@font-face{font-family:Paper Mono;src:url('/assets/fonts/PaperMono-Variable.woff2') format('woff2');font-weight:400 800;font-display:swap}
@font-face{font-family:Instrument Sans;src:url('/assets/fonts/InstrumentSans-Variable.woff2') format('woff2');font-weight:400 700;font-stretch:75% 100%;font-display:swap}
@font-face{font-family:Mono Fallback;src:local('Courier New');size-adjust:100%;ascent-override:95%;descent-override:25%;line-gap-override:0%}
@font-face{font-family:Sans Fallback;src:local('Helvetica Neue'),local('Arial');size-adjust:97%;ascent-override:96%;descent-override:24%;line-gap-override:0%}
:root{--sea:#07080f;--curve:#2f5d46;--curve-ink:#f6f3ec;--tint:rgba(47,93,70,.09);--glass:rgba(250,248,245,.86);--halo:rgba(250,248,245,.92);--bg:#faf8f5;--page:#f2efe9;--ink:#111110;--ink2:#575652;--ink3:#76746e;--line:rgba(20,20,19,.14);--dot:rgba(20,20,19,.1);--solid:#111110;--solid-ink:#faf8f5;--focus:#3e6a49;--new:#1d4ed8;--learn:#b91c1c;--due:#15803d;--hard:#b45309;--done:#9aa6dc;--today:#e3e4ef;--ok-bg:#dcfce7;--ai:#1d4ed8;--shadow:rgba(60,40,20,.14);--ease:cubic-bezier(.16,1,.3,1);--mono:'Paper Mono','Mono Fallback',monospace;--body:'Instrument Sans','Sans Fallback',system-ui,sans-serif;color-scheme:light}
:root[data-theme=dark]{--sea:#07080f;--curve:#8fcb8a;--curve-ink:#10170f;--tint:rgba(143,203,138,.07);--glass:rgba(22,24,21,.66);--halo:rgba(22,24,21,.92);--bg:#1e1d18;--page:#16150f;--ink:#e8e6d8;--ink2:#aeac95;--ink3:#8f8d79;--line:rgba(255,255,255,.12);--dot:rgba(255,255,255,.07);--solid:#e8e6d8;--solid-ink:#16150f;--focus:#ebc15b;--new:#93a8ff;--learn:#f19a8f;--due:#8fcb8a;--hard:#e0a55c;--done:#3b4a8a;--today:#2c2f45;--ok-bg:#1f3320;--ai:#93a8ff;--shadow:rgba(0,0,0,.45);color-scheme:dark}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--sea:#07080f;--curve:#8fcb8a;--curve-ink:#10170f;--tint:rgba(143,203,138,.07);--glass:rgba(22,24,21,.66);--halo:rgba(22,24,21,.92);--bg:#1e1d18;--page:#16150f;--ink:#e8e6d8;--ink2:#aeac95;--ink3:#8f8d79;--line:rgba(255,255,255,.12);--dot:rgba(255,255,255,.07);--solid:#e8e6d8;--solid-ink:#16150f;--focus:#ebc15b;--new:#93a8ff;--learn:#f19a8f;--due:#8fcb8a;--hard:#e0a55c;--done:#3b4a8a;--today:#2c2f45;--ok-bg:#1f3320;--ai:#93a8ff;--shadow:rgba(0,0,0,.45);color-scheme:dark}}
*{box-sizing:border-box}
html{scroll-padding-top:24px}
body{margin:0;background:var(--sea);color:var(--ink);font:400 17px/1.55 var(--body);-webkit-font-smoothing:antialiased}
h1,h2,h3,p,figure,ul{margin:0}
h1,h2,h3{font-family:var(--mono);font-weight:500;letter-spacing:-.03em;word-spacing:-.32em;line-height:1.04;text-wrap:balance}
h1{font-size:64px;letter-spacing:-.04em}
h2{font-size:40px}
h1 span{color:var(--ink3)}
h3{font-size:19px;letter-spacing:-.01em;line-height:1.3}
img{display:block;max-width:100%;height:auto}
a{color:var(--ink);text-underline-offset:3px}
a:hover{color:var(--ink2)}
button{font:inherit;color:inherit}
[hidden]{display:none!important}
::selection{background:#ebc15b;color:#111110}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.skip-link{position:absolute;top:8px;left:12px;z-index:20;padding:12px 18px;background:var(--bg);color:var(--ink);transform:translateY(-200%)}
.skip-link:focus{transform:none}
.sea{position:fixed;inset:0;width:100%;height:100%;display:block;z-index:0;pointer-events:none}
.frame{position:relative;z-index:1;width:calc(100% - 80px);max-width:1328px;margin:40px auto 48px;background:var(--glass);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 30px 90px var(--shadow)}
.nav{display:flex;align-items:center;gap:12px;min-height:60px;padding:8px 20px 8px 24px;border-bottom:1px solid var(--line)}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font:600 18px var(--mono);letter-spacing:-.02em}
.theme{display:none;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:2px;background:transparent;color:var(--ink);cursor:pointer}
.js .theme{display:grid}
.theme:hover{background:var(--page)}
.ico{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.theme .sun,:root[data-theme=dark] .theme .moon{display:none}
:root[data-theme=dark] .theme .sun{display:block}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .theme .moon{display:none}:root:not([data-theme=light]) .theme .sun{display:block}}
.ai-tag{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:2px 7px;border:1px solid var(--ai);color:var(--ai);font:600 11px/1.3 var(--mono);letter-spacing:.06em;vertical-align:middle}
.ai-tag .ico{width:12px;height:12px}
.brand img{width:24px;height:24px;image-rendering:pixelated}
.nav nav{display:flex;gap:28px;margin-left:auto;font-size:15px}
.nav nav a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink2);text-decoration:none;white-space:nowrap}
.nav nav a:hover,.nav nav a[aria-current]{color:var(--ink)}
.nav nav a[aria-current]{text-decoration:underline}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border:1px solid var(--ink);border-radius:2px;background:transparent;color:var(--ink);font:600 13px/1 var(--body);letter-spacing:.05em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .2s,color .2s}
.btn:hover{background:var(--ink);color:var(--solid-ink)}
.btn-solid{background:var(--solid);color:var(--solid-ink)}
.btn-solid:hover{background:transparent;color:var(--ink)}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.text-link{display:inline-flex;align-items:center;min-height:44px;font-weight:500}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:56px;align-items:stretch;padding:56px 40px}
.hero-copy{display:flex;flex-direction:column}
.hero h1{font-size:clamp(56px,5.9vw,84px)}
.hero .lead{margin-top:32px}
.lead{font-size:18px;line-height:1.5;color:var(--ink2);max-width:40ch}
.hero .lead{max-width:40ch;margin-bottom:36px;font-size:21px}
.hero .actions{gap:12px 28px;align-items:center}
.browser-link{gap:8px;color:var(--ink);text-decoration:none}
.browser-link:hover{text-decoration:underline;text-underline-offset:4px}
.browser-link .ico{width:16px;height:16px;transition:transform .2s var(--ease)}
.browser-link:hover .ico{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){*,.scene,.scene.on{transition:none!important}}
.section{padding:64px 40px;border-top:1px solid var(--line)}
.section>h2{max-width:28ch}
.steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:36px 0 0;padding:0;list-style:none;border-top:1px solid var(--ink)}
.steps li{position:relative;padding:24px 24px 0 0}
.steps li::before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;background:var(--ink)}
.step-n{display:block;margin-bottom:14px;font:400 12px/1 var(--mono);color:var(--ink2)}
.steps h3{display:flex;align-items:center;gap:8px;font:600 13px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.steps p{margin-top:10px;font-size:16px;color:var(--ink2)}
.steps .is-ai h3{color:var(--ai)}
.steps .is-ai::before{background:var(--ai)}
.extras{display:flex;flex-wrap:wrap;align-items:center;gap:4px 22px;margin-top:40px;padding-top:16px;border-top:1px solid var(--line);font-size:15px}
.extras span{font:400 12px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.extras a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink)}
.extras .extras-all{margin-left:auto}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.note{margin-top:18px;color:var(--ink2)}
.rows{padding:0;list-style:none}
.rows li{display:flex;justify-content:space-between;gap:12px;padding:16px 0;border-top:1px solid var(--line);color:var(--ink2)}
.rows li:last-child{border-bottom:1px solid var(--line)}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 24px;padding:14px 28px;border-top:1px solid var(--line);font-size:14px;color:var(--ink2)}
.foot p{font:400 12px var(--mono);letter-spacing:.04em}
.foot nav{display:flex;flex-wrap:wrap;gap:0 24px}
.foot a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink2)}
.doc-header{padding:64px 40px 32px}
.doc-header h1{font-size:56px}
.doc-header>p{margin-top:24px;font-size:19px;color:var(--ink2);max-width:52ch}
.section-index{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.section-index a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:2px;font:400 12px var(--mono);letter-spacing:.04em;text-transform:uppercase;text-decoration:none}
.screen-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:48px;align-items:start;padding-top:56px}
.screen-description h2{font-size:28px}
.screen-description p{margin-top:16px;color:var(--ink2)}
.screen-section img{border:1px solid var(--line);border-radius:6px;box-shadow:0 20px 50px var(--shadow)}
.inspect-image{display:block}
figcaption{margin-top:12px;font-size:13px;color:var(--ink2)}
.reading-title{font-size:40px}
.reading-copy{margin-top:16px;max-width:60ch;color:var(--ink2)}
.reading{max-width:800px;padding:96px 48px 72px;border-top:0}
.reading h1{font-size:52px}
.reading h2{margin:48px 0 12px;font-size:28px;letter-spacing:-.02em;line-height:1.15}
.reading p{margin-bottom:12px}
.reading .lead{margin:20px 0 0;font-size:20px;max-width:none}
.reading ul{padding-left:20px}
.reading li{margin-bottom:8px}
.effective{margin-top:16px;font-size:14px;color:var(--ink2)}
.mail{display:inline-flex;align-items:center;gap:12px;margin-top:32px;padding:10px 10px 10px 20px;border:1px solid var(--line);background:var(--bg);font:400 20px var(--mono)}
.mail button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line);background:transparent;cursor:pointer}
.mail svg{width:20px;height:20px}
.copy-status{min-height:24px;margin-top:8px;font-size:14px;color:var(--ink2)}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{display:flex;align-items:center;min-height:52px;font-weight:500;cursor:pointer}
.faq p{padding-bottom:12px;color:var(--ink2)}
.error-page h1{font-size:96px}
.error-page p{margin-top:16px;font-size:19px;color:var(--ink2)}
@media(max-width:1000px){.steps{grid-template-columns:1fr;border-top:0;border-left:1px solid var(--ink);margin-left:3px}.steps li{padding:0 0 24px 24px}.steps li::before{top:2px;left:-4px}.step-n{display:none}.split{grid-template-columns:1fr;gap:28px}}
@media(max-width:760px){
.frame{width:calc(100% - 20px);margin:10px auto 24px;border-radius:10px}
.nav{flex-wrap:wrap;gap:4px 16px;padding:10px 16px 0}
.nav nav{order:3;width:100%;margin:0;gap:20px;overflow-x:auto}
h1,.doc-header h1,.reading h1{font-size:38px}
h2{font-size:28px}
.hero{padding:36px 16px 28px}
.lead{font-size:17px}
.section,.doc-header,.reading{padding:48px 16px}
.extras .extras-all{margin-left:0}
.hero .lead{font-size:17px}
.foot{padding:12px 16px}
.screen-section{grid-template-columns:1fr;gap:24px}
.error-page h1{font-size:80px}
}

