/* Buildner Tools: Brand & UI Manual v2.0 / Electric Blue.
   This file follows tool CSS so shared design roles stay consistent. */
:root{
  --brand-black:#000000;--paper:#FFFFFF;--action:#254DFF;--action-hover:#163BDF;--action-pressed:#182BBF;
  --structure:#182BBF;--soft:#EEF1FF;--ink:#111111;--supporting:#595959;--rule:#DEDEDE;
  --input-boundary:#767676;--caution:#934322;--warn:#FFF4EE;--disabled:#E3E3E3;--on-disabled:#595959;--on-blue:#FFFFFF;
  --grey60:var(--supporting);--hair:var(--rule);--panel:#F1F1F1;--contrast:var(--structure);--accent:var(--structure);--mark-accent:var(--structure);--muted:#DDDDDD;
  --page-gutter:48px;--section-pad-y:96px;--hero-pad-y:120px;--section-heading-gap:64px;
  --hero-title-lead-gap:32px;--hero-lead-action-gap:40px;--entry-pad-y:32px;--utility-pad:32px;--note-pad:32px;--band-pad:64px;
  --field-group-gap:24px;--label-field-gap:12px;--action-gap:16px;--chip-gap:12px;--paragraph-gap:24px;
}
html{scroll-padding-top:24px}
body{color:var(--ink);font-size:16px;line-height:24px}
.wrap{width:min(1280px,calc(100% - var(--page-gutter)*2));max-width:none;margin-inline:auto;padding-inline:0}
h1,h2,h3,h4,.h1,.h2,.name{font-family:var(--display);font-weight:600;letter-spacing:normal}
h1,h2,h3,h4,p{margin-top:0}
.h1{font-size:56px;line-height:64px}.h2{font-size:40px;line-height:48px}.name{font-size:24px;line-height:32px}
.lead{color:var(--grey60);font-size:20px;line-height:28px}
.label,.eyebrow{font-family:var(--body);font-size:13px;line-height:20px;font-weight:500;letter-spacing:.055em;text-transform:uppercase;margin:0}
:where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid var(--structure);outline-offset:4px}
main:focus{outline:none}
button,input,select,textarea{font-family:var(--body)}
button{cursor:pointer}button:disabled{cursor:default}
.skip-link{position:absolute;left:20px;top:-100px;z-index:99;background:#000;color:#fff;padding:16px 24px}
.skip-link:focus{top:12px}
/* The corporate frame remains monochrome. */
.top{border-bottom:1px solid #E3E3E3;position:relative;background:#fff;color:#000}
.top-in{min-height:104px;align-items:center;gap:32px;padding-block:24px;flex-wrap:nowrap}
.lockup{gap:24px;flex:none;color:#000}
.lockup .wordmark{width:187px;height:26px;max-width:none}
.lockup-rule{height:28px;background:#E3E3E3}
.lockup-section{font-size:14px;line-height:21px;font-weight:400}
.nav{align-items:center;gap:24px;width:auto;border:0}
.nav-link{min-height:44px;padding:0;margin:0;border:0;font-size:16px;line-height:24px;white-space:nowrap;position:relative}
.nav-link.is-active::after{content:'';position:absolute;bottom:3px;height:2px;background:#000;left:0;right:0}
.nav-link .ext{width:12px;height:12px}
.btn{min-height:56px;height:auto;padding:15px 24px;display:inline-flex;align-items:center;justify-content:center;gap:16px;font-weight:400;line-height:24px;white-space:normal;text-align:center;border-radius:2px}
.btn.primary{background:var(--action);border-color:var(--action);color:var(--on-blue)}
.btn.secondary{background:#fff;border-color:var(--input-boundary);color:var(--ink)}
.btn.header-action{color:#fff;background:#000;border-color:#000;padding:15px 20px;white-space:nowrap}
.btn.primary:active:not(:disabled){background:var(--action-pressed);border-color:var(--action-pressed)}
.btn:disabled{opacity:1;background:var(--disabled);border-color:var(--disabled);color:var(--on-disabled);cursor:default}
.menu-toggle{display:none;background:transparent;border:0;color:#000;font-size:16px;min-height:48px;padding:8px 0;gap:12px;align-items:center}
.menu-symbol{font-size:24px;font-weight:400;width:20px}
.crumbs{padding-block:24px 0;font-size:14px;line-height:22px;color:var(--grey60)}
.crumbs a{min-height:24px}.crumbs ol{flex-wrap:wrap}
/* Tools: page headers, controls, live drawings and numeric results. */
.intro{padding-block:48px;gap:32px;align-items:end}
.intro .lead{max-width:59ch;padding-top:24px}
.intro>.facts{gap:16px}
.fact .h1{font-size:48px;line-height:56px;color:var(--structure)}
.fact .body{font-size:14px;line-height:22px}
.field,.fld input,.fld select,.rs-field{min-height:48px;border-color:var(--grey60);font-size:16px;border-radius:2px}
label.label,.field-group>.label,.ctl>.label{font-size:14px;line-height:22px;letter-spacing:0;text-transform:none}
.seg,.rs-seg{border-color:var(--structure)}
.seg button[aria-pressed=true],.seg button.on,.rs-seg button[aria-checked=true],.chip.on{background:var(--structure);color:#fff}
.rs-code[aria-checked=true]{box-shadow:0 0 0 2px var(--structure);background:var(--soft)}
.sc-row[aria-label=Inputs],.controls[aria-label="Your plan settings"]{background:var(--soft);padding:32px;border-top:0;margin-bottom:32px}
.sc-fig{background:var(--soft);border:0;padding:32px 24px 16px}
.sc-figcap{background:var(--soft);padding:8px 24px 24px}
.sc-res{background:var(--structure);color:#fff;border:0;padding:0 24px;margin-top:32px}
.sc-res .grey{color:#FFFFFF}.sc-res .sc-tile+.sc-tile{border-color:#FFFFFF66}
.sc-res input[type=range]::-webkit-slider-runnable-track{background:#FFFFFF99}
.sc-res input[type=range]::-webkit-slider-thumb{background:var(--on-blue)}
.sc-res input[type=range]::-moz-range-track{background:#FFFFFF99}
.sc-res input[type=range]::-moz-range-thumb{background:var(--on-blue)}
.sc-res .tert{color:#fff}
.sc-res .sc-cap.bad{color:var(--ink)}
/* Keep a native, keyboard-accessible control steady under both mouse and finger. */
input[type=range]{--range-thumb-width:14px;touch-action:none;user-select:none;cursor:ew-resize;min-height:44px}
#hero-height{--range-thumb-width:12px}#gr{--range-thumb-width:10px}#slider{--range-thumb-width:44px}#t[type=range]{--range-thumb-width:22px}#hours{--range-thumb-width:20px}
input[type=range]::-webkit-slider-thumb{cursor:ew-resize}
input[type=range]::-moz-range-thumb{cursor:ew-resize}
body.range-dragging,body.range-dragging *{cursor:ew-resize!important;user-select:none!important}
input[type=range]:focus-visible{outline:3px solid var(--structure);outline-offset:4px}
.sc-res input[type=range]:focus-visible{outline-color:var(--on-blue)}
.sc-res #gr{display:block;margin-top:8px;margin-bottom:0}
.sc-res #ga[hidden]{display:inline-block!important;visibility:hidden;pointer-events:none}
.study-results strong,.study-input output,.sc-tile .h1,.rs-tile .h1,#hoursOut,#timeout{font-variant-numeric:tabular-nums}
.rs-results{padding-inline:24px;background:var(--structure);color:#fff;border:0;margin-block:16px 32px}
.rs-results .grey{color:#FFFFFF}
.rs-drawing{background:var(--soft);padding:24px;border:0}
.numbers.band{background:var(--structure);color:#fff;border:0;padding:32px 24px}.numbers .grey,.numbers .h2 small{color:#FFFFFF}
.numbers .num .h2{color:#fff}
.map{background:var(--soft)}
.band.drawings{background:var(--soft);padding-inline:24px;margin-bottom:24px;border:0}
.notice{border-left:3px solid #934322;background:var(--warn);color:var(--ink)}
.sc-list li.fail{border-left:2px solid #934322}
.gate-main{padding-block:64px 80px}.gate-main .col{max-width:840px}.gate-main .h1{max-width:650px}
.gate-main .notice{padding:24px}.checks{gap:8px}.check{padding-block:12px}
.check input:checked+.box{background:var(--structure);border-color:var(--structure)}
.record{background:var(--soft);border:0;padding:24px}
/* Home page: an open editorial canvas with one live architectural study. */
.home-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;padding-block:80px}
.hero-copy .eyebrow{display:flex;gap:9px;align-items:center;color:var(--structure)}
.status-dot{display:inline-block;width:7px;height:7px;background:var(--structure);border-radius:50%;flex:none}
.home-hero h1{font-size:72px;line-height:80px;margin:24px 0;letter-spacing:0}
.hero-copy .lead{max-width:49ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:32px}
.hero-note{font-size:13px;line-height:20px;color:var(--grey60);margin:20px 0 0}
.hero-study{margin:0;background:var(--soft);align-self:center;padding:24px 24px 20px;min-width:0}
.study-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--rule);padding-bottom:16px;color:var(--structure)}
.study-head .eyebrow{font-size:12px}
.study-head>a{display:grid;place-items:center;width:44px;height:44px;text-decoration:none;border:1px solid var(--rule);font-size:24px}
#hero-drawing{width:100%;height:auto;display:block;margin-top:16px;font-family:var(--body)}
.study-input{padding:12px 0 8px}
.study-input label{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;line-height:20px}
.study-input output{color:var(--structure);font-weight:500;white-space:nowrap}
.study-input input{appearance:none;width:100%;height:32px;margin:4px 0;background:transparent;cursor:ew-resize}
.study-input input::-webkit-slider-runnable-track{height:2px;background:#767676}
.study-input input::-moz-range-track{height:2px;background:#767676}
.study-input input::-webkit-slider-thumb{appearance:none;width:12px;height:24px;background:var(--structure);margin-top:-11px;border-radius:1px}
.study-input input::-moz-range-thumb{width:12px;height:24px;background:var(--structure);border:0;border-radius:1px}
.study-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--rule);padding-block:16px}
.study-results>div{display:flex;flex-direction:column;padding-inline:20px;border-left:1px solid var(--rule)}
.study-results>div:first-child{padding-left:0;border-left:0}
.study-results strong{font-family:var(--display);font-size:32px;line-height:40px;font-weight:600;color:var(--structure)}
.study-results span{font-size:12px;line-height:20px;color:var(--grey60)}
.hero-study figcaption{font-size:12px;line-height:19px;color:var(--grey60);padding-top:16px}
.home-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;border-block:1px solid var(--rule)}
.home-facts>div{padding:28px 32px;border-left:1px solid var(--rule)}
.home-facts>div:first-child{padding-left:0;border:0}
.home-facts dt{font-family:var(--display);font-size:40px;line-height:48px;font-weight:600}
.home-facts dd{font-size:14px;line-height:22px;color:var(--grey60);margin:8px 0 0}
.catalogue{padding-block:80px}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:40px}
.section-heading .eyebrow{color:var(--grey60);margin-bottom:16px}
.section-heading h2,.university-callout h2{font-size:56px;line-height:64px;margin:0}
.section-heading>p{font-size:16px;line-height:24px;color:var(--grey60);margin:0 0 6px;flex:none}
.catalogue-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;border-block:1px solid var(--rule);padding-block:16px}
.tool-filters{display:flex;flex-wrap:wrap;gap:8px}
.tool-filters button{border:0;background:transparent;color:var(--grey60);font-size:14px;line-height:22px;padding:11px 14px;min-height:44px;border-radius:2px}
.tool-filters button[aria-pressed=true]{background:var(--structure);color:#fff}
.tool-filters button span{margin-left:6px;font-size:12px;opacity:.8}
.tool-search{display:flex;gap:12px;align-items:center;min-height:48px;padding:0 12px;max-width:220px;border:1px solid var(--grey60);border-radius:2px}
.tool-search svg{fill:none;stroke:var(--grey60);stroke-width:1.5;flex:none}
.tool-search input{background:none;border:0;font:inherit;font-size:14px;width:100%;min-width:0;height:46px;outline:none}
.tool-search:focus-within{outline:3px solid var(--structure);outline-offset:4px}
.catalogue-count{font-size:13px;color:var(--grey60);margin:20px 0 32px}
.catalogue .tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 32px}
:is(.tool-entry,.featured-guide){display:flex;flex-direction:column;text-decoration:none;color:var(--ink);min-width:0;border-bottom:1px solid var(--rule);padding-bottom:24px}
.entry-visual{position:relative;background:var(--soft);height:184px;padding:20px;display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.entry-mark{width:112px;height:112px;color:var(--ink);--mark-accent:var(--structure);transition:transform .18s ease}
.entry-category{position:absolute;left:20px;bottom:14px;color:var(--grey60);font-size:12px}
.entry-open{position:absolute;right:20px;bottom:16px;font-size:24px;line-height:24px;color:var(--structure)}
:is(.tool-entry,.featured-guide) h3{font-size:32px;line-height:40px;margin:0 0 12px}
:is(.tool-entry,.featured-guide)>p{color:var(--grey60);margin:0 0 24px;max-width:38ch}
.entry-detail{font-size:12px;line-height:20px;color:var(--structure);display:flex;justify-content:space-between;gap:8px;margin-top:auto}
.entry-detail>span{font-size:20px}
.empty-tools{grid-column:1/-1;padding:40px 0 64px}.empty-tools h3{font-size:32px;line-height:40px}
.workflow-band{background:var(--structure);color:#fff;padding-block:72px}
.workflow-inner{display:grid;grid-template-columns:1fr 1fr;gap:96px;align-items:center}
.workflow-inner .eyebrow{color:#FFFFFF;margin-bottom:24px}
.workflow-inner h2{font-size:56px;line-height:64px;margin-bottom:24px}
.workflow-inner .lead{color:#FFFFFF;max-width:34ch;margin-bottom:32px}
.workflow-band :focus-visible{outline-color:#fff}
.workflow-steps{list-style:none;padding:0;margin:0;display:grid;gap:32px}
.workflow-steps li{display:grid;grid-template-columns:40px 1fr;gap:24px;padding-top:24px;border-top:1px solid #FFFFFF66}
.workflow-steps li>span{color:var(--on-blue);font-size:14px}
.workflow-steps h3{font-size:24px;line-height:32px;margin:0 0 8px}
.workflow-steps p{color:#FFFFFF;margin:0;max-width:42ch}
.university-callout{display:grid;grid-template-columns:1fr 1fr;gap:96px;padding-block:80px;align-items:center}
.university-callout .eyebrow{color:var(--grey60);margin-bottom:24px}.university-callout .lead{max-width:46ch;margin-bottom:24px}
.text-action{display:inline-flex;align-items:center;gap:24px;color:var(--structure);min-height:44px;text-underline-offset:5px}
.home-notes{display:grid;grid-template-columns:1fr 1fr 1fr;gap:40px;padding-block:32px 80px;border-top:1px solid var(--rule)}
.home-notes h3{font-family:var(--body);font-size:16px;line-height:24px;font-weight:500;margin-bottom:16px}
.home-notes p{font-size:14px;line-height:22px;color:var(--grey60);margin-bottom:8px}
.home-notes .text-action{font-size:14px}
/* Academia and the work board share the same frame. */
.grid{gap:32px;padding:0}.tile{box-shadow:none;background:var(--soft);padding:32px;min-height:300px;grid-column:span 6}
.tile .name{font-size:32px;line-height:40px}.tile .body{max-width:48ch}.tile .icon{width:64px;height:64px}
.note{padding-bottom:80px}.intro3{padding-block:48px}.intro3 h1{font-size:56px;line-height:64px}.intro3 .steps .h2{color:var(--structure)}
.tabsbar{background:var(--soft)}
.tabsbar-in,.boardwrap{max-width:none;width:min(1280px,calc(100% - var(--page-gutter)*2));margin-inline:auto;padding-inline:0}
.boardwrap{padding-bottom:64px}.board{padding-top:24px}.list{background:var(--soft)}
.cr-app .h1{font-size:56px;line-height:64px}.cr-num{color:var(--structure)}
/* Footer remains neutral and contains all existing destinations. */
.site-foot{background:#000;color:#fff}.site-foot .wrap{padding-block:64px 32px;gap:40px}
.site-foot .lockup{color:#fff}.site-foot .lockup-rule{background:#666}.positioning{font-family:var(--body);font-size:14px;line-height:22px;color:#ddd;margin-top:24px;text-transform:none;letter-spacing:0}
.fhead{grid-template-columns:1fr 1fr;gap:64px;align-items:start}.fhead>:first-child,.fhead>.fintro{grid-column:auto}
.fhead>.fintro{max-width:46ch;justify-self:end;color:#ddd;font-size:14px;line-height:22px}
.fcols{border-color:#666;padding-top:32px;gap:32px}
.fcol .label{font-size:13px;letter-spacing:0;text-transform:none;color:#aaa}
.fcol ul{gap:0}.fcol a{display:inline-flex;align-items:center;min-height:36px;font-size:14px;line-height:22px}
.legal{border-color:#666;font-size:12px;color:#ddd;align-items:start;gap:16px}.legal>span:first-child{max-width:54ch}.legal-links{gap:24px;flex-wrap:wrap}.legal a{min-height:44px;display:inline-flex;align-items:center;color:#ddd}
.site-foot :focus-visible{outline-color:#fff}
@media(hover:hover){.btn.primary:hover:not(:disabled){background:var(--action-hover);border-color:var(--action-hover);color:var(--on-blue)}.btn.secondary:hover:not(:disabled){background:var(--soft)}.header-action:hover{opacity:.8}:is(.tool-entry,.featured-guide):hover .entry-mark{transform:translateY(-5px)}:is(.tool-entry,.featured-guide):hover h3{text-decoration:underline;text-underline-offset:5px}:is(.tool-entry,.featured-guide):hover .entry-visual{background:#EEF1FF}.tool-filters button:not([aria-pressed=true]):hover{background:var(--soft)}.study-head>a:hover{background:var(--action);color:var(--on-blue);border-color:var(--action)}}
@media(max-width:1200px){:root{--page-gutter:36px}.top-in{min-height:88px;padding-block:20px;flex-wrap:wrap;gap:0 20px}.top-in .lockup{padding:0}.menu-toggle{display:flex;margin-left:auto}.nav{display:none;width:100%;padding-top:20px;margin-top:20px;border-top:1px solid #E3E3E3;align-items:stretch;gap:0;flex-direction:column}.nav.is-open{display:flex}.nav-link{padding:12px 0;min-height:48px;border-bottom:1px solid #E3E3E3}.nav-link.is-active::after{display:none}.nav-link.is-active{font-weight:500;text-decoration:underline;text-underline-offset:6px}.nav .header-action{align-self:start;margin-top:20px}.catalogue-toolbar{align-items:start}.tool-search{max-width:100%;width:240px}.section-heading>p{display:none}}
@media(max-width:1100px){.home-hero{gap:40px;padding-block:64px}.home-hero h1{font-size:56px;line-height:64px}.hero-actions{gap:12px}.catalogue .tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 24px}.workflow-inner,.university-callout{gap:48px}.workflow-inner h2{font-size:48px;line-height:56px}.hero-study{padding:20px}.study-results>div{padding-inline:12px}.study-results strong{font-size:28px;line-height:36px}.home-notes{gap:24px}}
@media(max-width:760px){:root{--page-gutter:20px}.top-in{gap:0 16px}.lockup{gap:12px}.lockup .wordmark{width:140px;height:auto}.lockup-rule{height:24px}.nav .header-action{align-self:stretch;justify-content:space-between}.home-hero{grid-template-columns:1fr;padding-block:48px;gap:32px}.home-hero h1{font-size:48px;line-height:54px}.home-hero h1 br{display:none}.hero-copy .eyebrow{font-size:11px;letter-spacing:.03em}.hero-copy .lead,.lead{font-size:18px;line-height:26px}.hero-note{font-size:12px}.hero-study{padding:16px}.home-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.home-facts>div{padding:24px 20px}.home-facts>div:nth-child(3){border-left:0;padding-left:0;border-top:1px solid var(--rule)}.home-facts>div:nth-child(4){border-top:1px solid var(--rule)}.home-facts dt{font-size:32px;line-height:40px}.home-facts dd{font-size:12px;line-height:20px}.catalogue{padding-block:48px}.section-heading{margin-bottom:32px}.section-heading h2,.university-callout h2{font-size:40px;line-height:48px}.section-heading .eyebrow{font-size:12px}.catalogue-toolbar{gap:16px;padding-block:16px}.tool-search{width:100%;max-width:none}.tool-filters{gap:4px}.tool-filters button{padding:11px 10px;font-size:13px}.catalogue .tool-grid{grid-template-columns:1fr;gap:32px}.entry-visual{height:184px;margin-bottom:20px}:is(.tool-entry,.featured-guide) h3{font-size:28px;line-height:36px}:is(.tool-entry,.featured-guide)>p{max-width:none}.workflow-band{padding-block:48px}.workflow-inner{grid-template-columns:1fr;gap:40px}.workflow-inner h2{font-size:40px;line-height:48px}.workflow-steps{gap:24px}.workflow-steps li{gap:16px;grid-template-columns:32px 1fr}.workflow-steps h3{font-size:24px;line-height:32px}.university-callout{grid-template-columns:1fr;gap:32px;padding-block:48px}.home-notes{grid-template-columns:1fr;gap:32px;padding-block:32px 48px}.home-notes h3{margin-bottom:12px}.intro{padding-block:32px 40px}.h1,.intro3 h1,.cr-app .h1{font-size:40px;line-height:48px}.h2{font-size:32px;line-height:40px}.fact .h1{font-size:36px;line-height:44px}.intro>.facts{gap:12px}.fact .body{font-size:12px;line-height:20px}.sc-row[aria-label=Inputs],.controls[aria-label="Your plan settings"]{padding:20px}.sc-fig{padding:24px 12px 16px}.sc-figcap{padding:8px 16px 24px;font-size:12px;line-height:20px}.sc-res{padding-inline:16px}.sc-res .h1{font-size:36px;line-height:44px}.rs-results{padding-inline:20px}.band.drawings{padding-inline:16px}.numbers.band{padding:24px 20px}.gate-main{padding-block:40px 48px}.gate-main .notice,.record{padding:20px}.tile{grid-column:1/-1;padding:24px}.tile .name{font-size:28px;line-height:36px}.note{margin-top:48px;padding-block:32px 48px}.intro3{padding-block:32px}.fhead{grid-template-columns:1fr;gap:24px}.fhead>.fintro{justify-self:start}.site-foot .wrap{padding-block:48px 24px;gap:32px}.site-foot .wordmark{width:187px}.fcols{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 16px}.fcol{grid-column:auto}.fcol a{min-height:44px;font-size:13px;line-height:20px}.legal{display:block}.legal-links{margin-top:16px;gap:12px 24px}.legal-links a{font-size:12px}.legal>span:first-child{display:block}.home-hero .btn{font-size:14px;padding-inline:18px}.home-hero .hero-actions{gap:12px}}
@media(max-width:360px){.lockup-section,.top .lockup-rule{display:none}.top .wordmark{width:147px}.home-hero h1{font-size:44px;line-height:49px}.h1,.intro3 h1,.cr-app .h1{font-size:36px;line-height:42px}.hero-actions>.btn{width:100%;justify-content:space-between}.study-results strong{font-size:24px;line-height:32px}.study-input label{font-size:12px}.study-head .eyebrow{font-size:10px}.home-facts>div{padding-right:8px}.section-heading h2{font-size:36px;line-height:42px}.tool-filters button{font-size:12px}.site-foot .lockup{gap:12px}.fcols{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;animation-iteration-count:1!important}}
@media print{.top,.site-foot,.crumbs,.skip-link{display:none!important}.wrap{width:100%;padding:0}.sc-res,.rs-results,.numbers.band{background:#fff;color:#000}.sc-res .grey,.rs-results .grey,.numbers .grey,.numbers .h2 small,.numbers .num .h2{color:#333}.btn,.menu-toggle{display:none}}
/* Narrow-screen safeguards: twelve columns must not spend their full width on gaps. */
.intro{column-gap:var(--gutter)}
.intro>*,.bar-tools,.tabsbar-in>*{min-width:0}
[data-page=taskboard] .head{padding-inline:0}
[data-page=taskboard] .bar-tools{max-width:100%;flex-wrap:wrap}
[data-page=taskboard] .bar-tools .find{min-width:100px;flex:1 1 120px}
@media(max-width:760px){[data-page=taskboard] .board,[data-page=taskboard] .under{padding-inline:0}[data-page=taskboard] .tabsbar-in{padding-inline:0}.intro>.facts{column-gap:12px}}

.preview-notice{margin-top:24px;background:var(--soft);border-left:3px solid var(--structure);padding:16px 20px;font-size:14px;line-height:22px}
/* Reading and interaction use the manual's full 16px control size. */
.tool-filters button,.tool-search input{font-size:16px;line-height:24px}
.tool-filters button{padding:10px 14px}
.entry-detail,.entry-category,.hero-note,.hero-study figcaption,.study-input label,.study-results span{font-size:13px}
@media(max-width:760px){.tool-filters button{padding:10px 12px}:is(.tool-entry,.featured-guide) h3{font-size:24px;line-height:32px}.hero-copy .eyebrow{font-size:12px}.hero-actions .btn{font-size:16px}}
@media(max-width:360px){.hero-copy .eyebrow{align-items:flex-start}.hero-copy .status-dot{margin-top:6px}}
@media(max-width:760px){.grid{column-gap:var(--gutter)}}

/* V2 spacing applies once per section; utility panels retain their own internal padding. */
.home-hero{padding-block:var(--hero-pad-y)}
.home-hero h1{margin:24px 0 var(--hero-title-lead-gap)}
.hero-actions{margin-top:var(--hero-lead-action-gap);gap:var(--action-gap)}
.hero-note{margin-top:24px}
.hero-copy .eyebrow,.study-head .eyebrow{font-size:13px;line-height:20px}
.hero-study{padding:var(--utility-pad)}
.hero-study figcaption{padding-top:16px;font-size:13px;line-height:21px}
.study-head{padding-bottom:24px;color:var(--ink)}
.study-input{padding-block:24px}
.study-input label{font-size:14px;line-height:21px;flex-wrap:wrap}
.study-input input{margin-top:12px}
.study-results{padding-block:24px}
.study-results span{font-size:13px;line-height:21px}
.home-facts>div{padding:40px 24px}
.home-facts dt{font-size:56px;line-height:64px;overflow-wrap:anywhere}
.home-facts dd{font-size:14px;line-height:21px}
.catalogue,.home-notes,.intro,.crumbs ~ main .intro,.sc-row,.rs-controls,.rs-codes,.rs-how,.band,.plan,.calendar{padding-block:var(--section-pad-y)}
.section-heading{margin-bottom:var(--section-heading-gap)}
.catalogue-toolbar{background:var(--soft);border:0;padding:var(--utility-pad);gap:var(--field-group-gap);align-items:start}
.tool-filters{gap:var(--chip-gap)}
.tool-filters button{background:#fff;padding:9px 16px;min-height:44px;font-size:16px;line-height:24px;white-space:normal}
.tool-filters button[aria-pressed=true]{background:var(--structure);color:var(--on-blue)}
.tool-search{background:#fff;min-height:56px;width:240px;max-width:100%;border-color:var(--input-boundary);padding-inline:16px}
.tool-search input{height:auto;min-height:54px;font-size:16px;line-height:24px}
.catalogue-count{margin:24px 0 32px;font-size:14px;line-height:21px}
.catalogue .tool-grid{gap:48px 32px}
:is(.tool-entry,.featured-guide){padding-block:var(--entry-pad-y)}
:is(.tool-entry,.featured-guide) h3{margin-bottom:24px}
.entry-visual{background:#F1F1F1;min-height:208px;padding:32px;margin-bottom:24px}
.entry-detail,.entry-category{font-size:13px;line-height:21px}
.workflow-band{padding-block:var(--section-pad-y)}
.workflow-inner{padding-block:var(--band-pad)}
.workflow-band .btn.primary{border-color:#fff}
.workflow-inner .lead{margin-bottom:40px}
.workflow-steps{gap:32px}
.workflow-steps li{padding-top:32px}
.workflow-steps h3{margin-bottom:24px}
.home-notes p{font-size:16px;line-height:24px;margin-bottom:24px}
.home-notes h3{margin-bottom:24px}
.home-notes .text-action{font-size:16px}
.text-action,main .tert,main .body a{color:var(--action);text-underline-offset:4px}
.intro .lead{padding-top:32px}
.intro{gap:40px var(--gutter)}
.fact .h1{font-size:56px;line-height:64px}
.fact .body{font-size:14px;line-height:21px}
/* Form controls grow with text, with a separate row for every phone field. */
.field,.fld input,.fld select,.rs-field,#zonesel{height:auto;min-height:56px;padding:15px 16px;border-color:var(--input-boundary);font-size:16px;line-height:24px}
select.field,.fld select{padding-right:44px}
.bigin input{min-height:56px;max-width:100%;border-color:var(--input-boundary)}
.rs-field{padding-block:0}.rs-field input{padding-block:15px;line-height:24px;font-size:16px}
label.label,.field-group>.label,.ctl>.label{font-weight:500;font-size:16px;line-height:24px}
.field-group .label,.rs-fieldhead{margin-bottom:var(--label-field-gap)}
.ctl,.custom-deadline,.rename{gap:var(--label-field-gap)}
.ctl>.hint{margin-top:0}
.sc-row[aria-label=Inputs],.controls[aria-label="Your plan settings"]{padding:var(--utility-pad);margin-bottom:var(--section-heading-gap);gap:var(--field-group-gap)}
.sc-row.tight{padding-block:var(--utility-pad)}
.sc-row.sc-warnrow{padding:var(--note-pad)}
.fld,.bigin,.sc-row>*{min-width:0}
.sc-fig{background:#fff;padding:var(--utility-pad);border-top:1px solid var(--rule);margin-top:0}
.sc-figcap{background:#fff;padding:0 var(--utility-pad) var(--utility-pad);gap:24px}
.sc-res{padding:var(--band-pad);gap:32px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:var(--section-heading-gap)}
.sc-res .sc-tile{grid-column:auto;padding:0;margin:0;border:0;min-width:0}
.sc-res .sc-tile .h1{font-size:48px;line-height:56px;white-space:normal;overflow-wrap:anywhere}
.sc-res .grey,.rs-results .grey,.numbers .grey,.numbers .h2 small{color:var(--on-blue)}
.sc-res .tert{color:#fff}
.sc-cap{margin-top:24px}
.sc-copy p + p{margin-top:24px}
.sc-actions,.rs-actions,.acts,.actions,.btns,.cal-buttons{gap:var(--action-gap)}
.rs-results{padding:var(--band-pad);gap:32px;grid-template-columns:repeat(4,minmax(0,1fr));margin-block:0 var(--section-heading-gap)}
.rs-tile{grid-column:auto;gap:24px}
.rs-tile .h1{font-size:48px;line-height:56px}
.rs-drawing{background:#fff;padding:var(--utility-pad);border-block:1px solid var(--rule)}
.rs-c1,.rs-c2{gap:var(--field-group-gap)}
.rs-codegrid{margin-top:var(--section-heading-gap)}
.rs-code{padding:var(--utility-pad);gap:24px}
.rs-code[aria-checked=true]{background:var(--soft);box-shadow:0 0 0 2px var(--structure)}
.rs-how{margin-top:0}.rs-how>:first-child,.rs-how>:last-child{gap:24px}
.rs-seg,.seg{max-width:100%}
.rs-seg button,.seg button,.chip{height:auto;min-height:44px;white-space:normal;padding:9px 16px}
.seg button.on,.chip.on,.seg button[aria-pressed=true],.rs-seg button[aria-checked=true]{background:var(--structure);color:var(--on-blue)}
.chips{gap:var(--chip-gap);margin-bottom:24px}
/* Area comparisons keep stable geometry and use a quiet blue selection fill. */
[data-page=areacomparer] .tool{padding-block:0 var(--section-pad-y);border-top:0}
[data-page=areacomparer] .tool-grid{padding:var(--utility-pad);background:var(--soft);gap:32px}
[data-page=areacomparer] .drawing{margin-top:var(--section-heading-gap)}
[data-page=areacomparer] .drawing-foot{padding-top:24px;margin-top:24px;gap:24px}
[data-page=areacomparer] .results{padding-block:var(--section-pad-y)}
[data-page=areacomparer] .compare{padding-top:var(--section-pad-y)}
#ac-list{margin-top:var(--section-heading-gap);background:#fff}
#ac-list .row{padding-block:20px;gap:16px}
#ac-list button.row{padding-inline:24px}
#ac-list button.row:focus-visible{background:var(--soft);outline:3px solid var(--action);outline-offset:4px;position:relative;z-index:1}
#ac-list button.row:active{background:var(--soft)}
#ac-list .row .x{font-size:16px;line-height:24px}
/* Site tools use neutral drawings; colour belongs to controls and results. */
[data-page=sunshadow] .band.steps{padding:var(--utility-pad);background:var(--soft);border:0;gap:32px}
.step-side{gap:32px}.step .name{margin-bottom:24px}.step .label{margin-bottom:12px}
.searchrow{gap:24px;margin-bottom:24px}.sugg{top:calc(100% + 8px)}
.hrow{gap:24px}.map{background:#fff}
.placerow{gap:24px;margin-top:24px}.mapnote{margin-top:16px}
.tb-head .tert{font-size:16px;line-height:24px;min-height:44px}
#zonesel{max-width:100%}
.band.drawings{padding:var(--utility-pad);background:#fff;gap:32px}
.numbers.band{padding:var(--band-pad);gap:32px;grid-template-columns:repeat(4,minmax(0,1fr))}
.numbers .num{grid-column:auto;gap:24px;min-width:0}
.numbers .num .h2{white-space:normal;overflow-wrap:anywhere}
.method .text,.method .data{gap:24px}
[data-page=climatecard] .tool>.cols{padding:var(--utility-pad);background:var(--soft)}
[data-page=climatecard] .search{gap:16px}
[data-page=climatecard] .examples{gap:12px 16px;margin-top:24px}
[data-page=climatecard] .cardrow{margin-top:var(--section-heading-gap);gap:32px}
[data-page=climatecard] .cardcol{gap:16px}
[data-page=climatecard] .side{padding:var(--utility-pad);background:var(--soft);gap:24px}
[data-page=climatecard] .side .small{font-size:14px;line-height:21px}
[data-page=climatecard] .tert-list{gap:16px}
[data-page=backwardsplanner] .plan,[data-page=backwardsplanner] .calendar{margin-top:0}
.plan-head{padding-bottom:var(--section-heading-gap);gap:24px}
.rows>.row{padding-block:var(--entry-pad-y)}
.rows>.row .what{gap:24px}
.rows>.row .what::before{top:calc(-1*var(--entry-pad-y));bottom:calc(-1*var(--entry-pad-y))}
.calendar .copy .body{margin-top:24px}
.toast{background:var(--structure);color:#fff;padding:16px 24px;font-size:16px;line-height:24px}
.note{padding-block:var(--section-pad-y);margin-top:0;gap:32px}
.note>div{min-width:0}
.note .label + p{margin-top:24px!important}
.gate-main{padding-block:var(--section-pad-y)}
.gate-main .col{gap:24px}
.gate-main .notice,.record{padding:var(--note-pad)}
.notice{color:var(--caution);border-color:var(--caution)}
.notice .label{color:var(--caution)}
.checks{gap:24px}.check{padding-block:12px}
.site-foot .wrap{padding-block:96px 40px;gap:64px}
.fhead{gap:40px}.fcols{padding-top:32px}.legal{padding-top:32px}
.fcol a{font-size:16px;line-height:24px;min-height:44px}
.legal,.legal a{font-size:14px;line-height:21px}
.legal-links{gap:16px 24px}
/* Focus geometry is consistent across native and custom controls. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.field:focus-visible,input[type=range]:focus-visible{outline:3px solid var(--action);outline-offset:4px}
.check input:focus-visible + .box{outline:3px solid var(--action);outline-offset:4px}
.sc-res input[type=range]:focus-visible,.workflow-band :focus-visible,.site-foot :focus-visible{outline-color:#fff}
.rs-field:focus-within,.fld:focus-within,.tool-search:focus-within{outline:3px solid var(--action);outline-offset:4px}
.rs-field input:focus-visible,.fld input:focus-visible,.fld select:focus-visible,.tool-search input:focus-visible{outline:none}
button:disabled,.btn:disabled,.btn.primary:disabled,.btn.secondary:disabled{background:var(--disabled);border-color:var(--disabled);color:var(--on-disabled);opacity:1;cursor:default}
@media(hover:hover){
  .btn.primary:hover:not(:disabled){background:var(--action-hover);border-color:var(--action-hover);color:#fff}
  .workflow-band .btn.primary:hover:not(:disabled){border-color:#fff}
  .btn.secondary:hover:not(:disabled),#ac-list button.row:hover{background:var(--soft)}
  .chip.on:hover{background:var(--structure);color:#fff}
}
.btn.primary:active:not(:disabled){background:var(--action-pressed);border-color:var(--action-pressed)}
.workflow-band .btn.primary:active:not(:disabled){border-color:#fff}
@media(max-width:1200px){
  :root{--section-pad-y:80px;--hero-pad-y:96px;--section-heading-gap:48px;--band-pad:48px}
  .nav-link{padding-block:16px}
  .fhead{grid-template-columns:1fr}.fhead>.fintro{justify-self:start}
  .catalogue-toolbar{flex-direction:column}.tool-search{width:100%;max-width:440px}
}
@media(max-width:1100px){
  .home-hero{gap:40px}
  .catalogue .tool-grid{gap:40px 32px}
  .sc-res,.rs-results,.numbers.band{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  :root{--section-pad-y:64px;--hero-pad-y:64px;--section-heading-gap:40px;--hero-title-lead-gap:24px;--hero-lead-action-gap:32px;--entry-pad-y:24px;--utility-pad:24px;--note-pad:24px;--band-pad:32px}
  .home-hero{gap:48px}
  .hero-copy .lead,.lead{font-size:18px;line-height:26px}
  .home-facts>div{padding:32px 24px}
  .home-facts dt{font-size:40px;line-height:48px}
  .home-facts>div:nth-child(3),.home-facts>div:nth-child(4){padding-top:32px}
  .catalogue .tool-grid{gap:32px}
  :is(.tool-entry,.featured-guide) h3{font-size:24px;line-height:32px}
  .tool-search{max-width:none;width:100%}
  .section-heading h2,.workflow-inner h2{font-size:40px;line-height:48px}
  .hero-actions>.btn{font-size:16px;line-height:24px}
  .workflow-inner{gap:40px}
  .intro .lead{padding-top:24px}
  .fact .h1{font-size:40px;line-height:48px}
  .fact .body{font-size:13px;line-height:21px}
  .field-group,.sc-row[aria-label=Inputs]>*,.sc-row[aria-label=Headroom]>*,.controls>.ctl{grid-column:1/-1}
  .sc-res,.rs-results,.numbers.band{grid-template-columns:1fr}
  .sc-res .sc-tile+.sc-tile,.rs-tile+.rs-tile,.numbers .num+.num{padding-top:32px;border-top:1px solid #FFFFFF66}
  .sc-res .sc-tile .h1,.rs-tile .h1{font-size:40px;line-height:48px}
  .rs-grad{grid-template-columns:1fr;gap:24px}
  .rs-grad .rs-field:first-child{grid-column:auto}
  .rs-controls{gap:32px}
  .rs-fieldhead{flex-wrap:wrap}
  .rs-code{grid-column:1/-1}
  [data-page=areacomparer] .field-row{flex-direction:column;gap:24px}
  [data-page=areacomparer] .field{width:100%;border:1px solid var(--input-boundary);border-radius:2px}
  [data-page=areacomparer] .tool-grid>div{grid-column:1/-1}
  #ac-list .row{grid-template-columns:28px minmax(0,1fr);gap:12px 16px}
  #ac-list button.row{padding-inline:24px}
  #ac-list .row .ico{width:28px}
  #ac-list .row .x{grid-column:2;text-align:left;white-space:normal}
  #ac-list .row .x::after{margin-left:12px}
  [data-page=sunshadow] .step-where,[data-page=sunshadow] .step-side{grid-column:1/-1}
  .searchrow{flex-direction:column;align-items:stretch;gap:24px}
  .hrow{flex-wrap:wrap}.hrow .field{width:100%}
  .drawings figure{grid-column:1/-1}
  .placerow{flex-wrap:wrap}.zoom{gap:12px}
  .tb-head .zl{gap:12px}
  [data-page=climatecard] .search{grid-template-columns:1fr;gap:24px}
  [data-page=climatecard] .cardcol,[data-page=climatecard] .side{grid-column:1/-1}
  [data-page=climatecard] .side{position:static}
  .plan-head{align-items:flex-start;flex-direction:column}
  .rows>.row .when,.rows>.row .what{grid-column:1/-1}
  .rows>.row .what{padding-left:0;margin-top:24px}
  .rows>.row .what::before,.rows>.row .mark{display:none}
  .rows>.row .when{display:flex;flex-wrap:wrap;gap:12px 24px}
  .site-foot .wrap{padding-block:64px 32px;gap:40px}
  .fhead{gap:32px}.fcols,.legal{padding-top:24px}
  .fcol a{font-size:16px;line-height:24px}
}
@media(max-width:360px){
  .hero-copy .eyebrow,.study-head .eyebrow{font-size:13px;line-height:20px}
  .hero-actions>.btn{width:100%}
  .home-facts dt{font-size:40px;line-height:48px}
  .study-results{gap:24px;grid-template-columns:1fr}
  .study-results>div{padding:0;border:0;flex-direction:row;gap:16px;align-items:baseline}
  .study-results strong{font-size:32px;line-height:40px;min-width:3.5ch}
}
@media print{
  :root{--section-pad-y:24px;--hero-pad-y:24px;--band-pad:24px;--section-heading-gap:24px}
  .sc-res,.rs-results,.numbers.band{background:#fff;color:#111}
  .sc-res .grey,.rs-results .grey,.numbers .grey,.numbers .h2 small,.numbers .num .h2{color:#595959}
}
.rs-ruler input[type=range]:focus-visible,.track input[type=range]:focus-visible{outline:3px solid var(--action);outline-offset:4px}
.drawing:focus-visible{outline:3px solid var(--action);outline-offset:4px}
/* Twelve-track layouts use the gutter token; padded phone panels become one real track. */
.rs-controls,.note,[data-page=climatecard] .cardrow{column-gap:var(--gutter)}
.tool-search input,.rs-field input{min-height:56px}
@media(max-width:760px){
  .home-hero .btn{padding-inline:24px}
  [data-page=areacomparer] .tool-grid,[data-page=sunshadow] .band.steps,
  .sc-row[aria-label=Inputs],.sc-row[aria-label=Headroom],.controls.cols,
  [data-page=climatecard] .tool>.cols{grid-template-columns:minmax(0,1fr)}
  .controls.cols>*,[data-page=climatecard] .tool>.cols>*{grid-column:1/-1}
}
.wrap{overflow-wrap:anywhere}
:where(.cols,.col,.steps,.step-side,.workflow-inner,.workflow-steps li,.fhead,.fcols,.gate-main)>*{min-width:0}
.site-foot .wrap,.gate-main .col{grid-template-columns:minmax(0,1fr)}
.fhead{grid-template-columns:repeat(2,minmax(0,1fr))}
.check{grid-template-columns:24px minmax(0,1fr)}
.fcol a,.fintro a,.legal a,main .tert{overflow-wrap:anywhere;white-space:normal;max-width:100%}
.bigin input{min-width:0;flex:0 1 6.4ch}
.step-side{grid-template-columns:minmax(0,1fr)}
.search-label{display:block;font-size:16px;line-height:24px;font-weight:500;letter-spacing:0;text-transform:none;margin-bottom:12px}
[data-page=climatecard] .search-label{grid-column:1/-1;margin-bottom:0}
[data-page=climatecard] .search{row-gap:12px}
[data-page=sunshadow] .searchrow{align-items:flex-end}
.study-results{grid-template-columns:repeat(auto-fit,minmax(min(100%,5em),1fr))}
@media(max-width:1200px){.fhead{grid-template-columns:minmax(0,1fr)}}
@media(max-width:760px){
  .band.drawings{grid-template-columns:minmax(0,1fr)}
  .workflow-inner{grid-template-columns:minmax(0,1fr)}
  .workflow-steps li{grid-template-columns:2ch minmax(0,1fr)}
  .fcols{grid-template-columns:repeat(auto-fit,minmax(min(100%,10em),1fr));column-gap:16px}
  .fcol{grid-column:auto}
  .fhead{grid-template-columns:minmax(0,1fr)}
  [data-page=sunshadow] .searchrow{align-items:stretch}
  .tlabels{height:auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;margin-top:12px}
  .tlabels span,.tlabels span.l,.tlabels span.r{position:static;transform:none;white-space:normal}
  .track{height:auto;padding-bottom:44px;margin-top:32px}
  .noonlabel{position:static;display:block;transform:none;white-space:normal;text-align:center;max-width:100%;margin-bottom:12px}
  .track .rail,.track .dayseg{top:auto;bottom:21px}
  .track .tick-noon{top:auto;bottom:15px}
  .track input[type=range]{inset:auto 0 0}
}
@media(max-width:360px){.study-results{grid-template-columns:minmax(0,1fr)}}

/* Utility pages: one compact introduction, then the working controls. */
[data-page]:not([data-page=home]) main > .intro{padding-block:32px 40px;grid-template-columns:minmax(0,1fr);gap:0}
[data-page]:not([data-page=home]) main > .intro > .facts{display:none}
[data-page]:not([data-page=home]) main > .intro .lead{padding-top:16px;max-width:72ch}
.stair-tool .stair-heading{padding-block:32px 40px;gap:24px}
@media(max-width:760px){[data-page]:not([data-page=home]) main > .intro,.stair-tool .stair-heading{padding-block:24px 32px}}

/* Ramp workbench: dimensions and code beside a stable live result. */
.rs-workspace{display:grid;grid-template-columns:320px minmax(0,1fr);gap:32px;align-items:start;overflow-anchor:none;margin-bottom:40px}
.rs-workspace .rs-controls{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding:24px;background:var(--soft)}
.rs-workspace :is(.rs-c1,.rs-c2){grid-column:1/-1;gap:24px}
.rs-workspace .rs-grad{grid-template-columns:minmax(0,1fr);gap:12px}
.rs-workspace .rs-fieldhead{flex-wrap:wrap;gap:4px 12px}
.rs-workspace .rs-ticks{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0;height:auto}
.rs-workspace .rs-tick{position:static;transform:none;min-height:44px;padding:8px;flex:1 0 60px;border:1px solid var(--input-boundary);border-radius:2px;background:#fff;font-size:14px;line-height:24px}
.rs-workspace .rs-tick::before{display:none}
.rs-workspace .rs-tick[aria-pressed=true]{background:var(--structure);color:#fff;border-color:var(--structure)}
.rs-workspace .rs-zones{display:none}
.rs-output{display:grid;gap:24px;min-width:0;scroll-margin-top:24px}
.rs-summary{min-height:172px;padding:24px;background:var(--soft);border-left:3px solid var(--structure);display:grid;gap:12px;align-content:start}
.rs-summary.has-warning{background:var(--warn);border-color:var(--caution)}
.rs-summary .name{font-size:20px;line-height:28px}
.rs-summary #ramp-reason{min-height:3em}
.rs-workspace .rs-drawing{padding:0;border:0;gap:12px;min-width:0}
.rs-drawing-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.rs-zoom{display:flex;gap:8px}.rs-zoom button{min-width:44px;min-height:44px;border:1px solid var(--input-boundary);border-radius:2px;background:#fff;color:var(--ink);padding:8px 12px}
#ramp-viewport{width:100%;height:302px;overflow:auto;border:1px solid var(--rule);overscroll-behavior:contain}
.rs-workspace #dwg{width:auto;max-width:none;height:auto;overflow:hidden}
.rs-workspace .rs-results{padding:24px;margin:0;gap:24px;grid-template-columns:repeat(2,minmax(0,1fr))}
.rs-workspace .rs-tile{gap:12px;border:0;padding:0}.rs-workspace .rs-tile .h1{font-size:32px;line-height:40px}
.rs-workspace #ramp-input-note{min-height:4.5em}
.rs-view-result{display:none}.rs-codes .rs-codegrid{margin-top:16px}
@media(max-width:900px){.rs-workspace{grid-template-columns:minmax(0,1fr)}.rs-view-result{display:flex}.rs-workspace .rs-controls{padding:24px}}
@media(max-width:440px){.rs-workspace .rs-results{grid-template-columns:minmax(0,1fr)}.rs-workspace .rs-tile+.rs-tile{border-top:1px solid #FFFFFF66;padding-top:24px}}
@media(hover:hover){.rs-workspace .rs-tick:hover:not([aria-pressed=true]),.rs-zoom button:hover:not(:disabled){background:var(--soft)}}

#height-hint{min-height:3em}#day-note{margin-top:16px;min-height:3em}
.climate-data-details{border-top:1px solid var(--rule);padding-top:16px}.climate-data-details summary{cursor:pointer;min-height:44px;color:var(--action);font-weight:500}
#climate-data{overflow-x:auto;max-width:100%;overscroll-behavior:contain}#climate-data table{border-collapse:collapse;width:100%;font-size:14px;line-height:21px}#climate-data caption{text-align:left;padding:16px 0}#climate-data th,#climate-data td{border-bottom:1px solid var(--rule);padding:12px;text-align:right}#climate-data th:first-child{text-align:left}#climate-data thead{background:var(--soft)}

.plan-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;width:100%;border-top:1px solid var(--rule);padding-top:24px}.plan-summary .h1{font-size:32px;line-height:40px}.plan-summary .body{font-size:14px;line-height:21px}
[data-page=backwardsplanner] .controls[aria-label="Your plan settings"]{padding:var(--utility-pad)}
[data-page=areacomparer] .tool{padding-top:32px}
[data-page=sunshadow] .timeband{padding-block:32px}

/* Keep the optional map available without separating the time control from results. */
.map-disclosure{margin-top:16px;border-top:1px solid var(--rule)}
.map-disclosure summary{min-height:48px;display:list-item;align-content:center;cursor:pointer;color:var(--action);font-weight:500;padding:12px 0}
.map-disclosure .mapwrap{margin-top:16px}.map-disclosure summary:focus-visible{outline:3px solid var(--action);outline-offset:4px}
@media(min-width:1101px){[data-page=sunshadow] .step-where{grid-column:1/7}[data-page=sunshadow] .step-side{grid-column:7/13;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}[data-page=sunshadow] .searchrow{flex-wrap:wrap}[data-page=sunshadow] .searchrow .search{flex-basis:100%}}

/* Phone workflows: reachable results, compact room rows and local comparison controls. */
.phone-tool-nav{display:none}
@media(max-width:760px){
  #extra-tool .phone-tool-nav{display:flex;grid-column:1/-1;position:sticky;top:0;z-index:5;align-self:start;background:#fff;border-bottom:1px solid var(--rule);padding:8px 0;gap:12px}
  #extra-tool .phone-tool-nav button{flex:1;min-width:0;min-height:48px;padding:12px 8px;border:1px solid var(--input-boundary);background:#fff;color:var(--ink);font:500 16px/24px var(--body);border-radius:2px;overflow-wrap:anywhere}
  #extra-tool .phone-tool-nav #phone-show-results{background:var(--action);border-color:var(--action);color:#fff}
  #extra-tool .phone-tool-nav #phone-show-inputs:active{background:var(--soft)}
  #extra-tool .phone-tool-nav #phone-show-results:active{background:var(--action-pressed);border-color:var(--action-pressed)}
  @media(hover:hover){#extra-tool .phone-tool-nav #phone-show-inputs:hover{background:var(--soft)}#extra-tool .phone-tool-nav #phone-show-results:hover{background:var(--action-hover);border-color:var(--action-hover)}}
  #extra-tool .phone-tool-nav button:focus-visible{outline:3px solid var(--action);outline-offset:3px}
  #extra-tool :is(.xt-workspace,.xt-workbench):has(>.phone-tool-nav){row-gap:24px}
  [data-page=area-planner] #extra-tool .xt-room-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;padding-block:24px}
  [data-page=area-planner] #extra-tool :is(.xt-room-name,.xt-room-total){grid-column:1/-1}
  [data-page=area-planner] #extra-tool .xt-room-number{display:flex;flex-direction:column}
  [data-page=area-planner] #extra-tool .xt-room-number input{margin-top:auto}
  [data-page=area-planner] #extra-tool .xt-room-number label{overflow-wrap:anywhere}
  [data-page=drawing-overlay] #extra-tool .xt-viewer-column>.xt-comparison-settings{margin-top:16px;padding-top:16px}
  [data-page=drawing-overlay] #extra-tool .xt-viewer{height:clamp(240px,40svh,340px)}
  [data-page=drawing-overlay] #extra-tool .xt-viewer-column>#export{margin-top:24px}
  [data-page=drawing-overlay] #extra-tool .xt-viewer-column>#export-hint{margin-top:12px}
  [data-page=drawing-overlay] #extra-tool .xt-viewer-column .xt-setting-hint{margin-bottom:16px}
}

/* A permanent featured resource, separate from the eleven filterable tools. */
.featured-guide{grid-column:auto;grid-row:auto}
.featured-guide .entry-visual{background:var(--action);display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto minmax(112px,1fr) auto;row-gap:6px;height:auto;padding:20px}
.featured-guide .entry-mark{grid-column:1/-1;justify-self:center}
.featured-guide :is(.entry-category,.entry-open){position:static}
.featured-guide .entry-category{min-width:0}
.featured-guide :is(.entry-mark,.entry-category,.entry-open,.entry-featured){color:var(--on-blue)}
.entry-featured{grid-column:1/-1;font-size:12px;line-height:20px;font-weight:500;letter-spacing:.055em;text-transform:uppercase}
.featured-guide:focus-visible .entry-visual{background:var(--action-hover)}
.featured-guide:active .entry-visual{background:var(--action-pressed)}
@media(hover:hover){.featured-guide:hover .entry-visual{background:var(--action-hover)}}
@media(min-width:1101px){.catalogue .empty-tools{grid-column:1/3;grid-row:1}}
@media(min-width:761px) and (max-width:1100px){.catalogue .empty-tools{grid-row:1}}
@media(max-width:760px){.featured-guide{grid-column:auto;grid-row:auto}.catalogue .empty-tools:not([hidden]){grid-row:1}}

/* The footer links to stable categories, rather than an ever-growing tool list. */
.site-foot .footer-browse{font-weight:500;gap:12px}
.site-foot .fcol a{padding-block:10px}

/* Entry notice: white reading canvas, one blue privacy emphasis and one primary action. */
.entry-gate{padding-block:var(--section-pad-y)}
.entry-intro{max-width:760px;margin-bottom:64px}
.entry-intro .eyebrow{margin-bottom:24px;color:var(--structure)}
.entry-intro h1{font-size:64px;line-height:72px;font-weight:600;letter-spacing:-.025em;margin:0 0 32px}
.entry-intro .lead{max-width:58ch;margin:0}
.entry-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:64px;align-items:start}
.entry-layout>*{min-width:0}
.entry-information{display:grid;gap:32px}
.entry-notice{display:grid;gap:24px}
.entry-gate h2{font-size:32px;line-height:40px;font-weight:600;letter-spacing:-.015em;margin:0}
.entry-gate p{margin:0}
.entry-gate p,.entry-gate .check{font-size:16px;line-height:24px}
.entry-gate .eyebrow{font-size:12px;line-height:20px}
.entry-intro .lead{font-size:20px;line-height:28px}
.entry-privacy{background:var(--structure);color:#fff;padding:40px;display:grid;gap:24px;margin-top:8px}
.entry-privacy>svg{margin-bottom:0}
.entry-privacy h2{font-size:36px;line-height:44px}
.entry-gate .entry-privacy-scope{font-size:14px;line-height:22px;color:var(--supporting);margin-top:-8px}
.entry-data{border-block:1px solid var(--rule)}
.entry-data summary{padding-block:24px;display:flex;align-items:center;justify-content:space-between;gap:24px;cursor:pointer;color:var(--ink);font-weight:500;list-style:none}
.entry-data summary::-webkit-details-marker{display:none}
.entry-data summary span{font-size:24px;line-height:24px;color:var(--structure)}
.entry-data[open] summary span{transform:rotate(45deg)}
.entry-data-content{display:grid;gap:16px;padding-bottom:32px}
.entry-data-content h3{font-size:20px;line-height:28px;margin:8px 0 0}
.entry-data-content p{font-size:14px;line-height:22px;color:var(--supporting)}
.entry-gate a:not(.entry-leave){color:var(--action);text-decoration:underline;text-underline-offset:4px}
.entry-acceptance{border:1px solid var(--rule);border-top:4px solid var(--structure);padding:32px;display:grid;gap:24px}
.entry-acceptance>.eyebrow{color:var(--structure)}
.entry-gate .entry-required{color:var(--supporting);font-size:14px;line-height:22px}
.entry-form{display:grid;gap:24px;margin:0}
.entry-form fieldset{border:0;padding:0;margin:0;min-width:0}
.entry-form .check{padding:24px 0;border-top:1px solid var(--rule);gap:16px;position:relative}
.entry-form .check:last-child{border-bottom:1px solid var(--rule)}
.entry-form .box{border-color:var(--input-boundary);margin-top:1px;color:#fff}
.entry-form .check:has(input:checked){color:var(--ink)}
.entry-form .check input:checked+.box{background:var(--structure);border-color:var(--structure)}
.entry-form .check:has(input:disabled){cursor:wait}
.entry-form .btn{width:100%;justify-content:space-between;white-space:normal;min-height:56px;text-align:left}
.entry-form .btn:disabled{background:#F1F1F1;border-color:#DEDEDE;color:#595959;cursor:not-allowed;opacity:1}
.entry-gate .entry-progress{font-size:14px;line-height:22px;color:var(--structure)}
.entry-gate .entry-remember,.entry-gate .entry-existing{font-size:13px;line-height:21px;color:var(--supporting)}
.entry-form .status:empty{display:none}
.entry-gate .entry-error{color:var(--caution);background:var(--warn);padding:16px;border-left:3px solid var(--caution);font-size:14px;line-height:22px}
.entry-leave{color:var(--supporting);min-height:44px;display:flex;align-items:center;justify-content:space-between;text-decoration:underline;text-underline-offset:4px}
.entry-gate .entry-version{font-size:12px;line-height:20px;color:var(--supporting);margin-top:48px}
@media(hover:hover){.entry-form .check:hover{background:var(--soft)}.entry-gate a:hover{color:var(--action-hover)}.entry-data summary:hover{color:var(--action)}}
@media(max-width:1000px){.entry-layout{gap:32px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.entry-acceptance{padding:24px}.entry-privacy{padding:32px}}
@media(max-width:760px){.entry-intro{margin-bottom:40px}.entry-intro h1{font-size:40px;line-height:48px;margin-bottom:24px}.entry-intro .lead{font-size:18px;line-height:26px}.entry-layout{grid-template-columns:minmax(0,1fr);gap:40px}.entry-gate h2,.entry-privacy h2{font-size:28px;line-height:36px}.entry-privacy,.entry-acceptance{padding:24px}.entry-privacy h2 br{display:none}.entry-gate .entry-version{margin-top:32px}}
@media(max-width:360px){.entry-acceptance{padding:20px}.entry-form .check{gap:12px}.entry-privacy{padding:24px}}

/* Useful 404 recovery within the shared Electric Blue frame. */
.not-found-main{padding-block:48px var(--section-pad-y)}
.not-found-intro{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(240px,.7fr);gap:64px;align-items:center;margin-bottom:64px}
.not-found-intro .eyebrow{color:var(--structure);margin:0 0 24px}
.not-found-intro h1{font-size:64px;line-height:72px;font-weight:600;letter-spacing:-.025em;margin:0 0 32px}
.not-found-intro .lead{max-width:48ch;margin:0 0 32px}
.not-found-intro .btn{gap:32px}
.not-found-mark{background:var(--soft);color:var(--structure);min-height:280px;padding:40px;display:grid;align-content:center;justify-items:center;gap:8px}
.not-found-mark>span{font-family:var(--display);font-size:128px;font-weight:600;line-height:1;letter-spacing:-.04em}
.not-found-mark svg{display:block;width:100%;max-width:240px;height:40px}
.not-found-recovery{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:64px;padding-top:40px;border-top:1px solid var(--rule)}
.not-found-main h2{font-size:28px;line-height:36px;font-weight:600;margin:0 0 24px;letter-spacing:-.01em}
.not-found-main .finder label{display:block;font-weight:500;margin-bottom:16px}
.not-found-main .finder-row{display:flex;gap:16px;align-items:stretch}
.not-found-main .finder-row .field{flex:1 1 0;min-width:0;width:100%;margin:0}
.not-found-main .finder-row .btn{flex:0 1 auto;max-width:45%;white-space:normal;text-align:center;justify-content:center}
.not-found-main .status{font-size:14px;line-height:22px;margin:16px 0 0;color:var(--supporting);min-height:44px}
.not-found-help p{font-size:16px;line-height:24px;margin:0 0 16px;color:var(--supporting)}
.not-found-report{font:inherit;border:0;background:transparent;padding:0;color:var(--action);display:inline-flex;align-items:center;min-height:44px;gap:24px;text-decoration:underline;text-underline-offset:4px}
.not-found-tools{margin-top:64px}
.not-found-tool-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px}
.not-found-tool-list>a{display:grid;grid-template-columns:32px minmax(0,1fr) 20px;align-items:center;gap:16px;border-bottom:1px solid var(--rule);padding:24px 0;min-height:80px;font-size:16px;line-height:24px;color:var(--ink);text-decoration:none}
.not-found-tool-list .icon{width:32px;height:32px;--mark-accent:var(--structure)}
.not-found-tool-list .arrow{color:var(--structure);text-align:right}
@media(hover:hover){.not-found-tool-list>a:hover{color:var(--action);background:var(--soft)}.not-found-report:hover{color:var(--action-hover)}}
@media(max-width:1000px){.not-found-intro{gap:32px}.not-found-intro h1{font-size:56px;line-height:64px}.not-found-recovery{gap:32px;grid-template-columns:minmax(0,1fr)}.not-found-help{max-width:44ch}.not-found-tool-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.not-found-main{padding-top:32px}.not-found-intro{grid-template-columns:minmax(0,1fr);margin-bottom:40px}.not-found-intro h1{font-size:40px;line-height:48px;margin-bottom:24px}.not-found-intro h1 br{display:none}.not-found-intro .lead{font-size:18px;line-height:26px;margin-bottom:24px}.not-found-mark{display:none}.not-found-main h2{font-size:24px;line-height:32px}.not-found-recovery{padding-top:32px}.not-found-main .finder-row{flex-direction:column}.not-found-main .finder-row .btn{max-width:none;min-height:56px}.not-found-main .finder-row .field{flex:auto}.not-found-tools{margin-top:40px}.not-found-tool-list{grid-template-columns:minmax(0,1fr)}.not-found-tool-list>a{padding-block:20px;min-height:72px}}