/* tb-build rafter-truss-calculator a1d2687d14c8 */ /* stropilnaya-ferma — ToolBoss deployment build. Source of truth: delivery/apps/stropilnaya-ferma/app.css (cycle 2, accepted). */ /* Fonts: same-origin WOFF2 uploaded through the WP Font Library (/wp-content/uploads/fonts). */ @font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;font-display:swap;src:url('/wp-content/uploads/fonts/jetbrains-mono-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116} @font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;font-display:swap;src:url('/wp-content/uploads/fonts/jetbrains-mono-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} @font-face{font-family:'Golos Text';font-style:normal;font-weight:400 900;font-display:swap;src:url('/wp-content/uploads/fonts/golos-text-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116} @font-face{font-family:'Golos Text';font-style:normal;font-weight:400 900;font-display:swap;src:url('/wp-content/uploads/fonts/golos-text-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD} #js-tool-container-rafter-truss-calculator .tf { --tf-page: #eef0f4; --tf-panel: #ffffff; --tf-ink: #141a22; --tf-mute: #66707e; --tf-line: #d5dae2; --tf-view: #10151d; --tf-view-2: #182030; --tf-grid: rgba(255, 255, 255, .06); --tf-grid-2: rgba(255, 255, 255, .11); --tf-view-ink: #eef2f8; --tf-view-mute: #8b97a8; --tf-rafter: #f4f6fa; --tf-tie: #5ee0b0; --tf-strut: #ffb454; --tf-king: #c48cff; --tf-glow: rgba(94, 224, 176, .35); --tf-accent: #16b57f; --tf-bad: #ff6b5b; --tf-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace; --tf-sans: 'Golos Text', system-ui, sans-serif; color: var(--tf-ink); font-family: var(--tf-sans); display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; min-width: 0; } html[data-theme="dark"] #js-tool-container-rafter-truss-calculator .tf { --tf-page: #0b0e13; --tf-panel: #141922; --tf-ink: #e9edf3; --tf-mute: #8b97a8; --tf-line: #26303d; --tf-view: #05070b; --tf-view-2: #0d121b; } #js-tool-container-rafter-truss-calculator .tf [hidden] { display: none !important; } #js-tool-container-rafter-truss-calculator .tf > * { min-width: 0; } #js-tool-container-rafter-truss-calculator .tf-view { position: relative; isolation: isolate; overflow: hidden; border-radius: 18px; background: radial-gradient(120% 90% at 50% 110%, var(--tf-view-2), var(--tf-view) 70%); box-shadow: 0 40px 80px -50px rgba(0, 0, 0, .8), inset 0 0 0 1px rgba(255, 255, 255, .06); color: var(--tf-view-ink); } #js-tool-container-rafter-truss-calculator .tf-view::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: linear-gradient(var(--tf-grid-2) 1px, transparent 1px), linear-gradient(90deg, var(--tf-grid-2) 1px, transparent 1px), linear-gradient(var(--tf-grid) 1px, transparent 1px), linear-gradient(90deg, var(--tf-grid) 1px, transparent 1px); background-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px; mask-image: radial-gradient(90% 90% at 50% 50%, #000 40%, transparent 100%); } #js-tool-container-rafter-truss-calculator .tf-drawing { display: block; width: 100%; height: auto; } #js-tool-container-rafter-truss-calculator .tf-view--empty .tf-drawing { opacity: .25; } #js-tool-container-rafter-truss-calculator .tf-m { fill: none; stroke-linecap: round; stroke-linejoin: round; } #js-tool-container-rafter-truss-calculator .tf-m--rafter { stroke: var(--tf-rafter); stroke-width: 7; } #js-tool-container-rafter-truss-calculator .tf-m--tie { stroke: var(--tf-tie); stroke-width: 6; filter: drop-shadow(0 0 8px var(--tf-glow)); } #js-tool-container-rafter-truss-calculator .tf-m--strut { stroke: var(--tf-strut); stroke-width: 5; } #js-tool-container-rafter-truss-calculator .tf-m--king { stroke: var(--tf-king); stroke-width: 5; } #js-tool-container-rafter-truss-calculator .tf-node { fill: var(--tf-view); stroke: var(--tf-view-ink); stroke-width: 2; } #js-tool-container-rafter-truss-calculator .tf-wall { fill: rgba(255, 255, 255, .12); stroke: rgba(255, 255, 255, .25); stroke-width: 1; } #js-tool-container-rafter-truss-calculator .tf-ground { stroke: rgba(255, 255, 255, .18); stroke-width: 1; stroke-dasharray: 2 6; } #js-tool-container-rafter-truss-calculator .tf-dim { fill: none; stroke: var(--tf-view-mute); stroke-width: 1.2; } #js-tool-container-rafter-truss-calculator .tf-dim-tick { stroke: var(--tf-view-mute); stroke-width: 1.2; } #js-tool-container-rafter-truss-calculator .tf-dim-t { fill: var(--tf-view-ink); font: 500 15px var(--tf-mono); paint-order: stroke; stroke: var(--tf-view); stroke-width: 6px; stroke-linejoin: round; } #js-tool-container-rafter-truss-calculator .tf-dim-t--mute { fill: var(--tf-view-mute); } #js-tool-container-rafter-truss-calculator .tf-dim-t--tie { fill: var(--tf-tie); } #js-tool-container-rafter-truss-calculator .tf-dim-t--strut { fill: var(--tf-strut); } #js-tool-container-rafter-truss-calculator .tf-dim-t--king { fill: var(--tf-king); } #js-tool-container-rafter-truss-calculator .tf-angle-arc { fill: none; stroke: var(--tf-strut); stroke-width: 1.4; } #js-tool-container-rafter-truss-calculator .tf-error { position: absolute; left: 20px; right: 20px; bottom: 18px; margin: 0; padding: 10px 14px; border-radius: 10px; background: color-mix(in srgb, var(--tf-bad) 18%, var(--tf-view)); color: #fff; font-size: .92rem; } #js-tool-container-rafter-truss-calculator .tf-hud { position: absolute; z-index: 2; padding: 10px 14px; border-radius: 12px; background: rgba(8, 12, 18, .55); border: 1px solid rgba(255, 255, 255, .08); backdrop-filter: blur(10px); } #js-tool-container-rafter-truss-calculator .tf-hud--tl { left: 16px; top: 16px; padding: 6px; } #js-tool-container-rafter-truss-calculator .tf-hud--tr { right: 16px; top: 16px; } #js-tool-container-rafter-truss-calculator .tf-hud--br { right: 16px; bottom: 16px; } #js-tool-container-rafter-truss-calculator .tf-hud__k { margin: 0; font-size: .76rem; letter-spacing: .1em; text-transform: uppercase; color: var(--tf-view-mute); } #js-tool-container-rafter-truss-calculator .tf-hud__v { margin: 4px 0 0; display: flex; align-items: baseline; gap: 8px; } #js-tool-container-rafter-truss-calculator .tf-hud__v b { font: 600 1.9rem/1 var(--tf-mono); letter-spacing: -.03em; color: var(--tf-view-ink); } #js-tool-container-rafter-truss-calculator .tf-hud__v small { font-size: .8rem; color: var(--tf-view-mute); } #js-tool-container-rafter-truss-calculator .tf-hud__v i { font-style: normal; color: var(--tf-view-ink); } #js-tool-container-rafter-truss-calculator .tf-hud--dim .tf-hud__v b { color: var(--tf-view-mute); } #js-tool-container-rafter-truss-calculator .tf-schemes { display: flex; gap: 4px; } #js-tool-container-rafter-truss-calculator .tf-schemes button { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 6px 12px 6px 8px; border-radius: 8px; border: 1px solid transparent; background: transparent; color: var(--tf-view-mute); font: 500 .84rem/1 var(--tf-sans); cursor: pointer; transition: background .12s, color .12s; } #js-tool-container-rafter-truss-calculator .tf-schemes button svg { width: 34px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linejoin: round; } #js-tool-container-rafter-truss-calculator .tf-schemes button:hover { color: var(--tf-view-ink); } #js-tool-container-rafter-truss-calculator .tf-schemes button[aria-pressed="true"] { background: rgba(255, 255, 255, .1); color: var(--tf-view-ink); border-color: rgba(255, 255, 255, .14); } #js-tool-container-rafter-truss-calculator .tf-controls { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; } #js-tool-container-rafter-truss-calculator .tf-dial { display: grid; gap: 8px; padding: 14px 16px 12px; border-radius: 14px; background: var(--tf-panel); box-shadow: inset 0 0 0 1px var(--tf-line); min-width: 0; align-content: start; } #js-tool-container-rafter-truss-calculator .tf-dial__head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; min-width: 0; } #js-tool-container-rafter-truss-calculator .tf-dial__head label { font-size: .82rem !important; color: var(--tf-mute) !important } #js-tool-container-rafter-truss-calculator .tf-dial__val { display: inline-flex !important; align-items: baseline !important; gap: 4px !important; min-width: 0 !important } #js-tool-container-rafter-truss-calculator .tf-dial__val input { width: 4.5ch !important; min-width: 0 !important; padding: 8px 0 !important; min-height: 40px !important; box-sizing: border-box !important; border: 0 !important; border-bottom: 1px solid transparent !important; background: transparent !important; color: var(--tf-ink) !important; font: 600 1.35rem/1.2 var(--tf-mono) !important; letter-spacing: -.02em !important; text-align: right !important } #js-tool-container-rafter-truss-calculator .tf-dial__val input:focus { outline: none !important; border-bottom-color: var(--tf-accent) !important } #js-tool-container-rafter-truss-calculator .tf-dial__val i { font-style: normal !important; color: var(--tf-mute) !important; font-size: .85rem !important } #js-tool-container-rafter-truss-calculator .tf-dial__val--big { border-bottom: 2px solid var(--tf-line) !important } #js-tool-container-rafter-truss-calculator .tf-dial__val--big input { width: 100% !important; text-align: left !important; font-size: 1.9rem !important; min-height: 44px !important } #js-tool-container-rafter-truss-calculator .tf-dial__val--big input::placeholder { color: color-mix(in srgb, var(--tf-mute) 45%, transparent) !important } #js-tool-container-rafter-truss-calculator .tf-dial__val--big:focus-within { border-bottom-color: var(--tf-accent) !important } #js-tool-container-rafter-truss-calculator .tf-dial input[type="range"] { width: 100% !important; height: 40px !important; margin: 0 !important; accent-color: var(--tf-accent) !important; cursor: pointer !important } #js-tool-container-rafter-truss-calculator .tf-dial__scale { display: flex; justify-content: space-between; margin-top: -6px; font: 500 .76rem/1 var(--tf-mono); color: var(--tf-mute); } #js-tool-container-rafter-truss-calculator .tf-dial__note { margin: 0; font-size: .78rem; color: var(--tf-mute); line-height: 1.3; } #js-tool-container-rafter-truss-calculator .tf-dial select { width: 100% !important; min-width: 0 !important; min-height: 44px !important; padding: 6px 10px !important; border-radius: 8px !important; border: 1px solid var(--tf-line) !important; background: var(--tf-page) !important; color: var(--tf-ink) !important; font: 600 1rem/1.2 var(--tf-mono) !important } #js-tool-container-rafter-truss-calculator .tf-dial--bad .tf-dial__val input { color: var(--tf-bad) !important; border-bottom-color: var(--tf-bad) !important } #js-tool-container-rafter-truss-calculator .tf-dial--bad .tf-dial__val--big { border-bottom-color: var(--tf-bad) !important } #js-tool-container-rafter-truss-calculator .tf-out { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 10px; align-items: start; } #js-tool-container-rafter-truss-calculator .tf-h { margin: 0 0 12px; font: 600 .78rem/1 var(--tf-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--tf-mute); } #js-tool-container-rafter-truss-calculator .tf-h span { text-transform: none; letter-spacing: 0; font-weight: 500; } #js-tool-container-rafter-truss-calculator .tf-h span::before { content: "· "; } #js-tool-container-rafter-truss-calculator .tf-spec, #js-tool-container-rafter-truss-calculator .tf-loads { padding: 18px 20px 14px; border-radius: 14px; background: var(--tf-panel); box-shadow: inset 0 0 0 1px var(--tf-line); min-width: 0; } #js-tool-container-rafter-truss-calculator .tf-table { width: 100%; border-collapse: collapse; } #js-tool-container-rafter-truss-calculator .tf-table th, #js-tool-container-rafter-truss-calculator .tf-table td { padding: 12px 8px; text-align: left; border-top: 1px solid var(--tf-line); vertical-align: top; } #js-tool-container-rafter-truss-calculator .tf-table thead th { border-top: 0; padding-top: 0; font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; color: var(--tf-mute); font-weight: 600; } #js-tool-container-rafter-truss-calculator .tf-table tbody th { font-weight: 600; white-space: nowrap; } #js-tool-container-rafter-truss-calculator .tf-table tbody th::before { content: ""; display: inline-block; width: 18px; height: 4px; border-radius: 2px; margin-right: 10px; vertical-align: middle; background: var(--tf-ink); } #js-tool-container-rafter-truss-calculator .tf-row--tie th::before { background: var(--tf-tie); } #js-tool-container-rafter-truss-calculator .tf-row--strut th::before { background: var(--tf-strut); } #js-tool-container-rafter-truss-calculator .tf-row--king th::before { background: var(--tf-king); } #js-tool-container-rafter-truss-calculator .tf-num { font: 600 1.05rem/1.2 var(--tf-mono); letter-spacing: -.02em; white-space: nowrap; } #js-tool-container-rafter-truss-calculator .tf-num small { font: 500 .8rem/1 var(--tf-sans); color: var(--tf-mute); margin-left: 2px; } #js-tool-container-rafter-truss-calculator .tf-ang { color: var(--tf-mute); font-size: .86rem; line-height: 1.4; } #js-tool-container-rafter-truss-calculator .tf-splice { display: block; margin-top: 4px; font-size: .76rem; font-weight: 600; color: #b8741a; } html[data-theme="dark"] #js-tool-container-rafter-truss-calculator .tf-splice { color: var(--tf-strut); } #js-tool-container-rafter-truss-calculator .tf-loads__pick { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; } #js-tool-container-rafter-truss-calculator .tf-loads__pick label { display: grid !important; gap: 4px !important; font-size: .76rem !important; color: var(--tf-mute) !important; min-width: 0 !important } #js-tool-container-rafter-truss-calculator .tf-loads__pick select { width: 100% !important; min-width: 0 !important; min-height: 44px !important; padding: 6px 10px !important; border-radius: 8px !important; border: 1px solid var(--tf-line) !important; background: var(--tf-page) !important; color: var(--tf-ink) !important; font: 600 .9rem/1.2 var(--tf-sans) !important } #js-tool-container-rafter-truss-calculator .tf-stack { display: grid; } #js-tool-container-rafter-truss-calculator .tf-stack__row { display: grid; grid-template-columns: minmax(0, 1fr) auto 3.2em; align-items: baseline; gap: 10px; padding: 9px 0; border-top: 1px solid var(--tf-line); font-size: .9rem; color: var(--tf-mute); } #js-tool-container-rafter-truss-calculator .tf-stack__row small { display: block; font-size: .76rem; } #js-tool-container-rafter-truss-calculator .tf-stack__row i { font-style: normal; } #js-tool-container-rafter-truss-calculator .tf-stack__row b { font: 600 1.05rem/1.2 var(--tf-mono); color: var(--tf-ink); letter-spacing: -.02em; white-space: nowrap; } #js-tool-container-rafter-truss-calculator .tf-stack__row em { font-style: normal; font-size: .78rem; } #js-tool-container-rafter-truss-calculator .tf-stack__row--sum { border-top: 2px solid var(--tf-ink); color: var(--tf-ink); font-weight: 600; } #js-tool-container-rafter-truss-calculator .tf-stack__row--sum b { font-size: 1.4rem; } #js-tool-container-rafter-truss-calculator .tf-stack__row--r b { color: var(--tf-accent); font-size: 1.25rem; } #js-tool-container-rafter-truss-calculator .tf-snow-zero { margin: 10px 0 0; font-size: .82rem; color: #b8741a; } html[data-theme="dark"] #js-tool-container-rafter-truss-calculator .tf-snow-zero { color: var(--tf-strut); } #js-tool-container-rafter-truss-calculator .tf-method { margin: 0; max-width: 980px; font-size: .86rem; line-height: 1.5; color: var(--tf-mute); } @media (max-width: 1000px) { #js-tool-container-rafter-truss-calculator .tf-controls { grid-template-columns: repeat(3, minmax(0, 1fr)); } #js-tool-container-rafter-truss-calculator .tf-out { grid-template-columns: 1fr; } #js-tool-container-rafter-truss-calculator .tf-hud--br { display: none; } #js-tool-container-rafter-truss-calculator .tf-hud__v b { font-size: 1.5rem; } } @media (max-width: 600px) { #js-tool-container-rafter-truss-calculator .tf { gap: 10px; } #js-tool-container-rafter-truss-calculator .tf-view { border-radius: 14px; } #js-tool-container-rafter-truss-calculator .tf-hud--tl { left: 8px; top: 8px; right: 8px; padding: 4px; } #js-tool-container-rafter-truss-calculator .tf-view { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 0 8px 8px; } #js-tool-container-rafter-truss-calculator .tf-hud--tl { position: relative; left: 0; top: 0; right: 0; margin: 8px 0 0; grid-column: 1 / -1; order: 1; } #js-tool-container-rafter-truss-calculator .tf-drawing { grid-column: 1 / -1; order: 2; } #js-tool-container-rafter-truss-calculator .tf-hud--tr, #js-tool-container-rafter-truss-calculator .tf-hud--br { position: relative; display: grid; right: auto; bottom: auto; top: auto; margin: 0; padding: 8px 10px; order: 3; } #js-tool-container-rafter-truss-calculator .tf-hud--tr .tf-hud__v b, #js-tool-container-rafter-truss-calculator .tf-hud--br .tf-hud__v b { font-size: 1.35rem; } #js-tool-container-rafter-truss-calculator .tf-hud__v small { font-size: .78rem; } #js-tool-container-rafter-truss-calculator .tf-error { position: relative; left: 0; right: 0; bottom: 0; margin: 0; grid-column: 1 / -1; order: 4; } #js-tool-container-rafter-truss-calculator .tf-schemes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; } #js-tool-container-rafter-truss-calculator .tf-schemes button { padding: 6px 4px; font-size: .78rem; gap: 4px; justify-content: center; min-height: 44px; } #js-tool-container-rafter-truss-calculator .tf-schemes button svg { width: 24px; height: 12px; } #js-tool-container-rafter-truss-calculator .tf-dim-t { font-size: 14px; stroke-width: 5px; } #js-tool-container-rafter-truss-calculator .tf-m--rafter { stroke-width: 5; } #js-tool-container-rafter-truss-calculator .tf-m--tie { stroke-width: 4.5; } #js-tool-container-rafter-truss-calculator .tf-m--strut, #js-tool-container-rafter-truss-calculator .tf-m--king { stroke-width: 3.5; } #js-tool-container-rafter-truss-calculator .tf-node { r: 4; } #js-tool-container-rafter-truss-calculator .tf-wall { display: none; } #js-tool-container-rafter-truss-calculator .tf-error { left: 8px; right: 8px; bottom: 8px; font-size: .84rem; } #js-tool-container-rafter-truss-calculator .tf-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } #js-tool-container-rafter-truss-calculator .tf-dial { padding: 12px 12px 10px; } #js-tool-container-rafter-truss-calculator .tf-dial__val--big input { font-size: 1.5rem !important } #js-tool-container-rafter-truss-calculator .tf-table thead { display: none; } #js-tool-container-rafter-truss-calculator .tf-table tr { display: grid; grid-template-columns: 1fr auto auto; gap: 2px 12px; padding: 10px 0; border-top: 1px solid var(--tf-line); } #js-tool-container-rafter-truss-calculator .tf-table th, #js-tool-container-rafter-truss-calculator .tf-table td { border: 0; padding: 0; } #js-tool-container-rafter-truss-calculator .tf-table tbody th { grid-column: 1 / -1; } #js-tool-container-rafter-truss-calculator .tf-table td:nth-child(2) { grid-column: 1; } #js-tool-container-rafter-truss-calculator .tf-table td:nth-child(3)::before { content: "× "; color: var(--tf-mute); font-family: var(--tf-sans); font-weight: 400; } #js-tool-container-rafter-truss-calculator .tf-table td:nth-child(4)::before { content: "всего "; color: var(--tf-mute); font-family: var(--tf-sans); font-weight: 400; font-size: .8rem; } #js-tool-container-rafter-truss-calculator .tf-table td:nth-child(5) { grid-column: 1 / -1; } #js-tool-container-rafter-truss-calculator .tf-loads__pick { grid-template-columns: 1fr; } #js-tool-container-rafter-truss-calculator .tf-stack__row { grid-template-columns: minmax(0, 1fr) auto 3em; font-size: .84rem; } } #js-tool-container-rafter-truss-calculator .tf sub { font-size: .9em; line-height: 0; } /* ===== ToolBoss host integration (id-scoped) ===== */ /* 1. Wrapper neutralised: our block is the tool itself, no theme card around it. Focus mode («На весь экран») keeps its own padding. */ #js-tool-container-rafter-truss-calculator:not(.tb-focus-mode) { border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 !important; border-radius: 0 !important; overflow: visible !important; contain: layout style !important; } #js-tool-container-rafter-truss-calculator > .js-premium-app-html-content { display: contents; padding: 0 !important; background: transparent !important; } /* 1b. Focus mode: core.min.css forces `background:0 0!important` on `:has(.tb-zone)` wrappers (wins in dark), so the page would show through the fixed overlay — paint it with the page background. */ #js-tool-container-rafter-truss-calculator.tb-focus-mode { background: var(--bg0, #f4f5f7) !important; } html[data-theme="dark"] #js-tool-container-rafter-truss-calculator.tb-focus-mode { background: var(--bg0, #0b0c10) !important; } /* 2. .tb-zone on the app root switches the wrapper into zone layout (action links become the rounded end); the zone card itself is zeroed. */ #js-tool-container-rafter-truss-calculator .tb-zone.tf { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; box-shadow: none !important; margin: 0 !important; font-size: 1rem; line-height: 1.55; } /* 3. Theme control resets (tools-engine / semantic-dark force these with !important). Kept at (1,0,x) specificity so app rules win. */ #js-tool-container-rafter-truss-calculator input:where(:not([type="range"], [type="checkbox"], [type="radio"])), #js-tool-container-rafter-truss-calculator :where(select, textarea) { height: auto !important; border-radius: 0 !important; padding: 1px 2px !important; font-weight: inherit !important; } #js-tool-container-rafter-truss-calculator :where(select) { border-radius: 8px !important; } #js-tool-container-rafter-truss-calculator :where(input, select, textarea):focus { background-color: transparent !important; box-shadow: none !important; } #js-tool-container-rafter-truss-calculator :where(label) { color: inherit !important; } #js-tool-container-rafter-truss-calculator :where(table, thead, tbody, tr, th, td) { color: inherit; background: transparent; } #js-tool-container-rafter-truss-calculator :where([class*="val"], [class*="result"], [id*="res"]) { line-height: inherit !important; max-width: none !important; overflow-wrap: normal !important; word-break: normal !important; font-variant-numeric: inherit !important; } #js-tool-container-rafter-truss-calculator .tf-dial select:focus, #js-tool-container-rafter-truss-calculator .tf-loads__pick select:focus { border-color: var(--tf-accent) !important; background-color: var(--tf-page) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--tf-accent) 25%, transparent) !important; outline: none !important; } #js-tool-container-rafter-truss-calculator .tf-dial__val input:focus { background-color: transparent !important; box-shadow: none !important; }