:root{--teal:#006373;--teal-dark:#003e49;--ink:#163339;--muted:#5b7075;--line:#dce5e5;--paper:#fff;--bg:#f4f7f7;--yellow:#ffce4e;--radius:16px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}a{color:var(--teal);text-underline-offset:3px}button,input,select,textarea{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;min-height:44px;border:1px solid var(--line);border-radius:9px;padding:10px 14px;background:white;color:var(--ink);font-size:14px;font-weight:650}button:hover{border-color:var(--teal);background:#edf5f5}button:disabled{opacity:.45;cursor:default}input,select,textarea{width:100%;min-height:48px;border:1px solid #bdcccc;border-radius:9px;background:white;color:var(--ink);padding:11px 13px;font-size:16px}input[aria-invalid=true]{border-color:#ba4b39}input:focus,select:focus,textarea:focus{border-color:var(--teal)}:focus-visible{outline:3px solid #d39100;outline-offset:3px}[hidden]{display:none!important}label{display:block;font-size:14px;font-weight:650;margin:15px 0 7px}h1,h2,h3,p{margin-top:0}h2{font-size:22px;line-height:1.3;letter-spacing:-.5px}h3{font-size:19px;line-height:1.4}p{line-height:1.65}small,.small{font-size:13px;color:var(--muted)}.small{margin:8px 0}.wrap{max-width:1180px;margin:auto;padding-left:30px;padding-right:30px}.button-small{color:var(--teal);border-color:#c6d9dc}.intro{padding:52px 0 34px;position:relative}.eyebrow{font-size:11px;font-weight:750;letter-spacing:1.7px;color:var(--teal);margin-bottom:14px}.intro h1{font-size:clamp(32px,4.2vw,50px);font-weight:750;line-height:1.1;letter-spacing:-1.8px;margin-bottom:18px}.intro h1 span{display:block;color:var(--teal)}.intro>p:not(.eyebrow){font-size:16px;color:var(--muted);line-height:1.6;margin-bottom:18px}.intro-tags{position:absolute;right:0;bottom:38px;display:flex;gap:16px;color:var(--muted);font-size:12px}.intro-tags span:before{content:'✓';color:var(--teal);margin-right:6px}.calculator-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:24px;align-items:start;scroll-margin-top:20px}.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius)}.input-card{padding:28px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}.section-heading h2{margin:0;font-size:19px}.step{color:var(--teal);font-size:11px;letter-spacing:1px;margin-right:9px;vertical-align:middle}.text-button{border:0;background:transparent;padding:6px 0;min-height:44px;color:var(--teal);font-size:12px;font-weight:650;text-align:left}.text-button:hover{background:transparent;text-decoration:underline}.quick-shapes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-bottom:20px}.quick-shapes button{display:flex;flex-direction:column;align-items:center;padding:12px 4px 10px;font-size:12px;gap:5px;background:#fafcfc;border-radius:10px}.quick-shapes button>span{font-size:29px;line-height:32px;font-weight:400}.quick-shapes button[aria-pressed=true]{background:#eaf4f4;border:1.5px solid var(--teal);color:var(--teal)}.label-note{font-size:11px;font-weight:400;color:var(--muted);margin-left:7px}.material-heading{display:flex;justify-content:space-between;align-items:center;margin-top:9px}.material-heading label{margin:0}.material-heading .text-button{min-height:40px}#material-search{margin-bottom:8px}.density-details{font-size:12px;color:var(--muted);margin-top:12px}.density-details summary{cursor:pointer;line-height:24px;min-height:32px}.inline-field{display:flex;gap:8px}.inline-field input{min-width:0}.inline-field button{font-size:12px;flex-shrink:0}.dimensions-heading{border-top:1px solid var(--line);padding-top:24px;margin-top:24px;margin-bottom:10px}.dimensions-heading select{min-height:40px;padding:7px 11px;width:80px;font-size:14px}.dimension-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 16px}.dimension-fields label{font-size:13px}.measurement{position:relative}.measurement input{padding-right:50px;font-size:18px;font-variant-numeric:tabular-nums}.measurement>span{position:absolute;right:12px;top:15px;color:var(--muted);font-size:12px;pointer-events:none}.chips{display:flex;gap:7px;flex-wrap:wrap}.chips button{min-height:36px;padding:7px 10px;font-size:12px;border-radius:6px;background:#f8fafa}.thickness-chips{margin-top:16px;gap:5px}.thickness-chips button{min-height:34px;padding:6px 9px;font-size:11px}.quantity-row{display:flex;align-items:center;justify-content:space-between;padding-top:20px;margin-top:20px;border-top:1px solid var(--line);gap:12px}.quantity-row label{margin:0}.quantity-row input{width:112px;text-align:center}.error{color:#a32b24;font-size:13px;margin:14px 0 0;background:#fff3ee;padding:12px;border-radius:8px}.result-card{padding:24px 28px;background:linear-gradient(180deg,#f4fafa 0,#fff 55%)}.result-top{display:flex;justify-content:space-between;align-items:center;gap:10px}.result-top .eyebrow{margin:0}.connection{font-size:10px;color:var(--muted);text-align:right}.drawing{max-width:300px;margin:8px auto 0}.drawing svg{display:block;width:100%;height:auto;overflow:visible}.drawing .shape{stroke:var(--teal);stroke-width:1.7;fill:#d6e9e9;stroke-linejoin:round}.drawing .void{fill:#f4fafa}.drawing .guide{fill:none;stroke:#7fa4aa;stroke-width:1;stroke-dasharray:4 3}.drawing .dimension{stroke:#7fa4aa;stroke-width:1;fill:none}.drawing text{fill:var(--teal);font-size:13px;font-family:inherit;text-anchor:middle}.drawing-note{font-size:10px;text-align:center;color:var(--muted);margin:-2px 0 20px}.result-main{border-top:1px solid var(--line);padding-top:20px}.result-main>span{font-size:13px;color:var(--muted)}.result-main>div{display:flex;align-items:baseline;gap:14px;margin:4px 0}.result-main strong{font-size:clamp(36px,4.4vw,54px);line-height:1.2;letter-spacing:-2px;font-weight:750;color:var(--teal-dark);overflow-wrap:anywhere;min-width:0;font-variant-numeric:tabular-nums}.result-main select{width:68px;flex-shrink:0;min-height:36px;font-size:18px;background:transparent;border-color:transparent;padding:3px}.result-main p{font-size:12px;color:var(--muted);margin:6px 0 18px}.result-metrics{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;margin:0 0 18px;gap:12px}.result-metrics div+div{border-left:1px solid var(--line);padding-left:20px}.result-metrics dt{font-size:12px;color:var(--muted)}.result-metrics dd{margin:5px 0 0;font-size:17px;font-weight:650;overflow-wrap:anywhere}.primary{background:var(--yellow);border-color:var(--yellow);color:#253536}.primary:hover{background:#ffd970;border-color:#e0ac24}.full{width:100%;margin-top:12px;min-height:48px}.result-actions{display:flex;gap:12px;justify-content:space-between;margin:9px 0 16px}.result-actions button{background:transparent;border:0;color:var(--teal);padding:8px 0;font-size:12px}.calculation-details{font-size:12px;border-top:1px solid var(--line);padding-top:13px}.calculation-details summary{cursor:pointer;min-height:32px}.calculation-details p{margin:8px 0;color:var(--muted);overflow-wrap:anywhere}.estimate-note{font-size:11px;color:var(--muted);margin:10px 0 0}.quote-link{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border:1px solid #d5e3e4;border-radius:12px;text-decoration:none;margin-top:14px;font-size:12px;gap:20px}.quote-link strong{display:block;font-size:14px;margin-top:4px}.quote-link>span:last-child{font-size:26px}.saved-section{margin-top:28px;padding:28px;scroll-margin-top:20px}.saved-section .section-heading{margin-bottom:4px}.saved-section .eyebrow{margin-bottom:7px}.empty-list{border:1px dashed #c6d8d9;border-radius:10px;color:var(--muted);padding:30px 15px;text-align:center;font-size:14px;margin:22px 0 10px}.saved-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 20px;padding:20px 0;border-bottom:1px solid var(--line)}.saved-item h3{margin:0 0 5px;font-size:16px;overflow-wrap:anywhere}.saved-item p{font-size:12px;margin:3px 0;color:var(--muted);overflow-wrap:anywhere}.saved-amount{text-align:right;min-width:100px}.saved-amount strong{display:block;color:var(--teal);font-size:19px}.saved-amount small{display:block;margin-top:6px}.saved-actions{grid-column:1/-1;display:flex;gap:10px}.saved-actions button{font-size:12px;min-height:36px;padding:5px 12px}.list-footer{display:flex;justify-content:space-between;align-items:center;gap:15px}.list-footer p{margin:16px 0 0 auto;font-size:13px}.list-footer strong{margin-left:16px;color:var(--teal);font-size:24px}.guide-section{padding:66px 0 36px;max-width:1000px;margin:auto;scroll-margin-top:24px}.guide-section>h2{font-size:30px;letter-spacing:-1px}.guide-section p{font-size:14px;color:var(--muted)}.guide-columns{display:grid;grid-template-columns:1.25fr 1fr;gap:40px;margin:28px 0 35px}.example{border-left:3px solid var(--teal);padding:8px 24px}.example>span{font-size:10px;letter-spacing:1.4px;color:var(--teal)}.example h3{font-size:22px;margin:15px 0 8px}.example>strong{display:block;color:var(--teal);font-size:34px}.example button{display:block;margin-top:8px}.density-table{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin:30px 0}.density-table summary{cursor:pointer}.density-table summary h3{display:inline;font-size:18px}.density-table summary>span{font-size:11px;color:var(--muted);margin-left:14px}.density-table>p{margin-top:20px}.table-scroll{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:12px;text-align:left}th,td{padding:12px 8px;border-bottom:1px solid var(--line)}thead{color:var(--teal)}tbody th{font-weight:500}.faq h3{font-size:23px;margin:30px 0 20px}.faq details{border-bottom:1px solid var(--line);padding:16px 0}.faq summary{font-size:15px;cursor:pointer;font-weight:600}.faq p{padding:15px 0 0;margin:0}.site-footer{display:flex;align-items:center;gap:24px;border-top:1px solid var(--line);padding-top:24px;padding-bottom:32px;font-size:12px;color:var(--muted)}.site-footer a:first-child{font-weight:750;text-decoration:none}.site-footer a:last-child{margin-left:auto}.notice{background:#fff4d1;color:#59481b;padding:14px 18px;border:1px solid #efdaa2;border-radius:10px;font-size:14px;margin-bottom:18px}.notice button{margin-left:10px}dialog{border:1px solid var(--line);border-radius:16px;padding:28px;max-width:480px;width:calc(100% - 32px);color:var(--ink)}dialog::backdrop{background:#12343a88}dialog h2{font-size:23px}dialog p{font-size:14px}dialog textarea{margin-bottom:12px}.mobile-result{display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:20px;background:white;padding:15px;z-index:10}.skip-link:focus{top:10px}
@media(max-width:900px){.intro-tags{position:static}.wrap{padding-left:22px;padding-right:22px}.calculator-grid{gap:18px}.input-card,.result-card{padding:22px}.section-heading{flex-wrap:wrap}.section-heading h2{font-size:18px}.result-top{align-items:flex-start}.result-top .eyebrow{font-size:10px}.connection{max-width:100px}}
@media(max-width:680px){.wrap{padding-left:18px;padding-right:18px}.button-small{font-size:11px;padding:8px 10px;max-width:128px}.intro{padding:32px 0 26px}.intro h1{font-size:36px;letter-spacing:-1.4px}.intro>p:not(.eyebrow){font-size:14px}.intro-tags{gap:16px;font-size:11px}.calculator-grid{grid-template-columns:minmax(0,1fr)}.input-card,.result-card{padding:22px}.input-card .section-heading{flex-wrap:nowrap}.section-heading h2{font-size:17px}.section-heading .text-button{font-size:10px}.quick-shapes{gap:7px}.dimension-fields{gap:2px 12px}.dimension-fields label{font-size:12px}.drawing{max-width:245px}.result-main strong{font-size:49px}.result-card{padding-top:20px}.connection{max-width:none}.saved-section{padding:22px;margin-top:22px}.saved-section .section-heading{align-items:flex-start}.saved-section .section-heading>button{font-size:12px}.saved-item{grid-template-columns:minmax(0,1fr)}.saved-amount{text-align:left;display:flex;align-items:baseline;gap:12px}.saved-amount small{margin-top:0}.guide-section{padding-top:42px}.guide-section>h2{font-size:26px}.guide-columns{grid-template-columns:1fr;gap:18px}.guide-section p{font-size:14px}.density-table summary>span{display:block;margin:8px 0 0 20px}.mobile-result{display:flex;position:sticky;bottom:0;justify-content:space-between;align-items:center;padding:12px 22px max(12px,env(safe-area-inset-bottom));background:var(--teal-dark);color:white;font-size:12px;z-index:5;gap:12px;pointer-events:none}.mobile-result strong{font-size:23px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;text-align:right}.site-footer{flex-wrap:wrap;gap:14px;padding-bottom:28px}.site-footer span{order:3;width:100%}input,select,button,summary{scroll-margin-bottom:100px}.desktop-only{display:none}.list-footer strong{font-size:22px;margin-left:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
@media print{.site-header,.intro,.calculator-grid,.guide-section,.site-footer,.mobile-result,.saved-actions,.list-footer button,#download-csv,.notice{display:none!important}.wrap{max-width:none;padding:0}.saved-section{border:0;margin:0;padding:0}.saved-section .small{display:none}.saved-item{break-inside:avoid}}
@media(max-width:680px){.chips button,.saved-actions button{min-height:44px}.density-details summary,.calculation-details summary{min-height:44px;padding-top:8px}.material-heading .text-button{min-height:44px}}