:root{--color-base:#e9eaec;--color-raised:#ffffff;--color-fg:#25283b;--color-quiet:#4a4e69;--color-key:#4a4e69;--color-pop:#f2a541;--color-border:#c6c8d0;--color-radius:4px;--color-page:1200px;--color-heading:'Barlow',system-ui,sans-serif;--color-font-body:'Barlow',system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem} body{margin:0;background:var(--color-base);color:var(--color-fg);font:16px/1.78 var(--color-font-body)}
img{max-width:100%;height:auto} a{color:var(--color-key);text-underline-offset:3px}
input,select,textarea{max-width:100%;box-sizing:border-box}
input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week]{min-width:0;max-width:100%}
@supports (-webkit-touch-callout:none){input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week]{-webkit-appearance:none;appearance:none;min-height:2.75em} input::-webkit-date-and-time-value{text-align:left}}
h1,h2,h3{font-family:var(--color-heading);line-height:1.2;letter-spacing:-.01em;color:var(--color-fg)}
h1{font-size:clamp(1.9rem,4.5vw,2.8rem);margin:.2em 0 .35em} h2{font-size:clamp(1.35rem,3vw,1.8rem);margin:2.75em 0 .6em} h3{font-size:1.15rem;margin:1.6em 0 .4em}
p,ul,ol{margin:0 0 1.25em}
.site-inner{max-width:var(--color-page);margin:0 auto;padding:0 1rem} .site-content{max-width:var(--color-page);margin:0 auto;padding:1.2rem 1rem 3rem}
.site-skip{position:absolute;left:-9999px} .site-skip:focus{left:1rem;top:1rem;background:var(--color-raised);padding:.5rem;z-index:99}
.site-top__in{max-width:var(--color-page);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 1rem;flex-wrap:wrap}
.site-home-link{display:flex;align-items:center;gap:.6rem;font:800 1.15rem var(--color-heading);color:var(--color-fg);text-decoration:none}
.site-links{display:flex;gap:1rem;flex-wrap:wrap;align-items:center} .site-links a{color:var(--color-fg);text-decoration:none;font-weight:600;font-size:.95rem}
.site-header-bar{background:var(--color-key)} .site-header-bar a,.site-header-bar .site-home-link,.site-header-bar summary{color:#fff} .site-header-bar .site-langs summary{border-color:rgba(255,255,255,.5)} .site-header-bar .site-lang-menu__list a{color:var(--color-fg)} .site-header-bar .site-lang-menu__list a[aria-current]{color:var(--color-key)}  
.site-lede-box{margin:1rem 0 1.4rem} .site-summary{font-size:1.12rem;max-width:46em;color:var(--color-quiet)} .site-lede-box{background:var(--color-raised);background:color-mix(in srgb,var(--color-border) 45%,var(--color-raised));border:1px solid transparent;padding:2rem 1.6rem;border-radius:var(--color-radius)}
.site-calc-area{margin:1.4rem 0 2rem}
.site-aside-note{margin:1.4em 0;padding:.9em 1.1em;background:var(--color-raised);border-left:4px solid var(--color-pop);border-radius:0 var(--color-radius) var(--color-radius) 0}
.site-calc-line{margin:1.2em 0;padding:.9em 1.1em;font-family:ui-monospace,Consolas,monospace;background:var(--color-raised);border:1px dashed var(--color-key);border-radius:var(--color-radius);overflow-x:auto}
.site-table-holder{margin:1.2em 0;overflow-x:auto;border:1px solid var(--color-border);border-radius:var(--color-radius);background:var(--color-raised)}
.site-facts{width:100%;border-collapse:collapse;font-size:.95em;font-variant-numeric:tabular-nums} .site-facts th,.site-facts td{padding:.5em .75em;border-bottom:1px solid var(--color-border);text-align:left}
.site-facts thead th{background:color-mix(in srgb,var(--color-border) 60%,var(--color-raised))}
ol.site-procedure{padding-left:1.3em} ol.site-procedure>li{margin:.5em 0}
.site-graphic{margin:1.6em 0;text-align:center} .site-graphic img{width:100%;max-width:720px;border-radius:var(--color-radius);border:1px solid var(--color-border);background:#fff} .site-graphic figcaption{font-size:.9em;color:var(--color-quiet)}
.site-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;margin:1.2em 0}
.site-read{display:block;padding:1.1rem;background:var(--color-raised);border-radius:var(--color-radius);background:color-mix(in srgb,var(--color-border) 45%,var(--color-raised));border:1px solid transparent;color:var(--color-fg);text-decoration:none}
.site-read b{display:block;font-family:var(--color-heading);margin-bottom:.35rem} .site-read span{color:var(--color-quiet);font-size:.92rem} .site-read:hover{border-color:var(--color-key)}
.site-read--img{padding:0;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease} .site-read--img:hover{transform:translateY(-3px);box-shadow:0 10px 24px color-mix(in srgb,var(--color-fg) 14%,transparent)}
.site-guide-card__img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover} .site-read__txt{display:block;padding:1rem 1.1rem 1.1rem} .site-read__txt>span{display:block}
.site-blist a,.site-brow,.site-post__kicker{background:none!important}
.site-tile__meta{display:block;margin-top:.6rem;font-size:.8rem;font-weight:700;letter-spacing:.04em;color:var(--color-key)}
.site-tiles--feat{grid-template-columns:repeat(2,minmax(0,1fr))} .site-tiles--feat>.site-read:first-child{grid-column:1/-1;display:grid;grid-template-columns:1.3fr 1fr;align-items:center} .site-tiles--feat>.site-read:first-child b{font-size:1.35rem}
.site-blist{display:grid;gap:1rem;margin:1.2em 0} .site-brow{display:grid;grid-template-columns:240px 1fr;gap:1.1rem;align-items:center;background:var(--color-raised);border:1px solid var(--color-border);border-radius:var(--color-radius);overflow:hidden;color:var(--color-fg);text-decoration:none}
.site-brow .site-guide-card__img{height:100%;aspect-ratio:auto;min-height:126px} .site-brow b{display:block;font-family:var(--color-heading);font-size:1.12rem;margin-bottom:.3rem} .site-brow .site-read__txt>span{color:var(--color-quiet);font-size:.93rem} .site-brow:hover{border-color:var(--color-key)}
.site-blist--min{list-style:none;padding:0;counter-reset:bl;gap:0} .site-blist--min li{counter-increment:bl;border-top:1px solid var(--color-border)} .site-blist--min li:last-child{border-bottom:1px solid var(--color-border)}
.site-blist--min a{display:grid;grid-template-columns:4.2rem 1fr;column-gap:1rem;padding:1.1rem .2rem;color:var(--color-fg);text-decoration:none} .site-blist--min a::before{content:counter(bl,decimal-leading-zero);grid-row:1/4;font:800 2.4rem/1 var(--color-heading);color:var(--color-key)}
.site-blist--min b{font-family:var(--color-heading);font-size:1.15rem} .site-blist--min span{color:var(--color-quiet);font-size:.93rem} .site-blist--min a:hover b{color:var(--color-key)}
.site-post__head--overlay{position:relative;margin:.6rem 0 1.6rem;border-radius:var(--color-radius);overflow:hidden} .site-post__head--overlay>img{display:block;width:100%;height:auto;min-height:300px;object-fit:cover}
.site-post__ov{position:absolute;inset:auto 0 0 0;padding:4rem 1.6rem 1.4rem;background:linear-gradient(transparent,color-mix(in srgb,#000 72%,transparent))} .site-post__ov h1,.site-post__ov .site-post__meta,.site-post__ov .site-post__kicker{color:#fff}
.site-post__head--band{background:var(--color-key);color:#fff;padding:2.2rem 1.6rem;border-radius:var(--color-radius)} .site-post__head--band h1,.site-post__head--band .site-post__meta,.site-post__head--band .site-post__kicker{color:#fff}
.site-post__head--split{display:grid;grid-template-columns:1.1fr 1fr;gap:1.6rem;align-items:center} .site-post__head--split .site-post__cover{margin:0}
.site-contents--chips ol{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.45rem} .site-contents--chips li{margin:0} .site-contents--chips a{display:inline-block;padding:.3rem .75rem;border:1px solid var(--color-border);border-radius:999px;background:var(--color-base);text-decoration:none;font-size:.88rem}
.site-contents--rail{background:none;border:0;border-left:3px solid var(--color-pop);border-radius:0;padding:.2rem 0 .2rem 1rem}
.site-langs--globe summary{display:flex;align-items:center;gap:.35rem} .site-langpills{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.8rem} .site-langpills a{padding:.25rem .7rem;border:1px solid var(--color-border);border-radius:999px;text-decoration:none} .site-langpills a[aria-current]{background:var(--color-key);border-color:var(--color-key);color:#fff}
@media (max-width:700px){.site-tiles--feat{grid-template-columns:1fr} .site-tiles--feat>.site-read:first-child{display:flex} .site-brow{grid-template-columns:1fr} .site-brow .site-guide-card__img{min-height:0;aspect-ratio:1200/630} .site-post__head--split{grid-template-columns:1fr} .site-post__ov{position:static;background:var(--color-key);padding:1.2rem} .site-post__head--overlay>img{min-height:0}}
.site-post{max-width:48rem;margin:0 auto} .site-post__head{margin:.6rem 0 1.2rem} .site-post__head h1{font-size:clamp(2rem,5vw,3rem);line-height:1.12;letter-spacing:-.01em}
.site-post__kicker{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--color-key);text-decoration:none}
.site-upd{color:var(--color-quiet);font-size:.9rem;margin:2rem 0 0} .site-sign{font-style:italic;color:var(--color-quiet)} .site-post__meta{color:var(--color-quiet);font-size:.92rem;margin:0} .site-post__cover{margin:0 0 1.6rem} .site-post__cover img{display:block;width:100%;height:auto;border-radius:var(--color-radius)}
.site-post .site-summary{font-size:1.2rem;color:var(--color-fg)} .site-post .site-summary::first-letter{font-family:var(--color-heading);font-size:3.1em;float:left;line-height:.9;margin:.06em .1em 0 0;color:var(--color-key)}
.site-post .site-contents--post{position:static!important;top:auto!important;z-index:auto;margin:0 0 1.8rem;padding:1rem 1.2rem;background:var(--color-raised);border:1px solid var(--color-border);border-left:4px solid var(--color-key);border-radius:var(--color-radius);font-size:.95rem}
.site-contents--post ol{margin:.4rem 0 0;padding-left:1.2rem;columns:1} .site-contents--post li{margin:.2rem 0}
.site-post h3{color:var(--color-key)} .site-post blockquote{margin:1.4em 0;padding:.4em 1.2em;border-left:4px solid var(--color-pop);font-size:1.1em}
.site-faq-list h3{font-size:1.05rem;margin-top:1.3em}
.site-breadcrumbs{font-size:.88rem;color:var(--color-quiet);margin:.4rem 0 1rem} .site-breadcrumbs a{color:var(--color-quiet)}
.site-go-box{margin:2.4rem 0;padding:1.4rem;background:var(--color-raised);border-radius:var(--color-radius);background:color-mix(in srgb,var(--color-border) 45%,var(--color-raised));border:1px solid transparent;text-align:center}
.site-go{display:inline-block;padding:.7em 1.4em;background:var(--color-key);color:#fff;border-radius:999px;font-weight:700;text-decoration:none}
.site-bottom{border-top:1px solid var(--color-border);margin-top:3rem;padding:1.6rem 0 2.4rem;font-size:.9rem;color:var(--color-quiet);background:var(--color-raised)}
.site-bottom nav{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem} .site-bottom a{color:var(--color-quiet)} .site-bottom{background:var(--color-fg);color:var(--color-base)} .site-bottom a,.site-bottom p{color:var(--color-base);opacity:.85}


.site-langs{position:relative} .site-langs summary{cursor:pointer;list-style:none;padding:.25rem .6rem;border:1px solid var(--color-border);border-radius:999px;font-size:.85rem}
.site-lang-menu__list{position:absolute;right:0;top:120%;background:var(--color-raised);border:1px solid var(--color-border);border-radius:10px;padding:.4rem;display:grid;min-width:9rem;z-index:40}
.site-lang-menu__list a{padding:.3rem .5rem;text-decoration:none;color:var(--color-fg)} .site-lang-menu__list a[aria-current]{font-weight:700;color:var(--color-key)}
.site-codes{display:flex;gap:.35rem;font-size:.8rem;font-weight:700} .site-codes a{text-decoration:none;color:var(--color-quiet);padding:.1rem .3rem;border-radius:4px} .site-codes a[aria-current]{color:var(--color-key);background:color-mix(in srgb,var(--color-key) 12%,transparent)}
[data-zone]{margin:1rem auto;text-align:center;overflow:hidden;max-width:100%} [data-zone]:empty{margin:0}
[data-zone="mobile_sticky"]{position:fixed;left:0;right:0;bottom:0;margin:0;z-index:50;background:var(--color-raised)}
[data-zone="sidebar_left"],[data-zone="sidebar_right"]{position:fixed;top:110px;width:160px;margin:0;z-index:20} [data-zone="sidebar_left"]{left:12px} [data-zone="sidebar_right"]{right:12px}
@media (max-width:1499px){[data-zone="sidebar_left"],[data-zone="sidebar_right"]{display:none}}
.site-adx{float:right;border:0;background:transparent;font-size:1.2rem;cursor:pointer;color:var(--color-quiet)}
.site-go{border-radius:4px;text-transform:uppercase;letter-spacing:.06em;font-size:.85rem}
.site-facts tbody tr:nth-child(even){background:color-mix(in srgb,var(--color-key) 6%,transparent)}
.site-segment a:not(.site-go):not(.site-read){text-decoration-thickness:2px}
:root{--color-heading:'Barlow',system-ui,-apple-system,'Segoe UI',sans-serif;--color-font-body:'Barlow',system-ui,-apple-system,'Segoe UI',sans-serif} body{font-size:17px;font-kerning:normal;font-optical-sizing:auto;text-rendering:optimizeLegibility} h1,h2,h3{font-weight:700;letter-spacing:0;text-wrap:balance} .site-home-link{font-weight:700} h1{font-size:clamp(1.85rem,4.6vw,2.24rem);line-height:1.08} h2{font-size:clamp(1.3rem,3vw,1.56rem);line-height:1.18} h3{font-size:1.25rem} .site-post__head h1{font-size:clamp(1.95rem,5vw,2.38rem)} p,li{text-wrap:pretty} .site-segment>p,.site-segment>ul,.site-segment>ol,.site-post p,.site-post li{max-width:76ch} .site-facts,.site-calc-area output,.site-calc-area [class*=res],.site-calc-area [class*=val]{font-variant-numeric:tabular-nums lining-nums}  
@media (max-width:640px){.site-top__in{gap:.5rem} .site-links{gap:.8rem}}

/* Measurements and the order share a row; supporting calculations follow. */
.cn{font:400 17px/1.6 var(--color-font-body);color:var(--color-fg);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px 36px;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.cn *{box-sizing:border-box;min-width:0}.cn [hidden]{display:none!important}
.cn h3{font:700 25px/1.3 var(--color-heading);letter-spacing:0;margin:0;color:var(--color-fg)}
.cn p{margin:10px 0;line-height:1.6}
.cn label{display:block;font-size:16px;font-weight:600;line-height:1.5;margin-bottom:7px}
.cn input,.cn button,.cn select,.cn textarea{font:inherit}
.cn :is(input,select,textarea){color:var(--color-fg);background:var(--color-raised);border:1px solid var(--color-border);border-radius:3px;padding:10px 12px;min-height:46px;width:100%;font-variant-numeric:tabular-nums;transition:border-color .18s,background .18s}
.cn input::placeholder{color:var(--color-quiet);opacity:1;font-size:16px}
.cn input:focus,.cn select:focus{border-color:var(--color-key);background:color-mix(in srgb,var(--color-key) 3%,var(--color-raised))}
.cn input[type=checkbox]{width:20px;min-height:20px;height:20px;padding:0;accent-color:var(--color-key);flex:none;margin:0}
.cn :is(input,select,button,textarea,summary):focus-visible{outline:3px solid var(--color-pop);outline-offset:3px}
.cn button{min-height:44px;padding:10px 16px;border:0;border-radius:3px;color:var(--color-key);background:color-mix(in srgb,var(--color-key) 7%,var(--color-raised));cursor:pointer;font-size:16px;font-weight:600;line-height:1.5;transition:background .18s,transform .18s}
.cn button:hover:not(:disabled){background:color-mix(in srgb,var(--color-key) 13%,var(--color-raised));transform:translateY(-1px)}
.cn button:active:not(:disabled){transform:translateY(1px)}
.cn button:disabled{color:var(--color-quiet);background:color-mix(in srgb,var(--color-fg) 5%,var(--color-raised));cursor:not-allowed}
.cn small{font-size:15px;line-height:1.5;color:var(--color-quiet);display:block;margin-top:6px}
.cn .cn-primary{background:var(--color-key);color:var(--color-raised);font-weight:700;padding-inline:24px}
.cn .cn-primary:hover:not(:disabled){background:color-mix(in srgb,var(--color-key) 85%,var(--color-fg));color:var(--color-raised)}
.cn-kicker{font:600 20px/1.4 var(--color-heading);letter-spacing:0;text-transform:none;color:var(--color-fg);padding:0;border:0;margin:0 0 18px}
.cn .cn-sample{font-size:15px;color:var(--color-quiet);background:transparent;border:0;padding:0;margin:10px 0 16px}
.cn-editor{grid-column:1;grid-row:1;align-self:start}
.cn-editor>form{margin:0}
.cn #cn-shape{font-size:17px;font-weight:600;margin-bottom:18px;background:var(--color-raised);min-height:48px}
.cn-fields{display:grid;gap:12px}
.cn-field{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1fr);align-items:center;gap:14px}
.cn-field>label{font-weight:500;margin:0;font-size:17px}
.cn-field-controls{display:flex;gap:6px;align-items:center}
.cn-field-controls input{font-size:18px;width:100%;flex:1;min-width:50px}
.cn-field-controls select{font-size:16px;flex:0 0 82px;width:82px;padding:10px 6px;cursor:pointer}
.cn-field-controls input:last-child:not(:first-child){flex:0 1 70px;font-size:17px}
.cn-qty{display:grid;grid-template-columns:.65fr 1fr;align-items:center;gap:14px;margin:14px 0}
.cn-qty>label{margin:0;font-weight:500;font-size:17px}
.cn-qty input{max-width:130px;font-size:18px}
.cn .cn-hint{color:var(--color-quiet);font-size:15px;line-height:1.6;margin:12px 0}
.cn-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.cn-editor .cn-actions button{flex:1 1 auto}
.cn-editor .cn-actions .cn-primary{flex:1 1 100%}
.cn-editor #cn-example{background:transparent}
.cn-error{padding:12px 0;color:var(--color-pop);background:transparent;border:0;font-size:16px;overflow-wrap:anywhere}
.cn #cn-label{margin-bottom:12px}
.cn #cn-add{margin-bottom:16px}
.cn-geometry{grid-column:2;grid-row:2;align-self:start;background:color-mix(in srgb,var(--color-key) 5%,var(--color-raised));border:0;border-radius:3px;padding:24px}
.cn #cn-diagram{display:block;width:100%;height:auto;max-height:310px;overflow:hidden}
.cn-solid{stroke:var(--color-key);stroke-width:1.5;stroke-linejoin:round}
.cn-top{fill:color-mix(in srgb,var(--color-key) 17%,var(--color-raised));stroke:var(--color-key)}
.cn-front{fill:color-mix(in srgb,var(--color-key) 35%,var(--color-raised));stroke:var(--color-key)}
.cn-side{fill:color-mix(in srgb,var(--color-key) 60%,var(--color-raised));stroke:var(--color-key)}
.cn-hole{fill:var(--color-base);stroke:var(--color-pop);stroke-width:2}
.cn-edge{fill:none;stroke:var(--color-key);stroke-width:1.5}
.cn-measure{fill:none;stroke:var(--color-pop);stroke-width:1.6}
.cn-dim{fill:var(--color-fg);font-family:var(--color-font-body);font-variant-numeric:tabular-nums;font-weight:500}
.cn-geometry>p{font-size:15px;color:var(--color-quiet);line-height:1.6}
.cn-draft-volume{padding:14px 0 0;display:flex;justify-content:space-between;gap:15px;align-items:baseline}
.cn-draft-volume span{font-size:16px;color:var(--color-fg)}
.cn-draft-volume strong{font:700 29px/1.2 var(--color-heading);color:var(--color-key);letter-spacing:0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.cn-job{padding-top:8px;border:0}
.cn-job #cn-clearjob{margin-top:14px}
.cn-part{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:15px;padding:15px 0;border-bottom:1px solid var(--color-border)}
.cn-part span{font-size:17px;font-weight:600;overflow-wrap:anywhere}
.cn-part strong{font:700 25px/1.2 var(--color-heading);font-variant-numeric:tabular-nums;color:var(--color-key)}
.cn-part button{font-size:16px;min-height:44px}
.cn-settings{grid-column:1;grid-row:2;padding:0;background:transparent;border:0;align-self:start}
.cn-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.cn-settings-grid>div{display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:0;padding-bottom:20px}
.cn-settings-grid>div>small{align-self:start}
.cn-settings-grid label{font-size:16px;margin-bottom:8px;min-height:0}
.cn-settings-grid :is(input,select){font-size:18px}
.cn select{cursor:pointer}
.cn-result{grid-column:2;grid-row:1;align-self:start;background:var(--color-key);color:var(--color-raised);border:0;border-radius:3px;padding:26px;animation:cn-arrive .35s ease-out}
.cn-result-head{display:flex;flex-direction:column;gap:5px;align-items:start;font-size:19px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--color-raised);line-height:1.4}
.cn-result-head #cn-scope{font-size:15px;font-weight:400;background:transparent;border:0;padding:0;color:var(--color-raised)}
.cn-big{display:block;font:700 clamp(38px,4.5vw,54px)/1.12 var(--color-heading);letter-spacing:0;color:var(--color-raised);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;margin:18px 0 24px;transition:color .18s}
.cn-volumes{display:grid;grid-template-columns:1fr 1fr;gap:20px 16px;padding:0;border:0}
.cn-volumes>div{padding:0;border:0}
.cn-volumes span{display:block;font-size:16px;line-height:1.4;color:var(--color-raised);min-height:44px}
.cn-volumes b{display:block;font:600 24px/1.3 var(--color-heading);color:var(--color-raised);font-variant-numeric:tabular-nums;margin-top:6px;overflow-wrap:anywhere}
.cn #cn-breakdown{display:block;width:100%;height:auto;margin:22px 0 7px;transform-origin:left center}
.cn-base{fill:var(--color-raised)}
.cn-over{fill:color-mix(in srgb,var(--color-pop) 50%,var(--color-raised))}
.cn-round{fill:color-mix(in srgb,var(--color-key) 45%,var(--color-raised))}
.cn-result .cn-dim{fill:var(--color-raised)}
.cn-conversions{font-size:15px;font-variant-numeric:tabular-nums;line-height:1.6;color:var(--color-raised)}
.cn-weight{padding-top:12px;margin-top:12px;border:0}
.cn-weight span{font-size:16px;color:var(--color-raised);display:block}
.cn-weight strong{font:600 18px/1.5 var(--color-heading);display:block;font-variant-numeric:tabular-nums;margin-top:7px;color:var(--color-raised)}
.cn-result>.cn-hint{font-size:15px;color:var(--color-raised);margin:15px 0 0}
.cn-bags,.cn-cost{grid-column:1/-1;padding-top:18px;border:0}
.cn-section-head{display:grid;grid-template-columns:.7fr 1.3fr;align-items:start;gap:26px;margin-bottom:22px}
.cn-section-head p{color:var(--color-quiet);font-size:16px;margin:0;line-height:1.6}
.cn-bag-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:24px}
.cn-bag{padding:18px 0;background:transparent;border:0;border-radius:0}
.cn-bag span{font-size:17px;font-weight:600;color:var(--color-fg);display:block}
.cn-bag strong{font:700 42px/1.2 var(--color-heading);letter-spacing:0;display:block;color:var(--color-key);font-variant-numeric:tabular-nums;margin:8px 0}
.cn-yield{display:grid;grid-template-columns:1fr .7fr 1fr;gap:0 18px;align-items:start;background:color-mix(in srgb,var(--color-key) 5%,var(--color-raised));border:0;border-radius:3px;padding:22px}
.cn-yield>div{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0}
.cn-yield label,.cn-yield>div>span{min-height:0;font-size:16px;display:block;line-height:1.5;margin-bottom:8px;font-weight:600}
.cn-yield input,.cn-yield select{font-size:18px}
.cn-yield strong{font:700 34px/1.3 var(--color-heading);font-variant-numeric:tabular-nums;color:var(--color-key);overflow-wrap:anywhere;display:block;padding-top:4px}
.cn-price-inputs{display:grid;grid-template-columns:1.5fr .7fr;gap:18px;max-width:760px;margin-bottom:24px}
.cn-price-inputs input,.cn-price-inputs select{font-size:18px}
.cn-cost-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.cn-cost-grid>div{padding:12px 0;background:transparent;border:0;border-radius:0}
.cn-cost-grid span{font-size:16px;line-height:1.5;display:block;color:var(--color-quiet);min-height:48px}
.cn-cost-grid strong{font:700 27px/1.3 var(--color-heading);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;display:block;margin-top:10px;color:var(--color-fg)}
.cn-cost-grid>div:last-child strong{color:var(--color-key)}
.cn-details{grid-column:1/-1;padding:18px 0;border:0;border-bottom:1px solid var(--color-border);border-radius:0;background:transparent}
.cn-details summary{font:600 19px/1.5 var(--color-font-body);cursor:pointer;color:var(--color-fg);min-height:44px;padding:8px 0}
.cn-details summary::marker{color:var(--color-key)}
.cn-details[open]>summary{margin-bottom:18px;color:var(--color-key)}
.cn-details>p{color:var(--color-quiet);font-size:16px}
.cn-multipart>input{max-width:520px}
.cn-sensitivity{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;margin-top:20px}
.cn-sensitivity>div{padding:15px 0;border:0;border-radius:0;background:transparent}
.cn-sensitivity span{font-size:16px;color:var(--color-quiet);display:block}
.cn-sensitivity strong{font:700 27px/1.3 var(--color-heading);font-variant-numeric:tabular-nums;display:block;color:var(--color-fg);margin-top:9px;overflow-wrap:anywhere}
.cn-sensitivity small{font-size:15px}
.cn-equation{font:600 22px/1.5 var(--color-heading);color:var(--color-key);overflow-wrap:anywhere;background:color-mix(in srgb,var(--color-key) 5%,var(--color-raised));border:0;padding:18px;font-variant-numeric:tabular-nums;border-radius:3px}
.cn-converted{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 24px;margin-top:18px}
.cn-converted p{display:flex;flex-direction:column;padding:12px 0}
.cn-converted span{font-size:16px;color:var(--color-quiet)}
.cn-converted strong{font:600 22px/1.4 var(--color-heading);font-variant-numeric:tabular-nums;color:var(--color-fg)}
.cn-export{grid-column:1/-1;display:flex;gap:12px;flex-wrap:wrap}
.cn-export button:first-child{background:var(--color-key);color:var(--color-raised)}
.cn-history{grid-column:1/-1;padding-top:18px;border:0}
.cn-remember{display:flex!important;gap:10px;align-items:center;margin:18px 0!important;font-size:16px!important}
.cn-history-row{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--color-border)}
.cn-history-row span{font-size:16px;font-weight:600;overflow-wrap:anywhere}
.cn #cn-history>p{font-size:16px;color:var(--color-quiet)}
.cn #cn-toast{grid-column:1/-1;font-size:16px;color:var(--color-key);min-height:24px;margin:0}
.cn #cn-report{grid-column:1/-1;min-height:200px;font-size:16px;line-height:1.6;resize:vertical}
@keyframes cn-arrive{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.cn{gap:28px;grid-template-columns:1fr}.cn-editor,.cn-result,.cn-settings,.cn-geometry{grid-column:1;grid-row:auto}.cn-editor{order:0}.cn-result{order:1}.cn-settings{order:2}.cn-geometry{order:3}.cn-multipart{order:4}.cn-bags{order:5}.cn-cost{order:6}.cn-details:not(.cn-multipart){order:7}.cn-export{order:8}.cn-history{order:9}.cn #cn-toast,.cn #cn-report{order:10}.cn-result{padding:22px}.cn-big{font-size:44px}.cn-geometry{padding:20px}.cn-section-head{grid-template-columns:1fr;gap:12px}.cn-cost-grid{grid-template-columns:1fr 1fr}.cn-converted{grid-template-columns:1fr 1fr}.cn-sensitivity{gap:14px}.cn-sensitivity strong{font-size:23px}.cn-yield{grid-template-columns:1.2fr .8fr;padding:18px;gap:14px}.cn-yield>div:last-child{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:16px}.cn-yield>div:last-child>span{min-height:0;margin:0}.cn-yield strong{padding:0}.cn-bag-grid{gap:16px}.cn-bag strong{font-size:36px}}
@media(max-width:480px){.cn-field{grid-template-columns:minmax(0,.5fr) minmax(0,1fr);gap:10px}.cn-qty{grid-template-columns:.5fr 1fr;gap:10px}.cn-field-controls select{flex-basis:72px;width:72px;font-size:16px}.cn-field-controls input{font-size:17px;padding-inline:8px;min-width:38px}.cn-field-controls input:last-child:not(:first-child){flex-basis:48px;font-size:16px}.cn-volumes{gap:18px 12px}.cn-volumes b{font-size:22px}.cn-volumes span{font-size:16px}.cn #cn-breakdown{min-height:78px}.cn-part{grid-template-columns:minmax(0,1fr) auto;gap:10px}.cn-part button{grid-column:2}.cn-sensitivity{grid-template-columns:1fr}.cn-sensitivity>div{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px 0}.cn-sensitivity small{grid-column:1/-1}.cn-sensitivity strong{margin:0}.cn-history-row{grid-template-columns:1fr auto}.cn-history-row button:last-child{grid-column:2}.cn-price-inputs{grid-template-columns:1fr}.cn-result-head{font-size:20px}.cn-result .cn-hint{font-size:15px}.cn-export button{flex:1 1 auto}}
@media(prefers-reduced-motion:reduce){.cn *{transition:none!important;animation:none!important;scroll-behavior:auto!important}.cn button:hover:not(:disabled),.cn button:active:not(:disabled){transform:none}}
@media print{.cn{display:block}.cn section{margin-block:20px;break-inside:avoid}.cn .cn-actions,.cn .cn-export{display:none}.cn-result{background:var(--color-raised);color:var(--color-fg)}.cn-result :is(span,b,strong,p){color:var(--color-fg)}.cn-big{font-size:40px}.cn #cn-diagram{max-width:380px}}
/* The native result grid supplies the legend; the SVG is only the volume bar. */
.cn #cn-diagram{max-height:340px}
.cn #cn-breakdown{min-height:0}

/* Bagged and delivered supply are alternatives, shown together at the answer. */
.cn-bag-answer{display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:baseline;margin:-8px 0 24px;color:var(--color-raised)}
.cn-bag-answer>span{font-size:18px;font-weight:600}
.cn-bag-answer>strong{font:700 32px/1.2 var(--color-heading);font-variant-numeric:tabular-nums;color:var(--color-raised)}
.cn-bag-answer>small{grid-column:1/-1;font-size:15px;color:var(--color-raised);margin:0}

@media print{.cn-result .cn-bag-answer :is(span,strong,small){color:var(--color-fg)}}

/* Four published bag sizes remain easy to compare on a narrow screen. */
.cn-bag-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:480px){.cn-bag-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px}}

/* Visible compound-inch units and nearby errors make mixed measurements unambiguous. */
.cn-inch-unit{flex:none;color:var(--color-quiet);font-size:16px}
.cn-field-error{grid-column:1/-1;color:var(--color-pop);font-size:16px;line-height:1.5;margin:4px 0 0!important}
.cn [aria-invalid=true]{border-color:var(--color-pop)}
.cn-result .cn-next{font-size:16px;line-height:1.6;color:var(--color-raised);margin-top:18px}
.cn-result .cn-supply-link{color:var(--color-raised);font-size:16px;text-underline-offset:4px;display:inline-block;min-height:44px;padding-block:10px}
.cn #cn-shape-hint{font-size:16px;margin:0 0 16px}
.cn #cn-qty-hint{margin:4px 0 12px}
.cn-field-controls input:not(:first-child){flex:0 1 70px}
@media(max-width:480px){.cn-field{grid-template-columns:1fr;gap:6px}.cn-field-controls input{min-width:60px}.cn-field-controls input:not(:first-child){flex-basis:65px}.cn-field-error{margin-bottom:8px!important}}
@media print{.cn-result .cn-next,.cn-result .cn-supply-link{color:var(--color-fg)}}

.cn-field-help{grid-column:1/-1;font-size:16px;color:var(--color-quiet);margin:0!important}

/* Blueprint result: quantities in a materials table and actual bag pictograms. */
.cn{gap:28px 32px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.cn-kicker{font-size:22px;font-weight:600}
.cn-editor .cn-instructions{font-size:17px;color:var(--color-fg);margin-bottom:20px}
.cn :is(input,select,textarea){border-color:var(--color-border);border-radius:0}
.cn button{border-radius:0}
.cn .cn-primary{background:var(--color-key);color:var(--color-raised);border-left:6px solid var(--color-pop)}
.cn-error,.cn-field-error{color:var(--color-fg);border-left:3px solid var(--color-pop);padding-left:10px}
.cn [aria-invalid=true]{border-color:var(--color-key);box-shadow:inset 4px 0 var(--color-pop)}
.cn-result{background:var(--color-base);color:var(--color-fg);padding:24px;border-radius:0;box-shadow:none}
.cn-result-head{color:var(--color-fg);font-size:20px;font-weight:600}
.cn-result-head #cn-scope{color:var(--color-quiet);font-size:16px}
.cn-big{font-size:48px;color:var(--color-key);margin:12px 0 22px;font-weight:600}
.cn-bag-answer{color:var(--color-fg);margin:0;gap:4px 14px}
.cn-bag-answer>strong{color:var(--color-key)}
.cn-bag-answer>small{color:var(--color-quiet);font-size:16px}
.cn .cn-bag-scene{display:block;width:100%;height:auto;max-height:106px;margin:10px 0 0}
.cn .cn-bag-scene:empty{height:0;margin:0}
.cn-bag-body{fill:var(--color-pop);stroke:var(--color-key);stroke-width:1.5;stroke-linejoin:round}
.cn-bag-seam{fill:none;stroke:var(--color-key);stroke-width:1.3}
.cn-bag-mark{fill:var(--color-key)}
.cn-bag-more{fill:var(--color-key);font-family:var(--color-heading);font-weight:600;font-variant-numeric:tabular-nums}
.cn .cn-bag-legend{font-size:16px;color:var(--color-quiet);margin:8px 0 20px}
.cn .cn-bag-legend:empty{margin:0 0 20px}
.cn table.cn-volumes{display:table;width:100%;border-collapse:collapse;table-layout:fixed;margin:0;background:var(--color-raised);font-size:16px;line-height:1.5}
.cn .cn-volumes th,.cn .cn-volumes td{padding:10px 12px;color:var(--color-fg);background:transparent;border:0;border-bottom:1px solid var(--color-border);vertical-align:middle}
.cn .cn-volumes th{width:62%;font-size:16px;font-weight:500;text-align:left;text-transform:none;letter-spacing:0}
.cn .cn-volumes td{text-align:right}
.cn .cn-volumes tr:last-child :is(th,td){border-bottom:0}
.cn .cn-volumes b{color:var(--color-key);font:600 21px/1.3 var(--color-heading);font-variant-numeric:tabular-nums;margin:0;overflow-wrap:anywhere}
.cn .cn-volumes tr:nth-child(3){background:color-mix(in srgb,var(--color-key) 7%,var(--color-raised))}
.cn-base{fill:var(--color-key)}
.cn-over{fill:var(--color-pop)}
.cn-round{fill:color-mix(in srgb,var(--color-key) 35%,var(--color-raised))}
.cn-conversions,.cn-weight span,.cn-weight strong{color:var(--color-fg);font-size:16px}
.cn-result>.cn-hint,.cn-result .cn-next,.cn-result .cn-supply-link{color:var(--color-fg);font-size:16px}
.cn-result .cn-supply-link{text-decoration-thickness:1px}
.cn-geometry{background:var(--color-key);background-image:linear-gradient(color-mix(in srgb,var(--color-raised) 9%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--color-raised) 9%,transparent) 1px,transparent 1px);background-size:20px 20px;padding:24px;border-radius:0}
.cn-geometry .cn-kicker,.cn-geometry>p,.cn-geometry .cn-draft-volume span,.cn-geometry .cn-draft-volume strong{color:var(--color-raised)}
.cn-geometry>p{font-size:16px}
.cn #cn-diagram{max-height:330px}
.cn-geometry .cn-dim{fill:var(--color-raised);font-weight:500}
.cn-geometry .cn-solid{stroke:var(--color-raised)}
.cn-geometry .cn-top{fill:color-mix(in srgb,var(--color-key) 20%,var(--color-raised));stroke:var(--color-raised)}
.cn-geometry .cn-front{fill:color-mix(in srgb,var(--color-key) 45%,var(--color-raised));stroke:var(--color-raised)}
.cn-geometry .cn-side{fill:color-mix(in srgb,var(--color-key) 65%,var(--color-raised));stroke:var(--color-raised)}
.cn-geometry .cn-edge{stroke:var(--color-raised)}
.cn-geometry .cn-hole{fill:var(--color-key);stroke:var(--color-pop)}
.cn-geometry .cn-measure{stroke:var(--color-pop);stroke-width:2;fill:none}
.cn-board-front{fill:color-mix(in srgb,var(--color-pop) 65%,var(--color-key));stroke:var(--color-pop);stroke-width:1.5}
.cn-board-side{fill:color-mix(in srgb,var(--color-pop) 25%,var(--color-key));stroke:var(--color-pop);stroke-width:1.5}
.cn-stake{fill:var(--color-pop);stroke:var(--color-pop);stroke-width:1}
.cn-bags .cn-bag-grid{display:table;table-layout:fixed;width:100%;border-collapse:collapse;background:var(--color-base)}
.cn-bags .cn-bag{display:table-cell;padding:16px}
.cn-bags .cn-bag:nth-child(even){background:color-mix(in srgb,var(--color-key) 5%,var(--color-base))}
.cn-bags .cn-bag small{font-size:16px}
.cn-bags .cn-bag strong{font-weight:600}
.cn-yield,.cn-equation{border-radius:0}
@media(max-width:760px){.cn{grid-template-columns:1fr;gap:28px}.cn-result{padding:20px}.cn-big{font-size:44px}.cn-geometry{padding:20px}.cn .cn-bag-legend{margin-bottom:18px}.cn-bags .cn-bag{padding:14px 10px}.cn .cn-volumes b{font-size:21px}}
@media(max-width:480px){.cn .cn-volumes th,.cn .cn-volumes td{padding:10px 8px}.cn .cn-volumes th{width:57%}.cn .cn-volumes b{font-size:20px}.cn .cn-bag-scene{max-height:none}.cn-result{padding:18px}.cn-bags .cn-bag-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.cn-bags .cn-bag{display:block;padding:16px}.cn-geometry .cn-draft-volume{flex-wrap:wrap}}
@media print{.cn-result{background:var(--color-raised)}.cn-geometry{print-color-adjust:exact}.cn-bag-scene{max-width:400px}}
/* Independent desktop columns keep settings close to the measurements. */
.cn-input-side,.cn-output-side{display:flex;flex-direction:column;gap:28px;align-self:start}
.cn-input-side{grid-column:1}.cn-output-side{grid-column:2}
.cn-input-side>.cn-settings{padding-top:12px}
@media(max-width:760px){.cn-input-side,.cn-output-side{display:contents}.cn-input-side>.cn-settings{padding-top:0}}

/* Keep whole-bag counts exact and readable even at the supported volume limit. */
.cn .cn-bag strong.cn-large-count,.cn .cn-bag-answer strong.cn-large-count,.cn .cn-yield strong.cn-large-count{font-size:22px;white-space:nowrap}
@media(max-width:480px){.cn .cn-bag strong.cn-large-count{font-size:18px}.cn .cn-bag-answer{grid-template-columns:minmax(0,1fr) auto}.cn .cn-bag-answer>span{overflow-wrap:anywhere}.cn .cn-yield>div:last-child{flex-wrap:wrap}}

/* design: sites/<d>/design/site.css */
/* Concrete estimator: compact white page, clear construction typography. */
body{background:var(--color-base);color:var(--color-fg);font:400 17px/1.7 var(--color-font-body)}
h1,h2,h3{font-family:var(--color-heading);font-weight:700;letter-spacing:0;color:var(--color-fg)}
h1{font-size:40px;line-height:1.16}h2{font-size:29px;line-height:1.3}h3{font-size:23px;line-height:1.35}
.site-inner{max-width:1160px;padding-inline:28px;margin-inline:auto}
.site-content a{color:var(--color-key);text-decoration-thickness:1px;text-underline-offset:4px}
.site-content a:hover{color:var(--color-pop);text-decoration-thickness:2px}
.site-header-bar{background:var(--color-raised);border:0;border-radius:0;box-shadow:none;margin:0;max-width:none;position:static}
.site-top__in{max-width:1160px;margin:auto;min-height:78px;padding:15px 28px;gap:24px;background:transparent;border:0;border-radius:0}
.site-home-link{display:flex;align-items:center;gap:11px;font:700 23px/1.2 var(--color-heading);letter-spacing:0;text-decoration:none;color:var(--color-fg)}
.site-header-bar .site-home-link,.site-header-bar .site-home-link span{color:var(--color-fg)}
.site-home-link svg{width:35px;height:35px;padding:3px;background:var(--color-key);color:var(--color-raised);border:0;border-radius:3px;flex:none}
.site-links{display:flex;gap:24px;font-size:16px;font-weight:600;letter-spacing:0;text-transform:none}
.site-header-bar .site-links a{color:var(--color-fg);text-decoration:none;padding-block:8px;border:0}
.site-header-bar .site-links a:hover,.site-header-bar .site-links a[aria-current]{color:var(--color-key);text-decoration:underline;text-underline-offset:5px}
.site-langs{font-size:15px;letter-spacing:0;z-index:8}
.site-header-bar .site-langs summary{border:0;background:var(--color-base);color:var(--color-fg);padding:10px 12px;border-radius:3px;cursor:pointer;min-height:44px}
.site-lang-menu__list{background:var(--color-raised);border:1px solid var(--color-border);border-radius:3px;padding:8px;box-shadow:0 6px 18px color-mix(in srgb,var(--color-fg) 12%,transparent)}
.site-lang-menu__list a{font-size:16px;letter-spacing:0;text-transform:none;padding:10px 12px;text-decoration:none;color:var(--color-fg);min-height:44px}
.site-header-bar .site-lang-menu__list a{color:var(--color-fg)}
.site-lang-menu__list a:hover{background:color-mix(in srgb,var(--color-key) 8%,var(--color-raised))}
.site-langpills{display:flex;gap:8px;flex-wrap:wrap}
.site-langpills a{font-size:15px;min-height:44px;padding:10px 12px;border:0;border-radius:3px;color:var(--color-fg);text-decoration:none}
.site-langpills a[aria-current]{background:var(--color-key);color:var(--color-raised)}
.site-lede-box{padding:24px 0 22px;text-align:left;background:var(--color-base);border:0;overflow:visible}
.site-lede-box>div{padding-right:28px;min-height:0}
.site-lede-box:before,.site-lede-box:after,.site-lede-box>div:before,.site-lede-box>div:after{content:none}
.site-lede-box h1{font:700 40px/1.16 var(--color-heading);letter-spacing:0;max-width:none;margin:0 0 10px;color:var(--color-fg)}
.site-lede-box .site-summary{font:400 18px/1.5 var(--color-font-body);max-width:none;margin:0;color:var(--color-quiet)}
.site-lede-box--band h1{color:var(--color-fg)}
.site-lede-box--band .site-summary{color:var(--color-quiet)}
.site-content>.site-inner{padding-top:0}
.site-calc-area{padding:0;margin:0 0 44px;background:transparent;border:0;border-radius:0;box-shadow:none}
.site-layout{display:block}
.site-layout>.site-contents{position:static;background:transparent;border:0;padding:20px 0;margin:0 0 24px;font-size:16px}
.site-segment{background:transparent;border:0;border-radius:0;padding:30px 0;max-width:76ch;counter-increment:none}
.site-segment:before,.site-segment>h2:before,.site-segment>h2:after{content:none}
.site-segment>h2{font:700 29px/1.3 var(--color-heading);letter-spacing:0;margin:0 0 18px;padding:0;border:0}
.site-segment>p{font-size:17px;line-height:1.75;margin:0 0 20px;max-width:72ch}
.site-segment h3{font:700 23px/1.35 var(--color-heading);margin:28px 0 14px}
.site-segment li{font-size:17px;line-height:1.75;padding:4px 0}
.site-segment>ul,.site-segment>ol{padding-left:25px;margin:22px 0}
.site-segment li::marker{color:var(--color-key)}
.site-segment strong{font-weight:600}
.site-segment .site-summary{color:var(--color-fg);font-size:18px}
.site-table-holder{overflow-x:auto;max-width:100%;border:0;border-radius:0;background:transparent;margin:28px 0}
.site-facts{border-collapse:collapse;width:100%;font-size:16px;line-height:1.6;font-variant-numeric:tabular-nums}
.site-facts th{font:600 16px/1.5 var(--color-font-body);text-align:left;letter-spacing:0;text-transform:none;padding:15px;background:var(--color-key);color:var(--color-raised);border:0}
.site-facts td{padding:15px;border:0;border-bottom:1px solid var(--color-border);vertical-align:top;color:var(--color-fg);overflow-wrap:anywhere}
.site-facts td:first-child{font-weight:600;color:var(--color-fg)}
.site-facts tbody tr:nth-child(even){background:color-mix(in srgb,var(--color-key) 4%,var(--color-raised))}
.site-facts caption{font-size:16px;text-align:left;padding:10px 0;color:var(--color-quiet)}
.site-graphic{border:0;border-radius:0;background:transparent;max-width:780px;margin:30px 0;overflow:hidden}
.site-graphic img{display:block;width:100%;height:auto}
.site-graphic figcaption{padding:12px 0;font-size:15px;line-height:1.6;color:var(--color-quiet);border:0}
.site-procedure{padding-left:26px;border:0;margin:25px 0}
.site-procedure li{padding:7px 0 7px 5px;border:0;font-size:17px}
.site-procedure li::marker{color:var(--color-key);font-weight:600}
.site-calc-line{font:600 20px/1.5 var(--color-font-body);padding:20px;background:color-mix(in srgb,var(--color-key) 6%,var(--color-raised));border:0;border-radius:3px;font-variant-numeric:tabular-nums}
.site-aside-note{border:0;border-radius:0;padding:16px 0;background:transparent;color:var(--color-quiet);font-size:17px}
.site-breadcrumbs{font-size:15px;line-height:1.6;color:var(--color-quiet);padding:18px 0;letter-spacing:0}
.site-breadcrumbs a{color:var(--color-quiet);text-decoration:none}
.site-tiles,.site-blist{max-width:none!important;margin:28px 0}
.site-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.site-read{background:transparent;border:0;border-radius:0;box-shadow:none;text-decoration:none!important;overflow:hidden;transition:transform .18s ease}
.site-read:hover{transform:translateY(-3px)}
.site-guide-card__img{width:100%;height:auto;display:block;aspect-ratio:1200/630;object-fit:cover;border:0;border-radius:3px;background:color-mix(in srgb,var(--color-key) 6%,var(--color-raised))}
.site-read__txt{padding:18px 0;display:block}
.site-read__txt b,.site-read h3{display:block;font:700 24px/1.3 var(--color-heading);letter-spacing:0;color:var(--color-fg);margin:0 0 12px}
.site-read__txt>span,.site-read p{font:400 16px/1.7 var(--color-font-body);color:var(--color-quiet);margin:0 0 12px;display:block}
.site-tile__meta{font:600 15px/1.5 var(--color-font-body);letter-spacing:0;text-transform:none;color:var(--color-key)}
.site-read small,.site-brow small{display:block;margin-top:16px}
.site-blist{display:flex;flex-direction:column;gap:32px}
.site-brow{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);gap:28px;align-items:center;background:transparent;border:0;border-radius:0;text-decoration:none!important;overflow:hidden}
.site-brow .site-read__txt{padding:12px 0}
.site-brow .site-read__txt b{font-size:27px}
.site-brow .site-guide-card__img{height:auto;aspect-ratio:1200/630;border:0}
.site-blist--min .site-brow{padding:0}
.site-faq-list{max-width:76ch;padding:30px 0 45px;border:0}
.site-faq-list h2{font:700 29px/1.3 var(--color-heading);letter-spacing:0;margin:0 0 24px;color:var(--color-fg)}
.site-faq-list h3{font:600 22px/1.4 var(--color-heading);margin:0 0 12px;color:var(--color-fg)}
.site-faq-list p{font:400 17px/1.7 var(--color-font-body);color:var(--color-fg);margin:0}
.site-qa__grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.site-qa__grid>div{border:0;padding:0;border-radius:0;background:transparent}
.site-faq-list details{padding:18px 0;border:0;border-bottom:1px solid var(--color-border);border-radius:0;background:transparent;margin:0}
.site-faq-list summary{font:600 18px/1.5 var(--color-font-body);color:var(--color-fg);cursor:pointer}
.site-faq-list details[open]>summary{margin-bottom:14px;color:var(--color-key)}
.site-faq-list>div:not(.site-qa__grid){padding:20px 0;border:0;max-width:72ch}
.site-post{max-width:100%;margin:auto}
.site-post>.site-segment{max-width:72ch;margin:auto;padding:28px 0}
.site-post>.site-segment>p,.site-post>.site-summary{font:400 18px/1.8 var(--color-font-body);max-width:72ch;color:var(--color-fg)}
.site-post>.site-summary{margin:24px auto}
.site-post__head{padding:28px 0 30px;background:transparent;border:0;border-radius:0;margin-bottom:20px;color:var(--color-fg)}
.site-post__head h1{font:700 40px/1.2 var(--color-heading);letter-spacing:0;max-width:29ch;margin:12px 0 20px;color:var(--color-fg)}
.site-post__head .site-summary{font:400 18px/1.7 var(--color-font-body);max-width:65ch;color:var(--color-quiet);margin:0}
.site-post__kicker{font:600 16px/1.5 var(--color-font-body);text-transform:none;letter-spacing:0;color:var(--color-key)}
.site-post__meta{font-size:15px;line-height:1.6;letter-spacing:0;color:var(--color-quiet);margin-top:14px}
.site-post__cover{display:block;width:100%;max-height:450px;object-fit:cover;border:0;border-radius:3px;margin:24px auto}
.site-post__head--band{background:color-mix(in srgb,var(--color-key) 5%,var(--color-raised));padding:28px;border:0}
.site-post__head--band h1{color:var(--color-fg)}
.site-contents--post,.site-contents--rail{position:static!important;top:auto!important;max-width:72ch;margin:22px auto;padding:18px 0;background:transparent;border:0;border-radius:0;font-size:16px;line-height:1.6}
.site-contents--post ul,.site-contents--post ol{margin:0;padding-left:22px}
.site-contents--post li{padding:4px 0}
.site-post>.site-faq-list{max-width:72ch;margin:auto}
.site-post strong{font-weight:600}
.site-content a.site-go{color:var(--color-raised);text-decoration:none}
.site-go,.site-go-box{font:600 16px/1.5 var(--color-font-body);border-radius:3px;padding:12px 22px;min-height:44px;background:var(--color-key);border:0;color:var(--color-raised);box-shadow:none;transition:background .18s}
.site-go:hover,.site-go-box:hover{background:color-mix(in srgb,var(--color-key) 85%,var(--color-fg))}
.site-bottom{background:color-mix(in srgb,var(--color-key) 5%,var(--color-raised));border:0;border-radius:0;padding:36px 0;color:var(--color-fg);margin-top:30px}
.site-colophon__in{max-width:1160px;gap:28px;font-size:16px;line-height:1.7}
.site-bottom .site-home-link,.site-bottom strong{font:700 23px/1.3 var(--color-heading);letter-spacing:0;color:var(--color-fg)}
.site-bottom p{font-size:16px;color:var(--color-quiet);max-width:60ch}
.site-bottom a{color:var(--color-fg);text-underline-offset:4px}
.site-bottom nav{display:flex;gap:14px 22px;flex-wrap:wrap}
.site-bottom small{font-size:15px}
.site-colophon__in>div{min-width:0}
.site-content>.site-inner>h1{font:700 40px/1.2 var(--color-heading);letter-spacing:0;color:var(--color-fg);margin:22px 0 15px}
.site-content>.site-inner>.site-summary{font:400 18px/1.7 var(--color-font-body);max-width:72ch;color:var(--color-quiet)}
@media(max-width:760px){.site-inner{padding-inline:20px}.site-top__in{padding:14px 20px;flex-wrap:wrap;gap:12px}.site-home-link{font-size:21px}.site-links{gap:20px}.site-langs{margin-left:auto}.site-lede-box{padding:20px 0}.site-lede-box>div{padding-right:20px}.site-lede-box h1{font-size:34px}.site-lede-box .site-summary{font-size:17px}.site-tiles{grid-template-columns:1fr}.site-brow{grid-template-columns:1fr;gap:12px}.site-qa__grid{grid-template-columns:1fr}.site-post__head h1,.site-content>.site-inner>h1{font-size:34px}.site-post__head--band{padding:22px}.site-post>.site-segment>p,.site-post>.site-summary{font-size:17px}.site-facts,.site-facts th{font-size:15px}.site-facts th,.site-facts td{padding:12px}.site-segment>h2,.site-faq-list h2{font-size:27px}.site-bottom{padding:28px 0}.site-calc-area{margin-bottom:28px}}
@media(max-width:480px){.site-home-link{font-size:20px}.site-home-link svg{width:30px;height:30px}.site-links{order:3;width:100%;font-size:16px}.site-lede-box h1{font-size:32px}.site-lede-box .site-summary{font-size:17px}.site-post__head h1,.site-content>.site-inner>h1{font-size:32px}.site-post__head--band{padding:20px}.site-facts td:first-child{min-width:110px}.site-read__txt b{font-size:25px}.site-segment{padding:25px 0}}
@media(prefers-reduced-motion:reduce){.site-read,.site-go,.site-go-box{transition:none}.site-read:hover{transform:none}}
.site-post .site-summary::first-letter{font:inherit;float:none;line-height:inherit;margin:0;color:inherit}
.site-go,.site-go-box{text-transform:none;letter-spacing:0}
.site-post__cover img{display:block;width:100%;height:auto;max-height:450px;object-fit:cover;border-radius:3px}
/* Keep article metadata readable against the quiet header band. */
.site-post__head--band .site-post__kicker{color:var(--color-key)}
.site-post__head--band .site-post__meta,.site-post__head--band .site-summary{color:var(--color-quiet)}
.site-post .site-contents--post{position:static!important;background:transparent;border:0;border-radius:0;padding:18px 0;font-size:16px}
.site-post .site-graphic{border:0;border-radius:0;background:transparent}
.site-tiles--feat{grid-template-columns:repeat(2,minmax(0,1fr))}
.site-tiles--feat>.site-read:first-child{gap:24px;grid-template-columns:1.1fr 1fr}
.site-tiles--feat>.site-read:first-child b{font:700 26px/1.3 var(--color-heading)}
@media(max-width:760px){.site-tiles--feat{grid-template-columns:1fr}.site-tiles--feat>.site-read:first-child{display:block}.site-tiles--feat>.site-read:first-child b{font-size:25px}}

/* Override the generated striped-table header at equal specificity. */
.site-facts thead th{background:var(--color-key);color:var(--color-raised)}

/* I · Blueprint. A measured construction sheet, not a marketing hero. */
:root{--color-base:#e9eaec;--color-key:#4a4e69;--color-pop:#f2a541;--color-fg:#25283b;--color-quiet:#4a4e69;--color-border:#c6c8d0;--color-raised:#fff}
body{background-color:var(--color-base);background-image:linear-gradient(color-mix(in srgb,var(--color-key) 7%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--color-key) 7%,transparent) 1px,transparent 1px);background-size:24px 24px}
.site-header-bar{background:var(--color-key);color:var(--color-raised)}
.site-header-bar .site-home-link,.site-header-bar .site-home-link span,.site-header-bar .site-links a{color:var(--color-raised)}
.site-header-bar .site-links a:hover,.site-header-bar .site-links a[aria-current]{color:var(--color-raised);text-decoration-color:var(--color-pop)}
.site-home-link svg{color:var(--color-pop);background:transparent;padding:0}
.site-header-bar .site-langs summary{color:var(--color-raised);background:color-mix(in srgb,var(--color-raised) 12%,var(--color-key))}
.site-header-bar .site-lang-menu__list{background:var(--color-raised)}
.site-header-bar .site-lang-menu__list a,.site-header-bar .site-lang-menu__list a[aria-current]{color:var(--color-fg);background:var(--color-raised)}
.site-header-bar .site-lang-menu__list a:hover{background:var(--color-base)}
.site-lede-box{background:transparent;padding:26px 0 24px}
.site-lede-box h1{font-size:40px;font-weight:600}
.site-lede-box .site-summary{color:var(--color-fg)}
.site-content>.site-inner{padding-top:0}
.site-calc-area{background:var(--color-raised);padding:28px;margin-bottom:36px;border-radius:0;box-shadow:0 6px 20px color-mix(in srgb,var(--color-key) 8%,transparent)}
.site-layout{background:var(--color-raised);padding:8px 28px 28px;margin-inline:-28px}
.site-layout .site-segment{margin-inline:auto;max-width:76ch;padding-block:32px}
.site-segment:has(.site-tiles),.site-segment:has(.site-blist){max-width:none}
.site-content>.site-inner>.site-segment,.site-faq-list{background:var(--color-raised);padding:28px;margin-block:28px}
.site-post>.site-segment{padding:24px 0;background:transparent}
.site-post{background:var(--color-raised);padding:0 28px 28px}
.site-post__head--band{background:var(--color-base);border-left:6px solid var(--color-pop)}
.site-post__head h1{font-weight:600}
.site-facts thead th{background:var(--color-key);color:var(--color-raised)}
.site-facts a,.site-segment a,.site-faq-list a{color:var(--color-key)}
.site-content a:hover{color:var(--color-fg)}
.site-guide-card__img{background:var(--color-base)}
.site-read__txt b{font-weight:600}
.site-bottom{background:var(--color-key);color:var(--color-raised)}
.site-bottom .site-home-link,.site-bottom strong,.site-bottom p,.site-bottom a,.site-bottom small{color:var(--color-raised)}
.site-bottom a:hover{color:var(--color-pop)}
@media(max-width:760px){.site-lede-box{padding-block:20px}.site-lede-box h1{font-size:34px}.site-calc-area{padding:20px;margin-inline:-8px}.site-layout{padding:0 20px 20px;margin-inline:-20px}.site-content>.site-inner>.site-segment,.site-faq-list{padding:20px;margin-inline:-8px}.site-post{padding-inline:0;background:transparent}.site-post>.site-segment{padding:20px;background:var(--color-raised);margin-inline:-8px}.site-post__head--band{padding:20px}.site-post>.site-faq-list{padding:20px}}
@media(max-width:480px){.site-lede-box h1{font-size:32px}.site-calc-area{padding:18px}.site-top__in{gap:10px}.site-header-bar .site-langs summary{font-size:16px}}
/* The grid is a margin texture; long reading passages have plain paper behind them. */
.site-content>.site-segment{max-width:none;background:var(--color-raised);padding:30px 48px;margin:0}
.site-content>.site-segment>:is(h2,h3,p,ul,ol,.site-table-holder,.site-calc-line,.site-aside-note,.site-graphic){max-width:76ch;margin-inline:auto}
.site-content>.site-segment:has(.site-tiles),.site-content>.site-segment:has(.site-blist){padding:32px 28px}
.site-content>.site-segment:has(.site-tiles)>h2,.site-content>.site-segment:has(.site-blist)>h2{max-width:none}
@media(max-width:760px){.site-content>.site-segment{padding:26px 20px}.site-content>.site-segment:has(.site-tiles),.site-content>.site-segment:has(.site-blist){padding:26px 20px}}

/* I · Blueprint first screen: the header, title and calculator share one sheet.
   The opaque reading sections keep the drawing texture away from long text. */
body:has(.site-content > .site-lede-box){
  background-color:var(--color-base);
  background-image:
    linear-gradient(to bottom,transparent 340px,var(--color-base) 340px),
    linear-gradient(color-mix(in srgb,var(--color-raised) 10%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--color-raised) 10%,transparent) 1px,transparent 1px),
    linear-gradient(color-mix(in srgb,var(--color-raised) 7%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--color-raised) 7%,transparent) 1px,transparent 1px),
    linear-gradient(var(--color-key),var(--color-key));
  background-size:auto,24px 24px,24px 24px,120px 120px,120px 120px,auto;
  background-repeat:repeat;
}
body:has(.site-content > .site-lede-box) .site-header-bar{background:transparent}
body:has(.site-content > .site-lede-box) .site-top__in{min-height:74px;padding-block:13px}
body:has(.site-content > .site-lede-box) .site-header-bar .site-langs summary{
  background:color-mix(in srgb,var(--color-key) 84%,var(--color-raised));
}
.site-content > .site-lede-box{
  background:transparent url(/assets/img/d-blueprint-slab.svg) right 12px center / 220px 106px no-repeat;
  padding:18px 12px 24px;
  margin:0 0 10px;
}
.site-content > .site-lede-box h1{color:var(--color-raised);font-weight:600;letter-spacing:0}
.site-content > .site-lede-box .site-summary{color:var(--color-raised);max-width:76ch}
.site-content > .site-calc-area{
  background:var(--color-raised);
  box-shadow:0 10px 28px color-mix(in srgb,var(--color-fg) 20%,transparent);
}
@media(max-width:760px){
  body:has(.site-content > .site-lede-box) .site-top__in{padding-block:14px;min-height:0}
  .site-content > .site-lede-box{padding:14px 0 18px;margin-bottom:6px}
  .site-content > .site-lede-box > div{padding-right:0}
}
@media print{
  body:has(.site-content > .site-lede-box){background:var(--color-raised)}
  body:has(.site-content > .site-lede-box) .site-header-bar{background:var(--color-key)}
  .site-content > .site-lede-box h1,.site-content > .site-lede-box .site-summary{color:var(--color-fg)}
  .site-content > .site-calc-area{box-shadow:none}
}

/* Dimension lines belong to the slab outline; no decorative rulers. */
@media(min-width:1000px){.site-content > .site-lede-box > div{padding-right:260px}}
@media(max-width:999px){.site-content > .site-lede-box{background-image:none}}
@media print{.site-content > .site-lede-box{background-image:none}}