@import url('/assets/source-sans-3.css');
:root{--paper:#141517;--ink:#f3f4f6;--muted:#acb2bc;--line:#30343a;--soft:#202328;--accent:#92d99f;--measure:70ch;color-scheme:dark;scroll-behavior:smooth}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 'Source Sans 3',sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,p,figure{margin:0}strong{font-weight:600}h1,h2,h3{font-weight:600;line-height:1.2;letter-spacing:-.015em}h1{font-size:44px}h2{font-size:28px}h3{font-size:19px}p+p{margin-top:1rem}
img{display:block;max-width:100%;height:auto}a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}a:hover{color:var(--accent)}button,input{font:inherit}button,input,a,summary{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}
:focus-visible{outline:2px solid var(--accent);outline-offset:5px}::selection{background:var(--accent);color:var(--paper)}html{scrollbar-color:#5d626a var(--paper);scrollbar-width:thin}
.wrap{width:min(1080px,calc(100% - 64px));margin-inline:auto}
.skip{position:absolute;left:12px;top:12px;transform:translateY(-160%);background:var(--ink);color:var(--paper);padding:10px 15px;z-index:2}.skip:focus{transform:none}
.header{display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line);padding-block:18px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;line-height:1.2;flex-shrink:0}.brand img{width:37px;height:37px;border-radius:9px}.brand strong{font-size:20px;font-weight:600}.brand small{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.nav{display:flex;align-items:center;gap:23px;font-size:14px}.nav>a,.languages a{display:flex;align-items:center;min-height:44px;text-decoration:none}.nav>a:hover{text-decoration:underline}.languages{display:flex;gap:13px}.languages a{font-size:13px}.languages [aria-current]{font-weight:600;text-decoration:underline}
.hero{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:64px;padding-block:48px 52px}.hero-copy h1{max-width:14ch}.hero-copy h1 span{display:block}.hero-copy .lead{font-size:19px;color:var(--muted);max-width:39ch;margin-top:20px}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:24px;margin-top:26px}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;background:var(--ink);color:var(--paper);padding:12px 19px;border:1px solid var(--ink);border-radius:8px;font-size:16px;font-weight:600;text-decoration:none}.button:hover{background:#dce0e6;color:var(--paper);border-color:#dce0e6}.button svg{width:20px;height:20px;flex-shrink:0}.text-link{font-size:15px;display:inline-flex;align-items:center;min-height:44px}
.fine{color:var(--muted);font-size:13px;margin-top:16px}.app-summary{list-style:none;padding:0;margin:18px 0 0;color:var(--muted);font-size:15px}.app-summary li+li{margin-top:3px}
.hero-figure{display:flex;flex-direction:column;align-items:center;justify-content:center}.hero-figure img{width:min(270px,100%);max-height:530px;object-fit:contain}.hero-figure figcaption{font-size:12px;color:var(--muted);max-width:40ch;padding-top:16px;text-align:center}
.section{padding-block:44px;border-top:1px solid var(--line)}
.guide-teaser{display:grid;grid-template-columns:1fr 1fr;gap:64px}.guide-teaser>div>p{color:var(--muted);margin-top:15px;max-width:45ch}.guide-teaser .text-link{margin-top:14px}.steps-preview{margin:0;padding-left:24px;display:flex;flex-direction:column;gap:18px;font-size:16px}.steps-preview li{padding-left:5px}
.preview-intro{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:64px}.preview-intro p{color:var(--muted);max-width:44ch}.story-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-block:30px}.story-grid img{width:100%;max-width:245px;margin-inline:auto}.story-grid figcaption{margin-top:18px}.story-grid figcaption p{font-size:15px;color:var(--muted);margin-top:6px;max-width:32ch}.preview>.text-link{margin-top:14px}
.release-note{color:var(--muted);font-size:14px;line-height:1.6;max-width:70ch;margin-block:22px}.hero-release{font-size:13px;max-width:42ch;margin-bottom:0}.hero-release a{display:inline-block;min-height:32px;line-height:32px}.media-note{font-size:12px;color:var(--muted);line-height:1.65;max-width:70ch}
summary{cursor:pointer;font-weight:600;line-height:1.5;min-height:44px;align-content:center}.reference-section summary{font-size:23px}.demo-layout{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding-top:24px}.demo-layout>p{color:var(--muted);max-width:40ch}
.demo{background:var(--soft);padding:22px;border-radius:10px}.demo label{font-size:14px}.demo .reading{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px}.demo output{font-size:30px;line-height:1.2;font-weight:600;font-variant-numeric:tabular-nums}
.bubble-track{position:relative;display:flex;align-items:center;justify-content:center;height:64px;border:1px solid #717781;border-radius:32px;overflow:hidden;margin-bottom:20px}.bubble-track:before,.bubble-track:after{content:'';height:28px;border-left:1px solid #717781;position:absolute;left:calc(50% - 19px)}.bubble-track:after{left:calc(50% + 19px)}.bubble{width:38px;height:38px;border-radius:50%;background:var(--accent);transition:transform .28s cubic-bezier(.16,1,.3,1)}
.demo input{width:100%;height:36px;cursor:pointer;accent-color:var(--accent);margin:0}.range-labels{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.demo-results{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:22px 0}.demo-results dt{font-size:12px;color:var(--muted)}.demo-results dd{font-size:20px;margin:6px 0 0;font-variant-numeric:tabular-nums}.demo-buttons{display:flex;flex-wrap:wrap;gap:12px}.demo button{min-height:46px;border:1px solid #717781;background:transparent;color:var(--ink);border-radius:8px;padding:11px 14px;font-size:14px;font-weight:600}.demo button:first-child{background:var(--accent);border-color:var(--accent);color:var(--paper)}.demo button:hover:enabled{background:#343941}.demo button:first-child:hover{background:#b7e6c0;color:var(--paper)}.demo .disclaimer{font-size:12px;line-height:1.6;color:var(--muted);margin-top:18px}
.note-row{display:grid;grid-template-columns:1fr 1fr;gap:64px}.note-row p{color:var(--muted);max-width:55ch;font-size:15px}
.footer{display:flex;justify-content:space-between;gap:32px;border-top:1px solid var(--line);padding-block:22px 28px;font-size:14px;color:var(--muted)}.footer p{font-size:12px;margin-top:4px}.footer-links{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:start}.footer-links a{display:inline-flex;align-items:center;min-height:44px}
.document{max-width:var(--measure);padding-block:42px 60px}.document h1,.tools-heading h1{font-size:36px;margin-bottom:18px}.document .summary,.tools-heading .summary{font-size:18px;line-height:1.6;color:var(--muted);margin-bottom:24px}.document h2{font-size:24px;margin:32px 0 14px}.document h3{font-size:19px;margin:24px 0 10px}.document p,.document li{font-size:16px;line-height:1.75}.document ol,.document ul{padding-left:24px}.document li+li{margin-top:12px}.document .updated{font-size:13px;color:var(--muted);margin-bottom:24px}
.toc{display:flex;flex-wrap:wrap;gap:6px 22px;border-block:1px solid var(--line);padding-block:14px;margin-bottom:30px;font-size:14px}.toc a{display:inline-flex;align-items:center;min-height:36px}.document .contact{display:inline-flex;align-items:center;min-height:44px;font-size:18px;margin-bottom:10px}.faq{border-top:1px solid var(--line);padding-block:12px}.faq:last-child{border-bottom:1px solid var(--line)}.faq p{color:var(--muted);padding-top:12px}.document figure{width:min(240px,65%);margin:30px auto}.document figcaption{font-size:12px;line-height:1.65;color:var(--muted);margin-top:12px}.guidance-note{border-block:1px solid var(--line);padding-block:18px;margin-top:28px;color:var(--muted)}.return-link{display:inline-flex;align-items:center;min-height:44px;margin-top:24px;font-size:15px}.error-page{min-height:60vh;padding-block:64px}.error-page p{margin-block:20px}
.tools-page{padding-block:42px 60px}.tools-heading{max-width:70ch}.tools-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:72px;align-items:start}.tool-copy{max-width:70ch}.tool-copy section{scroll-margin-top:24px;padding-bottom:28px}.tool-copy h2,.calculator-section h2,.tool-faq h2{font-size:24px;margin-bottom:14px}.tool-copy p{font-size:16px}.preview-film{width:min(270px,100%);margin:0 auto;position:sticky;top:24px}.preview-film video{display:block;width:100%;height:auto;border-radius:8px;background:var(--soft)}.preview-film figcaption{font-size:12px;line-height:1.65;color:var(--muted);margin-top:14px}
.calculator-section{max-width:70ch;border-top:1px solid var(--line);padding-top:30px;margin-top:14px;scroll-margin-top:24px}.slope-calculator{margin-top:22px}.slope-calculator label{display:block;font-size:15px;font-weight:600;margin-bottom:10px}.calculator-controls{display:flex;align-items:center;flex-wrap:wrap;gap:14px}.calculator-controls input{width:135px;min-height:48px;border:1px solid #717781;border-radius:8px;background:var(--soft);color:var(--ink);padding:10px 14px;font-size:20px;font-variant-numeric:tabular-nums;caret-color:var(--ink)}.calculator-controls input[aria-invalid=true]{border-color:#ffa7a7}.text-button{border:0;background:transparent;color:var(--ink);padding:12px;min-height:48px;text-decoration:underline;text-underline-offset:.22em}.calculator-result{display:flex;gap:24px;align-items:baseline;padding-block:22px}.calculator-result span{font-size:15px}.calculator-result output{font-size:32px;font-variant-numeric:tabular-nums}.input-error{font-size:15px;color:#ffa7a7;margin-top:12px}.slope-examples{width:100%;margin-top:26px;border-collapse:collapse;text-align:left;font-size:16px;font-variant-numeric:tabular-nums}.slope-examples caption{text-align:left;font-weight:600;margin-bottom:12px}.slope-examples th,.slope-examples td{border-bottom:1px solid var(--line);padding:10px 14px}.slope-examples th{font-weight:400}.slope-examples thead th{font-weight:600}.tool-faq{max-width:70ch;margin-top:36px}.tool-faq p{margin-top:12px;color:var(--muted)}.tools-page .guidance-note{max-width:70ch;font-size:15px}
@media(max-width:900px){.wrap{width:calc(100% - 48px)}.header{gap:18px}.nav{gap:16px;font-size:13px}.hero,.guide-teaser,.demo-layout,.preview-intro,.note-row{gap:36px}.hero{padding-block:36px 42px}.hero-copy h1{font-size:38px}.tools-layout{gap:38px}.story-grid{gap:22px}}
@media(max-width:640px){body{font-size:16px}.wrap{width:calc(100% - 36px)}.header{flex-wrap:wrap;gap:12px;padding-block:14px}.nav{width:100%;flex-wrap:wrap;gap:12px;font-size:13px}.languages{margin-left:auto;gap:12px}.brand strong{font-size:19px}.hero{grid-template-columns:1fr;gap:30px;padding-block:30px 36px}.hero-copy h1{font-size:34px;max-width:none}.hero-copy .lead{font-size:18px;max-width:36ch;margin-top:14px}.actions{gap:20px;margin-top:20px}.hero-figure img{width:235px;max-height:480px}.hero-figure figcaption{max-width:38ch}.section{padding-block:32px}h2{font-size:25px}.guide-teaser,.demo-layout,.preview-intro,.note-row{grid-template-columns:1fr;gap:20px}.story-grid{grid-template-columns:1fr;gap:26px}.story-grid figure{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:20px}.story-grid figcaption{margin-top:0}.story-grid h3{font-size:18px}.story-grid figcaption p{font-size:15px}.release-note{font-size:13px}.hero-release{max-width:none}.footer{flex-direction:column;gap:14px}.footer-links{gap:4px 20px}.document,.tools-page{padding-block:30px 44px}.document h1,.tools-heading h1{font-size:30px;margin-bottom:14px}.document .summary,.tools-heading .summary{font-size:17px}.document h2{font-size:23px;margin-top:28px}.document p,.document li{font-size:16px}.tools-layout{grid-template-columns:1fr;gap:24px}.preview-film{position:static;width:min(260px,85%)}.tool-copy h2,.calculator-section h2,.tool-faq h2{font-size:23px}.calculator-controls{gap:12px}.calculator-controls .button{padding-inline:16px}.demo-layout{padding-top:18px}.reference-section summary{font-size:23px}.demo{padding:18px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.bubble{transition:none}}

/* Keep the focused skip link readable on its light surface. */
.skip:hover{color:var(--paper)}
