@import url('./manrope.css');
:root {
  color-scheme:dark;
  --canvas:#151515;--surface:#1d1d1d;--surface-2:#262626;
  --ink:#f2f1ee;--ink-muted:#aaa9a6;--ink-subtle:#858480;
  --hairline:#3a3a38;--hairline-strong:#858480;--accent:#e5e3de;
  --accent-hover:#faf9f6;--accent-ink:#20201f;--focus:#d1d0cc;
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;
  --space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;
  --space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;
  --r-sm:8px;--r-md:16px;--r-lg:24px;--r-full:999px;
  --container:1280px;--gutter:clamp(20px,5vw,80px);--measure:60ch;
  --font:Manrope,Arial,sans-serif;--text-xs:12px;--text-sm:14px;--text-md:16px;
  --text-lg:20px;--text-title:clamp(32px,4vw,56px);--text-display:clamp(56px,6.6vw,96px);
  --dur-fast:180ms;--ease-out:cubic-bezier(.2,.7,.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--space-8)}
body{margin:0;background:var(--canvas);color:var(--ink);font:var(--text-md)/1.65 var(--font);-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:.25em;text-decoration-thickness:1px}
button,input{font:inherit}
button,a,input,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--focus);outline-offset:5px}
::selection{background:var(--accent);color:var(--accent-ink)}
button:disabled{opacity:.5;cursor:wait}
[hidden]{display:none!important}
h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:600}
h1,h2{letter-spacing:-.055em;line-height:1.08}
.muted{color:var(--ink-muted)}
.shell{width:min(100% - var(--gutter)*2,var(--container));margin-inline:auto}
.site-header{display:flex;align-items:center;justify-content:space-between;min-height:112px;gap:var(--space-6);position:relative;z-index:1}
.brand{display:inline-flex;align-items:center;gap:var(--space-3);font-size:24px;font-weight:800;letter-spacing:-.055em;text-decoration:none;white-space:nowrap;min-height:44px}
.brand img{display:block;flex-shrink:0}.brand-light{font-weight:400;color:var(--ink-muted)}
.site-header nav{display:flex;gap:var(--space-10);align-items:center;font-size:var(--text-sm)}
.site-header nav a{display:inline-flex;gap:var(--space-4);align-items:center;min-height:44px;text-decoration:none;color:var(--ink-muted)}
.site-header nav a:hover{color:var(--ink)}
.site-header nav .header-link{border-bottom:1px solid var(--hairline-strong);color:var(--ink)}
.hero{position:relative;min-height:720px;display:flex;align-items:center;padding-block:var(--space-16) var(--space-24)}
.hero-copy{position:relative;z-index:1;max-width:670px;pointer-events:none}
.hero-copy a{pointer-events:auto}
.hero h1{font-size:var(--text-display);max-width:9.5em;line-height:1.03}
.hero h1 span{color:var(--ink-muted);display:inline-block;max-width:8em}
.hero-description{font-size:var(--text-lg);line-height:1.65;margin-top:var(--space-8);color:var(--ink-muted);max-width:var(--measure)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-4);min-height:60px;line-height:1.4;padding:var(--space-4) var(--space-6);border-radius:var(--r-sm);font-size:var(--text-sm);font-weight:700;border:1px solid transparent;text-decoration:none;cursor:pointer;transition:background var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out)}
.primary{background:var(--accent);color:var(--accent-ink)}
.primary:hover{background:var(--accent-hover)}
.secondary{background:transparent;color:var(--ink);border-color:var(--hairline-strong)}
.secondary:hover{background:var(--surface-2)}
.button:active{transform:translateY(1px)}
.button span{font-size:var(--text-lg);font-weight:400;line-height:1}.button svg{flex-shrink:0}
.hero .button{margin-top:var(--space-10);min-width:220px}
.hero-caption{font-size:var(--text-xs);color:var(--ink-muted);margin-top:var(--space-4)}
.hero-art{position:absolute;right:-4%;top:-2%;width:73%;height:100%;pointer-events:none;z-index:0}
.hero-art img{width:100%;height:100%;object-fit:contain;display:block}
.connection{padding-block:var(--space-24);border-top:1px solid var(--hairline)}
.connection-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--space-8)}
.connection h2{font-size:var(--text-title);line-height:1.17}
.connection-heading>p{color:var(--ink-muted);font-size:var(--text-md);max-width:25em}
.journey{padding:0;margin:var(--space-16) 0 0;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-12)}
.journey li{padding-top:var(--space-6);border-top:1px solid var(--hairline);min-width:0}
.step-mark{display:flex;align-items:center;justify-content:center;border:1px solid var(--hairline);width:48px;height:48px;border-radius:var(--r-full);color:var(--ink-muted);font-size:24px;margin-bottom:var(--space-8)}
.journey h3{font-size:var(--text-lg);letter-spacing:-.025em;margin-bottom:var(--space-3)}
.journey p{color:var(--ink-muted);font-size:var(--text-sm);max-width:30ch}
.journey a{display:inline-flex;gap:var(--space-4);align-items:center;min-height:44px;font-size:var(--text-sm);margin-top:var(--space-4)}
.closing{padding-block:var(--space-20);border-top:1px solid var(--hairline);display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-8)}
.closing p{font-size:clamp(28px,3.7vw,48px);letter-spacing:-.05em;line-height:1.3}
.site-footer{display:flex;justify-content:space-between;align-items:center;gap:var(--space-6);border-top:1px solid var(--hairline);padding-block:var(--space-8);color:var(--ink-muted);font-size:var(--text-xs)}
.site-footer a{display:inline-flex;align-items:center;min-height:44px}
.skip-link{position:fixed;left:var(--space-4);top:var(--space-4);transform:translateY(-200%);padding:var(--space-3) var(--space-4);background:var(--accent);color:var(--accent-ink);z-index:5}
.skip-link:focus{transform:none}
.subscription-shell{width:min(100% - var(--space-10),760px);margin-inline:auto}
.subscription-page .site-header{min-height:100px}
.private-label{font-size:var(--text-xs);color:var(--ink-muted)}
.subscription-main{padding-top:var(--space-10)}
.subscription-intro{position:relative;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:205px;margin-bottom:var(--space-8)}
.subscription-intro h1{font-size:clamp(40px,5.2vw,64px);line-height:1.12;z-index:1}
.subscription-planet{width:32%;height:auto;display:block}
.access-panel{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:var(--space-8)}
.access-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);font-size:var(--text-lg);font-weight:700;letter-spacing:-.03em}
.status-badge{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);font-weight:500;letter-spacing:0;color:var(--ink-muted)}
.status-badge>span{font-size:8px;color:var(--ink)}
.subscription-stats{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8);padding-block:var(--space-8);margin:var(--space-6) 0 var(--space-2);border-block:1px solid var(--hairline)}
.subscription-stats>div{min-width:0}.subscription-stats>div+div{border-left:1px solid var(--hairline);padding-left:var(--space-8)}
.subscription-stats dt{font-size:var(--text-sm);color:var(--ink-muted)}
.subscription-stats dd{font-size:64px;line-height:1.2;letter-spacing:-.055em;font-weight:500;margin:var(--space-3) 0;min-height:77px;display:flex;align-items:center;font-variant-numeric:tabular-nums}
.subscription-stats .traffic-value{font-size:clamp(24px,3.2vw,34px);letter-spacing:-.045em;line-height:1.2}
.subscription-stats p{color:var(--ink-muted);font-size:var(--text-xs)}
.connect-button,.copy-button{width:100%;margin-top:var(--space-4)}
.action-status{min-height:44px;font-size:var(--text-xs);color:var(--ink-muted);padding-top:var(--space-3)}
.manual-copy label{display:block;margin-bottom:var(--space-2);font-size:var(--text-sm)}
.access-panel input{width:100%;min-width:0;background:var(--canvas);color:var(--ink);border:1px solid var(--hairline-strong);padding:var(--space-3);border-radius:var(--r-sm);font-size:var(--text-sm)}
.setup{padding-top:var(--space-12)}
.setup-header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4)}
.setup-header h2{font-size:24px;letter-spacing:-.04em;line-height:1.3}.setup-header>span{font-size:var(--text-xs);color:var(--ink-muted)}
.setup-steps{padding:0;margin:var(--space-6) 0;list-style:none}
.setup-steps li{display:flex;gap:var(--space-5);padding-block:var(--space-6);border-bottom:1px solid var(--hairline)}
.setup-number{flex:0 0 32px;height:32px;border:1px solid var(--hairline-strong);border-radius:var(--r-full);display:grid;place-items:center;font-size:var(--text-xs);color:var(--ink-muted)}
.setup-steps h3{font-size:var(--text-md);margin-bottom:var(--space-2)}
.setup-steps p{font-size:var(--text-sm);color:var(--ink-muted);max-width:var(--measure)}
.setup-steps a{display:inline-block;line-height:1.8;color:var(--ink)}
.help-details{border-bottom:1px solid var(--hairline);padding-bottom:var(--space-4)}
.help-details summary{cursor:pointer;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);font-size:var(--text-sm);list-style:none}
.help-details summary::-webkit-details-marker{display:none}
.help-details summary::after{content:'+';font-size:24px;color:var(--ink-muted)}
.help-details[open] summary::after{content:'−'}
.help-details p{font-size:var(--text-sm);color:var(--ink-muted);padding-bottom:var(--space-4)}
.privacy-note{text-align:center;font-size:var(--text-xs);color:var(--ink-muted);margin:var(--space-8) 0 var(--space-12)}
.subscription-page .site-footer{padding-bottom:calc(var(--space-8) + env(safe-area-inset-bottom))}
.unavailable{margin-block:var(--space-8) var(--space-16)}.unavailable h2{font-size:28px;line-height:1.3}.unavailable p{color:var(--ink-muted);margin-block:var(--space-4) var(--space-8)}
@media(min-width:900px){.subscription-stats{grid-template-columns:1fr 1fr}.connect-button,.copy-button{width:calc(50% - var(--space-2));gap:var(--space-4)}.copy-button{margin-left:var(--space-3)}}
@media(max-width:1000px){.hero{min-height:650px}.hero-art{width:76%;right:-7%;opacity:.8}.hero h1{font-size:clamp(56px,7vw,76px)}.journey{gap:var(--space-8)}}
@media(max-width:700px){
  .site-header{min-height:88px}.brand{font-size:22px}.site-header nav{gap:var(--space-4)}.site-header nav .header-link{display:none}
  .hero{min-height:auto;display:block;padding-top:var(--space-12);padding-bottom:0}.hero-copy{max-width:none}.hero h1{font-size:clamp(48px,11vw,72px);max-width:10em}.hero-description{font-size:var(--text-md);margin-top:var(--space-6)}
  .hero .button{margin-top:var(--space-8)}.hero-art{position:relative;width:110%;height:370px;margin-left:-5%;top:auto;right:auto;opacity:1;margin-top:-40px}.hero-art img{object-fit:contain}
  .connection{padding-block:var(--space-12)}.connection-heading{display:block}.connection-heading>p{margin-top:var(--space-6)}.connection h2{font-size:36px}
  .journey{display:block;margin-top:var(--space-10)}.journey li{padding-block:var(--space-6);position:relative;padding-left:var(--space-16)}.step-mark{position:absolute;left:0;top:var(--space-6);width:40px;height:40px;margin:0}.journey p{max-width:100%}.journey a{margin-top:var(--space-2)}
  .closing{padding-block:var(--space-12)}.closing p{font-size:32px}.site-footer{gap:var(--space-3)}
  .subscription-page .site-header{min-height:88px}.subscription-main{padding-top:var(--space-5)}.subscription-intro{min-height:132px;margin-bottom:var(--space-6);display:block}.subscription-intro h1{font-size:38px;padding-top:var(--space-4)}.subscription-planet{position:absolute;width:100px;right:0;bottom:0;opacity:.6}
  .access-panel{padding:var(--space-6)}.subscription-stats{gap:var(--space-4);padding-block:var(--space-6);margin-top:var(--space-6)}.subscription-stats>div+div{padding-left:var(--space-4)}.subscription-stats dd{font-size:56px;min-height:68px}.subscription-stats .traffic-value{font-size:24px}
  .setup{padding-top:var(--space-10)}.setup-header{display:block}.setup-header>span{display:block;margin-top:var(--space-2)}
}
@media(max-width:360px){.site-header nav{font-size:var(--text-xs)}.brand{gap:var(--space-2)}.brand img{width:28px;height:28px}.hero h1{font-size:46px}.hero-art{height:310px}.button{padding-inline:var(--space-5)}.private-label{font-size:11px}.subscription-intro h1{font-size:34px}.subscription-planet{display:none}.access-panel{padding:var(--space-5)}.access-top{font-size:var(--text-md)}.status-badge{font-size:10px}.subscription-stats .traffic-value{font-size:21px}.subscription-stats dt,.subscription-stats p{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
@media(forced-colors:active){.button,.access-panel,.setup-number{border:1px solid ButtonText}.hero-art{opacity:.3}}