/* mydu.app/ductline, /privacy, /support. Loads after base.css. */
:root{
--canvas:#F4F7F7;--canvas-2:#E8F0F1;--surface:#fff;--ui:#F2F2F7;--field:#E9E9EE;--chip:#EDEEF0;--fx-bg:#DDF0F2;
--ink:#0B1F26;--ink-2:#44565E;--ink-3:#5B6C74;--hairline:rgb(11 31 38/.12);
--accent:#0E8A9C;--accent-text:#096676;--answer:#FFCA44;--answer-edge:#8A6100;--answer-soft:#FFF4D2;
--ok:#2F7D5C;--caution-text:#8A5A0B;--caution:#B87A16;--alert:#B3382E;
--plate:#E8F0F1;--grid-minor:rgb(14 138 156/.08);--grid-major:rgb(14 138 156/.16);
--device-bezel:#15191C;--device-edge:#3A4247;
--band-bg:radial-gradient(ellipse 75% 70% at 50% 40%,#0A4F5E 0%,#043644 55%,#022B37 100%);--band-end:#022B37;
--bench-bg:radial-gradient(ellipse 75% 70% at 50% 40%,#0B6778 0%,#065466 55%,#022B37 100%);
--on-dark:#fff;--on-dark-2:rgb(255 255 255/.80);--ctl-edge:rgb(11 31 38/.5);
--band-grid-minor:rgb(255 255 255/.035);--band-grid-major:rgb(255 255 255/.085);
--air:#BEF0F8;--air-warm:#FFD08A;--glow:color-mix(in oklab,#0E8A9C 30%,transparent);
--font-sans:var(--m-font);
--font-round:var(--m-font-round);
--font-mono:var(--m-font-mono);
--t-display:clamp(2.75rem,1.4rem + 5.2vw,5.5rem);--t-h2:clamp(2rem,1.25rem + 3vw,3.75rem);
--t-h3:clamp(1.25rem,1.05rem + .8vw,1.625rem);--t-lead:clamp(1.125rem,1rem + .45vw,1.375rem);
--t-result:clamp(3rem,2.4rem + 2.4vw,4.5rem);--t-next:clamp(1.75rem,1.5rem + 1vw,2.25rem);
--t-work:clamp(.8125rem,.77rem + .2vw,.9375rem);
--gutter:clamp(16px,4vw,48px);--section-y:clamp(4.5rem,3rem + 6vw,8rem);
--w-wide:1280px;--w-content:1120px;--w-text:680px;
--r-card:14px;--r-panel:20px;--r-plate:28px;--r-bench:32px;--r-icon:22.37%;
--ease:cubic-bezier(.2,.8,.2,1);--ease-back:cubic-bezier(.34,1.56,.64,1);--ease-std:cubic-bezier(.4,0,.2,1);--ease-draw:cubic-bezier(.65,0,.35,1);
--shadow-device:0 0 0 1px var(--device-edge),0 2px 4px rgb(0 0 0/.06),0 30px 60px -18px var(--glow),0 60px 110px -30px rgb(4 30 38/.30);
--shadow-card:0 1px 2px rgb(2 43 55/.08),0 18px 40px -16px rgb(2 43 55/.28);
--shadow-bench:0 2px 4px rgb(2 43 55/.10),0 40px 80px -30px rgb(2 43 55/.45);
--site-canvas:var(--canvas); --site-canvas-2:var(--canvas-2); --site-surface:var(--surface);
--site-ink:var(--ink); --site-ink-2:var(--ink-2); --site-ink-3:var(--ink-3); --site-line:var(--hairline);
--site-accent:var(--accent); --site-link:var(--accent-text); --site-focus:var(--accent-text);
--site-band:var(--band-bg); --site-on-band:#E8F4F6; --site-on-band-2:#A9C3C9; --site-focus-on-band:#fff;
--site-highlight:var(--answer); --site-on-highlight:#0B1F26;
}
@media (prefers-color-scheme: dark){:root{
--canvas:#03242E;--canvas-2:#062E3A;--surface:#08323E;--ui:#052A35;--field:#0A3A47;--chip:rgb(255 255 255/.08);--fx-bg:#0E4A58;
--ink:#E8F4F6;--ink-2:#A9C3C9;--ink-3:#8AA7AE;--hairline:rgb(255 255 255/.12);
--accent:#41ABBD;--accent-text:#5CC0D0;--answer-edge:transparent;--answer-soft:rgb(255 202 68/.16);
--ok:#5FC08F;--caution-text:#E7A93F;--caution:#E7A93F;--alert:#F07A6E;
--plate:#062E3A;--grid-minor:rgb(255 255 255/.035);--grid-major:rgb(255 255 255/.085);
--device-bezel:#0B0E10;--device-edge:#56616A;
--band-bg:radial-gradient(ellipse 75% 70% at 50% 40%,#083F4B 0%,#03303C 55%,#01202A 100%);--band-end:#01202A;
--bench-bg:radial-gradient(ellipse 75% 70% at 50% 42%,#0B5869 0%,#064352 55%,#032F3B 100%);--ctl-edge:rgb(255 255 255/.4);
--glow:color-mix(in oklab,#41ABBD 22%,transparent);
--shadow-card:0 0 0 1px rgb(255 255 255/.07);
--shadow-bench:0 0 0 1px rgb(255 255 255/.14),0 40px 80px -30px rgb(0 0 0/.6);
--shadow-device:0 0 0 1px var(--device-edge),0 40px 90px -30px rgb(0 0 0/.7);
}}
@media (max-width: 719.98px){:root{--r-plate:20px;--r-bench:24px;--m-bar-h:52px}}
#elev{--dur:3.14s}
#flow-range{--fill:56.5%}
body{background:var(--canvas);color:var(--ink);font-family:var(--font-sans);font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--accent-text);outline-offset:3px;border-radius:4px}
.closing :focus-visible,.film :focus-visible{outline-color:#fff}
.fx{text-transform:none;font-style:normal}
code{font-family:var(--font-mono)}
.wrap{width:min(100% - 2*var(--gutter),var(--w-wide));margin-inline:auto}
.wrap--content{width:min(100% - 2*var(--gutter),var(--w-content));margin-inline:auto}
.ic{width:14px;height:14px;flex:none}
.knock{stroke:var(--surface)}
.gridded,.gridded-band{background-image:linear-gradient(var(--gmaj) 1px,transparent 1px),linear-gradient(90deg,var(--gmaj) 1px,transparent 1px),linear-gradient(var(--gmin) 1px,transparent 1px),linear-gradient(90deg,var(--gmin) 1px,transparent 1px),var(--under,none);
background-size:120px 120px,120px 120px,24px 24px,24px 24px,100% 100%,100% 100%;background-position:-1px -1px,-1px -1px,-1px -1px,-1px -1px,0 0,0 0}
.gridded{--gmaj:var(--grid-major);--gmin:var(--grid-minor);--under:none}
.gridded-band{--gmaj:var(--band-grid-major);--gmin:var(--band-grid-minor)}
html.js .nojs{display:none}
html:not(.js) .js-only,html:not(.js) .answer .visually-hidden{display:none}
.top{position:sticky;top:0;z-index:50;height:52px;transition:background-color .2s,box-shadow .2s}
.top.is-scrolled{background:color-mix(in oklab,var(--canvas) 82%,transparent);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);box-shadow:0 1px 0 var(--hairline)}
.top__in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
.top__crumb{display:flex;align-items:center;min-width:0}
.top__home{color:var(--ink-3);font-weight:500}
.top__sep{color:var(--ink-3);margin-inline:8px}
.top__app{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:17px;font-weight:600;color:var(--ink);text-decoration:none}
.top__icon{width:24px;height:24px;flex:none}
.top__nav{display:flex;align-items:center;gap:16px;font-size:15px}
.top__nav a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-2);text-decoration:none}
.top__nav .top__store{position:relative;min-height:32px;padding:0 14px;font-size:14px;color:var(--accent-text)}
.top__nav .top__store::before{content:"";position:absolute;inset:-6px 0}
.top__nav .top__store:hover{color:var(--accent-text)}
.top__nav a:hover,.top__nav a[aria-current="page"]{color:var(--ink)}
.top__nav a[aria-current="page"]{font-weight:600}
@media (min-width: 720px){.top{height:64px}.top__nav{gap:24px}}
h1,h2,h3,h4{font-weight:700}
.sec{padding-block:var(--section-y)}
.sec--band{background:var(--canvas-2)}
.sec h2,.closing h2{font-size:var(--t-h2);font-weight:700;letter-spacing:-.035em;line-height:1.02;max-width:18ch;text-wrap:balance}
.lead{font-size:var(--t-lead);line-height:1.45;color:var(--ink-2);max-width:40ch;text-wrap:pretty}
.sec__head h2+.lead{margin-top:20px}
.caps{display:block;font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.055em;color:var(--ink-3)}
.badge{--bh:48px;display:block;width:fit-content;padding:calc(var(--bh) / 4);margin-inline-start:calc(var(--bh) / -4);line-height:0;border-radius:12px;transition:translate .16s}
.badge img{width:auto;height:var(--bh)}
.badge:hover{translate:0 -1px}
.plate{position:relative;display:flex;align-items:flex-end;overflow:clip;border-radius:var(--r-plate);background-color:var(--plate)}
.phone{container-type:inline-size;width:var(--phone-w,280px);flex:none}
.phone__frame{position:relative;padding:1.6cqw 1.6cqw 0;border-radius:15.5cqw 15.5cqw 0 0;background:var(--device-bezel);box-shadow:var(--shadow-device)}
.phone__frame::after{content:"";position:absolute;z-index:2;top:4.1cqw;left:50%;translate:-50% 0;width:28.6cqw;height:8.4cqw;border-radius:999px;background:#000}
.phone__screen{position:relative;overflow:clip;aspect-ratio:1100 / 2108;border-radius:13.9cqw 13.9cqw 0 0;background:#F2F2F7}
.phone__screen picture{height:100%}
.phone__screen img{width:100%;height:100%;object-fit:cover;object-position:top}
.hero{padding-top:28px}
.hero__in{display:grid;gap:40px}
.eyebrow{display:flex;align-items:center;gap:14px}
.eyebrow__icon{width:44px;height:44px;flex:none}
.eyebrow__name{font-size:17px;font-weight:600;line-height:1.3;color:var(--ink)}
.hero h1{margin-top:24px;font-size:var(--t-display);font-weight:700;letter-spacing:-.042em;line-height:.98;max-width:12ch;text-wrap:balance}
.hero .lead{margin-top:20px}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;column-gap:4px;row-gap:4px;margin-top:calc(24px - var(--bh,48px) / 4)}
.film-link,.top__store{display:inline-flex;align-items:center;gap:6px;border-radius:999px;background:var(--fx-bg);color:var(--accent-text);font-size:15px;font-weight:600;text-decoration:none;white-space:nowrap;transition:background-color .16s}
.film-link{min-height:40px;padding:0 16px 0 13px}
.film-link:hover,.top__store:hover{background:color-mix(in oklab,var(--fx-bg) 80%,var(--accent) 20%)}
.film-link__play{width:14px;height:14px;flex:none}
.hero__plate{--phone-w:280px;padding-top:32px;justify-content:center}
.annot{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.annot__ticks{fill:none;stroke:var(--ink-3);stroke-width:3}
.annot__casing{fill:none;stroke:#8A6100;stroke-width:12;stroke-linecap:round}
.annot__line{fill:none;stroke:#FFCA44;stroke-width:10;stroke-linecap:round}
.annot__ring{fill:none;stroke:var(--accent);stroke-width:6;stroke-dasharray:10 8}
.annot-out{display:none;position:absolute;top:1.6cqw;left:1.6cqw;right:1.6cqw;bottom:0;overflow:visible;pointer-events:none}
.annot-out svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.annot__leader{fill:none;stroke:var(--ink-2);stroke-width:3}
.annot__dot{fill:var(--ink-2)}
.annot-label{position:absolute;left:calc(1215 / 1100 * 100%);top:calc(1657 / 2108 * 100%);translate:0 -50%;width:150px;font:600 12px/1.35 var(--font-mono);color:var(--ink-2)}
@media (min-width: 720px){
.hero{padding-top:40px}
.hero__text{max-width:640px}
.eyebrow__icon{width:48px;height:48px}
.hero h1{margin-top:28px}
.hero .lead{margin-top:24px}
.hero__plate{--phone-w:300px;padding-top:48px;justify-content:flex-start}
.hero__phone{margin-left:48px}
.annot-out{display:block}
}
@media (min-width: 960px){
.hero{padding-top:56px}
.hero__in{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;align-items:end}
.hero__text{grid-column:1 / 7;align-self:center;max-width:none}
.hero .lead{max-width:40ch}
.hero__cta{--bh:52px;margin-top:calc(40px - var(--bh) / 4)}
.hero__cta .badge{--bh:52px}
.hero__plate{grid-column:7 / 13;--phone-w:380px;padding-top:0;height:calc(48px + var(--phone-w) * (1.6 / 100 + 2108 / 1100))}
.hero__phone{margin-left:64px}
}
.sec__head+*{margin-top:48px}
@media (min-width: 720px){.sec__head{max-width:680px;margin-inline:auto;text-align:center}.sec__head>*{margin-inline:auto}}
@media (min-width: 960px){.sec__head+*{margin-top:64px}}
.bench{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding:16px;border-radius:var(--r-bench);box-shadow:var(--shadow-bench);color:var(--on-dark);background-color:#065466}
.panel{order:2}
.drawing{order:1}
.result{order:3}
.next{order:4}
@media (min-width: 720px){
.bench{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;padding:28px;align-items:start}
.panel,.drawing,.result,.next{order:0}
.result,.next{grid-column:1 / -1}
}
@media (min-width: 960px){
.bench{grid-template-columns:repeat(12,minmax(0,1fr));gap:32px;padding:40px}
.panel{grid-column:1 / 6}
.drawing{grid-column:6 / 13}
.result{grid-column:1 / 7}
.next{grid-column:7 / 13}
.result,.next{align-self:stretch}
.result{display:flex;flex-direction:column}
.result>.hint{margin-top:auto;padding-top:8px}
}
#result{scroll-margin-top:76px}
.panel{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding:16px;border-radius:var(--r-panel);background:var(--ui);color:var(--ink);min-width:0}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;height:44px;margin:0;padding:3px;min-inline-size:0;border:0;border-radius:10px;background:var(--field)}
.seg label{position:relative;display:flex;align-items:center;justify-content:center;border-radius:8px;font-size:15px;font-weight:500;color:var(--ink-2);cursor:pointer;white-space:nowrap}
.seg label::before{content:"";position:absolute;inset:-3px}
.seg input:checked + label{background:var(--surface);box-shadow:0 0 0 1px var(--ctl-edge),0 1px 2px rgb(0 0 0/.12);font-weight:600;color:var(--ink)}
.seg input:focus-visible + label{outline:2px solid var(--accent-text);outline-offset:2px}
.seg input:disabled + label{cursor:default}
.field{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}
.field__label{font-size:13px;font-weight:500;color:var(--ink-3)}
.field__box{display:flex;align-items:center;gap:8px;height:52px;padding:0 12px;border-radius:10px;background:var(--field);box-shadow:inset 0 0 0 1px var(--ctl-edge)}
.field__box:focus-within{box-shadow:inset 0 0 0 2px var(--accent)}
.field__box:has(input:focus-visible){outline:2px solid var(--accent-text);outline-offset:3px}
.field__box.is-invalid{box-shadow:inset 0 0 0 2px var(--alert)}
.field__box input{flex:1;min-width:0;height:100%;padding:0;border:0;background:transparent;font-size:20px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--ink);outline:none}
.field__box input:disabled{opacity:1;-webkit-text-fill-color:var(--ink)}
.field__unit{font-size:15px;color:var(--ink-3);white-space:nowrap}
.err{font-size:13px;line-height:1.4;color:var(--alert)}
.range{appearance:none;width:100%;height:44px;margin:4px 0 0;background:transparent;cursor:pointer}
.range:disabled{cursor:default}
.range::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--accent) 0 var(--fill),var(--field) var(--fill) 100%)}
.range::-webkit-slider-thumb{appearance:none;width:28px;height:28px;margin-top:-12px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--ctl-edge),0 1px 3px rgb(0 0 0/.25)}
.range::-moz-range-track{height:4px;border-radius:2px;background:var(--field)}
.range::-moz-range-progress{height:4px;border-radius:2px;background:var(--accent)}
.range::-moz-range-thumb{width:28px;height:28px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--ctl-edge),0 1px 3px rgb(0 0 0/.25)}
.range:focus-visible{outline-offset:0}
.acard{position:relative;min-width:0;padding:16px;border-radius:var(--r-card);background:var(--surface);box-shadow:var(--shadow-card);color:var(--ink)}
.acard.pickers{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;padding:12px 16px}
.select{position:relative}
.select select{appearance:none;width:100%;height:44px;padding:0 28px;border:0;background:transparent;color:var(--accent-text);font-size:17px;text-align:center;text-align-last:center;cursor:pointer;text-overflow:ellipsis}
.select select:disabled{opacity:1;cursor:default}
.select__chev{position:absolute;right:8px;top:50%;translate:0 -50%;width:14px;height:14px;color:var(--accent-text);pointer-events:none}
.band-note{display:flex;align-items:center;gap:6px;padding-top:6px;font-size:13px;line-height:1.4;color:var(--ink-3)}
.air{font-size:13px;line-height:1.45;color:var(--ink-3)}
.textbtn{min-height:44px;padding:0;border:0;background:transparent;color:var(--accent-text);font-size:14px;font-weight:500;cursor:pointer;text-align:left}
.air .textbtn{min-height:0;padding:12px 0;margin-block:-12px}
.textbtn:disabled{cursor:default}
#reset{justify-self:start;margin-top:-8px}
@media (min-width: 960px){.acard{padding:20px}.acard.pickers{padding:12px 16px}}
.acard__title{font-size:15px;font-weight:500;color:var(--ink-3);padding-right:44px}
.acard__title--strong{font-weight:600;color:var(--ink)}
#d-out{display:flex;align-items:baseline;gap:6px;margin-top:6px}
#d-out:focus-visible{outline-offset:6px}
#d-out .val{font:600 var(--t-result)/1 var(--font-round);letter-spacing:-.02em;color:var(--ink)}
#d-out .unit{font-size:18px;font-weight:500;color:var(--ink-3)}
.hint{margin-top:8px;font-size:13px;line-height:1.4;color:var(--ink-3)}
.nosol,.oot{display:flex;gap:8px;margin-top:10px;font-size:14px;line-height:1.45;color:var(--ink-3)}
.nosol .ic,.oot .ic{width:18px;height:18px;margin-top:1px}
.working>summary{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--chip);list-style:none;cursor:pointer}
.working>summary::-webkit-details-marker{display:none}
.working>summary::before{content:"";position:absolute;inset:-5px}
.working[open]>summary{background:var(--fx-bg)}
.working>summary:focus-visible{border-radius:50%}
.working>summary .fx{font:700 13px/1 var(--font-sans);color:var(--ink)}
.working__body{display:grid;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid var(--hairline)}
.working__body code{display:block;margin-top:2px;font-size:var(--t-work);line-height:1.55;color:var(--ink-2);white-space:pre-wrap;overflow-wrap:anywhere}
.wk-src{display:block;margin-top:2px;font-size:14px;line-height:1.45;color:var(--ink-2)}
.wk-note{display:flex;gap:6px;font-size:13px;line-height:1.45;color:var(--ink-3)}
.wk-note .ic{margin-top:2px}
.wk-title{font:600 13px/1.3 var(--font-sans);text-transform:uppercase;letter-spacing:.04em;color:var(--ink)}
.wk-title--2{margin-top:6px}
.n{border-radius:3px}
.n.changed{background:var(--answer-soft)}
.up{margin-top:6px;font-size:var(--t-next);font-weight:700;line-height:1.15;color:var(--ink)}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.tile{min-width:0;padding:12px;border-radius:10px;background:var(--field)}
.tile__v{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:3px;margin-top:2px}
.tile__n{font-size:1.375rem;font-weight:600;line-height:1.25}
.tile__u{font-size:12px;color:var(--ink-3)}
.adv{display:grid;gap:8px;margin-top:12px}
.adv li{display:flex;gap:8px;font-size:14px;line-height:1.45}
.adv .ic{width:18px;height:18px;margin-top:1px}
.adv--info{color:var(--ink-3)}
.adv--caution{color:var(--caution-text)}
.adv--caution .ic{color:var(--caution)}
.adv--alert{color:var(--alert)}
.drawing{justify-self:center;width:100%;margin:0;min-width:0}
@media (min-width: 720px){.drawing{max-width:480px}}
@media (min-width: 960px){.drawing{max-width:520px}}
#sec,#elev{width:100%;height:auto}
#elev{margin-top:12px}
.drawing.is-stale #sec,.drawing.is-stale #elev{opacity:.3}
#sec text{font-family:var(--font-mono)}
.leg{font-size:12px}
.pill__t{font-size:13px;font-weight:600}
.streak{stroke:var(--air);stroke-opacity:.7;stroke-width:2;stroke-linecap:round}
#elev.warm .streak{stroke:var(--air-warm)}
.five{max-width:880px;margin-inline:auto;margin-bottom:0}
.five__meta{padding-inline:12px;font:500 13px/1.4 var(--font-mono);color:var(--ink-3)}
.answers{margin-top:20px}
.answers__scale,.answers__lines,.answer{display:grid;grid-template-columns:1fr 72px;column-gap:16px;padding-inline:12px}
.answers__scale{position:relative;height:30px;font:500 12px/1 var(--font-mono);color:var(--ink-3)}
.answers__scale>*{grid-column:1;grid-row:1}
.answers__ticks{align-self:end;height:5px;background:repeating-linear-gradient(90deg,var(--ink-3) 0 1px,transparent 1px calc(100% / 45));opacity:.45}
.answers__lbl{position:relative;align-self:start;justify-self:start;translate:-50% 0;white-space:nowrap;padding-top:4px}
.answers__lbl::after{content:"";position:absolute;left:50%;top:21px;width:1px;height:9px;background:var(--ink-3)}
.l14{margin-left:11.11%}.l15{margin-left:33.33%}.l16{margin-left:55.56%}.l17{margin-left:77.78%}.l18{margin-left:100%}
.answers__body{position:relative}
.answers__lines{display:none;position:absolute;inset:0;pointer-events:none}
.answers__lines i{grid-column:1;grid-row:1;justify-self:start;width:0;border-left:1px dashed var(--hairline)}
.k14{margin-left:11.11%}.k15{margin-left:33.33%}.k16{margin-left:55.56%}.k17{margin-left:77.78%}.k18{margin-left:100%}
.answers__list li{border-top:1px solid var(--hairline)}
.answers__list li:last-child{border-bottom:1px solid var(--hairline)}
.answer{grid-template-areas:"label label" "track val";row-gap:8px;align-items:center;width:100%;min-height:64px;padding-block:12px;border:0;background:transparent;text-align:left;cursor:pointer;color:var(--ink)}
.answer:not(:disabled):hover,.answer:focus-visible{background:color-mix(in oklab,var(--accent) 6%,transparent)}
.answer:disabled{cursor:default}
.answer__label{grid-area:label;font-size:15px;line-height:1.35}
.answer__track{grid-area:track;position:relative;height:24px;background:repeating-linear-gradient(90deg,var(--hairline) 0 1px,transparent 1px calc(100% / 45)) left bottom / 100% 5px no-repeat}
.answer__track svg{width:100%;height:24px}
.answer__base{fill:none;stroke:var(--hairline);stroke-width:1;vector-effect:non-scaling-stroke}
.answer__val{grid-area:val;font:600 15px/1.2 var(--font-mono);text-align:right;white-space:nowrap}
.dot{position:absolute;top:6px;width:12px;height:12px;translate:-50% 0;border:2px solid var(--accent);border-radius:50%;background:var(--surface)}
.dot.p1{border:1px solid #8A6100;background:#FFCA44;box-shadow:0 0 0 4px var(--answer-soft)}
.p1{left:17.33%}.p2{left:13.33%}.p3{left:4.89%}.p4{left:38.00%}.p5{left:88.67%}
@media (min-width: 960px){
.answers__scale,.answers__lines,.answer{grid-template-columns:minmax(200px,240px) 1fr 88px;column-gap:24px}
.answers__scale>*,.answers__lines i{grid-column:2}
.answers__lines{display:grid}
.answer{grid-template-areas:"label track val";padding-block:8px}
.answer__track{background:none}
}
.closing{color:#E8F4F6;background-color:var(--band-end)}
.bench{--under:var(--bench-bg)}
.closing{--under:linear-gradient(transparent 70%,var(--band-end)),var(--band-bg);padding-block:clamp(5rem,3rem + 6vw,7.5rem);text-align:center;background-position:-1px bottom,-1px bottom,-1px bottom,-1px bottom,0 0,0 0}
.closing__in{display:flex;flex-direction:column;align-items:center}
.closing__icon{width:88px;height:88px;filter:drop-shadow(0 18px 30px rgb(0 15 20/.5))}
.closing h2{margin-top:32px;font-size:var(--t-h2);font-weight:700;letter-spacing:-.035em;line-height:1.02;max-width:18ch;text-wrap:balance;color:#fff}
.closing__sub{margin-top:16px;font-size:18px;line-height:1.45;color:rgb(255 255 255/.8)}
.badge--band{margin-top:calc(40px - var(--bh) / 4);margin-inline:auto}
.beat__in{display:grid;gap:40px}
.beat__text .lead{margin-top:16px}
.beat__plate{--phone-w:280px;padding-top:40px;justify-content:center}
@media (min-width: 720px){.beat__plate{--phone-w:300px;padding-top:56px}}
@media (min-width: 960px){
.beat__in{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;align-items:center}
.beat__text{grid-column:1 / 7;max-width:520px}
.beat__plate{grid-column:7 / 13;--phone-w:340px;padding-top:64px}
.beat--flip .beat__text{grid-column:8 / 13;grid-row:1;justify-self:end}
.beat--flip .beat__plate{grid-column:1 / 7;grid-row:1}
}
.m-foot{padding:28px 0 40px;border-top:1px solid var(--hairline);font-size:14px;line-height:1.4;color:var(--ink-3)}
main:has(> .closing:last-child)+.m-foot{border-top:0}
.m-foot__row{display:flex;flex-wrap:wrap;align-items:center;gap:4px 28px}
.m-foot__links{display:flex;gap:20px}
.m-foot__links a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-2);text-decoration:none}
.m-foot__links a:hover,.m-foot__links a[aria-current="page"]{color:var(--ink)}
.m-foot__links a:hover{text-decoration:underline;text-underline-offset:3px}
.m-foot .m-family{margin-inline-start:auto}
.m-foot__note{flex-basis:100%}
@media (max-width: 719.98px){.m-foot__row{column-gap:20px}.m-foot .m-family{margin-inline-start:0;flex-basis:100%}}
html:has(#film[open]){overflow:hidden}
#film{width:100%;max-width:min(1120px,100vw - 32px);max-height:calc(100svh - 32px);padding:0;border:0;border-radius:20px;background:#01202A;color:#E8F4F6}
#film::backdrop{background:rgb(1 20 26/.72)}
.film__title{margin-bottom:12px;font-size:17px;font-weight:600}
.film video{width:100%;height:auto;border-radius:12px;background:#000}
.film__desc{margin-top:12px;max-width:70ch;font-size:14px;line-height:1.5;color:rgb(255 255 255/.8)}
.film__close{margin-top:12px;min-height:44px;padding:0 18px;border:0;border-radius:10px;background:rgb(255 255 255/.12);color:#fff;font-weight:600;cursor:pointer}
.film{padding:16px}
@media (min-width: 960px){.film{padding:24px}}
@media (prefers-reduced-motion: no-preference){
.hero__text>*{transition:opacity .5s var(--ease),translate .5s var(--ease)}
.hero__text>:nth-child(2){transition-delay:40ms}
.hero__text>:nth-child(3){transition-delay:100ms}
.hero__text>:nth-child(4){transition-delay:160ms}
.hero__text>:nth-child(5){transition-delay:220ms}
.hero__plate{transition:opacity .7s var(--ease) .12s,translate .7s var(--ease) .12s}
@starting-style{.hero__text>*{opacity:0;translate:0 12px}.hero__plate{opacity:0;translate:0 24px}}
.annot__casing,.annot__line{transform-box:fill-box;transform-origin:50% 50%;animation:dl-scale-x .45s var(--ease-back) .9s both}
.annot__ring{animation:dl-fade .3s ease-out .9s both}
.annot__leader{stroke-dasharray:1;animation:dl-draw .4s ease-out 1.1s both}
.annot__dot,.annot-label{animation:dl-fade .2s ease-out 1.5s both}
html.js .rv:not(.is-in),html.js .rv-kids:not(.is-in)>*{opacity:0;translate:0 16px}
.rv.is-in,.rv-kids.is-in>*{transition:opacity .5s var(--ease),translate .5s var(--ease)}
.rv-kids.is-in>:nth-child(2){transition-delay:60ms}
.rv-kids.is-in>:nth-child(3){transition-delay:120ms}
.rv-kids.is-in>:nth-child(n+4){transition-delay:180ms}
.n.changed{animation:dl-wash 1s linear forwards}
.working__body.is-opening>*{animation:dl-row .22s ease-out both}
.working__body.is-opening>:nth-child(2){animation-delay:40ms}
.working__body.is-opening>:nth-child(3){animation-delay:80ms}
.working__body.is-opening>:nth-child(4){animation-delay:120ms}
.working__body.is-opening>:nth-child(n+5){animation-delay:160ms}
.streak{animation:dl-stream var(--dur) linear infinite paused}
.streak:nth-child(4){animation-delay:calc(var(--dur) * -.14)}
.streak:nth-child(5){animation-delay:calc(var(--dur) * -.29)}
.streak:nth-child(6){animation-delay:calc(var(--dur) * -.43)}
.streak:nth-child(7){animation-delay:calc(var(--dur) * -.57)}
.streak:nth-child(8){animation-delay:calc(var(--dur) * -.71)}
.streak:nth-child(9){animation-delay:calc(var(--dur) * -.86)}
#elev.is-flowing .streak{animation-play-state:running}
.closing__icon .icon__sq{stroke-dasharray:2575}
.closing__icon .icon__ring{stroke-dasharray:1464}
.closing__icon .icon__d{transform-box:fill-box;transform-origin:50% 50%}
html.js .closing__icon:not(.is-in) .icon__sq{stroke-dashoffset:2575}
html.js .closing__icon:not(.is-in) .icon__ring{stroke-dashoffset:1464}
html.js .closing__icon:not(.is-in) .icon__fill{opacity:0}
html.js .closing__icon:not(.is-in) .icon__d{scale:0 1}
.closing__icon.is-in .icon__sq{transition:stroke-dashoffset .6s var(--ease-draw)}
.closing__icon.is-in .icon__ring{transition:stroke-dashoffset .6s var(--ease-draw) .45s}
.closing__icon.is-in .icon__fill{transition:opacity .25s ease-out 1s}
.closing__icon.is-in .icon__d{transition:scale .5s var(--ease-back) 1.25s}
}
@keyframes dl-scale-x{from{scale:0 1}to{scale:1 1}}
@keyframes dl-fade{from{opacity:0}to{opacity:1}}
@keyframes dl-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes dl-wash{from{background-color:var(--answer-soft)}to{background-color:transparent}}
@keyframes dl-row{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
@keyframes dl-stream{from{stroke-dashoffset:100}to{stroke-dashoffset:-580}}