.demo-still{margin:0}
.demo-still img{border:1px solid var(--line);border-radius:10px}
.index-ai{gap:6px;color:var(--ai)!important;border-color:var(--ai)!important}
.ai-rows li{flex-direction:column;gap:4px}
.ai-rows b{display:flex;align-items:center;gap:8px;color:var(--ink);font:600 15px var(--mono)}
.ai-rows .ico{color:var(--ai)}
.ai-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:48px;align-items:start}
@media(max-width:760px){.ai-section{grid-template-columns:1fr;gap:20px}.theme{width:44px}}
.demo-still{aspect-ratio:1120/620;margin-top:64px;overflow:hidden}
.demo-still img{width:100%;height:100%;object-fit:cover;object-position:top}
@media(max-width:859px){.demo-still{aspect-ratio:600/620}}
@media(max-width:560px){.demo-still{margin-top:116px}}
@media(max-width:760px){.js .theme{margin-left:auto}}

.frame{-webkit-backdrop-filter:blur(5px) saturate(1.15);backdrop-filter:blur(5px) saturate(1.15)}
.rows li a{white-space:nowrap}

.memory,.bench{margin:0}
.hero-charts{display:flex;flex-direction:column;gap:28px}
.hero-charts .bench{margin-top:auto}
.memory-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px}
.memory figcaption{font:600 13px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.curve-toggle{display:flex;border:1px solid var(--line)}
.curve-toggle button{min-height:40px;padding:0 14px;border:0;background:var(--bg);color:var(--ink2);font:400 13px var(--mono);cursor:pointer;transition:background .2s,color .2s}
.curve-toggle button[aria-pressed=true]{background:var(--curve);color:var(--curve-ink)}
.curve-chart{display:block;width:100%;height:auto;margin-top:12px;overflow:visible}
.curve-chart text{font:400 12px var(--mono);fill:var(--ink2)}
.c-y{text-anchor:end}.c-x,.c-review{text-anchor:middle}
.curve-chart .c-review{fill:var(--curve)}
.c-grid{stroke:var(--line);vector-effect:non-scaling-stroke}
.c-spaced,.c-none{fill:none;stroke-linejoin:round;vector-effect:non-scaling-stroke;transition:opacity .4s var(--ease),stroke .4s}
.c-spaced{stroke:var(--curve);stroke-width:2.5}
.c-none{stroke:var(--ink2);stroke-width:1.5;stroke-dasharray:4 5}
.c-mark{fill:var(--curve);transition:opacity .4s}
.curve-chart .c-review{transition:opacity .4s}
[data-curve=none] .c-spaced,[data-curve=none] .c-mark,[data-curve=none] .c-review{opacity:.18}
[data-curve=none] .c-none{stroke:var(--ink);stroke-width:2.5}
.curve-legend{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 22px;margin-top:4px;font-size:14px;color:var(--ink2)}
.curve-legend span{display:inline-flex;align-items:center;gap:10px}
.curve-legend span::before{content:"";width:24px;border-top:2.5px solid var(--curve)}
.curve-legend .lg-none::before{border-top:2px dashed var(--ink2)}
.trust{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 32px;margin:0;padding:18px 40px;list-style:none;border-top:1px solid var(--line)}
.trust li{display:flex;align-items:center;gap:12px}
.trust .ico{color:var(--curve)}
.demo-section{padding:48px 40px;border-top:1px solid var(--line)}
.demo-section .demo{margin-top:0}
@media(max-width:1000px){.hero{grid-template-columns:1fr;gap:36px}}
@media(max-width:760px){.hero h1{font-size:40px}.hero .actions{margin-top:20px}.curve-chart text{font-size:17px}.curve-chart .c-review{display:none}.trust{flex-direction:column;padding:16px}.demo-section{padding:32px 16px}}
html:not(.js) .curve-toggle{display:none}

.bench figcaption{margin-bottom:8px;font:600 13px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.bench figcaption span{margin-left:8px;font:400 13px var(--body);letter-spacing:0;text-transform:none;color:var(--ink2)}
.bench-chart{display:block;width:100%;height:auto;overflow:visible}
.bench-chart text{font:400 13px var(--body);fill:var(--ink)}
.bench-chart .b-tick{font:400 11px var(--mono);fill:var(--ink2);text-anchor:middle}
.b-grid{stroke:var(--line);vector-effect:non-scaling-stroke}
.b-bar{fill:var(--ink3);opacity:.45}
.b-best .b-bar{fill:var(--curve);opacity:1}
.bench-chart .b-best text{font-weight:600}
.bench-chart .b-best .b-value{fill:var(--curve)}
.bench-stat{display:flex;align-items:baseline;gap:14px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);color:var(--ink2);font-size:15px}
.bench-stat b{font:500 30px/1 var(--mono);letter-spacing:-.03em;color:var(--curve)}
.bench-source{margin-top:6px;font-size:12px;color:var(--ink2)}
@media(max-width:760px){.bench-chart text{font-size:17px}.bench-chart .b-tick{font-size:16px}.bench-stat{flex-direction:column;gap:4px}}

.platforms{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:auto 0 0;padding:0;list-style:none;max-width:500px}
.platforms li:first-child{grid-column:span 2}
.tile{border-radius:8px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:96px;padding:14px 14px 12px;border:1px solid var(--line);background:var(--bg);color:var(--ink);text-decoration:none;transition:border-color .2s,transform .2s var(--ease)}
.tile:hover{border-color:var(--ink);transform:translateY(-2px)}
.tile .ico{width:22px;height:22px;margin-bottom:auto;color:var(--ink2)}
.tile span{font:600 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.tile small{font:400 11px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.tile.is-live{background:var(--solid);border-color:var(--solid);color:var(--solid-ink)}
.tile.is-live .ico,.tile.is-live small{color:var(--solid-ink)}
@media(max-width:760px){.platforms{max-width:none}.tile{min-height:84px;padding:12px 10px 10px}}
