:root{--ink:#0F1419; --ink-2:#1A2128; --muted:#5C6470; --line:#E8E3D9; --cream:#FAF7F2; --cream-2:#F2EDE3; --accent:#FF6B35; --accent-2:#E85A24; --accent-50:#FFF3EC; --accent-100:#FFE1CC; --accent-200:#FFC49A; --accent-500:#FF6B35; --accent-700:#E85A24; --accent-900:#8A3517; --accent-text:#B8461E; --accent-text-soft:#AE411A; --accent-glow-0:rgba(255, 107, 53, 0.06); --accent-glow-1:rgba(255, 107, 53, 0.12); --accent-glow-2:rgba(255, 107, 53, 0.20); --accent-glow-3:rgba(255, 107, 53, 0.35); --accent-glow-4:rgba(255, 107, 53, 0.55); --green:#2EA869; --shadow:0 1px 2px rgba(15, 20, 25, 0.04), 0 8px 24px rgba(15, 20, 25, 0.06); --radius:14px; --radius-sm:8px; --container:1120px; --bg:#FAF7F2; --bg-2:#F2EDE3; --fg:#0F1419; --fg-2:#1A2128; --card-bg:#FFFFFF; --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px; --text-xs:12px; --text-sm:13px; --text-base:15.5px; --text-md:17px; --text-lg:clamp(20px, 2vw, 24px); --text-xl:clamp(24px, 3vw, 32px); --text-2xl:clamp(28px, 4vw, 44px); --text-3xl:clamp(36px, 5.5vw, 60px); --text-display:clamp(44px, 7.5vw, 96px)} body.dark{--ink:#F5F1EA; --ink-2:#E8E2D6; --muted:#8C857A; --line:#2A2F36; --cream:#0B0E12; --cream-2:#15191E; --bg:#0B0E12; --bg-2:#15191E; --fg:#F5F1EA; --fg-2:#E8E2D6; --card-bg:#15191E; --shadow:0 1px 2px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.4); --accent-text:#FF6B35; --accent-text-soft:#FF6B35; color-scheme:dark} body.dark .hero-launch{background:var(--card-bg); border-color:var(--ink-2)} body.dark .demo-pin,body.dark .story{background:#15191E} body.dark .hero-launch::before{background:var(--accent)} body.dark .signup-row{background:var(--card-bg); border-color:var(--line)} body.dark .signup-row input,body.dark .signup-row select{color:var(--fg)} body.dark .signup-row input::placeholder{color:var(--muted)} body.dark .showcase-card{background:var(--card-bg); border-color:var(--ink-2)} body.dark .showcase-bar{background:var(--cream-2); border-bottom-color:var(--line)} body.dark .showcase-eyebrow{background:rgba(21, 25, 30, 0.85)} body.dark .plan,body.dark .feature,body.dark .who-grid li{background:var(--card-bg); border-color:var(--line)} body.dark .faq-item{background:var(--card-bg); border-color:var(--line)} body.dark .faq-item[open]{border-color:var(--ink-2)} body.dark .badge{background:var(--cream); color:var(--ink)} body.dark .badge.muted,body.dark .badge.outline{background:transparent; color:var(--fg); border-color:var(--line)} body.dark .nav{background:rgba(11, 14, 18, 0.78); border-color:var(--line)} body{background:var(--bg); color:var(--fg); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:16.5px; line-height:1.7; letter-spacing:0.01em; transition:background 0.4s ease, color 0.4s ease}*{box-sizing:border-box}*::before, *::after{box-sizing:border-box} html, body{margin:0; padding:0} .sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap; border:0} .skip-link{position:absolute; top:-100px; left:8px; z-index:9999; padding:12px 18px; background:var(--ink); color:var(--cream); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:14px; font-weight:600; border-radius:8px; text-decoration:none; transition:top 0.2s ease} .skip-link:focus{top:8px; outline:2px solid var(--accent); outline-offset:3px} html{scroll-behavior:smooth; overscroll-behavior-y:none} body{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:var(--text-base); line-height:1.55; color:var(--fg); background:var(--bg); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; position:relative; overflow-x:hidden; font-feature-settings:'ss01', 'cv11'; -webkit-text-size-adjust:100%; text-size-adjust:100%} html.is-paused *,html.is-paused *::before,html.is-paused *::after{animation-play-state:paused !important} a, button, [role="button"], input, select, textarea, summary{-webkit-tap-highlight-color:rgba(255, 107, 53, 0.18)} :focus-visible{outline:2px solid var(--accent); outline-offset:3px; border-radius:4px} body::before{content:""; position:fixed; inset:0; pointer-events:none; z-index:0; background:radial-gradient(900px 620px at 12% 8%, var(--accent-glow-1), transparent 62%), radial-gradient(700px 520px at 88% 92%, rgba(15, 20, 25, 0.05), transparent 60%); animation:bgshift 22s ease-in-out infinite alternate} body::after{content:""; position:fixed; inset:0; pointer-events:none; z-index:0; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='1' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.035 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); opacity:0.5; background-repeat:repeat} @media (prefers-reduced-motion:reduce), (prefers-reduced-data:reduce){body::after{display:none}} .bg-topo{position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; color:var(--ink); opacity:0.10; animation:topodrift 60s ease-in-out infinite alternate; will-change:transform} body.dark .bg-topo{color:var(--cream); opacity:0.08} @keyframes topodrift{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(-24px, 12px, 0)}} @keyframes bgshift{0%{transform:translate3d(0, 0, 0) scale(1)}50%{transform:translate3d(-2%, 1%, 0) scale(1.04)}100%{transform:translate3d(2%, -1%, 0) scale(1.02)}} main, .nav, .footer{position:relative; z-index:1} em, .italic{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-weight:400} h1, h2, h3, h4, h5, h6{color:var(--ink); text-wrap:balance; letter-spacing:-0.025em; font-weight:800; margin:0} p{margin:0} ::selection{background:var(--accent); color:var(--cream)} .container{max-width:var(--container); margin:0 auto; padding:0 24px} a{color:inherit; text-decoration:none} a:hover{text-decoration:underline; text-underline-offset:3px} img, svg{max-width:100%; display:block} .nav-wrap{position:fixed; top:max(12px, env(safe-area-inset-top)); left:0; right:0; z-index:50; padding:0 16px; padding-left:max(16px, env(safe-area-inset-left)); padding-right:max(16px, env(safe-area-inset-right)); pointer-events:none; transform:translateY(0); transition:transform 0.4s cubic-bezier(0.2, 0.7, 0.2, 1); animation:navCurtainReveal 0.55s cubic-bezier(0.2, 0.7, 0.2, 1) 2.7s both} .nav-wrap.is-hidden{transform:translateY(-150%)} html.is-curtain-closed .nav-wrap{transform:translateY(-150%); pointer-events:none} html.is-curtain-closed .scroll-progress{opacity:0} @keyframes navCurtainReveal{0%{transform:translateY(-150%)}100%{transform:translateY(0)}} @supports not (backdrop-filter:blur(1px)){.nav{background:rgba(255, 255, 255, 0.94)} .cmd-palette-card{background:rgba(255, 255, 255, 1)}} .nav{pointer-events:auto; position:relative; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:7px 9px 7px 18px; max-width:980px; margin:12px auto 0; background:rgba(255, 255, 255, 0.72); backdrop-filter:saturate(180%) blur(22px) saturate(180%); -webkit-backdrop-filter:saturate(180%) blur(22px) saturate(180%); border:1px solid rgba(232, 227, 217, 0.55); border-radius:999px; box-shadow:0 1px 1px rgba(15, 20, 25, 0.03), 0 6px 20px rgba(15, 20, 25, 0.05), inset 0 0 0 1px rgba(255, 255, 255, 0.5); transition:box-shadow 0.3s ease, transform 0.3s ease, background 0.3s ease, border-color 0.3s ease} .nav:hover{background:rgba(255, 255, 255, 0.82); border-color:rgba(232, 227, 217, 0.75); box-shadow:0 1px 1px rgba(15, 20, 25, 0.03), 0 12px 32px rgba(15, 20, 25, 0.10), inset 0 0 0 1px rgba(255, 255, 255, 0.6)} .nav[data-state="scrolled"]{background:rgba(255, 255, 255, 0.86); border-color:rgba(232, 227, 217, 0.85)} body.dark .nav{background:rgba(20, 23, 28, 0.62); border-color:rgba(255, 255, 255, 0.08); box-shadow:0 1px 1px rgba(0, 0, 0, 0.4), 0 6px 24px rgba(0, 0, 0, 0.35), inset 0 0 0 1px rgba(255, 255, 255, 0.04)} body.dark .nav:hover,body.dark .nav[data-state="scrolled"]{background:rgba(20, 23, 28, 0.78); border-color:rgba(255, 255, 255, 0.14)} .brand{display:inline-flex; align-items:center; gap:10px; font-family:'Stalinist One', 'JetBrains Mono', ui-monospace, monospace; font-style:normal; font-weight:400; font-size:22px; letter-spacing:-0.01em; padding:6px 4px; color:var(--ink); transition:transform 0.2s ease} .brand, body.dark .brand, .brand-name, body.dark .brand-name{color:var(--ink)} .brand:hover{text-decoration:none; transform:translateX(-1px)} .brand .brand-name{line-height:1; max-width:9ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .brand .brand-name{line-height:1} @media (max-width:480px){.brand .brand-name{max-width:7ch}} .brand-mark{width:auto; height:24px; display:inline-block; position:relative; color:var(--ink); transition:transform 0.4s cubic-bezier(0.2, 0.7, 0.2, 1); flex-shrink:0} .brand-mark svg, .brand-mark img{height:100%; width:auto; display:block; object-fit:contain} body.dark .brand-mark{color:var(--cream)} body.dark .brand-mark img{filter:invert(1) hue-rotate(180deg)} .brand:hover .brand-mark{transform:rotate(-8deg) scale(1.08)} .nav-links{display:flex; align-items:center; gap:4px; font-size:14px; font-weight:500} .nav-links a{color:var(--ink-2); padding:8px 14px; border-radius:999px; position:relative; transition:color 0.2s ease, background 0.2s ease; min-height:36px; display:inline-flex; align-items:center} .nav-links a:not(.nav-cta):hover{text-decoration:none; color:var(--ink)} .nav-cta{display:inline-flex; align-items:center; gap:8px; background:var(--ink); color:var(--cream) !important; padding:9px 16px 9px 18px !important; border-radius:999px; font-weight:600; font-size:14px; transition:transform 0.2s cubic-bezier(0.2, 0.7, 0.2, 1), background 0.2s ease, box-shadow 0.2s ease; box-shadow:0 2px 8px rgba(15, 20, 25, 0.18)} .nav-cta:hover{text-decoration:none; background:var(--ink-2) !important; transform:translateY(-1px); box-shadow:0 6px 16px rgba(15, 20, 25, 0.28)} .nav-cta-arrow{display:inline-block; transition:transform 0.2s ease; font-size:14px} .nav-cta:hover .nav-cta-arrow{transform:translateX(3px)} .nav-burger{display:none; flex-direction:column; justify-content:center; align-items:center; gap:4px; min-width:44px; min-height:44px; background:transparent; border:0; cursor:pointer; padding:0 8px; border-radius:999px; transition:background 0.2s ease} .nav-burger:hover{background:rgba(15, 20, 25, 0.05)} .nav-burger span{display:block; width:18px; height:2px; background:var(--ink); border-radius:2px; transition:transform 0.3s ease, opacity 0.3s ease} .nav-burger.is-open span:nth-child(1){transform:translateY(6px) rotate(45deg)} .nav-burger.is-open span:nth-child(2){opacity:0} .nav-burger.is-open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)} .btn{display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:10px 16px; border-radius:10px; font-weight:600; font-size:14px; border:1px solid transparent; cursor:pointer; transition:transform 0.2s cubic-bezier(0.2, 0.7, 0.2, 1), background 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; font-family:inherit; white-space:nowrap; position:relative; overflow:hidden; isolation:isolate; min-height:44px} .btn::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(255, 255, 255, 0.22), transparent 55%); opacity:0; transition:opacity 0.25s ease; z-index:-1} .btn:hover::after{opacity:1} .btn:hover{text-decoration:none; transform:translateY(-1px)} .btn:active{transform:translateY(1px)} .btn:focus-visible{outline:none; box-shadow:0 0 0 3px var(--cream), 0 0 0 5px var(--accent)} .btn-sm{padding:8px 14px; font-size:13px; min-height:36px} .btn-lg{padding:14px 22px; font-size:16px; min-height:48px} @media (max-width:720px){.btn{min-height:44px} .btn-sm{min-height:36px; padding:8px 14px}} .btn-primary{background:var(--ink); color:var(--cream); box-shadow:0 4px 14px rgba(15, 20, 25, 0.18)} .btn-primary:hover{background:var(--ink-2); box-shadow:0 6px 20px rgba(15, 20, 25, 0.28)} .btn-ghost{background:transparent; color:var(--ink); border-color:var(--ink)} .btn-ghost:hover{background:var(--ink); color:var(--cream)} .hero{padding:108px 0 24px; text-align:center; position:relative; overflow:hidden; isolation:isolate} .hero-inner{z-index:2; position:relative} .hero-asymmetric{padding:80px 0 80px; text-align:left; min-height:720px; max-height:920px; position:relative; overflow:hidden; isolation:isolate} .hero-asymmetric-grid{display:grid; grid-template-columns:60% 40%; gap:32px; align-items:start; position:relative; z-index:2} .hero-asymmetric .hero-left{display:flex; flex-direction:column; align-items:flex-start; gap:24px; max-width:720px} .hero-asymmetric .hero-mark-row{margin:0} .hero-asymmetric .hero-title{margin:0; text-align:left; align-items:flex-start} .hero-asymmetric .ht-row{display:flex; align-items:baseline; gap:0.25em; flex-wrap:wrap; justify-content:flex-start; width:100%} .hero-asymmetric .ht-row-1{font-size:clamp(36px, 5vw, 72px); justify-content:flex-start} .hero-asymmetric .ht-row-2{font-size:clamp(28px, 4vw, 52px); margin-top:0.1em} .hero-asymmetric .hero-sub{text-align:left; max-width:460px; margin:0} .hero-asymmetric .hero-form-slim{width:100%; max-width:520px} .hero-asymmetric .hero-meta{margin:0} .hero-asymmetric .hero-launch{margin:24px 0 0} .hero-strip{list-style:none; padding:0; margin:4px 0 0; display:flex; flex-wrap:wrap; gap:6px 14px; font-size:13.5px; color:var(--muted)} .hero-strip li{display:inline-flex; align-items:center; gap:6px; padding:4px 10px; background:var(--cream-2); border:1px solid var(--line); border-radius:999px} body.dark .hero-strip li{background:rgba(255, 255, 255, 0.04)} .hero-strip-dot{width:5px; height:5px; border-radius:50%; background:var(--accent)} .hero-asymmetric .hero-right{position:relative; display:flex; align-items:center; justify-content:center; transform:translateY(-12px)} .hero-asymmetric .hero-right .showcase-card{width:100%} .hero-asymmetric .hero-right .showcase-card-wrap{margin:0; max-width:100%} .hero-asymmetric .hero-right .showcase-caption{text-align:right; margin:16px 0 0} .hero-scurve{position:absolute; inset:0; width:100%; height:100%; color:var(--accent-text); opacity:0; z-index:0; pointer-events:none; animation:heroScurveIn 1.2s cubic-bezier(0.2, 0.7, 0.2, 1) 0.4s forwards} @keyframes heroScurveIn{0%{opacity:0; transform:translateY(8px)}100%{opacity:0.35; transform:translateY(0)}} .ht-strike{position:relative; display:inline-block; color:var(--accent-text); font-size:1.15em; padding:0 0.12em} .ht-strike::after{content:""; position:absolute; left:0.05em; right:0.05em; top:52%; height:5px; background:var(--accent); border-radius:3px; transform:scaleX(0); transform-origin:left; animation:pdfStrike 0.8s cubic-bezier(0.65, 0, 0.35, 1) 1.2s forwards} @keyframes pdfStrike{0%{transform:scaleX(0)}60%{transform:scaleX(1.06)}100%{transform:scaleX(1)}} .workshop{position:relative; padding:120px 0 140px; background:var(--cream); overflow:hidden} body.dark .workshop-eyebrow{color:var(--accent-text)} body.dark .workshop-line-1,body.dark .workshop-line-2,body.dark .workshop-line-3{color:var(--ink)} body.dark .workshop-quote{color:var(--ink)} body.dark .workshop-attribution{color:rgba(250, 247, 242, 0.65)} body.dark .workshop-squiggle,body.dark .workshop-squiggle-label{color:var(--accent-text)} body.dark .workshop-anno-text{fill:var(--accent)} body.dark .workshop-annotations{color:var(--accent-text)} .workshop-grid{display:grid; grid-template-columns:40% 60%; gap:80px; align-items:start; position:relative} .workshop-left{position:sticky; top:120px; padding-left:32px} .workshop-eyebrow{font-size:13px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--accent-text); margin:0 0 18px} .workshop-heading{margin:0; font-weight:900; line-height:0.95; letter-spacing:-0.04em; display:flex; flex-direction:column; gap:4px} .workshop-line{display:block} .workshop-line-1, .workshop-line-3{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-weight:400; font-size:clamp(36px, 5vw, 64px); color:var(--ink); letter-spacing:-0.02em} .workshop-line-2{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-weight:900; font-size:clamp(36px, 5vw, 64px); color:var(--ink)} .workshop-pullquote{margin-top:36px; padding-top:24px; border-top:1px solid var(--line)} .workshop-quote{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:18px; line-height:1.5; color:var(--ink); margin:0 0 12px} .workshop-attribution{font-size:13px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); font-weight:600} .workshop-right{position:relative} .workshop-form{max-width:480px; width:100%; margin:0 auto} .workshop-card-wrap{position:relative} .workshop-card{position:relative; z-index:2} .workshop-annotations{position:absolute; top:0; left:0; width:100%; height:100%; color:var(--accent-text); pointer-events:none; z-index:3; opacity:0; transform:translateY(6px); transition:opacity 0.6s ease, transform 0.6s ease} .workshop.is-on .workshop-annotations{opacity:1; transform:translateY(0)} .workshop-anno-text{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:14px; fill:var(--accent)} .workshop-squiggle{position:absolute; top:-8px; right:-36px; display:flex; flex-direction:column; align-items:center; color:var(--accent-text); transform:rotate(4deg)} .workshop-squiggle svg{display:block} .workshop-squiggle-label{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:14px; margin-top:2px; color:var(--accent-text)} @media (max-width:900px){.workshop{padding:60px 0 80px} .workshop-grid{grid-template-columns:1fr; gap:40px} .workshop-left{position:static; padding-left:0} .workshop-squiggle{right:0}} @media (max-width:720px){.workshop{padding:48px 0 64px} .workshop-grid{gap:32px}} @media (max-width:540px){.workshop{padding:40px 0 56px} .workshop-grid{gap:28px}} @media (max-width:360px){.workshop{padding:36px 0 48px} .workshop-grid{gap:24px}} @media (max-width:900px){.hero-asymmetric{min-height:0; max-height:none; padding:48px 0 24px} .hero-asymmetric-grid{grid-template-columns:1fr; gap:32px} .hero-asymmetric .hero-right{transform:none} .hero-asymmetric .hero-right .showcase-caption{text-align:center} .hero-scurve{display:none} .hero-folio{padding:8px 16px; gap:6px} .hero-folio .folio-rule{display:none} .hero-launch{padding:16px 14px} .launch-grid{gap:6px} .launch-cell{min-width:48px; padding:4px 2px} .launch-cell strong{font-size:clamp(22px, 6vw, 32px)} .launch-sep{font-size:clamp(20px, 5vw, 26px)}}[data-split]{display:inline-block; overflow:hidden; vertical-align:top}[data-split] > .ch{display:inline-block; transform:translateY(110%); opacity:0}[data-split].is-split > .ch{animation:chIn 0.9s cubic-bezier(0.2, 0.7, 0.2, 1) forwards} @keyframes chIn{to{transform:translateY(0); opacity:1}}[data-split] > .wh{display:inline-block; width:0.25em} .hero > .container{max-width:1480px; padding:0 32px} .hero-folio{display:flex; align-items:center; gap:10px; width:100%; padding:10px 24px; border-bottom:1px solid var(--line); font-size:12px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; position:relative; z-index:1; clip-path:inset(0 100% 0 0); animation:folioWipe 0.9s cubic-bezier(0.65, 0, 0.35, 1) 0.15s forwards} @keyframes folioWipe{to{clip-path:inset(0 0 0 0)}} .hero-folio .folio-issue{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 14, 'SOFT' 0, 'WONK' 0; font-weight:600; color:var(--accent-text)} .hero-folio .folio-label{color:var(--muted)} .hero-folio .folio-rule{flex:1; height:1px; background:var(--line)} .hero-inner{max-width:1080px; margin:0 auto; padding:0 16px; text-align:center; display:flex; flex-direction:column; align-items:center; position:relative; z-index:1} .eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--ink); background:rgba(255, 255, 255, 0.85); backdrop-filter:blur(8px); border:1px solid var(--line); padding:6px 12px; border-radius:999px; margin:0 0 10px; box-shadow:0 2px 10px rgba(15, 20, 25, 0.04)} .eyebrow .dot{width:8px; height:8px; background:var(--green); border-radius:50%; display:inline-block; box-shadow:0 0 0 4px rgba(46, 168, 105, 0.20); animation:pulse 1.6s ease-in-out infinite} .eyebrow strong{color:var(--ink); font-weight:700} .eyebrow-sep{opacity:0.4} .hero-mark-row{display:inline-flex; align-items:center; gap:18px; margin:0 0 28px; padding:0} .hero-mark{display:inline-flex; align-items:center; font-size:13px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted); padding-bottom:6px; border-bottom:1px solid var(--line)} .hero-mark .mark-eyebrow{line-height:1} .hero-eyebrow-text{display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted)} .hero-eyebrow-text strong{color:var(--accent-text); font-weight:800} .hero-eyebrow-text-sep{opacity:0.4} .hero-title{margin:0 auto 24px; max-width:1000px; width:100%; text-wrap:balance; display:flex; flex-direction:column; gap:0px; position:relative} .ht-row{display:block; line-height:1; letter-spacing:-0.04em} .ht-row-1{font-size:clamp(36px, 5.5vw, 76px); font-weight:800; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-optical-sizing:auto; font-variation-settings:'opsz' 96, 'wght' 800; color:var(--ink); letter-spacing:-0.035em} .ht-row-2{font-size:clamp(36px, 5.5vw, 76px); display:flex; align-items:baseline; gap:0.2em; flex-wrap:wrap; justify-content:center; width:100%; text-align:center} .ht-display{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-optical-sizing:auto; font-variation-settings:'opsz' 96, 'wght' 800; letter-spacing:-0.04em; color:var(--ink)} .ht-serif{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-weight:400; letter-spacing:-0.02em} .ht-orange{color:var(--accent-text); font-size:1.15em; text-shadow:0 0 60px var(--accent-glow-3)} .underline{background:linear-gradient(transparent 62%, rgba(255, 107, 53, 0.55) 62%, rgba(255, 107, 53, 0.55) 90%, transparent 90%); padding:0 4px} .hero-sub{font-size:clamp(16px, 1.6vw, 19px); color:var(--muted); max-width:620px; margin:0 auto 36px; line-height:1.55; text-wrap:balance; position:relative; padding-top:18px} .hero-sub::before{content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); width:56px; height:1px; background:var(--ink)} .signup-form{max-width:960px; margin:0 auto} .signup-row{display:flex; flex-direction:row; gap:8px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:10px; box-shadow:0 1px 2px rgba(15, 20, 25, 0.04), 0 12px 32px rgba(15, 20, 25, 0.10), 0 0 0 1px rgba(255, 255, 255, 0.6) inset; transition:box-shadow 0.25s ease, border-color 0.25s ease, transform 0.25s ease} .signup-row > input[type="email"]{flex:1.4 1 0; min-width:0} .signup-row > select{flex:0.9 1 0; min-width:0} .signup-row > button{flex:0 0 auto} .signup-row:hover{border-color:rgba(255, 107, 53, 0.35); box-shadow:0 1px 2px rgba(15, 20, 25, 0.04), 0 16px 40px rgba(255, 107, 53, 0.16), 0 0 0 1px rgba(255, 255, 255, 0.6) inset} .signup-row:focus-within{border-color:var(--accent-text); box-shadow:0 1px 2px rgba(15, 20, 25, 0.04), 0 18px 48px rgba(255, 107, 53, 0.22), 0 0 0 4px rgba(255, 107, 53, 0.12); transform:translateY(-1px)} .signup-row input,.signup-row select{border:0; outline:0; background:transparent; font-family:inherit; font-size:16px; color:var(--ink); padding:14px 14px; border-radius:10px; min-width:0; min-height:48px} .signup-row input::placeholder{color:#9aa1ab} .signup-row select{color:var(--muted); cursor:pointer} .signup-row input:focus,.signup-row select:focus{background:var(--cream-2); color:var(--ink)} .signup-row .btn-primary{border-radius:10px; padding:14px 22px; font-size:15px; min-height:48px} .form-msg{font-size:14px; color:var(--muted); margin:14px 0 0; min-height:20px} .form-msg.ok{color:var(--green)} .form-msg.err{color:var(--accent-2)} .counter{display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:500; color:var(--muted); background:#fff; border:1px solid var(--line); padding:7px 14px; border-radius:999px; margin:0 0 22px} .counter[hidden]{display:none} .counter-dot{width:7px; height:7px; background:var(--accent); border-radius:50%; display:inline-block; animation:pulse 1.6s ease-in-out infinite} .counter strong{color:var(--ink); font-weight:700} @keyframes pulse{0%, 100%{transform:scale(1); opacity:1}50%{transform:scale(1.4); opacity:0.55}} .hero-meta{margin-top:10px; font-size:13px; color:var(--muted); display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:center} .hero-meta .sep{opacity:0.5} .hero-launch{margin:0 0 18px; padding:14px 20px 14px; max-width:520px; width:100%; background:var(--card-bg); border:1px solid var(--ink); border-radius:14px; position:relative; text-align:center; box-shadow:0 8px 24px rgba(15, 20, 25, 0.06)} .hero-asymmetric .hero-launch{margin:0 0 16px} .hero-launch::before{content:""; position:absolute; top:-1px; left:24px; right:24px; height:3px; background:var(--accent)} .launch-label{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.14em; color:var(--ink); margin-bottom:12px} .launch-dot{width:8px; height:8px; background:var(--accent); border-radius:50%; box-shadow:0 0 0 4px rgba(255, 107, 53, 0.18), 0 0 10px rgba(255, 107, 53, 0.5); animation:pulse 1.6s ease-in-out infinite} .launch-grid{display:inline-flex; align-items:center; justify-content:center; gap:6px; font-variant-numeric:tabular-nums} .launch-cell{display:flex; flex-direction:column; align-items:center; min-width:64px; padding:4px 6px} .launch-cell strong{display:inline-block; overflow:hidden; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-optical-sizing:auto; font-variation-settings:'SOFT' 15, 'WONK' 1; font-size:clamp(28px, 4vw, 40px); font-weight:600; line-height:1; letter-spacing:-0.01em; color:var(--ink); font-variant-numeric:tabular-nums} .launch-cell span{font-size:12px; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); margin-top:4px} .launch-sep{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:clamp(24px, 3.4vw, 34px); font-weight:600; color:var(--accent-text); line-height:1; padding-bottom:14px} .launch-foot{font-size:13.5px; font-weight:600; color:var(--muted); letter-spacing:0.02em; margin-top:10px} @media (max-width:480px){.launch-cell{min-width:52px} .hero-launch{padding:16px 14px}} .hero-trust{margin-top:32px; padding-top:24px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; max-width:560px; margin-left:auto; margin-right:auto} .hero-trust-founder{display:flex; align-items:center; gap:12px} .founder-avatar{width:38px; height:38px; border-radius:50%; background:linear-gradient(135deg, var(--ink) 0%, var(--ink) 60%, var(--accent) 60%, var(--accent) 100%); color:var(--cream); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:15px; flex-shrink:0} .hero-trust-founder strong{display:block; font-size:14px; color:var(--ink); line-height:1.2} .hero-trust-founder span{display:block; font-size:12.5px; color:var(--muted); margin-top:2px} .hero-trust-link{display:inline-flex; align-items:center; gap:4px; font-size:14px; font-weight:600; color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:1px} .hero-trust-link:hover{text-decoration:none; color:var(--accent-text); border-color:var(--accent-text)} .hero-trust-link span{transition:transform 0.15s ease} .hero-trust-link:hover span{transform:translateX(3px)} .showcase{padding:28px 0 24px; position:relative} .showcase > .container{position:relative; z-index:1} .showcase-eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.12em; color:var(--muted); background:rgba(255, 255, 255, 0.85); backdrop-filter:blur(8px); border:1px solid var(--line); padding:6px 12px; border-radius:999px; margin:0 auto 18px; display:flex; width:fit-content} .showcase-eyebrow .dot-live{width:7px; height:7px; background:var(--accent); border-radius:50%; display:inline-block; animation:pulse 1.6s ease-in-out infinite} .showcase-card{background:#fff; border:1px solid var(--ink); border-radius:4px; overflow:hidden; box-shadow:0 1px 0 rgba(15, 20, 25, 0.06), 0 24px 60px -12px rgba(15, 20, 25, 0.18); max-width:940px; margin:0 auto; transition:box-shadow 0.4s ease; position:relative} .showcase-card::before{content:""; position:absolute; top:-1px; left:24px; right:24px; height:1px; background:var(--ink); z-index:2} .showcase-card:hover{box-shadow:0 1px 0 rgba(15, 20, 25, 0.06), 0 32px 80px -12px rgba(15, 20, 25, 0.24)}[data-parallax]{will-change:transform} .showcase-bar{display:flex; align-items:center; gap:6px; padding:10px 16px; background:var(--cream-2); border-bottom:1px solid var(--line); flex-wrap:wrap} .showcase-bar .dot-r,.showcase-bar .dot-y,.showcase-bar .dot-g{width:10px; height:10px; border-radius:50%; display:inline-block} .showcase-bar .dot-r{background:#FF5F57} .showcase-bar .dot-y{background:#FEBC2E} .showcase-bar .dot-g{background:#28C840} .showcase-url{margin-left:14px; font-size:13.5px; color:var(--muted); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif} .showcase-tabs{margin-left:auto; position:relative; display:grid; grid-template-columns:repeat(4, auto); gap:4px; background:transparent; border:0; padding:0; transition:none} .showcase-tabs.is-highlight{border-color:var(--accent-text); box-shadow:0 0 0 3px var(--accent-glow-2)} .s-tab{border:1px solid var(--line); background:transparent; font-family:inherit; font-size:13.5px; font-weight:600; color:var(--muted); padding:8px 14px; min-height:36px; border-radius:999px; cursor:pointer; transition:background 0.2s ease, color 0.2s ease, border-color 0.2s ease; position:relative; z-index:1} .s-tab:hover{color:var(--ink); border-color:var(--ink-2)} .s-tab.is-active{background:var(--ink); color:var(--cream); border-color:var(--ink)} .s-tab-indicator{position:absolute; top:0; left:0; width:0; height:0; background:var(--ink); border-radius:999px; z-index:0; transition:transform 0.45s cubic-bezier(0.2, 0.7, 0.2, 1), width 0.45s cubic-bezier(0.2, 0.7, 0.2, 1), height 0.45s cubic-bezier(0.2, 0.7, 0.2, 1); pointer-events:none} .s-tab.is-active + .s-tab-indicator,.showcase-tabs .s-tab-indicator{background:var(--ink)} body.dark .s-tab-indicator{background:var(--cream)} body.dark .s-tab.is-active{background:var(--cream); color:var(--ink); border-color:var(--cream)} @media (max-width:720px){.showcase-tabs{grid-template-columns:repeat(2, auto)}} .showcase-body{padding:22px 24px; max-height:540px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--line) transparent} .showcase-body::-webkit-scrollbar{width:6px} .showcase-body::-webkit-scrollbar-thumb{background:var(--line); border-radius:6px} .showcase-body::-webkit-scrollbar-thumb:hover{background:var(--muted)} .showcase-hero{display:flex; align-items:center; gap:14px; padding-bottom:22px; border-bottom:1px solid var(--line)} .showcase-avatar{width:52px; height:52px; border-radius:50%; background:linear-gradient(135deg, var(--accent), #FFB088)} .showcase-hero h3{margin:0; font-size:18px} .showcase-hero p{margin:2px 0 0; font-size:13px; color:var(--muted)} .showcase-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; padding:22px 0} @media (max-width:640px){.showcase-grid{grid-template-columns:1fr}} .showcase-tile{background:var(--cream-2); border-radius:10px; padding:14px; min-height:90px; display:flex; flex-direction:column; gap:6px} .tile-label{font-size:13px; text-transform:uppercase; letter-spacing:0.08em; color:var(--muted); font-weight:600} .showcase-tile strong{font-size:14px; line-height:1.3} .showcase-cta{display:flex; gap:8px; flex-wrap:wrap; padding-top:8px} .pf{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif} .pf-head{display:flex; align-items:center; gap:14px; padding-bottom:12px; border-bottom:1px solid var(--line); margin-bottom:12px} .pf-monogram{width:48px; height:48px; border-radius:12px; background:var(--ink); color:var(--cream); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 36, 'SOFT' 25, 'WONK' 1; font-weight:500; font-size:18px; display:flex; align-items:center; justify-content:center; letter-spacing:0.04em} body.dark .pf-monogram{background:var(--cream); color:var(--ink)} .pf-head-meta{flex:1; min-width:0} .pf-name{margin:0; font-size:17px; font-weight:700; letter-spacing:-0.01em} .pf-role{margin:2px 0 0; font-size:12.5px; color:var(--muted)} .pf-status{display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); padding:4px 10px; border:1px solid var(--line); border-radius:999px; white-space:nowrap} .pf-status-dot{width:6px; height:6px; border-radius:50%; background:var(--green); box-shadow:0 0 0 3px rgba(46, 168, 105, 0.18); animation:pfPulse 1.6s ease-in-out infinite} @keyframes pfPulse{0%, 100%{opacity:1}50%{opacity:0.55}} .pf-section-title{font-size:12px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); margin:10px 0 6px} .pf-foot{display:flex; justify-content:space-between; gap:12px; margin-top:14px; padding-top:14px; border-top:1px solid var(--line); flex-wrap:wrap} .pf-foot-meta{font-size:13px; color:var(--muted); letter-spacing:0.04em} .pf-chef .pf-menu{list-style:none; padding:0; margin:0 0 4px} .pf-course{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 18, 'SOFT' 25, 'WONK' 1; font-weight:500; font-size:13px; color:var(--accent-text)} .pf-dish{color:var(--ink); font-weight:500} .pf-tag{font-size:12px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); padding:2px 8px; border:1px solid var(--line); border-radius:999px} .pf-price{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 30, 'SOFT' 20, 'WONK' 0; font-weight:500; font-size:13px; color:var(--ink); margin-left:auto; font-variant-numeric:tabular-nums; letter-spacing:-0.01em} body.dark .pf-price{color:var(--cream)} .pf-dev .pf-dev-row{display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin-bottom:14px} .pf-dev .pf-stat{background:var(--cream-2); border-radius:10px; padding:12px; display:flex; flex-direction:column; gap:2px} .pf-dev .pf-stat-num{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 48, 'SOFT' 25, 'WONK' 1; font-weight:500; font-size:28px; letter-spacing:-0.02em; color:var(--ink); line-height:1} .pf-dev .pf-stat-label{font-size:13px; color:var(--muted); letter-spacing:0.02em} .pf-contrib-grid{display:grid; grid-template-columns:repeat(7, 1fr); gap:4px; margin-bottom:14px} .pf-contrib-cell{background:var(--cream-2); border-radius:6px; padding:6px 4px; text-align:center; font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted); line-height:1.2} .pf-contrib-bar{display:block; margin:6px auto 0; width:8px; background:var(--accent); border-radius:999px; height:var(--h, 0%); min-height:4px; max-height:28px; transition:height 0.6s cubic-bezier(0.2, 0.7, 0.2, 1)} .pf-dev-talk{font-size:13px; color:var(--ink); padding:10px 12px; background:var(--cream-2); border-radius:10px; border-left:3px solid var(--accent)} .pf-student .pf-proj-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px} .pf-student .pf-proj{background:var(--cream-2); border-radius:10px; padding:14px; display:flex; flex-direction:column; gap:6px; border-top:2px solid var(--ink)} .pf-student .pf-proj-tag{font-size:12.5px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent-text)} .pf-student .pf-proj strong{font-size:14px; line-height:1.3; color:var(--ink)} .pf-student .pf-proj-meta{font-size:13px; color:var(--muted)} .pf-consultant .pf-cases{list-style:none; padding:0; margin:0 0 14px} .pf-consultant .pf-cases li{display:grid; grid-template-columns:28px 1fr auto; gap:12px; align-items:center; padding:12px 0; border-bottom:1px solid var(--line); font-size:13px} .pf-consultant .pf-cases li:last-child{border-bottom:0} .pf-consultant .pf-case-num{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 18, 'SOFT' 25, 'WONK' 1; font-weight:500; font-size:13px; color:var(--accent-text)} .pf-consultant .pf-case-meta strong{display:block; font-size:13.5px; color:var(--ink)} .pf-consultant .pf-case-meta span{display:block; font-size:13.5px; color:var(--muted); margin-top:2px} .pf-consultant .pf-case-out{font-size:13px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--accent-text); padding:4px 8px; border:1px solid var(--accent); border-radius:999px; white-space:nowrap} .pf-quote{margin:0; padding:12px 14px; background:var(--cream-2); border-radius:10px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:14px; color:var(--ink); line-height:1.4} .pf-ticker{display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:6px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:10px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:12.5px; letter-spacing:0.04em; color:var(--muted)} .pf-ticker-item{display:inline-flex; align-items:center; gap:6px} .pf-ticker-item strong{color:var(--ink); font-weight:700} body.dark .pf-ticker-item strong{color:var(--cream)} .pf-ticker-sep{color:var(--muted); opacity:0.5} .pf-live-dot{width:6px; height:6px; border-radius:50%; background:#2EA869; box-shadow:0 0 0 3px rgba(46, 168, 105, 0.2); animation:pfPulse 1.6s ease-in-out infinite; display:inline-block} .pf-rating{display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border:1px solid var(--line); border-radius:999px; white-space:nowrap; font-size:13.5px} .pf-stars{color:var(--accent-text); font-size:13px; letter-spacing:1px} .pf-rating-n{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 24, 'SOFT' 25, 'WONK' 1; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums} body.dark .pf-rating-n{color:var(--cream)} .pf-proj-list,.pf-essay-list,.pf-experience-list,.pf-talk-list,.pf-achievement-list{list-style:none; padding:0; margin:0 0 8px} .pf-proj-row,.pf-essay-row,.pf-experience-row,.pf-talk-row,.pf-achievement-list li,.pf-dish-row,.pf-case-row{padding:8px 0; border-bottom:1px solid var(--line); cursor:default; font-size:13px; color:var(--ink); display:grid; gap:3px} .pf-proj-row:last-child,.pf-essay-row:last-child,.pf-experience-row:last-child,.pf-talk-row:last-child,.pf-achievement-list li:last-child,.pf-dish-row:last-child,.pf-case-row:last-child{border-bottom:0} .pf-proj-head,.pf-essay-head,.pf-experience-head,.pf-talk-head{display:flex; align-items:baseline; justify-content:space-between; gap:10px} .pf-proj-head strong,.pf-essay-head strong,.pf-experience-head strong,.pf-talk-head strong{font-size:13.5px; font-weight:600; color:var(--ink); line-height:1.3} body.dark .pf-proj-head strong,body.dark .pf-essay-head strong,body.dark .pf-experience-head strong,body.dark .pf-talk-head strong{color:var(--cream)} .pf-proj-tag,.pf-proj-stars,.pf-essay-meta,.pf-experience-meta{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:12px; letter-spacing:0.06em; color:var(--muted); white-space:nowrap} .pf-proj-stars{color:var(--accent-text)} .pf-proj-desc,.pf-essay-meta,.pf-experience-desc,.pf-talk-body{margin:0; font-size:12.5px; color:var(--muted); line-height:1.45} .pf-byline-grid{margin:0 0 18px; padding:10px 12px; background:var(--cream-2); border-radius:8px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:13.5px; color:var(--ink); line-height:1.5} body.dark .pf-byline-grid{background:var(--card-bg-2)} .pf-achievement-list li{display:flex; align-items:center; gap:10px; font-size:12.5px; color:var(--ink); padding:9px 0; border-bottom:1px solid var(--line)} .pf-achievement-list li::before{content:'◆'; color:var(--accent-text); font-size:12.5px; flex-shrink:0} .pf-now{margin:0 0 18px; padding:14px 16px; background:var(--cream-2); border-radius:10px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:14.5px; line-height:1.5; color:var(--ink); border-left:3px solid var(--accent)} body.dark .pf-now{background:var(--card-bg-2)} .pf-cta{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 16px; margin-top:12px; background:var(--ink); color:var(--cream); border-radius:12px; text-decoration:none; transition:transform 0.2s ease, background 0.2s ease} .pf-cta:hover{transform:translateY(-1px); background:var(--ink-2)} body.dark .pf-cta{background:var(--cream); color:var(--ink)} body.dark .pf-cta:hover{background:#fff} .pf-cta-label{font-size:13px; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; display:block} .pf-cta-sub{display:block; font-size:13.5px; font-weight:400; opacity:0.7; letter-spacing:0; text-transform:none; margin-top:2px} .pf-cta-arrow{font-size:18px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; transition:transform 0.25s ease} .pf-cta:hover .pf-cta-arrow{transform:translateX(4px)} .pf-dev-row{display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin-bottom:14px} .pf-stat{background:var(--cream-2); border-radius:10px; padding:12px; display:flex; flex-direction:column; gap:2px} body.dark .pf-stat{background:var(--card-bg-2)} .pf-stat-num{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 48, 'SOFT' 25, 'WONK' 1; font-weight:500; font-size:24px; letter-spacing:-0.02em; color:var(--ink); line-height:1; font-variant-numeric:tabular-nums} body.dark .pf-stat-num{color:var(--cream)} .pf-stat-label{font-size:12.5px; color:var(--muted); letter-spacing:0.02em} .pf-dish-row{padding:0; border-bottom:1px solid var(--line); cursor:pointer; transition:background 0.2s ease} .pf-dish-row:hover{background:var(--cream-2)} .pf-dish-row:last-child{border-bottom:0} .pf-dish-head{display:grid; grid-template-columns:28px 1fr auto auto; gap:10px; align-items:baseline; padding:9px 0} .pf-dish-detail{max-height:0; overflow:hidden; transition:max-height 0.3s ease, margin 0.3s ease, padding 0.3s ease; font-size:13.5px; color:var(--muted); line-height:1.5; padding:0 0 0 38px} .pf-dish-row.is-open .pf-dish-detail{max-height:200px; padding-bottom:10px} .pf-dish-name{font-size:13.5px; font-weight:600; color:var(--ink)} body.dark .pf-dish-name{color:var(--cream)} .pf-dish-sub{font-size:13.5px; color:var(--muted); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic} .pf-dish-arrow{width:22px; height:22px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:14px; color:var(--muted); transition:transform 0.25s ease, background 0.25s ease, color 0.25s ease; flex-shrink:0} .pf-dish-row.is-open .pf-dish-arrow{transform:rotate(45deg); background:var(--ink); color:var(--cream); border-color:var(--ink)} body.dark .pf-dish-row.is-open .pf-dish-arrow{background:var(--cream); color:var(--ink); border-color:var(--cream)} .pf-press{margin:14px 0 18px; padding:14px 16px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:14.5px; line-height:1.5; color:var(--ink); text-align:center; position:relative} .pf-press::before,.pf-press::after{content:'“'; position:absolute; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 72, 'SOFT' 100; font-style:normal; color:var(--accent-text); font-size:36px; line-height:1} .pf-press::before{top:4px; left:4px} .pf-press::after{content:'”'; bottom:-8px; right:4px} .pf-press-meta{display:block; margin-top:8px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:normal; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted)} body.dark .pf-press{color:var(--cream)} @media (max-width:640px){.pf-contrib-grid{grid-template-columns:repeat(7, 1fr); gap:3px} .pf-dev .pf-stat-num{font-size:22px} .pf-student .pf-proj-grid{grid-template-columns:1fr}} .badge{display:inline-flex; align-items:center; font-size:13.5px; font-weight:600; padding:6px 10px; border-radius:999px; background:var(--ink); color:var(--cream)} .badge.muted{background:transparent; color:var(--ink); border:1px solid var(--line)} .badge.outline{background:transparent; color:var(--ink); border:1px solid var(--ink)} .s-action{cursor:pointer; transition:transform 0.15s ease, background 0.2s ease, color 0.2s ease; min-height:44px; padding:12px 18px; font-size:13px} .s-action:hover{transform:translateY(-1px)} .s-action.is-flash{background:var(--accent) !important; color:#fff !important; border-color:var(--accent-text) !important} .s-fade{animation:sFade 0.35s ease} @keyframes sFade{0%{opacity:0; transform:translateY(6px)}100%{opacity:1; transform:translateY(0)}} .who, .features, .pricing, .cta{padding:88px 0} @media (max-width:720px){.who, .features, .pricing, .cta{padding:56px 0}} @media (max-width:480px){.who, .features, .pricing, .cta{padding:48px 0} .horizontal{padding:48px 0 20px}} @media (max-width:360px){.who, .features, .pricing, .cta{padding:40px 0} .horizontal{padding:40px 0 16px}} .faq{padding:88px 0 32px} @media (max-width:720px){.faq{padding:56px 0 24px}} .stats{padding:100px 0} @media (max-width:720px){.stats{padding:64px 0}} .stats-hero{display:grid; grid-template-columns:1.25fr 1fr; gap:60px; align-items:center; margin-top:56px; padding:48px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); position:relative} .stats-hero::before{content:""; position:absolute; left:0; top:0; width:60px; height:1px; background:var(--accent); transition:width 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) 0.4s} .stats.is-in-view .stats-hero::before{width:200px} .stats-hero-main{display:flex; flex-direction:column; gap:14px; opacity:0; transform:translateY(20px); transition:opacity 0.7s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1)} .stats.is-in-view .stats-hero-main{opacity:1; transform:translateY(0)} .stats-hero-eyebrow{font-family:'Saira', sans-serif; font-size:11px; font-weight:600; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text); padding:4px 8px; border:1px solid rgba(255, 107, 53, 0.32); border-radius:2px; align-self:flex-start} .stats-hero-num{font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:clamp(64px, 11vw, 128px); font-weight:400; line-height:0.88; letter-spacing:-0.04em; color:var(--ink); display:block; align-items:baseline; position:relative; margin:4px 0 0; max-width:100%} .stats-hero-num::after{content:""; position:absolute; left:0; right:0; bottom:8px; height:2px; background:var(--accent); transform:scaleX(0); transform-origin:left center; transition:transform 0.8s cubic-bezier(0.65, 0, 0.35, 1) 0.6s} .stats.is-in-view .stats-hero-num::after{transform:scaleX(1)} .stats-hero-unit{font-family:'Stalinist One', sans-serif; font-size:0.35em; color:var(--accent-text); margin-left:6px; letter-spacing:0} .stats-hero-label{font-family:'Saira', sans-serif; font-size:14px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink)} .stats-hero-note{font-family:'Saira', sans-serif; font-size:14px; color:var(--muted); font-style:italic; max-width:38ch; line-height:1.5} .stats-hero-orbit{display:flex; flex-direction:column; gap:0; border-left:1px solid var(--line); padding-left:40px} .stat-orbit{display:flex; flex-direction:column; gap:6px; padding:22px 0; border-bottom:1px dashed var(--line); opacity:0; transform:translateY(12px); transition:opacity 0.55s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.55s cubic-bezier(0.2, 0.7, 0.2, 1)} .stat-orbit:last-child{border-bottom:0} .stats.is-in-view .stat-orbit{opacity:1; transform:translateY(0)} .stats.is-in-view .stat-orbit{transition-delay:calc(0.3s + var(--d, 0) * 0.1s)} .stat-orbit strong{font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:clamp(32px, 4vw, 48px); font-weight:400; color:var(--ink); letter-spacing:-0.02em; line-height:1; display:inline-flex; align-items:baseline; gap:4px} .stat-orbit .stat-unit{font-size:0.5em; color:var(--accent-text); letter-spacing:0; font-weight:400} .stat-orbit .stat-label{font-family:'Saira', sans-serif; font-size:12px; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink)} .stat-orbit .stat-note{font-family:'Saira', sans-serif; font-size:12.5px; color:var(--muted); line-height:1.5; margin-top:2px} @media (max-width:900px){.stats-hero{grid-template-columns:1fr; gap:40px; padding:36px 0} .stats-hero-orbit{border-left:0; padding-left:0; border-top:1px dashed var(--line); padding-top:8px}} @media (prefers-reduced-motion:reduce){.stats-hero-main, .stat-orbit, .stats-hero-num::after, .stats-hero::before{animation:none !important; transition:none !important; opacity:1 !important; transform:none !important} .stats-hero::before{width:200px !important} .stats-hero-num::after{transform:scaleX(1) !important} .nav-wrap{animation:none !important; transform:translateY(0) !important}} .horizontal{padding:88px 0 32px; overflow:hidden} @media (max-width:720px){.horizontal{padding:56px 0 24px}} .faq-list{max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:10px} .faq-item{background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; transition:border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease} .faq-item[open]{border-color:var(--ink); box-shadow:0 8px 24px rgba(15, 20, 25, 0.08)} .faq-item summary{list-style:none; cursor:pointer; padding:20px 22px; display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:16px; font-weight:600; color:var(--ink); user-select:none; transition:background 0.2s ease} .faq-item summary::-webkit-details-marker{display:none} .faq-item summary:hover{background:var(--cream-2)} .faq-item[open] summary:hover{background:transparent} .faq-icon{width:28px; height:28px; border-radius:50%; background:var(--cream-2); position:relative; flex-shrink:0; transition:background 0.25s ease, transform 0.4s linear(0, 0.5 60%, 1.05 82%, 1)} .faq-icon::before,.faq-icon::after{content:""; position:absolute; top:50%; left:50%; background:var(--ink); border-radius:1px; transition:transform 0.3s ease, opacity 0.3s ease} .faq-icon::before{width:12px; height:2px; margin:-1px 0 0 -6px} .faq-icon::after{width:2px; height:12px; margin:-6px 0 0 -1px} .faq-item[open] .faq-icon{background:var(--ink); transform:rotate(180deg)} .faq-item[open] .faq-icon::before,.faq-item[open] .faq-icon::after{background:var(--cream)} .faq-item[open] .faq-icon::after{transform:scaleY(0)} .faq-body{padding:0 22px 22px; color:var(--muted); font-size:15px; line-height:1.6; animation:faqOpen 0.35s cubic-bezier(0.2, 0.7, 0.2, 1)} .faq-body p{margin:0} @keyframes faqOpen{0%{opacity:0; transform:translateY(-6px)}100%{opacity:1; transform:translateY(0)}} @media (max-width:720px){.faq-item summary{padding:18px; font-size:15px} .faq-body{padding:0 18px 18px; font-size:14.5px}} .reveal{opacity:0; transform:translateY(28px); transition:opacity 0.7s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1); will-change:opacity, transform} .reveal.is-in{opacity:1; transform:translateY(0)} .reveal-stagger > *{opacity:0; transform:translateY(20px); transition:opacity 0.55s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.55s cubic-bezier(0.2, 0.7, 0.2, 1)} .reveal-stagger.is-in > *{opacity:1; transform:translateY(0)} .reveal-stagger.is-in > *:nth-child(1){transition-delay:0.02s} .reveal-stagger.is-in > *:nth-child(2){transition-delay:0.10s} .reveal-stagger.is-in > *:nth-child(3){transition-delay:0.18s} .reveal-stagger.is-in > *:nth-child(4){transition-delay:0.26s} .reveal-stagger.is-in > *:nth-child(5){transition-delay:0.34s} .reveal-stagger.is-in > *:nth-child(6){transition-delay:0.42s} .hero .eyebrow,.hero .hero-title,.hero .hero-sub,.hero .signup-form,.hero .hero-meta{animation:heroIn 0.9s cubic-bezier(0.2, 0.7, 0.2, 1) both} .hero .eyebrow{animation-delay:0.05s} .hero .hero-title{animation-delay:0.18s} .hero .hero-sub{animation-delay:0.30s} .hero .signup-form{animation-delay:0.42s} .hero .hero-meta{animation-delay:0.54s} .showcase .showcase-card{animation:heroIn 1.0s cubic-bezier(0.2, 0.7, 0.2, 1) 0.55s both} @keyframes heroIn{0%{opacity:0; transform:translateY(18px); filter:blur(6px)}100%{opacity:1; transform:translateY(0); filter:blur(0)}} @media (prefers-reduced-motion:reduce){*, *::before, *::after{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important} .reveal, .reveal-stagger > *{opacity:1 !important; transform:none !important} .scroll-progress{display:none !important} body > main > *:not(.hero){visibility:visible !important} body{overflow-x:auto !important}} .scroll-progress{position:fixed; top:0; left:0; height:3px; width:0%; background:linear-gradient(90deg, var(--accent), #FFB088); z-index:100; pointer-events:none; box-shadow:0 0 12px rgba(255, 107, 53, 0.6); transform-origin:left center; will-change:width} .tabular{font-variant-numeric:tabular-nums} .ticker-strip{position:relative; margin-top:64px; background:var(--cream); border-top:1.5px solid var(--ink); border-bottom:1.5px solid var(--ink); overflow:hidden} .ticker-head{display:flex; align-items:center; justify-content:space-between; padding:9px 24px; border-bottom:1px solid var(--line); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:13px; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted); background:var(--cream); position:relative; z-index:2; gap:16px} .ticker-head-l{display:inline-flex; align-items:center; gap:9px; color:var(--ink); font-weight:700} .ticker-head-dot{display:inline-block; width:7px; height:7px; background:var(--accent); border-radius:50%; box-shadow:0 0 8px rgba(255, 107, 53, 0.55); animation:dotPulse 1.6s ease-in-out infinite; flex-shrink:0} .ticker-head-eyebrow{color:var(--ink); font-weight:700} .ticker-head-c{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; letter-spacing:0; text-transform:none; color:var(--muted); font-size:13px; white-space:nowrap} .ticker-head-times{margin:0 6px; color:var(--line); font-style:normal; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif} .ticker-head-r{color:var(--accent-text); font-weight:700; letter-spacing:0.22em; display:inline-flex; align-items:center; gap:8px} .ticker-head-r::before{content:""; display:inline-block; width:6px; height:6px; background:var(--accent); border-radius:50%; box-shadow:0 0 6px rgba(255, 107, 53, 0.6)} .ticker-rail{position:relative; overflow:hidden; padding:14px 0 13px; -webkit-mask-image:linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); mask-image:linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent)} .ticker-rail::before,.ticker-rail::after{content:""; position:absolute; top:0; bottom:0; width:80px; z-index:2; pointer-events:none} .ticker-rail::before{left:0; background:linear-gradient(90deg, var(--cream), transparent)} .ticker-rail::after{right:0; background:linear-gradient(-90deg, var(--cream), transparent)} .ticker-rail:hover .ticker-track,.ticker-rail:focus-within .ticker-track{animation-play-state:paused} .ticker-track{display:inline-flex; align-items:baseline; gap:14px; white-space:nowrap; padding-left:14px; will-change:transform; animation:marquee 56s linear infinite} .ticker-eyebrow{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:13px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text); flex-shrink:0; align-self:baseline; padding-top:1px} .ticker-headline{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:19px; line-height:1; color:var(--ink); letter-spacing:-0.005em; font-weight:400; flex-shrink:0} .ticker-dot{display:inline-block; font-size:12.5px; color:var(--line); margin:0 8px; align-self:center; flex-shrink:0} body.dark .ticker-strip{background:var(--cream); border-top-color:var(--ink); border-bottom-color:var(--ink)} body.dark .ticker-head{border-bottom-color:var(--line); color:var(--muted); background:var(--cream)} body.dark .ticker-head-l,body.dark .ticker-head-eyebrow{color:var(--ink)} body.dark .ticker-headline{color:var(--ink)} body.dark .ticker-eyebrow{color:var(--accent-text)} body.dark .ticker-rail::before{background:linear-gradient(90deg, var(--cream), transparent)} body.dark .ticker-rail::after{background:linear-gradient(-90deg, var(--cream), transparent)} @keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}} @keyframes dotPulse{0%, 100%{transform:scale(1); opacity:1}50%{transform:scale(1.3); opacity:0.6}} .magnetic{transition:transform 0.35s linear(0, 0.4 55%, 1.06 78%, 0.98 92%, 1)} .ripple{position:absolute; border-radius:50%; pointer-events:none; background:rgba(255, 255, 255, 0.45); transform:scale(0); animation:rippleOut 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) forwards; z-index:0} @keyframes rippleOut{0%{transform:scale(0); opacity:0.5}100%{transform:scale(2.4); opacity:0}} .cmd-k-fab{position:fixed; bottom:max(24px, env(safe-area-inset-bottom)); right:max(24px, env(safe-area-inset-right)); z-index:40; display:inline-flex; align-items:center; gap:10px; padding:10px 14px 10px 10px; background:rgba(255, 255, 255, 0.85); backdrop-filter:blur(16px) saturate(180%); -webkit-backdrop-filter:blur(16px) saturate(180%); border:1px solid var(--line); border-radius:999px; box-shadow:0 8px 24px rgba(15, 20, 25, 0.10); font-family:inherit; font-size:13px; font-weight:500; color:var(--ink); cursor:pointer; transition:transform 0.2s ease, box-shadow 0.2s ease} .cmd-k-fab:hover{transform:translateY(-2px); box-shadow:0 12px 32px rgba(15, 20, 25, 0.16)} .cmd-k-icon{display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; background:var(--ink); color:var(--cream); border-radius:8px; font-size:13.5px; font-weight:700; letter-spacing:-0.02em} .cmd-k-text{color:var(--muted)} .cmd-palette{position:fixed; inset:0; z-index:150; display:none; align-items:flex-start; justify-content:center; padding-top:12vh; pointer-events:none} .cmd-palette.is-open{display:flex; pointer-events:auto} .cmd-palette-backdrop{position:absolute; inset:0; background:rgba(15, 20, 25, 0.45); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); animation:backdropIn 0.25s ease} @keyframes backdropIn{from{opacity:0} to{opacity:1}} .cmd-palette-card{position:relative; width:min(560px, calc(100% - 32px)); background:rgba(255, 255, 255, 0.98); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid var(--line); border-radius:16px; box-shadow:0 24px 80px rgba(15, 20, 25, 0.30); overflow:hidden; animation:paletteIn 0.25s cubic-bezier(0.2, 0.7, 0.2, 1)} @keyframes paletteIn{from{opacity:0; transform:translateY(-12px) scale(0.98)} to{opacity:1; transform:translateY(0) scale(1)}} .cmd-palette-input{display:flex; align-items:center; gap:12px; padding:16px 18px; border-bottom:1px solid var(--line); color:var(--muted)} .cmd-palette-input input{flex:1; border:0; outline:0; background:transparent; font-family:inherit; font-size:16px; color:var(--ink); min-width:0} .cmd-palette-input input::placeholder{color:#9aa1ab} .cmd-palette-input kbd{font-family:inherit; font-size:13px; font-weight:600; padding:3px 7px; border:1px solid var(--line); border-radius:6px; background:var(--cream-2); color:var(--muted)} .cmd-palette-list{list-style:none; margin:0; padding:8px; max-height:360px; overflow-y:auto} .cmd-palette-item{display:flex; align-items:center; gap:14px; padding:10px 12px; border-radius:10px; cursor:pointer; transition:background 0.12s ease; font-size:14.5px; min-height:44px} .cmd-palette-item.is-active,.cmd-palette-item:hover{background:var(--cream-2)} .cmd-palette-item .icon{width:32px; height:32px; border-radius:8px; background:var(--ink); color:var(--cream); display:flex; align-items:center; justify-content:center; font-size:14px; flex-shrink:0} .cmd-palette-item .icon.accent{background:var(--accent)} .cmd-palette-item .label{flex:1; color:var(--ink); font-weight:500} .cmd-palette-item .hint{font-size:13px; color:var(--muted); text-transform:uppercase; letter-spacing:0.08em; font-weight:600} .cmd-palette-empty{padding:32px; text-align:center; color:var(--muted); font-size:14px} .cmd-palette-foot{display:flex; gap:16px; padding:10px 18px; border-top:1px solid var(--line); background:var(--cream-2); font-size:13px; color:var(--muted)} .cmd-palette-foot kbd{display:inline-block; margin-right:4px; padding:1px 5px; border:1px solid var(--line); border-radius:4px; background:#fff; font-family:inherit; font-size:12px; font-weight:600} @media (max-width:720px){.cmd-k-fab{bottom:16px; right:16px; padding:8px 10px} .cmd-k-text{display:none} .cmd-palette{padding-top:8vh}} @media (max-width:480px){.cmd-k-fab{bottom:max(12px, env(safe-area-inset-bottom)); right:max(12px, env(safe-area-inset-right)); padding:0; width:44px; height:44px; justify-content:center} .cmd-k-fab .cmd-k-icon{width:24px; height:24px; font-size:12px} .share-float{display:none !important}}[data-reveal]{opacity:0; transform:translateY(40px)}[data-reveal].is-revealed{opacity:1; transform:translateY(0); transition:opacity 0.9s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.9s cubic-bezier(0.2, 0.7, 0.2, 1)} .section-label{display:inline-flex; align-items:center; gap:8px; font-size:13px; text-transform:uppercase; letter-spacing:0.14em; color:var(--accent-text); font-weight:800; margin:0 0 18px} .section-label::before{content:""; width:18px; height:1px; background:var(--accent); display:inline-block; transform:scaleX(0); transform-origin:left; transition:transform 0.5s cubic-bezier(0.2, 0.7, 0.2, 1)} .section-label.is-in::before{transform:scaleX(1)} .folio-meta{display:flex; align-items:center; gap:14px; font-size:12px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted); margin:0 0 18px; padding-bottom:10px; border-bottom:1px solid var(--line); opacity:0.85} .folio-meta-dot{color:var(--accent-text)} .folio-meta-sep{opacity:0.4} .who h2, .features h2, .pricing h2{font-size:clamp(28px, 4vw, 40px); letter-spacing:-0.02em; line-height:1.15; margin:0 0 36px; max-width:720px} .who-grid{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:12px} @media (max-width:900px){.who-grid{grid-template-columns:repeat(2, 1fr)}} @media (max-width:540px){.who-grid{grid-template-columns:1fr}} .who-grid li{display:flex; align-items:flex-start; gap:14px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:18px; transition:transform 0.15s ease, border-color 0.15s ease} .who-grid li:hover{transform:translateY(-2px); border-color:var(--ink)} .who-icon{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; flex-shrink:0; border-radius:10px; background:var(--accent-50); color:var(--accent-900)} body.dark .who-icon{background:rgba(255, 107, 53, 0.12); color:var(--accent-text)} .who-icon svg{width:20px; height:20px} .who-grid strong{display:block; font-size:15px} .who-grid p{margin:4px 0 0; font-size:13px; color:var(--muted)} .who-dir{margin-top:40px; border-top:1.5px solid var(--ink)} .who-dir-row{display:grid; grid-template-columns:80px 100px 1fr 32px; align-items:start; gap:28px; padding:28px 4px; border-bottom:1px solid var(--line); position:relative; opacity:0; transform:translateX(-12px); transition:opacity 0.5s ease, transform 0.55s cubic-bezier(0.2, 0.7, 0.3, 1), background 0.3s ease; cursor:default} body.dark .who-dir-row{border-bottom-color:rgba(250, 247, 242, 0.12)} .who.is-in-view .who-dir-row{opacity:1; transform:translateX(0)} .who.is-in-view .who-dir-row{transition-delay:calc(0.05s + var(--d, 0) * 0.09s)} .who-dir-row:hover{background:rgba(255, 107, 53, 0.04)} .who-dir-row:last-child{border-bottom:1.5px solid var(--ink)} @media (max-width:480px){.who-dir-row{grid-template-columns:auto 1fr; gap:12px} .who-dir-mark{display:none}} .who-dir-num{font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--accent-text); padding-top:14px} .who-dir-mark{width:88px; height:88px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:52px; font-weight:400; color:var(--cream); line-height:1; position:relative; transition:transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1)} .who-dir-mark::before{content:""; position:absolute; inset:6px; border:1px solid rgba(250, 247, 242, 0.5); pointer-events:none} .who-dir-row:hover .who-dir-mark{transform:rotate(-6deg) scale(1.04)} .who-dir-mark--1{background:var(--ink)} .who-dir-mark--2{background:var(--accent)} .who-dir-mark--3{background:#1A2128} .who-dir-mark--4{background:#8A3517} .who-dir-mark--5{background:#6B5B3F} .who-dir-mark--6{background:var(--ink)} .who-dir-mark--7{background:#4B3F2F} .who-dir-mark--8{background:#2F4B3F} .who-dir-body{display:flex; flex-direction:column; gap:8px; padding-top:8px} .who-dir-title{margin:0; font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:clamp(24px, 2.6vw, 34px); font-weight:400; letter-spacing:-0.02em; line-height:1; color:var(--ink)} body.dark .who-dir-title{color:var(--cream)} .who-dir-tag{font-family:'Saira', sans-serif; font-size:11px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--muted)} .who-dir-desc{margin:6px 0 0; font-family:'Saira', sans-serif; font-size:15px; line-height:1.55; color:var(--ink-2); max-width:640px} body.dark .who-dir-desc{color:rgba(250, 247, 242, 0.78)} .who-dir-arrow{font-family:'Saira', sans-serif; font-size:22px; color:var(--ink); padding-top:22px; opacity:0; transform:translateX(-8px); transition:opacity 0.3s ease, transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1)} body.dark .who-dir-arrow{color:var(--cream)} .who-dir-row:hover .who-dir-arrow{opacity:1; transform:translateX(0)} @media (max-width:900px){.who-dir-row{grid-template-columns:64px 76px 1fr; gap:18px} .who-dir-mark{width:76px; height:76px; font-size:42px} .who-dir-arrow{display:none}} @media (max-width:540px){.who-dir-row{grid-template-columns:56px 60px 1fr; gap:14px; padding:22px 2px} .who-dir-mark{width:60px; height:60px; font-size:32px} .who-dir-mark::before{inset:4px} .who-dir-num{padding-top:10px; font-size:11px} .who-dir-body{padding-top:4px; gap:6px} .who-dir-title{font-size:22px} .who-dir-desc{font-size:14px}} @media (prefers-reduced-motion:reduce){.who-dir-row, .who-dir-mark, .who-dir-arrow{transition:none !important; animation:none !important; opacity:1 !important; transform:none !important} .who-dir-row:hover .who-dir-mark{transform:rotate(-6deg) scale(1.04)}} .dossier-grid{display:grid; grid-template-columns:1fr 1fr; gap:80px; margin-top:48px; padding-top:32px; border-top:1px solid var(--ink)} .dossier-list{list-style:none; padding:0; margin:0; counter-reset:dossier} .dossier-list-row{display:flex; align-items:baseline; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); font-size:16px; line-height:1.4} .dossier-list-row:last-child{border-bottom:0} .dossier-num{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 30, 'SOFT' 25, 'WONK' 1; font-weight:500; font-size:13px; letter-spacing:0.04em; color:var(--accent-text); min-width:32px; flex-shrink:0} .dossier-text strong{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-weight:700; color:var(--ink); letter-spacing:-0.01em; font-size:16px; margin-right:4px} .dossier-text{color:var(--muted); display:inline} .dossier-mono{display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; margin-right:8px; border-radius:5px; background:var(--ink); color:var(--cream); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 18, 'SOFT' 25, 'WONK' 1; font-weight:500; font-size:13px; vertical-align:-4px} .dossier-mono-1{background:var(--accent)} .dossier-mono-2{background:#1A2128; color:#F5DDB0} .dossier-mono-3{background:var(--ink)} .dossier-mono-4{background:#8A3517} .dossier-mono-5{background:#15191E; color:#A0E4FF} .dossier-mono-6{background:#6B5B3F} body.dark .dossier-mono-1{background:var(--accent)} body.dark .dossier-mono-2{background:var(--cream-2); color:var(--cream)} body.dark .dossier-mono-3{background:var(--cream); color:var(--ink)} body.dark .dossier-mono-4{background:#8A3517} body.dark .dossier-mono-5{background:#A0E4FF; color:var(--ink)} body.dark .dossier-mono-6{background:#6B5B3F} @media (max-width:900px){.dossier-grid{grid-template-columns:1fr; gap:40px}} .dossier-grid-cards{grid-template-columns:1fr; gap:48px} .who-superlist{margin-top:56px; padding-top:36px; border-top:1px solid var(--ink)} .who-list{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:0 80px} @media (max-width:720px){.who-list{grid-template-columns:1fr; gap:0}} .who-row{position:relative; padding:22px 0 22px 28px; border-bottom:1px solid var(--line); cursor:pointer; transition:opacity 0.3s ease, color 0.4s ease; opacity:0.7} .who-row[data-prof="students"]{opacity:1.00} .who-row[data-prof="chefs"]{opacity:0.88} .who-row[data-prof="artists"]{opacity:0.76} .who-row[data-prof="consultants"]{opacity:0.64} .who-row[data-prof="developers"]{opacity:0.52} .who-row[data-prof="working"]{opacity:0.40} .who-list:hover .who-row{opacity:0.35} .who-list .who-row:hover{opacity:1} .who-row:hover{background:transparent} .who-accent{position:absolute; top:50%; left:0; transform:translateY(-50%); width:3px; height:32px; background:var(--who-accent, var(--ink)); border-radius:3px; transition:height 0.35s cubic-bezier(0.2, 0.7, 0.2, 1), background 0.4s ease} .who-row:hover .who-accent{height:72px} .who-title{margin:0 0 6px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-weight:700; font-size:26px; letter-spacing:-0.015em; color:var(--ink); line-height:1.15; transition:color 0.4s ease} body.dark .who-title{color:var(--cream)} .who-desc{margin:0; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:15px; line-height:1.55; color:var(--muted); max-width:540px; transition:color 0.4s ease} .who-row:hover .who-title,.who-row:hover .who-desc{color:var(--who-hover-fg, var(--ink))} body.dark .who-row:hover .who-title,body.dark .who-row:hover .who-desc{color:var(--who-hover-fg, var(--cream))} .who-row[data-prof="students"]{--who-hover-fg:#FF6B35; --who-accent:#FF6B35} .who-row[data-prof="chefs"]{--who-hover-fg:#6B7F3A; --who-accent:#6B7F3A} .who-row[data-prof="artists"]{--who-hover-fg:#6E2B5C; --who-accent:#6E2B5C} .who-row[data-prof="consultants"]{--who-hover-fg:#1F3A5F; --who-accent:#1F3A5F} .who-row[data-prof="developers"]{--who-hover-fg:#2A5741; --who-accent:#2A5741} .who-row[data-prof="working"]{--who-hover-fg:#B85C2E; --who-accent:#B85C2E} .receipt-grid{display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:48px} .receipt{background:var(--cream); padding:36px 32px 32px; display:flex; flex-direction:column; gap:14px; position:relative; border:1px solid var(--line); border-radius:0} .receipt-paper{background:repeating-linear-gradient( 0deg, rgba(15, 20, 25, 0.025) 0, rgba(15, 20, 25, 0.025) 1px, transparent 1px, transparent 3px ), var(--cream-2); opacity:0; transform:translateY(16px); transition:opacity 0.6s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1)} .pricing.is-in-view .receipt-paper{opacity:1; transform:translateY(0)} .pricing.is-in-view .receipt-paper:nth-child(2){transition-delay:0.12s} .receipt-featured{background:repeating-linear-gradient( 0deg, rgba(250, 247, 242, 0.04) 0, rgba(250, 247, 242, 0.04) 1px, transparent 1px, transparent 3px ), var(--ink); color:var(--cream); border-color:var(--ink)} .receipt-featured .receipt-items,.receipt-featured .receipt-bullet{color:var(--cream)} .receipt-featured .receipt-sub{color:rgba(250, 247, 242, 0.7)} .receipt-featured .receipt-num{color:var(--accent-text); border-color:rgba(255, 107, 53, 0.4)} .receipt-featured .receipt-tier{color:var(--accent-text)} .receipt-corner{position:absolute; width:14px; height:14px; border:1px solid var(--muted); pointer-events:none; opacity:0.4} .receipt-corner-tl{top:6px; left:6px; border-right:0; border-bottom:0} .receipt-corner-tr{top:6px; right:6px; border-left:0; border-bottom:0} .receipt-featured .receipt-corner{border-color:rgba(250, 247, 242, 0.3)} .receipt-header{display:grid; grid-template-columns:auto 1fr auto; align-items:baseline; gap:12px; border-bottom:1px dashed currentColor; padding-bottom:14px; opacity:0.92} .receipt-num{font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink); padding:3px 8px; border:1px solid var(--line); border-radius:2px} .receipt-name{margin:0; font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:28px; font-weight:400; letter-spacing:-0.02em; text-transform:none; line-height:1; color:inherit} .receipt-tier{font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; white-space:nowrap} .receipt-tally{display:flex; align-items:baseline; gap:8px; padding:8px 0 4px; position:relative} .receipt-price{font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:clamp(48px, 6vw, 72px); font-weight:400; line-height:0.9; letter-spacing:-0.03em; color:var(--ink)} .receipt-featured .receipt-price{color:var(--cream)} .receipt-unit{font-family:'Saira', sans-serif; font-size:13px; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted)} .receipt-featured .receipt-unit{color:rgba(250, 247, 242, 0.6)} .receipt-was-row{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:-2px; margin-bottom:6px} .receipt-was{font-family:'Saira', sans-serif; font-size:17px; font-weight:600; color:var(--muted); text-decoration:line-through; text-decoration-thickness:2px; letter-spacing:0.01em} .receipt-featured .receipt-was{color:rgba(250, 247, 242, 0.55)} .receipt-badge{display:inline-block; background:var(--accent); color:var(--cream); font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; padding:4px 10px; border-radius:999px; line-height:1.2; white-space:nowrap} .receipt-cta[aria-disabled="true"]{opacity:0.5; cursor:not-allowed; pointer-events:none; filter:grayscale(0.6)} .receipt-cta[aria-disabled="true"]:hover{transform:none} .receipt-cta-note{font-family:'Saira', sans-serif; font-size:10px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; margin-left:6px; opacity:0.85} .receipt-fineprint{margin:10px 0 0; font-family:'Saira', sans-serif; font-size:11px; font-style:italic; line-height:1.5; color:var(--muted)} .receipt-sub{margin:0; font-family:'Saira', sans-serif; font-size:14px; font-weight:500; line-height:1.5; color:var(--muted); max-width:36ch} .receipt-save-stamp{display:inline-flex; align-items:center; justify-content:center; align-self:flex-start; margin:6px 0 -2px; padding:6px 14px; font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:14px; letter-spacing:0.04em; color:var(--cream); background:var(--accent); border:2px solid var(--cream); border-radius:2px; transform:rotate(-4deg) scale(0.4); opacity:0; transition:transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.4s ease; pointer-events:none; position:relative} .receipt-save-stamp.is-on{transform:rotate(-4deg) scale(1); opacity:1; animation:receiptStampPulse 2.4s ease-in-out 0.6s infinite} @keyframes receiptStampPulse{0%, 100%{transform:rotate(-4deg) scale(1)}50%{transform:rotate(-4deg) scale(1.04)}} .receipt-items{list-style:none; padding:0; margin:8px 0 0; display:flex; flex-direction:column; gap:8px; border-top:1px dashed currentColor; padding-top:16px} .receipt-items li{display:flex; align-items:flex-start; gap:10px; font-family:'Saira', sans-serif; font-size:14px; line-height:1.4; color:currentColor; opacity:0; transform:translateY(6px); transition:opacity 0.4s ease, transform 0.4s cubic-bezier(0.2, 0.7, 0.2, 1)} .pricing.is-in-view .receipt-items li{opacity:1; transform:translateY(0)} .pricing.is-in-view .receipt-items li:nth-child(1){transition-delay:0.32s} .pricing.is-in-view .receipt-items li:nth-child(2){transition-delay:0.40s} .pricing.is-in-view .receipt-items li:nth-child(3){transition-delay:0.48s} .pricing.is-in-view .receipt-items li:nth-child(4){transition-delay:0.56s} .pricing.is-in-view .receipt-items li:nth-child(5){transition-delay:0.64s} .receipt-bullet{color:var(--accent-text); font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:18px; line-height:1; flex-shrink:0} .receipt-cta{margin-top:auto; align-self:flex-start; padding:12px 22px} .receipt-perf{position:absolute; left:0; right:0; bottom:-1px; height:8px; background-image:radial-gradient(circle at 4px 4px, var(--cream) 4px, transparent 4px); background-size:12px 8px; background-position:0 100%; background-repeat:repeat-x; pointer-events:none} .receipt-paper .receipt-perf{background-image:radial-gradient(circle at 4px 4px, var(--cream-2) 4px, transparent 4px)} .receipt-featured .receipt-perf{background-image:radial-gradient(circle at 4px 4px, var(--ink) 4px, transparent 4px)} .receipt-seal{position:absolute; top:18px; right:18px; width:88px; height:88px; border-radius:50%; background:var(--accent); color:var(--cream); display:flex; align-items:center; justify-content:center; text-align:center; transform:rotate(-14deg) scale(0.4); opacity:0; z-index:2; box-shadow:0 2px 0 rgba(0, 0, 0, 0.15); transition:transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.4s ease} .pricing.is-in-view .receipt-seal{transform:rotate(-14deg) scale(1); opacity:1; transition-delay:0.7s} .receipt-seal-ring{position:absolute; inset:-8px; border:2px dashed rgba(250, 247, 242, 0.55); border-radius:50%; pointer-events:none} .receipt-seal-text{font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:11px; font-weight:400; letter-spacing:0.04em; line-height:1.1; padding:0 6px} .is-hidden{display:none !important} @media (max-width:720px){.receipt-grid{grid-template-columns:1fr; gap:20px} .receipt{padding:28px 22px 24px} .receipt-seal{width:72px; height:72px; top:12px; right:12px} .receipt-seal-text{font-size:clamp(8.5px, 2.2vw, 11px)} .receipt-price{font-size:48px} .receipt-featured .receipt-save-stamp{position:absolute; top:auto; right:14px; bottom:12px; transform:rotate(-4deg) scale(1); z-index:2} .receipt-featured .receipt-save-stamp.is-on{transform:rotate(-4deg) scale(1); animation:none} .receipt-featured{padding-bottom:56px}} @media (max-width:480px){.receipt{padding:24px 18px 22px} .receipt-seal{width:60px; height:60px; top:10px; right:10px} .receipt-seal-text{font-size:10px; letter-spacing:0.18em} .receipt-price{font-size:40px} .receipt-featured{padding-bottom:52px} .receipt-featured .receipt-save-stamp{font-size:12px; padding:4px 10px}} @media (prefers-reduced-motion:reduce){.receipt-paper, .receipt-items li, .receipt-save-stamp, .receipt-seal{animation:none !important; transition:none !important; opacity:1 !important; transform:none !important} .receipt-save-stamp.is-on{transform:rotate(-4deg) scale(1) !important} .receipt-seal{transform:rotate(-14deg) scale(1) !important}} .receipt-price{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 50, 'SOFT' 15, 'WONK' 0; font-weight:500; font-size:56px; margin:16px 0 0; letter-spacing:-0.02em; line-height:0.95; color:inherit} .receipt-price .receipt-unit{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:13px; font-weight:600; letter-spacing:0.04em; margin-left:4px; vertical-align:super; opacity:0.7} .receipt-sub{margin:0; font-size:13px; opacity:0.7; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif} .receipt-items{list-style:none; padding:0; margin:16px 0 24px; display:flex; flex-direction:column; gap:8px; font-size:14px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif} .receipt-items li{padding:8px 0; border-bottom:1px dashed currentColor; opacity:0.85; display:flex; align-items:center; gap:8px} .receipt-items li::before{content:"—"; opacity:0.5} .receipt-items li:last-child{border-bottom:0} .receipt .btn{align-self:flex-start; margin-top:auto} body.dark .receipt-grid{background:#1A2128; border-color:var(--cream)} body.dark .receipt{background:transparent; color:var(--ink)} body.dark .receipt-featured{background:var(--accent); color:#fff} body.dark .receipt-featured .receipt-tier{color:#fff} @media (max-width:900px){.receipt-grid{grid-template-columns:1fr}} .stats-band{display:grid; grid-template-columns:repeat(4, 1fr); gap:0; margin-top:48px; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink)} .stats-band .stat{background:transparent; border:0; border-right:1px solid var(--ink); border-radius:0; padding:32px 24px; display:flex; flex-direction:column; gap:6px; transition:background 0.25s ease} .stats-band .stat:last-child{border-right:0} .stats-band .stat:hover{background:var(--accent-50)} body.dark .stats-band .stat:hover{background:rgba(255, 107, 53, 0.10)} .stats-band .stat strong{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 80, 'SOFT' 20, 'WONK' 1; font-weight:500; font-size:clamp(40px, 5vw, 56px); letter-spacing:-0.01em; line-height:1; color:var(--ink); display:inline-flex; align-items:baseline; gap:4px} body.dark .stats-band .stat strong{color:var(--ink)} .stats-band .stat-label{font-size:13.5px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted)} .stats-band .stat-note{font-size:13.5px; color:var(--muted); margin-top:0; line-height:1.5} @media (max-width:900px){.stats-band{grid-template-columns:1fr 1fr} .stats-band .stat:nth-child(2n){border-right:0} .stats-band .stat:nth-child(-n+2){border-bottom:1px solid var(--ink)}} @media (max-width:540px){.stats-band{grid-template-columns:1fr} .stats-band .stat{border-right:0; border-bottom:1px solid var(--ink)} .stats-band .stat:last-child{border-bottom:0}} .orbits{position:relative; margin-top:64px; padding:80px 0 0; display:grid; grid-template-columns:repeat(3, 1fr); gap:48px} .orbit-line{position:absolute; top:16px; left:16.6%; right:16.6%; height:1px; background:rgba(250, 247, 242, 0.18); z-index:0} .orbit-line-fill{position:absolute; inset:0; background:var(--accent); transform-origin:left; transform:scaleX(0); transition:transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1)} .orbits.is-on .orbit-line-fill{animation:orbitFill 1.2s cubic-bezier(0.2, 0.7, 0.2, 1) forwards} @keyframes orbitFill{0%{transform:scaleX(0)}100%{transform:scaleX(1)}} .orbit-node{position:relative; z-index:1; display:flex; flex-direction:column; gap:8px; text-align:left} .orbit-dot{display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; border:1px solid rgba(250, 247, 242, 0.25); background:#1A2128; color:var(--accent-text); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 24, 'SOFT' 25, 'WONK' 1; font-weight:500; font-size:13px; margin-bottom:18px; position:relative; z-index:2} .orbit-node-1 .orbit-dot{background:var(--accent); color:#fff; border-color:var(--accent-text)} .orbit-node h3{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-weight:400; font-size:28px; color:var(--cream); margin:0; letter-spacing:-0.01em} .orbit-node p{color:rgba(250, 247, 242, 0.65); font-size:14px; margin:0; line-height:1.5; max-width:280px} @media (max-width:900px){.orbits{grid-template-columns:1fr; gap:32px; padding:0} .orbit-line{display:none} .orbit-dot{margin-bottom:8px} .orbit-node h3{font-size:24px}} .stamp{position:relative; padding:96px 0 110px; background:var(--ink); color:var(--cream); overflow:hidden; isolation:isolate; border-radius:0; margin:0; max-width:none; text-align:left} body.dark .stamp{background:#15191E; color:var(--ink)} .stamp::before,.stamp::after{content:""; position:absolute; left:24px; right:24px; height:1px; border-top:1px dashed rgba(250, 247, 242, 0.18); pointer-events:none; z-index:0} .stamp::before{top:24px} .stamp::after{bottom:24px} body.dark .stamp::before,body.dark .stamp::after{border-top-color:rgba(250, 247, 242, 0.10)} .stamp .container{position:relative; z-index:1} .stamp .folio-meta{color:rgba(250, 247, 242, 0.55); margin-bottom:36px; text-align:center} .stamp .folio-meta-dot{color:var(--accent-text)} .ticket{display:grid; grid-template-columns:200px 1fr; background:#FAF7F2; color:var(--ink); max-width:980px; margin:0 auto; position:relative; isolation:isolate; box-shadow:0 30px 60px -30px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(15, 20, 25, 0.06)} body.dark .ticket{background:#1B1F25; color:var(--cream); box-shadow:0 30px 60px -30px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(250, 247, 242, 0.06)} .ticket::before,.ticket::after{content:""; position:absolute; top:0; bottom:0; width:14px; background-image:radial-gradient(circle at center, var(--ink) 6px, transparent 6.5px); background-size:14px 22px; background-repeat:repeat-y; z-index:2; pointer-events:none} .ticket::before{left:200px} .ticket::after{right:0} body.dark .ticket::before,body.dark .ticket::after{background-image:radial-gradient(circle at center, #FAF7F2 6px, transparent 6.5px)} .ticket-stub{background:var(--accent); color:var(--ink-2); padding:28px 18px 22px; display:flex; flex-direction:column; align-items:center; text-align:center; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; position:relative; overflow:hidden} .ticket-stub-label{font-size:12.5px; letter-spacing:0.3em; font-weight:700; text-transform:uppercase; color:var(--ink-2)} .ticket-stub-num{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-weight:500; font-size:96px; line-height:1; margin:12px 0 0; color:var(--ink-2)} .ticket-stub-sep{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:32px; line-height:1; color:var(--ink-2); margin:4px 0 6px} .ticket-stub-cap{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-weight:500; font-size:40px; line-height:1; margin:0 0 18px; color:var(--ink-2)} .ticket-stub-foot{font-size:12.5px; letter-spacing:0.22em; font-weight:700; text-transform:uppercase; color:var(--ink-2); line-height:1.4} .ticket-stub-seal{position:absolute; left:50%; bottom:18px; width:110px; height:110px; transform:translateX(-50%) scale(2.2) rotate(-22deg); opacity:0; pointer-events:none; z-index:1; color:rgba(26, 33, 40, 0.5)} .cta.stamp.is-in-view .ticket-stub-seal{animation:sealStampIn 0.65s cubic-bezier(0.2, 0.9, 0.3, 1.05) 0.55s forwards} .ticket-stub-seal-ring{position:absolute; inset:0; border:1.5px dashed currentColor; border-radius:50%; opacity:0.7} .ticket-stub-seal-text{position:absolute; inset:0; animation:sealTextSpin 28s linear infinite} .ticket-stub-seal-text svg{width:100%; height:100%} .ticket-stub-seal-mark{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:22px; color:rgba(255, 255, 255, 0.9); text-shadow:0 0 0 currentColor} .ticket-body{padding:36px 56px 36px 48px; display:flex; flex-direction:column; position:relative} .ticket-eyebrow{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:12px; font-weight:700; letter-spacing:0.26em; text-transform:uppercase; color:var(--accent-text); margin-bottom:12px; display:inline-flex; align-items:center; gap:10px} .ticket-eyebrow-dot{width:6px; height:6px; border-radius:50%; background:var(--accent); display:inline-block; animation:sealPulse 2.2s ease-in-out infinite} .stamp-headline{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 80, 'SOFT' 30, 'WONK' 1; font-weight:500; font-size:clamp(28px, 4vw, 44px); letter-spacing:-0.02em; line-height:1.08; margin:0 0 10px; color:var(--ink); text-align:left} body.dark .cta .stamp-headline,body.dark .stamp-headline{color:var(--ink)} body.dark .ticket .stamp-headline{color:var(--cream)} .stamp-headline em{font-style:italic; color:var(--accent-text)} .stamp-sub{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:14px; color:var(--muted); margin:0 0 24px; max-width:520px} body.dark .stamp-sub{color:rgba(250, 247, 242, 0.65)} .ticket-perks{list-style:none; padding:18px 0; margin:0 0 24px; border-top:1px dashed rgba(15, 20, 25, 0.18); border-bottom:1px dashed rgba(15, 20, 25, 0.18); display:grid; gap:16px} body.dark .ticket-perks{border-top-color:rgba(250, 247, 242, 0.18); border-bottom-color:rgba(250, 247, 242, 0.18)} .ticket-perk{display:grid; grid-template-columns:44px 1fr; gap:14px; align-items:start; opacity:0; transform:translateX(-14px); transition:opacity 0.5s ease, transform 0.5s cubic-bezier(0.2, 0.7, 0.3, 1); transition-delay:calc(0.25s + var(--i, 1) * 0.12s)} .cta.stamp.is-in-view .ticket-perk{opacity:1; transform:translateX(0)} .ticket-perk-num{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-weight:500; font-size:28px; line-height:1; color:var(--accent-text); position:relative} .ticket-perk-num::after{content:""; position:absolute; top:50%; left:calc(100% + 4px); width:6px; height:1px; background:var(--accent); opacity:0.5} .ticket-perk-body{display:flex; flex-direction:column; gap:4px} .ticket-perk-body strong{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-weight:700; font-size:15px; letter-spacing:-0.005em; color:var(--ink); line-height:1.3} body.dark .ticket-perk-body strong{color:var(--cream)} .ticket-perk-body span{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:13px; line-height:1.55; color:var(--muted)} body.dark .ticket-perk-body span{color:rgba(250, 247, 242, 0.65)} .ticket-cta-row{display:flex; align-items:center; gap:18px; flex-wrap:wrap} .ticket-cta-foot{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:13px; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted)} .ticket-cta-stamp{position:relative; transform:scale(0.85) rotate(-3deg); opacity:0; transition:transform 0.55s cubic-bezier(0.2, 0.9, 0.3, 1.25), opacity 0.4s ease; transition-delay:0.85s} .cta.stamp.is-in-view .ticket-cta-stamp{transform:scale(1) rotate(0); opacity:1; animation:ctaStampPulse 0.6s ease-out 1.45s 1} .ticket-cta-stamp-inner{display:inline-block} .ticket-cta-stamp:hover{animation:ctaStampPulse 0.55s ease-out} .ticket-corner-mark{position:absolute; width:16px; height:16px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:12px; color:rgba(15, 20, 25, 0.35); display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity 0.5s ease} body.dark .ticket-corner-mark{color:rgba(250, 247, 242, 0.35)} .cta.stamp.is-in-view .ticket-corner-mark{opacity:1} .ticket-corner-mark--tl{top:14px; left:14px} .ticket-corner-mark--br{bottom:14px; right:14px; transform:rotate(45deg)} .ticket-rotate-mark{position:absolute; top:50%; right:8px; width:80px; height:80px; transform:translateY(-50%) rotate(-12deg) scale(0.4); opacity:0; pointer-events:none; color:var(--accent-text); z-index:3; transition:opacity 0.5s ease, transform 0.55s cubic-bezier(0.2, 0.9, 0.3, 1.15); transition-delay:0.7s} .cta.stamp.is-in-view .ticket-rotate-mark{opacity:1; transform:translateY(-50%) rotate(-12deg) scale(1); animation:ctaRotateSpin 32s linear infinite 1.2s} .ticket-rotate-mark svg{width:100%; height:100%} @keyframes sealStampIn{0%{opacity:0; transform:translateX(-50%) scale(2.2) rotate(-22deg)}35%{opacity:0.95; transform:translateX(-50%) scale(0.95) rotate(-6deg)}55%{transform:translateX(-50%) scale(1.08) rotate(-4deg)}75%{transform:translateX(-50%) scale(0.98) rotate(-3deg)}100%{opacity:0.85; transform:translateX(-50%) scale(1) rotate(-3deg)}} @keyframes sealTextSpin{from{transform:rotate(0deg)} to{transform:rotate(360deg)}} @keyframes sealPulse{0%, 100%{opacity:1; transform:scale(1)}50%{opacity:0.45; transform:scale(0.8)}} @keyframes ctaStampPulse{0%{transform:scale(1) rotate(0)}35%{transform:scale(1.08) rotate(-1deg)}60%{transform:scale(0.97) rotate(1deg)}100%{transform:scale(1) rotate(0)}} @keyframes ctaRotateSpin{from{transform:translateY(-50%) rotate(-12deg)} to{transform:translateY(-50%) rotate(348deg)}} @media (max-width:720px){.ticket{grid-template-columns:1fr} .ticket::before{display:none} .ticket::after{display:none} .ticket-stub{flex-direction:row; align-items:center; gap:10px; padding:14px 20px; justify-content:center; overflow:visible} .ticket-stub-num{font-size:36px; margin:0} .ticket-stub-cap{font-size:20px; margin:0} .ticket-stub-sep{display:none} .ticket-stub-foot{display:none} .ticket-stub-seal{width:56px; height:56px; bottom:-10px; right:-10px; left:auto; transform:translateX(0) scale(1) rotate(-12deg); opacity:0.85} .cta.stamp.is-in-view .ticket-stub-seal{animation:none; opacity:0.85} .ticket-stub-seal-mark{font-size:12px} .ticket-body{padding:28px 22px 24px} .ticket-cta-row{flex-direction:column; align-items:stretch} .ticket-cta-foot{text-align:center} .ticket-corner-mark{display:none} .ticket-rotate-mark{display:none}} @media (prefers-reduced-motion:reduce){.cta.stamp.is-in-view .ticket-stub-seal, .ticket-perk, .ticket-cta-stamp, .ticket-corner-mark, .ticket-rotate-mark, .ticket-stub-seal-text{transition:none !important; animation:none !important; transform:none !important; opacity:1 !important} .ticket-eyebrow-dot{animation:none}} .colophon{position:relative; padding:80px 0 48px; border-top:1px solid var(--ink); font-size:13.5px; color:var(--muted)} .built-with{padding:18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--cream-2); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:clamp(12px, 2.8vw, 13px); font-weight:700; letter-spacing:clamp(0.06em, 1.4vw, 0.14em); text-transform:uppercase; color:var(--muted); text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} body.dark .built-with{background:rgba(250, 247, 242, 0.04); border-color:rgba(250, 247, 242, 0.10)} .built-with strong{color:var(--ink); font-weight:800} body.dark .built-with strong{color:var(--cream)} body.dark .colophon{border-color:var(--cream)} .colophon::before{content:""; position:absolute; top:-1px; left:50%; width:80px; height:1px; margin-left:-40px; background:var(--accent)} .colophon .container{display:grid; grid-template-columns:auto 1fr auto; gap:32px; align-items:center} .colophon-mark{font-family:'Stalinist One', 'JetBrains Mono', ui-monospace, monospace; font-style:normal; font-weight:400; font-size:clamp(48px, 7vw, 88px); letter-spacing:-0.02em; color:var(--ink); line-height:0.9} .colophon-mark::after{content:"·"; color:var(--accent-text); margin-left:8px; font-style:normal; font-weight:600} .colophon-center{display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; border-left:1px solid var(--line); border-right:1px solid var(--line); padding:0 24px} .colophon-meta{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:14px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted)} .colophon-tag{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 30, 'SOFT' 20, 'WONK' 0; font-weight:500; font-style:italic; font-size:clamp(16px, 1.5vw, 20px); color:var(--ink)} .prose{max-width:65ch; margin:0 auto; font-size:16px; line-height:1.75} .prose a{color:var(--accent-text); text-decoration:underline} .colophon-anti{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:12.5px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent-text); padding-top:8px; border-top:1px solid var(--line); margin-top:4px; max-width:32ch; text-align:center; line-height:1.5} body.dark .colophon-anti{border-color:rgba(250, 247, 242, 0.15)} .colophon-printer-mark{width:64px; height:64px; color:var(--accent-text); margin-bottom:8px} body.dark .colophon-printer-mark{color:var(--accent-text)} .colophon-printed{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 14, 'SOFT' 20, 'WONK' 0; font-weight:400; font-style:italic; font-size:13.5px; color:var(--muted); letter-spacing:0.01em; line-height:1.5; max-width:36ch; text-align:center} .colophon-spacer{display:flex; flex-direction:column; align-items:flex-end; gap:6px; text-align:right} .colophon-spacer .colophon-year{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-variation-settings:'opsz' 60, 'SOFT' 25, 'WONK' 1; font-weight:500; font-size:clamp(24px, 3vw, 40px); letter-spacing:-0.02em; color:var(--muted); line-height:1} .colophon-spacer .colophon-meta{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:13px; letter-spacing:0.04em; color:var(--muted)} @media (max-width:720px){.colophon .container{grid-template-columns:1fr; text-align:center; gap:24px} .colophon-center{border:0; padding:0} .colophon-spacer{align-items:center; text-align:center} .colophon::before{width:40px; margin-left:-20px}} .horizontal-wrap{overflow:hidden; padding:32px max(32px, calc((100vw - var(--container)) / 2)) 32px max(32px, calc((100vw - var(--container)) / 2)); margin-top:32px} .horizontal-strip{display:flex; gap:32px; width:max-content; animation:horizontalScroll 48s linear infinite; will-change:transform} .horizontal-wrap:hover .horizontal-strip,.horizontal-wrap:focus-within .horizontal-strip{animation-play-state:paused} @media (hover:none){.horizontal-wrap{overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain; scrollbar-width:none} .horizontal-wrap::-webkit-scrollbar{display:none} .horizontal-strip{animation:none; padding-right:32px} .horizontal-set > .h-card, .horizontal-set > *{scroll-snap-align:start}} .horizontal-set{display:flex; gap:32px; flex-shrink:0} @keyframes horizontalScroll{from{transform:translateX(0)} to{transform:translateX(-50%)}} @media (prefers-reduced-motion:reduce){.horizontal-strip{animation:none !important; transform:none !important}} @media (max-width:720px){.horizontal-strip{animation-duration:64s; gap:24px} .h-card{flex:0 0 calc(100vw - 80px)}} @media (max-width:480px){.horizontal-strip{gap:16px} .h-card{flex:0 0 calc(100vw - 56px); padding:16px 0}} .h-card{flex:0 0 340px; border:0; border-top:1px solid var(--ink); background:transparent; padding:20px 0; border-radius:0; box-shadow:none; transition:border-color 0.25s ease} body.dark .h-card{border-top-color:var(--ink)} .h-card:hover{transform:none} .h-card .h-avatar{width:32px; height:32px; border-radius:50%; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-weight:700; font-size:13px; display:flex; align-items:center; justify-content:center; margin:0 0 12px; background:var(--cream-2); color:var(--ink)} body.dark .h-card .h-avatar{background:var(--ink-2); color:var(--ink)} .h-card .h-role{font-size:13px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); display:block; margin-bottom:8px} .h-card h3{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:17px; line-height:1.3; margin:0 0 8px; font-weight:700} .h-card p{font-size:14px; color:var(--muted); margin:0; line-height:1.5} .h-card .h-foot{margin-top:12px; display:flex; gap:6px} .h-card .badge{font-size:13px; padding:4px 8px; background:transparent; color:var(--ink); border:1px solid var(--line)} body.dark .h-card .badge{color:var(--ink); border-color:var(--line)} .h-card .badge.muted{background:transparent; border:0; padding:0; color:var(--muted)} .feature-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:14px} @media (max-width:900px){.feature-grid{grid-template-columns:repeat(2, 1fr)}} @media (max-width:540px){.feature-grid{grid-template-columns:1fr}} .feature{background:var(--cream-2); border-radius:14px; padding:26px; border:1px solid transparent; transition:border-color 0.15s ease, background 0.15s ease} .feature:hover{border-color:var(--ink); background:#fff} .feature-icon{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; margin-bottom:14px; border-radius:10px; background:var(--accent-50); color:var(--accent-900)} body.dark .feature-icon{background:rgba(255, 107, 53, 0.12); color:var(--accent-text)} .feature-icon svg{width:20px; height:20px} .feature h3{font-size:18px; margin:0 0 8px; letter-spacing:-0.01em} .feature p{margin:0; font-size:14.5px; color:var(--muted); line-height:1.55} .pricing-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; max-width:820px} @media (max-width:720px){.pricing-grid{grid-template-columns:1fr}} .plan{background:#fff; border:1px solid var(--line); border-radius:16px; padding:32px; position:relative} .plan-featured{background:var(--ink); color:var(--cream); border-color:var(--ink)} .plan-tag{position:absolute; top:-10px; right:24px; background:var(--accent); color:#fff; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; padding:4px 10px; border-radius:999px} .plan h3{margin:0 0 12px; font-size:18px} .plan .price{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-optical-sizing:auto; font-variation-settings:'SOFT' 15, 'WONK' 0; font-size:36px; font-weight:500; letter-spacing:-0.01em; margin:0} .plan .price span{font-size:14px; font-weight:500; color:var(--muted); margin-left:4px} .plan-featured .price span{color:rgba(250, 247, 242, 0.6)} .plan .price-sub{margin:4px 0 18px; font-size:14px; color:var(--muted)} .plan-featured .price-sub{color:rgba(250, 247, 242, 0.65)} .plan ul{list-style:none; padding:0; margin:0 0 24px; font-size:14.5px} .plan li{padding:7px 0; border-bottom:1px dashed rgba(15, 20, 25, 0.08)} .plan-featured li{border-bottom-color:rgba(250, 247, 242, 0.12)} .plan li:last-child{border-bottom:0} .plan .btn{width:100%} .plan-featured .btn-primary{background:var(--accent)} .plan-featured .btn-primary:hover{background:var(--accent-2)} .plan-featured .btn-ghost{color:var(--cream); border-color:var(--cream)} .plan-featured .btn-ghost:hover{background:var(--cream); color:var(--ink)} .cta{text-align:center; background:var(--ink); color:var(--cream); border-radius:24px; margin:0 24px 32px; max-width:calc(var(--container) - 48px)} .cta.stamp{border-radius:0; margin:0; max-width:none} .cta h2{font-size:clamp(28px, 4vw, 40px); letter-spacing:-0.02em; margin:0 0 12px} .cta p{color:rgba(250, 247, 242, 0.7); margin:0 0 28px} .footer{padding:24px 0 48px; font-size:13px; color:var(--muted)} .footer .container{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap} @media (max-width:900px){body::before, body::after{display:none}} @media (max-width:720px){body{font-size:16px; line-height:1.65} .container{padding:0 16px} .nav{padding:12px 16px} .brand{font-size:16px} .brand-mark{height:20px} .btn{padding:11px 16px; font-size:14px; border-radius:10px} .btn-sm{padding:9px 14px; font-size:13px} .btn-lg{padding:14px 22px; font-size:16px} .hero{padding:84px 0 16px} .hero > .container{padding:0 16px} .hero-inner{padding:0; max-width:100%} .eyebrow{font-size:13.5px; padding:5px 10px; gap:6px; margin-bottom:12px; letter-spacing:0.01em} .eyebrow .dot{width:6px; height:6px} .ht-row-1{font-size:clamp(32px, 9.5vw, 48px); line-height:1.05; letter-spacing:-0.03em} .ht-row-2{font-size:clamp(32px, 9.5vw, 48px); line-height:1.05; letter-spacing:-0.03em; gap:0.15em; flex-wrap:wrap; justify-content:center} .ht-orange{font-size:1em; text-shadow:0 0 30px rgba(255, 107, 53, 0.3)} .hero-title{gap:2px; margin-bottom:14px; max-width:100%} .hero-sub{font-size:15px; line-height:1.5; margin-bottom:18px; padding:0; max-width:100%} .signup-form{max-width:100%; width:100%} .signup-row{display:flex; flex-direction:column; padding:8px; gap:6px; border-radius:14px; width:100%} .signup-row input, .signup-row select{font-size:16px; padding:14px 14px; background:var(--cream-2); width:100%; border-radius:10px} .signup-row .btn-primary{width:100%; padding:15px 18px; font-size:15.5px} .form-msg{font-size:13.5px; margin-top:12px} .hero-meta{font-size:13.5px; margin-top:14px; gap:6px; padding:0; line-height:1.6} .showcase{padding:20px 0 16px} .showcase > .container{padding:0 16px} .showcase-eyebrow{font-size:12px; padding:5px 10px; letter-spacing:0.08em; margin-bottom:12px} .showcase-card{border-radius:16px; max-width:100%} .showcase-bar{padding:10px 12px; gap:5px} .showcase-bar .dot-r, .showcase-bar .dot-y, .showcase-bar .dot-g{width:8px; height:8px} .showcase-url{font-size:12.5px; margin-left:8px; overflow:hidden; text-overflow:ellipsis} .showcase-body{padding:16px} .showcase-hero{gap:12px; padding-bottom:14px} .showcase-avatar{width:40px; height:40px} .showcase-hero h3{font-size:15px} .showcase-hero p{font-size:13.5px} .showcase-grid{gap:8px; padding:14px 0} .showcase-tile{padding:12px; min-height:auto} .showcase-tile strong{font-size:13px; line-height:1.3} .tile-label{font-size:12.5px} .badge{font-size:13px; padding:5px 9px} .ticker-strip{margin-top:32px} .ticker-head{padding:8px 16px; font-size:12px; gap:12px} .ticker-head-c{font-size:13.5px} .ticker-head-times{margin:0 4px} .ticker-rail{padding:10px 0 9px} .ticker-track{gap:11px; padding-left:11px; animation-duration:72s} .ticker-headline{font-size:15px} .ticker-eyebrow{font-size:clamp(11px, 2.8vw, 13px); letter-spacing:0.16em} .ticker-dot{font-size:11.5px; margin:0 5px} .who, .features, .pricing, .cta{padding:48px 0} .section-label{font-size:13px; margin-bottom:12px} .who h2, .features h2, .pricing h2{font-size:clamp(22px, 5.5vw, 28px); margin-bottom:24px; line-height:1.2} .who-grid li{padding:16px; gap:12px} .who-icon{width:34px; height:34px} .who-icon svg{width:18px; height:18px} .who-grid strong{font-size:14.5px} .who-grid p{font-size:12.5px} .feature{padding:20px} .feature h3{font-size:16.5px} .feature p{font-size:13.5px} .plan{padding:24px 20px} .plan .price{font-size:30px} .plan .price span{font-size:13px} .plan .price-sub{font-size:13px; margin-bottom:14px} .plan ul{font-size:13.5px} .plan li{padding:6px 0} .plan-tag{font-size:12px; padding:3px 9px; right:16px; top:-9px} .cta{border-radius:16px; margin:0 16px 20px; padding:36px 20px} .cta h2{font-size:clamp(20px, 5.5vw, 26px); margin-bottom:10px; line-height:1.2} .cta p{font-size:13.5px; margin-bottom:20px} .footer{padding:18px 0 32px} .footer .container{justify-content:center; text-align:center; gap:6px; font-size:13.5px} .scroll-progress{height:2px} .nav-wrap{padding:0 12px} .nav{padding:6px 8px 6px 14px; margin-top:10px; max-width:100%} .nav-links{position:fixed; top:70px; left:16px; right:16px; flex-direction:column; align-items:stretch; gap:4px; padding:14px; background:rgba(255, 255, 255, 0.95); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid var(--line); border-radius:18px; box-shadow:0 12px 40px rgba(15, 20, 25, 0.18); opacity:0; pointer-events:none; transform:translateY(-8px); transition:opacity 0.25s ease, transform 0.25s ease} .nav-links.is-open{opacity:1; pointer-events:auto; transform:translateY(0)} .nav-links a{padding:14px 16px; font-size:16px; border-radius:12px} .nav-links a:not(.nav-cta){display:block} .nav-cta{margin-top:6px; justify-content:center; padding:14px 18px !important; font-size:15px} .nav-burger{display:flex}} @media (max-width:520px){.signup-row{flex-direction:column; align-items:stretch; gap:6px} .signup-row > input[type="email"], .signup-row > select, .signup-row > button{width:100%; flex:1 1 auto} .signup-row > input[type="email"], .signup-row > select{font-size:16px} .signup-row > button{padding:14px 18px}} @media (max-width:420px){.ht-row-1, .ht-row-2{font-size:clamp(28px, 8.5vw, 38px)} .hero-sub{font-size:14px} .showcase-body{padding:14px} .showcase-hero h3{font-size:14px} .showcase-tile strong{font-size:12.5px} .ticker-headline{font-size:13.5px} .ticker-eyebrow{font-size:11.5px; letter-spacing:0.16em} .ticker-head-c{display:none} .ticker-head{padding:7px 14px} .ticker-strip{margin-top:24px} .launch-grid{gap:0} .launch-cell{min-width:46px; padding:4px 2px} .launch-sep{padding-bottom:12px} .hero-launch{padding:14px 10px}} .hero-cta{position:relative; min-height:220px; margin-top:28px} .hero-cta-pre{max-width:520px; margin:0 auto; padding:28px 24px; border:1px dashed var(--line); border-radius:16px; background:rgba(255, 255, 255, 0.55); text-align:center; transition:opacity 0.4s ease, transform 0.4s ease} body.dark .hero-cta-pre{background:rgba(21, 25, 30, 0.55)} .hero-cta-pre.is-out{opacity:0; transform:translateY(-12px); pointer-events:none; position:absolute; inset:0} .hero-cta-pre-text{display:inline-flex; align-items:center; gap:10px; font-size:14px; font-weight:600; color:var(--ink); margin:0} .hero-cta-dot{width:8px; height:8px; background:var(--accent); border-radius:50%; box-shadow:0 0 0 4px rgba(255, 107, 53, 0.18), 0 0 10px rgba(255, 107, 53, 0.5); animation:pulse 1.6s ease-in-out infinite} .hero-cta-live{animation:ctaIn 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) both} @keyframes ctaIn{from{opacity:0; transform:translateY(14px) scale(0.98)} to{opacity:1; transform:translateY(0) scale(1)}} .confetti{position:fixed; inset:0; pointer-events:none; z-index:250; overflow:hidden} .confetti-piece{position:absolute; top:-12vh; width:10px; height:16px; border-radius:2px; animation:confettiFall linear forwards} @keyframes confettiFall{0%{transform:translate3d(0, -12vh, 0) rotate(0deg); opacity:1}100%{transform:translate3d(var(--dx, 0px), 115vh, 0) rotate(var(--rot, 720deg)); opacity:0.9}} .hero-magnetic{display:inline-block; transition:transform 0.25s cubic-bezier(0.2, 0.7, 0.2, 1); will-change:transform} .showcase-card-wrap{margin:0 auto; max-width:940px} .showcase-caption{text-align:center; margin:16px 0 0; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-style:italic; font-size:13px; color:var(--muted)} .hero-inner{z-index:2} .nav-wrap{position:fixed; top:max(12px, env(safe-area-inset-top)); left:0; right:0; z-index:50; padding:0 16px; padding-left:max(16px, env(safe-area-inset-left)); padding-right:max(16px, env(safe-area-inset-right)); pointer-events:none; transform:translateY(0); transition:transform 0.4s cubic-bezier(0.2, 0.7, 0.2, 1); animation:navCurtainReveal 0.55s cubic-bezier(0.2, 0.7, 0.2, 1) 2.7s both} .nav-wrap.is-hidden{transform:translateY(-150%)} html.is-curtain-closed .nav-wrap{transform:translateY(-150%); pointer-events:none} html.is-curtain-closed .scroll-progress{opacity:0} @keyframes navCurtainReveal{0%{transform:translateY(-150%)}100%{transform:translateY(0)}} .nav{pointer-events:auto; display:grid; grid-template-columns:auto 1fr auto auto auto; align-items:center; gap:6px; padding:6px 6px 6px 14px; max-width:980px; margin:12px auto 0; background:rgba(255, 255, 255, 0.78); backdrop-filter:saturate(180%) blur(20px); -webkit-backdrop-filter:saturate(180%) blur(20px); border:1px solid rgba(232, 227, 217, 0.7); border-radius:999px; box-shadow:0 1px 2px rgba(15, 20, 25, 0.04), 0 8px 24px rgba(15, 20, 25, 0.06), 0 0 0 1px rgba(255, 255, 255, 0.4) inset; position:relative; transition:box-shadow 0.3s ease, background 0.3s ease, padding 0.3s ease, max-width 0.3s ease} .nav[data-state="scrolled"]{background:rgba(255, 255, 255, 0.92); max-width:720px; padding:5px 5px 5px 12px} .brand{display:inline-flex; align-items:center; gap:9px; font-family:'Stalinist One', 'JetBrains Mono', ui-monospace, monospace; font-weight:400; font-size:15.5px; letter-spacing:-0.01em; padding:8px 8px 8px 4px; min-height:44px; transition:opacity 0.3s ease} .nav[data-state="scrolled"] .brand-name{display:none} .nav[data-state="scrolled"] .brand{padding-left:4px} .brand-mark{width:auto; height:24px; display:inline-block; position:relative; color:var(--ink); flex-shrink:0} .brand-mark svg, .brand-mark img{height:100%; width:auto; display:block; object-fit:contain} body.dark .brand-mark{color:var(--cream)} body.dark .brand-mark img{filter:invert(1) hue-rotate(180deg)} .nav-links{position:relative; display:flex; align-items:center; gap:2px; font-size:13.5px; font-weight:500; justify-content:center; isolation:isolate} .nav-link{position:relative; z-index:1; display:inline-flex; align-items:center; gap:5px; color:var(--ink-2); padding:8px 13px; border-radius:999px; transition:color 0.2s ease; min-height:36px; font-weight:500; letter-spacing:-0.005em} .nav-link:hover{color:var(--ink); text-decoration:none} .nav-link.is-active{color:var(--ink)} .nav-link--end{margin-left:auto} .nav-indicator{position:absolute; top:50%; left:0; height:36px; width:0; background:rgba(15, 20, 25, 0.06); border:1px solid rgba(15, 20, 25, 0.05); border-radius:999px; opacity:0; transform:translateY(-50%); z-index:0; pointer-events:none; transition:left 0.42s cubic-bezier(0.2, 0.7, 0.2, 1), width 0.42s cubic-bezier(0.2, 0.7, 0.2, 1), opacity 0.25s ease, background 0.25s ease, border-color 0.25s ease; will-change:left, width, opacity} .nav-indicator.is-on{opacity:1} body.dark .nav-indicator{background:rgba(255, 255, 255, 0.10); border-color:rgba(255, 255, 255, 0.08)} .nav-search{display:inline-flex; align-items:center; gap:8px; padding:6px 10px 6px 8px; background:var(--cream-2); border-radius:999px; font-size:12.5px; color:var(--muted); cursor:pointer; transition:background 0.15s ease; font-weight:500} .nav-search:hover{background:rgba(15, 20, 25, 0.08)} .nav-search kbd{display:inline-flex; align-items:center; justify-content:center; min-width:30px; height:22px; padding:0 6px; background:var(--ink); color:var(--cream); border-radius:6px; font-family:inherit; font-size:13px; font-weight:700; letter-spacing:-0.02em} .nav-cta{display:inline-flex; align-items:center; gap:7px; background:var(--ink); color:var(--cream) !important; padding:13px 16px !important; border-radius:999px; font-weight:600; font-size:13px; transition:transform 0.2s cubic-bezier(0.2, 0.7, 0.2, 1), background 0.2s ease, box-shadow 0.2s ease; min-height:44px} .nav-cta:hover{text-decoration:none; background:var(--ink-2) !important; transform:translateY(-1px); box-shadow:0 6px 16px rgba(15, 20, 25, 0.28)} .nav-cta-arrow{transition:transform 0.2s ease; font-size:13px} .nav-cta:hover .nav-cta-arrow{transform:translateX(3px)} .nav-cta-text-short{display:none} .nav-theme-mobile{display:none} @media (max-width:380px){.nav-cta{padding:10px 14px !important; font-size:12.5px; min-height:44px}} @media (max-width:340px){.nav-cta{padding:8px 11px !important; font-size:11.5px; min-height:44px; gap:6px} .nav-burger{min-width:44px; min-height:44px; padding:0 6px}} .nav-theme{display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; flex-shrink:0; background:transparent; border:1px solid transparent; color:var(--ink-2); border-radius:999px; cursor:pointer; padding:0; transition:color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.4s cubic-bezier(0.2, 0.7, 0.2, 1); position:relative} .nav-theme:hover{color:var(--ink); background:rgba(15, 20, 25, 0.05)} .nav-theme:focus-visible{outline:none; border-color:var(--accent-text); box-shadow:0 0 0 3px rgba(255, 107, 53, 0.2)} .nav-theme:active{transform:scale(0.94)} .nav-theme-icon{width:16px; height:16px; position:absolute; inset:0; margin:auto; transition:opacity 0.3s ease, transform 0.5s cubic-bezier(0.2, 0.7, 0.2, 1)} .nav-theme-icon-sun{opacity:1; transform:rotate(0) scale(1)} .nav-theme-icon-moon{opacity:0; transform:rotate(-90deg) scale(0.6)} body.dark .nav-theme-icon-sun{opacity:0; transform:rotate(90deg) scale(0.6)} body.dark .nav-theme-icon-moon{opacity:1; transform:rotate(0) scale(1)} body.dark .nav-theme:hover{background:rgba(255, 255, 255, 0.08)} @media (prefers-reduced-motion:reduce){.nav-theme-icon, .nav-theme{transition:opacity 0.15s ease} .nav-wrap{animation:none !important; transform:translateY(0) !important}} .nav-burger{display:none; flex-direction:column; justify-content:center; align-items:center; gap:4px; min-width:44px; min-height:44px; background:transparent; border:0; cursor:pointer; padding:0 8px; border-radius:999px; transition:background 0.2s ease} .nav-burger:hover{background:rgba(15, 20, 25, 0.05)} .nav-burger span{display:block; width:18px; height:2px; background:var(--ink); border-radius:2px; transition:transform 0.3s ease, opacity 0.3s ease} .nav-burger.is-open span:nth-child(1){transform:translateY(6px) rotate(45deg)} .nav-burger.is-open span:nth-child(2){opacity:0} .nav-burger.is-open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)} @media (max-width:900px){.nav{grid-template-columns:auto 1fr auto} .nav-links, .nav-search{display:none} .nav-burger{display:flex} .nav-theme{display:inline-flex} .nav-links.is-open{display:flex; position:fixed; top:76px; left:16px; right:16px; flex-direction:column; align-items:stretch; gap:4px; padding:14px; background:rgba(255, 255, 255, 0.95); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border:1px solid var(--line); border-radius:18px; box-shadow:0 12px 40px rgba(15, 20, 25, 0.18); opacity:1; pointer-events:auto; transform:translateY(0); z-index:49} body.dark .nav-links.is-open{background:rgba(20, 23, 28, 0.92); border-color:rgba(255, 255, 255, 0.08)} .nav-links.is-open a{padding:14px 16px; font-size:16px; border-radius:12px} .nav-links.is-open .nav-cta{margin-top:6px; justify-content:center; padding:14px 18px !important; font-size:15px} .nav-links.is-open .nav-indicator{display:none}} @media (max-width:720px){.nav-wrap{padding:0 12px} .nav{padding:6px 6px 6px 14px; gap:8px; min-height:48px} .nav-search{display:none} .nav-theme{display:none} .nav-links.is-open{top:64px; left:12px; right:12px; padding:12px} .nav-links.is-open .nav-theme-mobile{display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:14px 16px; margin-top:6px; border-top:1px solid var(--line); border-radius:0 0 12px 12px; font-size:13px} .nav-links.is-open .nav-theme-mobile button{width:44px; height:44px; border-radius:50%; background:rgba(15, 20, 25, 0.06); border:0; cursor:pointer; font-size:18px} .nav-cta{padding:11px 16px !important; font-size:13px; min-height:44px} .nav-cta-text-full{display:none} .nav-cta-text-short{display:inline}} @media (max-width:480px){.nav{padding:5px 5px 5px 12px; gap:6px; min-height:46px} .brand-name{font-size:17px; letter-spacing:-0.01em} .brand-mark{height:22px} .nav-cta{padding:10px 14px !important; font-size:12.5px; min-height:42px}} @media (max-width:380px){.nav{padding:4px 4px 4px 10px; gap:4px; min-height:44px} .brand-name{font-size:16px} .brand-mark{height:20px} .nav-cta{padding:9px 12px !important; font-size:12px; min-height:40px}} @media (max-width:340px){.nav-wrap{padding:0 8px} .nav{padding:4px 4px 4px 8px; gap:3px; min-height:42px} .brand{gap:7px; padding:4px 0} .brand-name{font-size:14px; letter-spacing:-0.02em} .brand-mark{height:18px} .nav-cta{padding:8px 11px !important; font-size:11.5px; min-height:38px; gap:6px} .nav-cta-arrow{font-size:12px} .nav-burger{min-width:40px; min-height:40px; padding:0 6px} .nav-burger span{width:16px}} .hero::after{content:""; position:absolute; inset:0; background:radial-gradient(300px circle at var(--mx, 50%) var(--my, 50%), rgba(255, 107, 53, 0.10), transparent 50%); pointer-events:none; z-index:1; opacity:0; transition:opacity 0.3s ease} .hero.is-cursor-on::after{opacity:1} .hero-mark-row em,.ht-orange{position:relative} .ht-orange::after{content:""; position:absolute; left:-4%; right:-4%; top:48%; height:6px; background:var(--accent); border-radius:3px; transform:scaleX(0); transform-origin:left center; animation:strikeThrough 1.2s cubic-bezier(0.7, 0, 0.3, 1) 0.8s forwards} @keyframes strikeThrough{0%{transform:scaleX(0)}60%{transform:scaleX(1.05)}100%{transform:scaleX(1)}} .pricing-toggle{display:inline-flex; align-items:center; gap:6px; background:var(--cream-2); padding:5px; border-radius:999px; margin:0 0 28px; border:1px solid var(--line)} .pricing-toggle button{border:0; background:transparent; font:inherit; font-size:13.5px; font-weight:600; color:var(--muted); padding:12px 18px; min-height:44px; border-radius:999px; cursor:pointer; transition:background 0.2s ease, color 0.2s ease; display:inline-flex; align-items:center; gap:8px} .pricing-toggle button.is-on{background:var(--ink); color:var(--cream)} .pricing-save{font-size:12px; font-weight:700; background:var(--accent); color:#fff; padding:2px 7px; border-radius:999px; letter-spacing:0.04em} .plan .price.is-hidden{display:none} .plan .price.is-yearly{display:block} .plan .price-sub.is-yearly{display:block} .plan .price-sub.is-monthly{display:none} .share-float{position:fixed; bottom:24px; left:24px; z-index:30; display:inline-flex; align-items:center; gap:8px; padding:12px 16px; min-height:44px; background:var(--ink); color:var(--cream); border-radius:999px; font-size:14px; font-weight:700; box-shadow:var(--shadow); opacity:0; transform:translateY(20px); pointer-events:none; transition:opacity 0.4s ease, transform 0.4s cubic-bezier(0.2, 0.7, 0.2, 1)} .share-float.is-on{opacity:1; transform:translateY(0); pointer-events:auto} .share-float:hover{background:var(--ink-2); text-decoration:none} .share-float svg{width:18px; height:18px} @media (max-width:720px){.share-float{left:16px; bottom:max(16px, env(safe-area-inset-bottom)); font-size:13px; padding:12px 16px; min-height:44px}} .demo-pin{position:relative; min-height:80vh; min-height:80dvh; background:#1A2128; color:#FAF7F2; padding:120px 0; overflow:hidden; isolation:isolate} .demo-pin::before{content:""; position:absolute; inset:0; background:radial-gradient(800px 400px at 20% 50%, rgba(255, 107, 53, 0.20), transparent 60%); pointer-events:none} .demo-pin .container{position:relative; z-index:1} .demo-pin h2{color:#FAF7F2; text-align:center; margin-bottom:16px} .demo-pin-lead{text-align:center; color:rgba(250, 247, 242, 0.7); font-size:16px; max-width:620px; margin:0 auto 40px} .demo-steps{display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; max-width:980px; margin:0 auto} @media (max-width:900px){.demo-steps{grid-template-columns:repeat(2, 1fr)}} @media (max-width:540px){.demo-steps{grid-template-columns:1fr}} .demo-step{background:rgba(255, 255, 255, 0.05); border:1px solid rgba(255, 255, 255, 0.1); border-radius:16px; padding:22px; position:relative; transition:background 0.3s ease, border-color 0.3s ease, transform 0.3s ease; opacity:0.5} .demo-step.is-on{background:rgba(255, 107, 53, 0.18); border-color:var(--accent-text); opacity:1; transform:scale(1.04)} .demo-step-num{display:inline-block; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-optical-sizing:auto; font-variation-settings:'opsz' 60, 'SOFT' 20, 'WONK' 1; font-weight:500; font-size:36px; color:var(--accent-text); line-height:1; margin-bottom:8px; padding:4px 10px; border:1px solid rgba(250, 247, 242, 0.25); border-radius:2px} .demo-step h3{color:var(--cream); font-size:16px; margin:0 0 6px} .demo-step p{color:rgba(250, 247, 242, 0.7); font-size:13px; margin:0; line-height:1.55} .story{position:relative; padding:140px 0 160px; background:var(--ink); color:var(--cream); overflow:hidden; isolation:isolate} .story::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 22% 38%, rgba(255, 107, 53, 0.12), transparent 55%), radial-gradient(circle at 78% 62%, rgba(255, 107, 53, 0.08), transparent 55%); pointer-events:none} .story::after{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(250, 247, 242, 0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(250, 247, 242, 0.04) 1px, transparent 1px); background-size:64px 64px; background-position:-1px -1px; pointer-events:none; opacity:0.5; mask-image:linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent); -webkit-mask-image:linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent)} body.dark .story{background:#0F1419} .story .container{position:relative; z-index:1; max-width:1180px} .story-rail{display:grid; grid-template-columns:auto 1fr auto; align-items:end; gap:24px; padding:28px 0 36px; margin-bottom:56px; border-top:1px solid rgba(250, 247, 242, 0.18); border-bottom:1px solid rgba(250, 247, 242, 0.18)} .story-rail-mark{font-family:'Saira', sans-serif; font-size:12px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--accent-text); padding:6px 10px; border:1px solid rgba(255, 107, 53, 0.4); border-radius:2px; align-self:start} .story-rail-title{font-family:'Saira', sans-serif; font-size:clamp(22px, 2.4vw, 32px); font-weight:800; letter-spacing:-0.02em; line-height:1.15; margin:0; color:var(--cream); max-width:22ch} .story-rail-title em{font-style:italic; font-weight:400; color:var(--accent-text)} .story-rail-sub{font-family:'Saira', sans-serif; font-size:12px; font-weight:500; letter-spacing:0.18em; text-transform:uppercase; color:rgba(250, 247, 242, 0.5); margin:0; white-space:nowrap} .story-track{display:grid; grid-template-columns:1fr 96px 1fr; gap:0; align-items:stretch} .story-step{position:relative; padding:32px 36px; display:flex; flex-direction:column; opacity:0; transform:translateY(20px); transition:opacity 0.7s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1)} .story.is-in-view .story-step{opacity:1; transform:translateY(0)} .story-step--old{transition-delay:0s} .story-step--new{transition-delay:1.7s} .story-step-head{display:flex; align-items:baseline; gap:16px; padding-bottom:18px; margin-bottom:22px; border-bottom:1px solid rgba(250, 247, 242, 0.18)} .story-num{font-family:'Stalinist One', 'Arial Black', Impact, sans-serif; font-size:44px; font-weight:400; line-height:1; color:rgba(250, 247, 242, 0.55); letter-spacing:-0.02em} .story-num--new{color:var(--cream); background:var(--accent); padding:6px 12px 8px; border-radius:2px; font-size:36px} .story-step-tag{font-family:'Saira', sans-serif; font-size:11px; font-weight:500; letter-spacing:0.18em; text-transform:uppercase; color:rgba(250, 247, 242, 0.55)} .story-step h3{font-family:'Saira', sans-serif; font-size:clamp(24px, 2.4vw, 30px); font-weight:800; letter-spacing:-0.02em; line-height:1.2; margin:0 0 18px; color:var(--cream); max-width:22ch} .story-step h3 em{font-style:italic; font-weight:400; color:var(--accent-text)} .story-step p{font-family:'Saira', sans-serif; font-size:15px; line-height:1.6; color:rgba(250, 247, 242, 0.7); margin:0 0 28px; max-width:38ch} .story-mock{position:relative; font-family:'Saira', sans-serif; border-radius:4px} .story-mock--old{display:flex; flex-direction:column; gap:0; padding:18px 20px; background:rgba(250, 247, 242, 0.03); border:1px dashed rgba(250, 247, 242, 0.18); opacity:0; transform:translateX(-12px); transition:opacity 0.6s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1); transition-delay:0.45s} .story.is-in-view .story-mock--old{opacity:1; transform:translateX(0)} .story-mock-row{position:relative; display:grid; grid-template-columns:22px 1fr; grid-template-rows:auto auto; column-gap:12px; padding:14px 0; border-bottom:1px dashed rgba(250, 247, 242, 0.08); opacity:0; transform:translateX(-8px)} .story-mock-row:last-child{border-bottom:0} .story.is-in-view .story-mock-row{animation:story-row-in 0.55s cubic-bezier(0.2, 0.7, 0.2, 1) forwards; animation-delay:calc(0.75s + var(--d, 0) * 0.18s)} .story-mock-row::after{content:""; position:absolute; left:28px; right:0; top:50%; height:1.5px; background:var(--accent); transform:scaleX(0); transform-origin:left center; opacity:0.85} .story.is-in-view .story-mock-row::after{animation:story-strike 0.5s cubic-bezier(0.65, 0, 0.35, 1) forwards; animation-delay:calc(1.85s + var(--d, 0) * 0.2s)} .story-mock-mark{grid-row:1 / 3; align-self:center; font-family:'Stalinist One', sans-serif; font-size:22px; color:var(--accent-text); line-height:1; opacity:0; transform:scale(0.4) rotate(-25deg)} .story.is-in-view .story-mock-mark{animation:story-mark-in 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; animation-delay:calc(1.55s + var(--d, 0) * 0.2s)} .story-mock-label{font-size:14px; font-weight:600; color:rgba(250, 247, 242, 0.55); letter-spacing:0.01em; text-decoration:line-through; text-decoration-color:rgba(255, 107, 53, 0.55); text-decoration-thickness:1.5px} .story-mock-meta{font-size:12px; color:rgba(250, 247, 242, 0.42); letter-spacing:0.02em; margin-top:2px} .story-arrow{position:relative; display:flex; align-items:center; justify-content:center; padding:0 4px} .story-arrow-line{position:absolute; top:16px; bottom:16px; left:50%; width:1px; background:linear-gradient(180deg, transparent, rgba(255, 107, 53, 0.5) 20%, rgba(255, 107, 53, 0.5) 80%, transparent); transform:translateX(-50%) scaleY(0); transform-origin:top center; opacity:0} .story.is-in-view .story-arrow-line{animation:story-arrow-line 0.9s cubic-bezier(0.65, 0, 0.35, 1) 0.5s forwards} .story-arrow-head{position:absolute; top:50%; left:50%; width:40px; height:40px; border-radius:50%; background:var(--accent); color:var(--cream); display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:700; transform:translate(-50%, -50%) scale(0); opacity:0; box-shadow:0 0 0 0 rgba(255, 107, 53, 0.5)} .story.is-in-view .story-arrow-head{animation:story-arrow-head 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) 1.3s forwards} .story.is-in-view .story-arrow-head{animation:story-arrow-head 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) 1.3s forwards, story-arrow-pulse 2.4s ease-in-out 2.4s infinite} .story-arrow-tag{position:absolute; bottom:18px; left:50%; transform:translateX(-50%) rotate(-90deg); transform-origin:center; font-family:'Saira', sans-serif; font-size:10px; font-weight:600; letter-spacing:0.28em; text-transform:uppercase; color:rgba(250, 247, 242, 0.45); white-space:nowrap; opacity:0} .story.is-in-view .story-arrow-tag{animation:story-arrow-tag 0.5s ease forwards; animation-delay:1.5s} .story-mock--new{padding:22px 24px; background:linear-gradient(135deg, rgba(255, 107, 53, 0.14), rgba(255, 107, 53, 0.04)); border:1.5px solid var(--accent); opacity:0; transform:scale(0.94); transform-origin:center; transition:opacity 0.7s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1); transition-delay:2.1s; box-shadow:0 24px 60px -20px rgba(255, 107, 53, 0.4); overflow:hidden} .story.is-in-view .story-mock--new{opacity:1; transform:scale(1)} .story-mock--new::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 0% 0%, rgba(255, 107, 53, 0.22), transparent 50%); pointer-events:none} .story-mock--new > *{position:relative; z-index:1} .story-mock-url{display:flex; flex-wrap:wrap; align-items:baseline; margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid rgba(250, 247, 242, 0.14); font-family:'Saira', sans-serif; font-size:17px; letter-spacing:0; line-height:1.4; word-break:break-all} .story-mock-protocol{color:rgba(250, 247, 242, 0.5); font-weight:500; font-size:14px; margin-right:1px} .story-mock-domain{color:var(--cream); font-weight:700; font-size:17px} .story-mock-slug{color:var(--accent-text); font-weight:700; font-size:17px; position:relative; display:inline-block} .story-mock-slug::after{content:""; position:absolute; left:0; right:0; bottom:-3px; height:2px; background:var(--accent); transform:scaleX(0); transform-origin:left center; opacity:0} .story.is-in-view .story-mock-slug::after{animation:story-underline 0.6s cubic-bezier(0.65, 0, 0.35, 1) 2.7s forwards} .story-mock-stats{display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; margin-bottom:14px} .story-mock-stat{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; padding:10px 6px; background:rgba(15, 20, 25, 0.45); border:1px solid rgba(250, 247, 242, 0.10); border-radius:3px; text-align:center; opacity:0; transform:translateY(8px)} .story-mock-stat b{font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:18px; font-weight:400; color:var(--cream); letter-spacing:0; line-height:1} .story-mock-stat span{font-family:'Saira', sans-serif; font-size:10px; font-weight:500; letter-spacing:0.16em; text-transform:uppercase; color:rgba(250, 247, 242, 0.55)} .story.is-in-view .story-mock-stat{animation:story-chip-in 0.45s cubic-bezier(0.2, 0.7, 0.2, 1) forwards} .story.is-in-view .story-mock-stat:nth-child(1){animation-delay:2.85s} .story.is-in-view .story-mock-stat:nth-child(2){animation-delay:2.95s} .story.is-in-view .story-mock-stat:nth-child(3){animation-delay:3.05s} .story-mock-channels{display:flex; flex-wrap:wrap; gap:6px} .story-mock-chip{font-family:'Saira', sans-serif; font-size:11px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; padding:6px 10px; background:rgba(15, 20, 25, 0.55); color:var(--cream); border-radius:999px; border:1px solid rgba(250, 247, 242, 0.18); opacity:0; transform:translateY(6px)} .story.is-in-view .story-mock-chip{animation:story-chip-in 0.4s cubic-bezier(0.2, 0.7, 0.2, 1) forwards} .story.is-in-view .story-mock-chip:nth-child(1){animation-delay:3.2s} .story.is-in-view .story-mock-chip:nth-child(2){animation-delay:3.3s} .story.is-in-view .story-mock-chip:nth-child(3){animation-delay:3.4s} .story.is-in-view .story-mock-chip:nth-child(4){animation-delay:3.5s} @keyframes story-row-in{to{opacity:1; transform:translateX(0)}} @keyframes story-mark-in{to{opacity:1; transform:scale(1) rotate(0)}} @keyframes story-strike{to{transform:scaleX(1)}} @keyframes story-arrow-line{0%{transform:translateX(-50%) scaleY(0); opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateX(-50%) scaleY(1); opacity:1}} @keyframes story-arrow-head{0%{transform:translate(-50%, -50%) scale(0); opacity:0; box-shadow:0 0 0 0 rgba(255, 107, 53, 0.5)}60%{transform:translate(-50%, -50%) scale(1.18); opacity:1; box-shadow:0 0 0 12px rgba(255, 107, 53, 0)}100%{transform:translate(-50%, -50%) scale(1); opacity:1; box-shadow:0 0 0 0 rgba(255, 107, 53, 0)}} @keyframes story-arrow-pulse{0%, 100%{box-shadow:0 0 0 0 rgba(255, 107, 53, 0)}50%{box-shadow:0 0 0 14px rgba(255, 107, 53, 0)}} @keyframes story-arrow-tag{to{opacity:1}} @keyframes story-underline{to{transform:scaleX(1); opacity:1}} @keyframes story-chip-in{to{opacity:1; transform:translateY(0)}} @media (max-width:900px){.story{padding:90px 0 110px} .story-rail{grid-template-columns:auto 1fr; gap:16px} .story-rail-sub{grid-column:1 / -1} .story-track{grid-template-columns:1fr; gap:40px} .story-step{padding:24px 20px} .story-arrow{height:64px; padding:0} .story-arrow-line{top:0; bottom:0; left:0; right:0; width:100%; height:1px; background:linear-gradient(90deg, transparent, rgba(255, 107, 53, 0.5) 20%, rgba(255, 107, 53, 0.5) 80%, transparent); transform:translateX(0) scaleX(0); transform-origin:left center} .story.is-in-view .story-arrow-line{animation-name:story-arrow-line-h} .story-arrow-tag{display:none} .story-mock-stats{grid-template-columns:1fr 1fr} .story-mock-stats .story-mock-stat:nth-child(3){grid-column:1 / -1} .story-step--new{transition-delay:1.7s}} @keyframes story-arrow-line-h{to{transform:translateX(0) scaleX(1); opacity:1}} @media (prefers-reduced-motion:reduce){.story-step, .story-mock--old, .story-mock-row, .story-mock-row::after, .story-mock-mark, .story-mock--new, .story-mock-slug::after, .story-mock-stat, .story-mock-chip, .story-arrow-line, .story-arrow-head, .story-arrow-tag{animation:none !important; transition:none !important; opacity:1 !important; transform:none !important}} .signup-dossier{background:var(--card-bg); border:1px solid var(--line); border-radius:14px; padding:22px 22px 20px; box-shadow:var(--shadow)} body.dark .signup-dossier{background:var(--card-bg); border-color:var(--ink-2)} .signup-dossier-eyebrow{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:12px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text); margin-bottom:6px} .signup-dossier-title{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:clamp(20px, 2.6vw, 24px); line-height:1.18; font-weight:400; letter-spacing:-0.01em; margin:0 0 12px; color:var(--ink)} .signup-dossier-rule{border:0; border-top:1px solid var(--line); margin:0 0 14px} .signup-field{display:block; margin-bottom:14px} .signup-field-label{display:block; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:12px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--muted); margin-bottom:6px} .signup-field-input{width:100%; background:var(--cream); border:1px solid var(--line); border-radius:10px; padding:12px 14px; font-family:inherit; font-size:16px; color:var(--ink); outline:0; transition:border-color 0.2s ease, background 0.2s ease; box-sizing:border-box} .signup-field-input:focus{border-color:var(--accent-text); background:var(--cream-2)} body.dark .signup-field-input{background:var(--bg-2); color:var(--fg); border-color:var(--line)} body.dark .signup-field-input:focus{background:var(--ink-2); border-color:var(--accent-text)} .signup-chips{display:flex; flex-wrap:wrap; gap:6px} .signup-chip{position:relative; display:inline-flex; align-items:center; justify-content:center; padding:10px 14px; min-height:44px; border-radius:999px; background:var(--cream); border:1px solid var(--line); cursor:pointer; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:clamp(12px, 3vw, 14px); font-weight:600; color:var(--ink); transition:background 0.18s ease, color 0.18s ease, border-color 0.18s ease; user-select:none; -webkit-tap-highlight-color:transparent} .signup-chip input{position:absolute; opacity:0; pointer-events:none; width:0; height:0; margin:0} .signup-chip:hover{border-color:var(--accent-text); color:var(--accent-text)} .signup-chip:has(input:checked){background:var(--accent); color:var(--cream); border-color:var(--accent-text)} .signup-chip:focus-within{outline:2px solid var(--accent); outline-offset:2px} body.dark .signup-chip{background:var(--bg-2); color:var(--fg); border-color:var(--line)} body.dark .signup-chip:hover{border-color:var(--accent-text); color:var(--accent-text)} body.dark .signup-chip:has(input:checked){background:var(--accent); color:var(--cream); border-color:var(--accent-text)} .signup-dossier-cta{width:100%; margin-top:4px; padding:14px 18px; font-size:12.5px} .signup-dossier-microcopy{margin-top:12px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:12px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--muted); text-align:center} .signup-dossier-blurb{margin:14px 0 16px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:14px; line-height:1.6; color:var(--ink-2)} body.dark .signup-dossier-blurb{color:var(--cream-2)} .signup-dossier-cta-row{display:flex; flex-direction:column; gap:10px; margin-top:4px} @media (min-width:481px){.signup-dossier-cta-row{flex-direction:row} .signup-dossier-cta-row > .signup-dossier-cta{width:auto; flex:1}} .signup-dossier-cta--ghost{background:transparent; color:var(--ink); border:1.5px solid var(--line)} .signup-dossier-cta--ghost:hover{background:var(--ink); color:var(--cream); border-color:var(--ink)} body.dark .signup-dossier-cta--ghost{color:var(--cream); border-color:var(--ink-2)} body.dark .signup-dossier-cta--ghost:hover{background:var(--cream); color:var(--ink); border-color:var(--cream)} .cover{position:relative; overflow:hidden; isolation:isolate; width:100%; min-height:100vh; min-height:100dvh; min-height:100lvh; padding:clamp(56px, 12vh, 140px) 0 clamp(32px, 8vh, 96px); display:flex; flex-direction:column; align-items:center; justify-content:center; background:radial-gradient(ellipse 44% 40% at 50% 52%, rgba(250, 247, 242, 0.68), transparent 72%), radial-gradient(ellipse 30% 22% at 80% 16%, rgba(250, 247, 242, 0.48), transparent 70%), radial-gradient(ellipse 22% 18% at 12% 78%, rgba(250, 247, 242, 0.42), transparent 70%), radial-gradient(ellipse 60% 50% at 8% 4%, rgba(255, 107, 53, 0.32), transparent 62%), radial-gradient(ellipse 55% 45% at 94% 98%, rgba(232, 90, 36, 0.28), transparent 60%), radial-gradient(ellipse 44% 34% at 84% 30%, rgba(255, 107, 53, 0.20), transparent 64%), radial-gradient(ellipse 34% 26% at 12% 88%, rgba(232, 90, 36, 0.18), transparent 64%), radial-gradient(ellipse 50% 26% at 50% 52%, rgba(255, 107, 53, 0.08), transparent 70%), linear-gradient(180deg, var(--cream) 0%, var(--cream-2) 100%); color:var(--ink)} .cover-grain{position:absolute; inset:0; z-index:1; pointer-events:none; opacity:0.38; mix-blend-mode:multiply} .cover-grain svg{width:100%; height:100%; display:block} .cover-grain svg rect{fill:var(--cream)} .cover-glow{position:absolute; inset:0; z-index:0; pointer-events:none; background:radial-gradient(circle 460px at 24% 26%, rgba(255, 107, 53, 0.22), transparent 64%), radial-gradient(circle 420px at 82% 74%, rgba(232, 90, 36, 0.20), transparent 64%), radial-gradient(circle 280px at 60% 14%, rgba(255, 107, 53, 0.12), transparent 68%)} .cover-stars{position:absolute; inset:0; z-index:2; pointer-events:none; overflow:hidden} .cover-star-pin{position:absolute; transform:translate(-50%, -50%); display:block; line-height:0} .cover-star{fill:var(--ink); display:block; animation:coverStarTwinkle 5s ease-in-out infinite; will-change:auto; min-width:2.5px; min-height:2.5px} @media (min-width:721px){.cover-star{will-change:opacity, transform}} @keyframes coverStarTwinkle{0%, 100%{filter:opacity(1); transform:scale(1)}50%{filter:opacity(0.55); transform:scale(0.82)}} @media (prefers-reduced-motion:reduce){.cover-star{animation:none}} .cover > .cover-container{position:relative; z-index:3; max-width:1280px; text-align:center; display:flex; flex-direction:column; align-items:center} .cover-eyebrow{display:inline-flex; align-items:center; gap:14px; margin:0 0 28px; padding:6px 0; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:11px; font-weight:600; letter-spacing:0.22em; text-transform:uppercase; color:var(--ink); opacity:0; transform:translateY(8px); animation:coverFadeIn 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) 0.05s forwards} .cover-eyebrow-line{display:inline-block; width:36px; height:1px; background:var(--ink); opacity:0.5} .cover-eyebrow-text{white-space:nowrap} .cover-headline{margin:0 0 32px; padding:0; font-family:'Stalinist One', 'Arial Black', Impact, sans-serif; font-weight:400; font-style:normal; font-size:clamp(96px, 14vw, 220px); line-height:0.92; letter-spacing:-0.02em; color:var(--ink)} .cover-headline-line{display:block; opacity:0; transform:translateY(28px); animation:coverHeadlineUp 0.9s cubic-bezier(0.2, 0.7, 0.2, 1) forwards} .cover-headline-line:nth-child(1){animation-delay:0.18s} .cover-headline-line:nth-child(2){animation-delay:0.32s} .cover-tagline{margin:0 auto 32px; max-width:520px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:14px; font-weight:500; letter-spacing:0.22em; text-transform:uppercase; line-height:1; color:var(--ink); opacity:0; border-top:1px solid var(--line-strong); border-bottom:1px solid var(--line-strong); padding:18px 0; animation:coverFadeIn 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) 0.6s forwards; animation-fill-mode:forwards} .cover-countdown{display:inline-flex; align-items:baseline; justify-content:center; gap:18px; margin:-8px auto 32px; padding:14px 0; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:14px; font-weight:500; letter-spacing:0.22em; text-transform:uppercase; line-height:1; color:var(--ink); border-top:1px solid var(--line-strong); border-bottom:1px solid var(--line-strong); opacity:0; animation:coverFadeIn 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) 0.7s forwards; animation-fill-mode:forwards} .cover-countdown[hidden]{display:none} .cover-countdown-eyebrow{font-size:12px; font-weight:700; letter-spacing:0.26em; color:var(--accent-text)} .cover-countdown-num{display:inline-flex; align-items:baseline; gap:10px; font-feature-settings:"tnum" 1, "lnum" 1; letter-spacing:0.18em} .cover-countdown-cell{display:inline-flex; align-items:baseline; gap:2px} .cover-countdown-cell > span{font-size:15px; font-weight:700; letter-spacing:0.04em; color:var(--ink); font-variant-numeric:tabular-nums; min-width:1.6ch; text-align:right} .cover-countdown-cell > em{font-style:normal; font-size:11px; font-weight:500; letter-spacing:0.18em; color:var(--muted)} .cover-countdown-sep{font-size:12px; font-weight:500; color:var(--line-strong); letter-spacing:0} .cover-cta-row{display:flex; flex-direction:column; align-items:center; gap:8px; margin-top:8px; opacity:0; transform:translateY(12px); animation:coverFadeUp 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) 0.78s forwards} .cover-cta{font-size:15px; padding:14px 22px} .cover-cta-foot{font-family:'Saira', sans-serif; font-size:11px; font-weight:500; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink); opacity:0.55} .cover-vertical{position:absolute; left:18px; top:50%; z-index:4; transform:translateY(-50%) rotate(-90deg); transform-origin:left center; white-space:nowrap; pointer-events:none; opacity:0; animation:coverFadeIn 0.6s ease 0.4s forwards} .cover-vertical-text{font-family:'Saira', sans-serif; font-size:11px; font-weight:500; letter-spacing:0.32em; text-transform:uppercase; color:var(--ink); opacity:0.62} .cover-stub{position:absolute; right:28px; bottom:120px; z-index:5; display:inline-flex; align-items:stretch; text-decoration:none; background:var(--ink); color:var(--cream); font-family:'Saira', sans-serif; border-radius:4px; box-shadow:0 1px 0 rgba(255, 255, 255, 0.08) inset, 0 6px 18px rgba(15, 20, 25, 0.25); opacity:0; transform:rotate(-3deg); animation:coverStampIn 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) 0.95s forwards; transition:transform 0.35s cubic-bezier(0.2, 0.7, 0.2, 1)} .cover-stub:hover{transform:rotate(0deg) translateY(-2px)} .cover-stub-stub{display:flex; flex-direction:column; align-items:center; justify-content:center; padding:12px 12px 10px; min-width:64px; gap:2px} .cover-stub-num{font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:28px; font-weight:400; line-height:1; letter-spacing:-0.02em; color:var(--cream); font-variant-numeric:tabular-nums} .cover-stub-cap{font-size:8.5px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:rgba(250, 247, 242, 0.65)} .cover-stub-perf{align-self:stretch; width:0; border-left:1px dashed rgba(250, 247, 242, 0.35); margin:6px 0} .cover-stub-main{display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:10px 14px 9px 12px; min-width:96px; gap:3px} .cover-stub-eyebrow{font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:11px; letter-spacing:0.04em; color:var(--accent-text); line-height:1} .cover-stub-tag{font-size:8.5px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:rgba(250, 247, 242, 0.78); line-height:1.2} .cover-marquee{position:absolute; left:0; right:0; bottom:0; z-index:4; padding:14px 0; background:var(--ink); color:var(--cream); border-top:1px solid var(--ink); overflow:hidden; opacity:0; animation:coverFadeIn 0.6s ease 1.2s forwards} .cover-marquee-track{display:flex; align-items:center; gap:14px; white-space:nowrap; animation:coverMarquee 44s linear infinite; width:max-content} @media (max-width:720px){.cover-marquee-track{animation-play-state:paused !important}} .cover-marquee-item{font-family:'Saira', sans-serif; font-size:12px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--cream); flex-shrink:0} .cover-marquee-dot{font-family:'Saira', sans-serif; font-size:12px; color:var(--accent-text); flex-shrink:0} @keyframes coverFadeIn{to{opacity:1}} @keyframes coverFadeUp{to{opacity:1; transform:translateY(0)}} @keyframes coverHeadlineUp{to{opacity:1; transform:translateY(0)}} @keyframes coverStampIn{to{opacity:1; transform:scale(1) rotate(-6deg)}} @keyframes coverRingIn{to{opacity:1}} @keyframes coverMarquee{from{transform:translateX(0)} to{transform:translateX(-50%)}} .cover-curtain{position:absolute; inset:0; z-index:50; pointer-events:none; overflow:hidden} .cover-curtain-rod{position:absolute; top:0; left:0; right:0; height:2px; background:var(--accent); transform:scaleX(0); transform-origin:left center; animation:coverCurtainRod 0.85s cubic-bezier(0.22, 1, 0.36, 1) 0.15s forwards; z-index:2} .cover-curtain-half{position:absolute; top:0; bottom:0; width:50%; background:repeating-linear-gradient( 90deg, var(--ink) 0, var(--ink) 60px, #15191E 60px, #15191E 120px ); z-index:1; will-change:transform} .cover-curtain-half--l{left:0; transform-origin:left center; animation:coverCurtainOpenL 1.55s cubic-bezier(0.77, 0, 0.175, 1) 1.1s forwards} .cover-curtain-half--r{right:0; transform-origin:right center; animation:coverCurtainOpenR 1.55s cubic-bezier(0.77, 0, 0.175, 1) 1.1s forwards} .cover-curtain-fold{position:absolute; top:0; bottom:0; width:2px; background:rgba(250, 247, 242, 0.06); pointer-events:none} .cover-curtain-half--l .cover-curtain-fold--1{left:25%} .cover-curtain-half--l .cover-curtain-fold--2{left:50%} .cover-curtain-half--l .cover-curtain-fold--3{left:75%} .cover-curtain-half--r .cover-curtain-fold--1{right:25%} .cover-curtain-half--r .cover-curtain-fold--2{right:50%} .cover-curtain-half--r .cover-curtain-fold--3{right:75%} .cover-curtain-half--l::after,.cover-curtain-half--r::after{content:""; position:absolute; top:0; bottom:0; width:4px; background:linear-gradient(180deg, rgba(255, 107, 53, 0.0) 0%, rgba(255, 107, 53, 0.35) 30%, rgba(255, 107, 53, 0.35) 70%, rgba(255, 107, 53, 0.0) 100% ); pointer-events:none} .cover-curtain-half--l::after{right:0} .cover-curtain-half--r::after{left:0} .cover-curtain-label{position:absolute; top:50%; font-family:'Stalinist One', 'Arial Black', sans-serif; font-size:clamp(60px, 12vw, 140px); line-height:1; color:rgba(250, 247, 242, 0.92); letter-spacing:-0.02em; z-index:3; pointer-events:none; transform:translateY(-50%) scale(0.94); opacity:0; animation:coverCurtainLabel 1.1s cubic-bezier(0.22, 1, 0.36, 1) 0.35s forwards} .cover-curtain-label--l{right:52%; text-align:right} .cover-curtain-label--r{left:52%; text-align:left} .cover-curtain-half--l.splitting ~ .cover-curtain-label--l,.cover-curtain-half--r.splitting ~ .cover-curtain-label--r{opacity:0} @keyframes coverCurtainOpenL{0%{transform:translateX(0)}100%{transform:translateX(-100%)}} @keyframes coverCurtainOpenR{0%{transform:translateX(0)}100%{transform:translateX(100%)}} @keyframes coverCurtainRod{0%{transform:scaleX(0)}100%{transform:scaleX(1)}} @keyframes coverCurtainLabel{0%{opacity:0; transform:translateY(-50%) translateX(0) scale(0.94)}25%{opacity:0.95; transform:translateY(-50%) translateX(0) scale(1)}72%{opacity:0.95; transform:translateY(-50%) translateX(0) scale(1)}100%{opacity:0; transform:translateY(-50%) translateX(var(--label-slide, 0)) scale(0.98)}} .cover-curtain-label--l{--label-slide:-30px} .cover-curtain-label--r{--label-slide:30px} @media (max-width:720px){.cover-curtain-label{font-size:clamp(40px, 14vw, 72px)} .cover-stars{display:none} .cover-glow{opacity:0.35}} @media (max-width:480px){.cover-glow{opacity:0}} @media (max-width:400px){.cover-curtain-label{font-size:clamp(28px, 11vw, 56px); letter-spacing:-0.01em}} @media (max-width:340px){.cover-curtain-label{font-size:clamp(24px, 9vw, 44px)}} @media (prefers-reduced-motion:reduce){.cover-eyebrow, .cover-headline-line, .cover-tagline, .cover-cta-row, .cover-countdown, .cover-vertical, .cover-stub, .cover-marquee{animation:none !important; opacity:1 !important; transform:none !important} .cover-stub{transform:rotate(-2deg) !important} .cover-marquee-track{animation:none !important} .cover-stars{display:none !important} .cover-star{animation:none !important; opacity:0 !important} .cover-curtain, .cover-curtain-half, .cover-curtain-rod, .cover-curtain-label{display:none !important; animation:none !important}} @media (min-width:1920px){.cover{max-height:1080px}} @media (max-width:1024px){.cover-headline{font-size:clamp(72px, 11vw, 140px)}} @media (max-width:880px){.cover{padding:88px 0 56px; justify-content:flex-start} .cover-headline{font-size:clamp(56px, 12vw, 96px)} .cover-vertical{display:none} .cover-stub{position:static; margin:28px auto 0} .cover-stub-num{font-size:24px} .cover-stub-cap, .cover-stub-tag{font-size:8px} .cover-stub-main{min-width:80px; padding:9px 12px 8px 10px} .cover-stub-stub{min-width:56px; padding:10px 12px 9px} .cover-cta-row{margin-top:28px} .cover-marquee-item{font-size:11px; letter-spacing:0.14em}} @media (max-width:768px) and (orientation:portrait){.cover{padding:80px 0 48px}} @media (max-width:560px){.cover{padding:76px 0 48px} .cover-headline{font-size:clamp(44px, 12vw, 72px); margin-bottom:22px} .cover-tagline{font-size:12.5px; letter-spacing:0.18em; padding:14px 0}} @media (max-width:400px){.cover{padding:68px 0 40px} .cover-headline{font-size:clamp(40px, 14vw, 60px); margin-bottom:18px; line-height:0.96} .cover-tagline{font-size:12px; letter-spacing:0.14em; padding:12px 0; max-width:280px}} @media (max-width:480px){.cover-stub{margin:20px auto 0} .cover-stub-num{font-size:22px} .cover-stub-main{min-width:72px; padding:8px 10px 7px 8px} .cover-stub-stub{min-width:50px; padding:8px 10px 7px}} @media (max-width:480px){.cover-headline{font-size:clamp(32px, 9vw, 46px); margin-bottom:16px}} @media (max-width:360px){.cover{padding:64px 0 36px} .cover-headline{font-size:clamp(28px, 8vw, 38px); margin-bottom:14px; line-height:0.95; letter-spacing:-0.03em} .cover-tagline{font-size:11.5px; letter-spacing:0.14em; padding:10px 0} .cover-stub{margin:18px auto 0} .cover-stub-num{font-size:20px} .cover-stub-main{min-width:64px; padding:7px 9px 6px 7px} .cover-stub-stub{min-width:46px; padding:7px 9px 6px} .cover-countdown{font-size:11.5px; letter-spacing:0.14em; padding:10px 0; gap:12px} .cover-countdown-num{gap:6px; letter-spacing:0.12em} .cover-countdown-cell > span{font-size:13px; min-width:1.5ch} .cover-countdown-cell > em{font-size:10px} .cover-countdown-sep{font-size:11px} .cover-countdown-eyebrow{font-size:10.5px}} @media (max-width:340px){.cover{padding:56px 0 32px} .cover-headline{font-size:clamp(28px, 9.5vw, 44px); margin-bottom:14px; letter-spacing:-0.03em} .cover-tagline{font-size:12px; letter-spacing:0.12em; padding:8px 0; max-width:260px} .cover-countdown{font-size:11px; letter-spacing:0.1em; padding:8px 0; gap:10px} .cover-countdown-num{gap:4px; letter-spacing:0.08em} .cover-countdown-cell > span{font-size:12px; min-width:1.4ch} .cover-countdown-cell > em{font-size:9px} .cover-countdown-sep{font-size:10px} .cover-countdown-eyebrow{font-size:9.5px} .cover-cta{padding:12px 18px !important; font-size:14px !important} .cover-cta-row{margin-top:24px} .cover-eyebrow{font-size:11px; letter-spacing:0.18em; gap:10px} .cover-eyebrow-line{width:24px}} @media (max-height:480px) and (orientation:landscape){.cover{padding:56px 0 32px; min-height:100vh; min-height:100dvh} .cover-headline{font-size:clamp(36px, 8vh, 56px); line-height:0.96; margin-bottom:14px} .cover-tagline{font-size:11.5px; padding:8px 0; letter-spacing:0.16em}} @media (max-height:380px) and (orientation:landscape){.cover{padding:40px 0 20px} .cover-headline{font-size:clamp(28px, 7vh, 44px); line-height:1; margin-bottom:8px} .cover-tagline{font-size:12px; padding:4px 0; letter-spacing:0.18em}} @media (max-height:720px) and (min-width:1024px) and (orientation:landscape){.cover-headline{font-size:clamp(64px, 10vh, 120px)}} @media (prefers-reduced-motion:reduce){.cover{min-height:100vh; min-height:100dvh}} body.dark .cover{background:radial-gradient(ellipse 44% 40% at 50% 52%, rgba(250, 247, 242, 0.80), transparent 72%), radial-gradient(ellipse 30% 22% at 80% 16%, rgba(250, 247, 242, 0.56), transparent 70%), radial-gradient(ellipse 22% 18% at 12% 78%, rgba(250, 247, 242, 0.50), transparent 70%), radial-gradient(ellipse 60% 50% at 8% 4%, rgba(255, 107, 53, 0.42), transparent 62%), radial-gradient(ellipse 55% 45% at 94% 98%, rgba(232, 90, 36, 0.36), transparent 60%), radial-gradient(ellipse 44% 34% at 84% 30%, rgba(255, 107, 53, 0.26), transparent 64%), radial-gradient(ellipse 34% 26% at 12% 88%, rgba(232, 90, 36, 0.22), transparent 64%), linear-gradient(180deg, var(--cream) 0%, var(--cream-2) 100%)} body.dark .cover-grain{opacity:0.30} @media (hover:hover) and (pointer:fine){.who-dir-row{transition:background 0.2s ease, padding-left 0.2s ease, border-left-color 0.2s ease} .who-dir-row:hover{padding-left:22px; border-left:2px solid var(--accent); background:rgba(255, 107, 53, 0.05)} .receipt-featured{transition:transform 0.25s cubic-bezier(0.2, 0.7, 0.2, 1), box-shadow 0.25s ease} .receipt-featured:hover{transform:translateY(-4px) rotate(-0.5deg); box-shadow:0 18px 48px rgba(15, 20, 25, 0.12)} .cover-cta{transition:transform 0.2s ease, box-shadow 0.2s ease} .cover-cta:hover{transform:translateY(-2px); box-shadow:0 10px 28px rgba(15, 20, 25, 0.18)} .cmd-k-fab:active{transform:scale(0.96)}} .features-page-hero{padding:140px 0 56px; background:var(--cream)} @media (max-width:720px){.features-page-hero{padding:64px 0 24px} .features-pills{margin-top:16px}} .features-page-hero .container{max-width:var(--container)} .features-page-hero h1{font-family:"Stalinist One", serif; font-size:clamp(40px, 6vw, 72px); line-height:0.96; letter-spacing:-0.02em; color:var(--ink); max-width:720px; margin:24px 0 32px} .features-page-hero h1 em{font-family:"Stalinist One", serif; font-style:italic; color:var(--accent-text)} .features-page-lead{font-size:19px; line-height:1.55; color:var(--muted); max-width:640px; margin-bottom:56px} .features-page-row{padding:32px 0; background:var(--cream)} .features-page-row + .features-page-row{padding-top:0} .features-page-row .who-dir-row{border-top:1px solid var(--ink); border-bottom:1px solid var(--line); padding:32px 0; align-items:center} .features-page-cta{padding:96px 0 140px; background:var(--cream); border-top:1px solid var(--line)} .features-page-cta-line{font-size:18px; line-height:1.55; color:var(--ink); max-width:560px; margin-bottom:32px} .features-teaser-lead{max-width:640px; color:var(--muted); font-size:18px; line-height:1.55; margin:16px 0 56px} .features-teaser-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:24px; margin-bottom:56px} .features-teaser-cta{display:inline-flex} @media (max-width:720px){.features-page-hero{padding:96px 0 32px} .features-page-hero h1{margin:16px 0 24px} .features-page-lead{font-size:17px; margin-bottom:40px} .features-page-row{padding:16px 0} .features-page-row .who-dir-row{padding:24px 0} .features-page-cta{padding:64px 0 96px} .features-teaser-grid{grid-template-columns:1fr} .features-teaser-lead{font-size:16px; margin:12px 0 40px}} body.dark .features-page-hero,body.dark .features-page-row,body.dark .features-page-cta{background:var(--ink-2)} body.dark .features-page-row .who-dir-row{border-bottom-color:var(--line)} body.dark .features-page-lead,body.dark .features-teaser-lead{color:var(--line)} body.dark .features-page-cta-line{color:var(--cream)} body.dark .features-page-cta{border-top-color:var(--line)} body.dark #features-teaser{background:var(--ink-2)} .features-page-row .who-dir-row,.community-page-row .who-dir-row{opacity:1; transform:none} .community-cover .cover-headline{font-size:clamp(48px, 8vw, 120px)} .community-cover .cover-headline-line em{font-family:"Stalinist One", serif; font-style:italic; color:var(--accent-text)} .community-cover .cover-headline{max-width:100%; word-break:break-word; overflow-wrap:anywhere; hyphens:auto} @media (max-width:480px){.community-cover .cover-headline{font-size:clamp(28px, 8vw, 44px); line-height:1.02}} .community-cover .cover-tagline{font-size:clamp(13px, 1.6vw, 17px); letter-spacing:0.12em} .community-cover .cover-eyebrow-text{font-size:12px; letter-spacing:0.16em} .community-cover .cover-vertical-text{font-size:11px; letter-spacing:0.22em} .community-cover-search{margin-top:clamp(20px, 4vh, 36px); max-width:620px} .community-cover-filters{margin-top:22px; max-width:760px; display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:18px 28px} .community-cover-filters-group{display:flex; flex-direction:column; gap:10px; min-width:0} .community-cover-filters-label{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:10.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted)} .community-cover-filters-row{display:flex; flex-wrap:wrap; gap:5px; padding-right:8px} .community-cover-stub-meta{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:11px; letter-spacing:0.08em; color:var(--ink-2); margin-top:8px} .community-page-row{padding:32px 0; background:var(--cream)} .community-page-row + .community-page-row{padding-top:0} .community-page-row .who-dir-row{border-top:1px solid var(--ink); border-bottom:1px solid var(--line); padding:32px 0; align-items:center} .community-page-cta{padding:96px 0 140px; background:var(--cream); border-top:1px solid var(--line)} .community-page-cta-line{font-size:18px; line-height:1.55; color:var(--ink); max-width:560px; margin-bottom:32px} .community-teaser-lead{max-width:640px; color:var(--muted); font-size:18px; line-height:1.55; margin:16px 0 40px} .community-teaser-cta{display:inline-flex} @media (max-width:880px){.community-cover-filters{grid-template-columns:repeat(2, minmax(0, 1fr))}} @media (max-width:720px){.community-page-row{padding:16px 0} .community-page-row .who-dir-row{padding:24px 0} .community-page-cta{padding:64px 0 96px} .community-teaser-lead{font-size:16px; margin:12px 0 32px} .community-cover-filters{grid-template-columns:1fr; gap:16px} .community-cover-search{max-width:100%}} body.dark .community-cover,body.dark .community-page-row,body.dark .community-page-cta{background:var(--ink-2)} body.dark .community-page-row .who-dir-row{border-bottom-color:var(--line)} body.dark .community-teaser-lead{color:var(--line)} body.dark .community-page-cta-line{color:var(--cream)} body.dark .community-page-cta{border-top-color:var(--line)} body.dark #space-community-teaser{background:var(--ink-2)} body.dark .features-page-hero h1,body.dark .features-page-hero .folio-meta{color:var(--cream)} .features-pills{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:32px} .features-pill{display:inline-flex; align-items:center; padding:7px 14px; min-height:33px; border-radius:999px; border:1px solid var(--line); background:transparent; color:var(--ink-2); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:13px; font-weight:600; text-decoration:none; transition:color 0.18s ease, border-color 0.18s ease} @media (max-width:720px){.features-pill{min-height:44px; padding:10px 16px}} .features-pill:hover{color:var(--accent-text); border-color:var(--accent-text); text-decoration:none} body.dark .features-pill{border-color:var(--line); color:var(--fg)} body.dark .features-pill:hover{border-color:var(--accent-text); color:var(--accent-text)} .community-search{display:flex; align-items:center; gap:12px; max-width:640px; margin-top:8px; padding:14px 18px; border:1px solid var(--ink); border-radius:14px; background:var(--cream); opacity:0.55; pointer-events:none} .community-search-icon{flex-shrink:0; color:var(--muted)} .community-search-input{flex:1; min-width:0; border:0; outline:0; background:transparent; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:16px; font-weight:500; color:var(--ink); -webkit-appearance:none; appearance:none} .community-search-input::placeholder{color:var(--muted)} .community-search-input::-webkit-search-cancel-button{display:none} .community-search-badge{display:inline-flex; align-items:center; padding:5px 10px; border:1px solid var(--line); border-radius:999px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); background:var(--cream-2); white-space:nowrap} @media (max-width:480px){.community-search-badge{display:none}} body.dark .community-search{background:var(--ink-2); border-color:var(--cream)} body.dark .community-search-icon{color:var(--line)} body.dark .community-search-input{color:var(--cream)} body.dark .community-search-input::placeholder{color:var(--line)} body.dark .community-search-badge{background:var(--cream-2); color:var(--line); border-color:var(--line)} .community-filters{display:flex; flex-direction:column; gap:18px; max-width:640px; margin-top:24px; opacity:0.55; pointer-events:none} .community-filters-group{display:flex; flex-direction:column; gap:8px} .community-filters-label{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted)} .community-filters-row{display:flex; flex-wrap:wrap; gap:6px} .filter-chip{display:inline-flex; align-items:center; padding:8px 14px; min-height:44px; border-radius:999px; border:1px solid var(--line); background:transparent; color:var(--ink-2); font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:13px; font-weight:600; cursor:not-allowed; -webkit-tap-highlight-color:transparent} .filter-chip:disabled{cursor:not-allowed} body.dark .filter-chip{border-color:var(--line); color:var(--fg); background:transparent} @media (max-width:720px){.community-search{padding:12px 14px; gap:10px} .community-search-input{font-size:15px} .community-search-badge{font-size:10.5px; padding:4px 8px} .community-filters{margin-top:20px; gap:14px} .filter-chip{padding:7px 12px; font-size:12.5px} .features-pills{margin-bottom:24px}} .auth-main{min-height:100vh; min-height:100dvh; display:flex; align-items:center; justify-content:center; padding:96px 24px 64px; background:var(--cream)} body.dark .auth-main{background:var(--ink)} .auth-split{min-height:100vh; min-height:100dvh; display:grid; grid-template-columns:1fr 1fr; background:var(--cream)} body.dark .auth-split{background:var(--ink)} .auth-split-brand{position:relative; display:flex; flex-direction:column; justify-content:space-between; padding:56px clamp(40px, 5vw, 72px); background:var(--ink); color:var(--cream); overflow:hidden; min-height:100vh; min-height:100dvh} body.dark .auth-split-brand{background:var(--ink-2)} .auth-split-brand::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 20% 15%, rgba(255, 107, 53, 0.18), transparent 50%), radial-gradient(circle at 80% 80%, rgba(255, 107, 53, 0.10), transparent 55%); pointer-events:none} .auth-brand-logo{position:relative; display:inline-flex; align-items:center; gap:10px; font-family:'Stalinist One', sans-serif; font-size:17px; color:var(--cream); text-decoration:none; letter-spacing:-0.01em} .auth-brand-mark{display:block; width:auto; height:96px; color:var(--cream); object-fit:contain} .auth-brand-mark img, .auth-brand-mark svg{height:100%; width:auto; display:block; object-fit:contain} .auth-brand-mark img{filter:invert(1) hue-rotate(180deg)} .auth-brand-pitch{position:relative; margin:clamp(24px, 6vw, 64px) 0} .auth-brand-eyebrow{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text); margin-bottom:22px} .auth-brand-headline{font-family:'Stalinist One', 'Saira', sans-serif; font-size:clamp(40px, 5vw, 68px); line-height:0.96; letter-spacing:-0.022em; margin:0 0 20px; color:var(--cream); max-width:14ch} .auth-brand-headline em{font-style:italic; color:var(--accent-text)} .auth-brand-sub{font-family:'Saira', sans-serif; font-size:16px; line-height:1.55; margin:0; color:rgba(250, 247, 242, 0.74); max-width:42ch} .auth-brand-proof{position:relative; list-style:none; margin:0 0 32px; padding:0; display:flex; flex-direction:column; gap:14px} .auth-brand-proof li{display:flex; align-items:flex-start; gap:12px; font-family:'Saira', sans-serif; font-size:14px; line-height:1.45; color:rgba(250, 247, 242, 0.82)} .auth-brand-proof strong{color:var(--cream); font-weight:700} .auth-brand-proof-mark{color:var(--accent-text); font-size:11px; padding-top:3px; flex-shrink:0} .auth-brand-foot{position:relative; display:flex; align-items:center; gap:12px; font-family:'JetBrains Mono', ui-monospace, monospace; font-size:10.5px; letter-spacing:0.2em; text-transform:uppercase; color:rgba(250, 247, 242, 0.55)} .auth-brand-foot-rule{flex:1; height:1px; background:rgba(250, 247, 242, 0.18)} .auth-split-form{display:flex; align-items:center; justify-content:center; padding:clamp(32px, 5vw, 64px) clamp(20px, 3vw, 48px); background:var(--cream)} body.dark .auth-split-form{background:var(--ink)} @media (max-width:720px){.auth-split{grid-template-columns:1fr; min-height:auto} .auth-split-brand, .auth-split-form{min-width:0} .auth-split-brand{min-height:auto; padding:40px clamp(20px, 5vw, 48px)} .auth-brand-mark{max-width:100%; height:auto}} .auth-form-inner{width:100%; max-width:460px; display:flex; flex-direction:column; gap:14px; padding:36px 32px 32px; background:var(--cream-2); border:1px solid var(--line); border-radius:18px; box-shadow:0 24px 48px -24px rgba(15, 20, 25, 0.18)} body.dark .auth-form-inner{background:var(--ink-2); border-color:var(--line); box-shadow:0 24px 48px -24px rgba(0, 0, 0, 0.5)} @media (max-width:900px){.auth-split{grid-template-columns:1fr} .auth-split-brand{min-height:auto; padding:36px 28px 32px} .auth-brand-pitch{margin:20px 0 24px} .auth-brand-headline{font-size:clamp(32px, 8vw, 44px)} .auth-brand-proof{display:none} .auth-brand-foot{display:none}} .welcome-brand{position:absolute; top:28px; left:32px; display:inline-flex; align-items:center; gap:12px; text-decoration:none; color:var(--ink)} .welcome-brand-mark{display:block; width:auto; height:38px; color:var(--ink); object-fit:contain} .welcome-brand-mark img, .welcome-brand-mark svg{height:100%; width:auto; display:block; object-fit:contain} body.dark .welcome-brand-mark img{filter:invert(1) hue-rotate(180deg)} .dash-side-brand{display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); padding:4px 0} .dash-side-brand-mark{display:block; width:auto; height:30px; color:var(--ink); flex-shrink:0; object-fit:contain} .dash-side-brand-mark img, .dash-side-brand-mark svg{height:100%; width:auto; display:block; object-fit:contain} body.dark .dash-side-brand-mark img{filter:invert(1) hue-rotate(180deg)} .colophon-brand{display:inline-flex; align-items:center; gap:14px; text-decoration:none; color:inherit} .colophon-brand-mark{display:block; width:auto; height:50px; color:inherit; flex-shrink:0; object-fit:contain} .colophon-brand-mark img, .colophon-brand-mark svg{height:100%; width:auto; display:block; object-fit:contain} body.dark .colophon-brand-mark img{filter:invert(1) hue-rotate(180deg)} @media (max-width:640px){.welcome-brand{top:18px; left:20px; gap:10px} .welcome-brand-mark{height:32px} .colophon-brand{gap:10px} .colophon-brand-mark{height:42px}} @media (prefers-reduced-motion:reduce){.auth-split-brand::before{transition:none !important}} .welcome-main{position:relative; min-height:100vh; min-height:100dvh; display:flex; align-items:center; justify-content:center; padding:80px 24px 64px; background:var(--cream)} body.dark .welcome-main{background:var(--ink)} .welcome-skip{position:absolute; top:28px; right:32px; font-family:'Saira', sans-serif; font-size:12px; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted); text-decoration:none; padding:8px 14px; border:1px solid transparent; border-radius:999px; transition:color 0.15s ease, border-color 0.15s ease} .welcome-skip:hover{color:var(--ink); border-color:var(--line)} body.dark .welcome-skip:hover{color:var(--cream); border-color:var(--line)} .welcome-wrap{width:100%; max-width:640px; margin:0 auto; text-align:center} .welcome-eyebrow{display:inline-flex; align-items:center; gap:10px; font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text); margin-bottom:26px; padding:7px 14px 7px 11px; border:1px solid var(--accent); border-radius:999px} .welcome-eyebrow-mark{font-size:9px} .welcome-title{font-family:'Stalinist One', 'Saira', sans-serif; font-size:clamp(48px, 7.6vw, 96px); line-height:0.94; letter-spacing:-0.025em; margin:0 auto 22px; color:var(--ink); max-width:14ch} .welcome-title em{font-style:italic; color:var(--accent-text)} .welcome-rule{width:64px; height:2px; background:var(--accent); margin:0 auto 24px} .welcome-sub{font-family:'Saira', sans-serif; font-size:clamp(16px, 1.6vw, 19px); line-height:1.5; margin:0 auto 56px; color:var(--ink-2); max-width:52ch} body.dark .welcome-sub{color:rgba(250, 247, 242, 0.78)} .welcome-flash{display:flex; align-items:center; gap:10px; margin:0 auto 28px; max-width:520px; padding:12px 16px; border:1px solid var(--line); border-radius:12px; background:var(--cream-2); font-family:'Saira', sans-serif; font-size:13.5px; color:var(--ink)} body.dark .welcome-flash{background:var(--card-bg); color:var(--cream); border-color:var(--line)} .welcome-flash.is-ok{border-color:var(--green); color:var(--green); background:rgba(46, 168, 105, 0.08)} .welcome-flash.is-warn{border-color:var(--accent-text); color:var(--accent-text); background:rgba(255, 107, 53, 0.08)} .welcome-flash-mark{display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:currentColor; color:var(--cream); font-weight:800; font-size:12px; flex:0 0 auto} .welcome-flash.is-warn .welcome-flash-mark{color:var(--cream)} .welcome-flash.is-ok .welcome-flash-mark{color:var(--cream)} .welcome-cards{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:0 auto 44px; max-width:640px} .welcome-card{display:flex; flex-direction:column; gap:14px; padding:22px 22px 20px; background:var(--cream-2); border:1px solid var(--line); border-radius:16px; text-align:left; position:relative; transition:border-color 0.18s ease, transform 0.18s ease} body.dark .welcome-card{background:var(--card-bg); border-color:var(--line)} .welcome-card.is-connected{border-color:var(--green); background:rgba(46, 168, 105, 0.05)} body.dark .welcome-card.is-connected{background:rgba(46, 168, 105, 0.08)} .welcome-card-head{display:flex; align-items:center; gap:10px} .welcome-card-mark{display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:8px; background:var(--cream); border:1px solid var(--line); flex:0 0 auto} body.dark .welcome-card-mark{background:var(--bg)} .welcome-card-mark-github{color:var(--ink)} .welcome-card-mark-linkedin{color:#0A66C2} body.dark .welcome-card-mark-github{color:var(--cream)} .welcome-card-name{font-family:'Stalinist One', sans-serif; font-size:14px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink); flex:1 1 auto} body.dark .welcome-card-name{color:var(--cream)} .welcome-card-state{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:9.5px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted)} .welcome-card-state-ok{color:var(--green)} .welcome-card-rule{height:1px; background:var(--line); margin:0} .welcome-card.is-connected .welcome-card-rule{background:rgba(46, 168, 105, 0.35)} .welcome-card-body{font-family:'Saira', sans-serif; font-size:14px; line-height:1.5; margin:0; color:var(--ink-2); flex:1 1 auto} body.dark .welcome-card-body{color:rgba(250, 247, 242, 0.78)} .welcome-card-foot{display:flex; align-items:center; gap:10px; min-height:44px} .welcome-card-btn{display:inline-flex; align-items:center; gap:10px; padding:11px 18px; background:var(--ink); color:var(--cream); font-family:'Stalinist One', sans-serif; font-size:11px; text-transform:uppercase; letter-spacing:0.06em; text-decoration:none; border-radius:10px; transition:background 0.18s ease, transform 0.15s ease} .welcome-card-btn-github:hover{background:#0F1419; transform:translateY(-1px)} .welcome-card-btn-linkedin:hover{background:#0A66C2; transform:translateY(-1px)} .welcome-card-btn:focus-visible{outline:2px solid var(--accent); outline-offset:3px} .welcome-card-btn-arrow{transition:transform 0.18s ease; font-size:14px} .welcome-card-btn:hover .welcome-card-btn-arrow{transform:translateX(2px)} .welcome-card-tick{display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:var(--green); color:var(--cream); font-weight:800; font-size:12px; flex:0 0 auto} .welcome-card-tick-text{font-family:'Saira', sans-serif; font-size:12.5px; line-height:1.45; color:var(--ink)} body.dark .welcome-card-tick-text{color:var(--cream)} .welcome-card-off{font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); font-style:italic} .welcome-cta-wrap{display:flex; flex-direction:column; align-items:center; gap:12px; margin-bottom:56px} .welcome-cta{display:inline-flex; align-items:center; gap:14px; min-height:60px; padding:18px 36px; background:var(--accent); color:var(--cream); font-family:'Stalinist One', sans-serif; font-size:15px; text-transform:uppercase; letter-spacing:0.06em; text-decoration:none; border-radius:14px; transition:background 0.2s ease, transform 0.15s ease} .welcome-cta:hover{background:var(--accent-2); transform:translateY(-1px)} .welcome-cta:focus-visible{outline:2px solid var(--accent); outline-offset:3px} .welcome-cta-arrow{transition:transform 0.2s ease; font-size:18px} .welcome-cta:hover .welcome-cta-arrow{transform:translateX(3px)} .welcome-cta-meta{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted)} .welcome-trust{display:flex; flex-direction:column; align-items:center; gap:10px; padding-top:32px; border-top:1px solid var(--line)} .welcome-trust-stars{display:inline-flex; gap:4px; color:var(--accent-text); font-size:16px; letter-spacing:0.1em} .welcome-trust-label{font-family:'Saira', sans-serif; font-size:13px; color:var(--muted); max-width:42ch} @media (max-width:640px){.welcome-main{padding:64px 20px 48px} .welcome-skip{top:18px; right:18px; font-size:11px} .welcome-title{font-size:clamp(40px, 11vw, 56px)} .welcome-sub{margin-bottom:40px} .welcome-cards{grid-template-columns:1fr; gap:14px; margin-bottom:36px} .welcome-card{padding:18px 18px 16px} .welcome-cta{min-height:54px; padding:16px 28px; font-size:14px} .welcome-cta-wrap{margin-bottom:40px}} @media (prefers-reduced-motion:reduce){.welcome-cta, .welcome-cta-arrow, .welcome-skip, .welcome-card, .welcome-card-btn, .welcome-card-btn-arrow{transition:none !important}} .auth-wrap{width:100%; max-width:440px} .auth-card{display:flex; flex-direction:column; gap:14px; padding:32px 28px; border:1px solid var(--line); border-radius:18px; background:var(--cream-2); box-shadow:0 24px 48px -24px rgba(15, 20, 25, 0.18)} body.dark .auth-card{background:var(--ink-2); border-color:var(--line); box-shadow:0 24px 48px -24px rgba(0, 0, 0, 0.5)} .auth-eyebrow{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--accent-text)} body.dark .auth-eyebrow{color:var(--accent-text)} .auth-title{font-family:'Stalinist One', 'Saira', sans-serif; font-size:clamp(34px, 5.4vw, 48px); line-height:0.98; letter-spacing:-0.01em; margin:0; color:var(--ink)} .auth-title em{font-style:normal; color:var(--accent-text)} body.dark .auth-title{color:var(--cream)} body.dark .auth-title em{color:var(--accent-text)} .auth-rule{width:56px; height:2px; background:var(--ink)} body.dark .auth-rule{background:var(--cream)} .auth-sub{font-family:'Saira', sans-serif; font-size:14px; line-height:1.55; color:var(--ink-2); margin:0 0 6px} body.dark .auth-sub{color:var(--fg)} .auth-trial-note{font-family:'Saira', sans-serif; font-size:12px; letter-spacing:0.04em; color:var(--muted); background:rgba(255,107,53,0.08); border:1px solid rgba(255,107,53,0.3); padding:8px 12px; border-radius:999px; display:inline-block; margin:4px 0 18px} .auth-trial-note strong{color:var(--accent-text); letter-spacing:0.06em} .auth-err{font-family:'Saira', sans-serif; font-size:13.5px; font-weight:500; padding:10px 14px; border-radius:10px; background:rgba(184, 58, 15, 0.08); border:1px solid rgba(184, 58, 15, 0.25); color:var(--accent-text)} .auth-err a{color:var(--accent-text); text-decoration:underline; font-weight:600} .auth-err.is-warn{background:rgba(245, 107, 53, 0.12); border-color:var(--accent-text); color:var(--accent-text)} body.dark .auth-err{background:rgba(245, 169, 138, 0.12); border-color:rgba(245, 169, 138, 0.35); color:var(--accent-text)} body.dark .auth-err a, body.dark .auth-err.is-warn{color:var(--accent-text)} .auth-field{display:flex; flex-direction:column; gap:6px; margin-bottom:4px} .auth-field label{font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted)} .auth-field-link{float:right; font-size:10.5px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent-text); text-decoration:underline} body.dark .auth-field-link{color:var(--accent-text)} .auth-sub-tight{margin-top:-8px; margin-bottom:18px} .auth-otp-note{font-size:12.5px; line-height:1.55; color:var(--muted); margin:-4px 0 16px; padding:0} body.dark .auth-otp-note{color:rgba(255, 255, 255, 0.55)} .auth-social{display:flex; flex-direction:column; gap:10px; margin:0 0 18px} .auth-social-btn{display:flex; align-items:center; justify-content:center; gap:12px; width:100%; min-height:46px; padding:10px 16px; border:1px solid var(--line-strong); border-radius:10px; background:var(--cream); color:var(--ink); font-family:'Saira', sans-serif; font-size:14px; font-weight:600; letter-spacing:0.02em; text-decoration:none; cursor:pointer; transition:background 0.15s ease, border-color 0.15s ease, transform 0.1s ease} .auth-social-btn:hover{background:var(--cream-2); border-color:var(--ink)} .auth-social-btn:active{transform:scale(0.99)} .auth-social-btn:focus-visible{outline:none; border-color:var(--accent-text); box-shadow:0 0 0 3px rgba(255, 107, 53, 0.22)} .auth-social-mark{display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px} .auth-social-mark svg{display:block} .auth-social-label{line-height:1} body.dark .auth-social-btn{background:var(--ink); color:var(--cream); border-color:var(--line)} body.dark .auth-social-btn:hover{background:rgba(255, 255, 255, 0.06); border-color:var(--cream)} body.dark .auth-social-github .auth-social-mark svg,body.dark .auth-social-github .auth-social-label{color:var(--cream); fill:var(--cream)} body.dark .auth-social-github .auth-social-mark svg path{fill:var(--cream)} .auth-divider{display:flex; align-items:center; gap:12px; margin:4px 0 18px; color:var(--muted); font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.20em; text-transform:uppercase} .auth-divider::before,.auth-divider::after{content:""; flex:1; height:1px; background:var(--line)} body.dark .auth-divider{color:rgba(255, 255, 255, 0.45)} body.dark .auth-divider::before,body.dark .auth-divider::after{background:var(--line)} .auth-field input{font-family:'Saira', sans-serif; font-size:16px; font-weight:500; padding:14px 16px; min-height:48px; border:1px solid var(--line-strong); border-radius:12px; background:var(--cream); color:var(--ink); transition:border-color 0.15s ease, box-shadow 0.15s ease} .auth-field input:focus{outline:none; border-color:var(--accent-text); box-shadow:0 0 0 3px rgba(255, 107, 53, 0.18)} body.dark .auth-field input{background:var(--ink); color:var(--cream); border-color:var(--line)} body.dark .auth-field input:focus{border-color:var(--accent-text); box-shadow:0 0 0 3px rgba(255, 107, 53, 0.22)} .auth-hint{font-weight:500; text-transform:none; letter-spacing:0.04em; color:var(--muted); margin-left:6px} .auth-submit{display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:14px 22px; margin-top:6px; border:none; border-radius:12px; background:var(--accent); color:var(--cream); font-family:'Stalinist One', 'Saira', sans-serif; font-size:14px; letter-spacing:0.05em; text-transform:uppercase; cursor:pointer; transition:transform 0.1s ease, background 0.15s ease} .auth-submit:hover{background:var(--accent-text)} .auth-submit:active{transform:scale(0.98)} .auth-submit:focus-visible{outline:3px solid var(--accent-text); outline-offset:3px} body.dark .auth-submit{background:var(--accent); color:var(--ink)} .auth-foot{font-family:'Saira', sans-serif; font-size:13.5px; text-align:center; color:var(--muted); margin-top:14px; padding-top:14px; border-top:1px solid var(--line)} .auth-foot a{color:var(--accent-text); text-decoration:underline; font-weight:600} body.dark .auth-foot a{color:var(--accent-text)} .dash-flash{margin:0 0 18px; padding:14px 16px; border-left:3px solid var(--accent); background:var(--cream-2); border-radius:0 var(--radius-sm) var(--radius-sm) 0} .dash-flash-eyebrow{display:block; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:11px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--accent-text); margin-bottom:6px} .dash-flash-body{margin:0; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:14px; line-height:1.55; color:var(--ink-2)} .dash-flash-body strong{font-weight:700} body.dark .dash-flash{background:var(--card-bg)} body.dark .dash-flash-body{color:var(--ink-2)} .nav-user{display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:10px 14px; border-radius:999px; background:transparent; color:var(--ink-2); font-family:'Saira', sans-serif; font-size:13px; font-weight:600; text-decoration:none; -webkit-tap-highlight-color:transparent} .nav-user:hover{color:var(--accent-text)} .nav-user-logout{background:transparent; border:1px solid var(--line); cursor:pointer; font-family:'Saira', sans-serif} .nav-user-logout:hover{border-color:var(--accent-text); color:var(--accent-text)} body.dark .nav-user{color:var(--fg)} body.dark .nav-user-logout{border-color:var(--line); color:var(--fg)} body.dark .nav-user:hover{color:var(--accent-text)} body.dark .nav-user-logout:hover{border-color:var(--accent-text); color:var(--accent-text)} @media (max-width:480px){.auth-main{padding:72px 16px 48px} .auth-card{padding:26px 22px; border-radius:14px} .auth-title{font-size:clamp(30px, 8vw, 40px)}} .auth-email-chip{display:inline-block; margin-top:4px; padding:2px 8px; border-radius:6px; background:var(--cream-2); color:var(--ink); font-size:14px; font-weight:600; word-break:break-all} body.dark .auth-email-chip{background:rgba(255, 255, 255, 0.08); color:var(--cream)} .auth-ok{font-size:13.5px; line-height:1.5; color:#1f6b3a; background:rgba(31, 107, 58, 0.10); border:1px solid rgba(31, 107, 58, 0.30); border-left:3px solid #1f6b3a; padding:10px 14px; border-radius:8px; margin:0 0 16px} body.dark .auth-ok{color:#6ddc8c; background:rgba(109, 220, 140, 0.10); border-color:rgba(109, 220, 140, 0.30); border-left-color:#6ddc8c} .auth-otp-row{display:flex; justify-content:center; gap:10px; margin:6px 0 20px} .auth-otp-cell{width:48px; height:56px; text-align:center; font-family:'Saira', Helvetica, Arial, sans-serif; font-size:26px; font-weight:700; line-height:1; color:var(--ink); background:var(--cream-2); border:1px solid var(--line); border-radius:10px; padding:0; outline:none; transition:border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease; -moz-appearance:textfield; appearance:textfield} .auth-otp-cell::-webkit-outer-spin-button,.auth-otp-cell::-webkit-inner-spin-button{-webkit-appearance:none; margin:0} .auth-otp-cell:focus{border-color:var(--accent-text); background:var(--cream); box-shadow:0 0 0 3px rgba(255, 107, 53, 0.22)} .auth-otp-cell.is-filled{border-color:var(--ink); background:var(--cream)} body.dark .auth-otp-cell{background:var(--ink); color:var(--cream); border-color:var(--line)} body.dark .auth-otp-cell:focus{background:rgba(255, 255, 255, 0.04); border-color:var(--accent-text)} body.dark .auth-otp-cell.is-filled{border-color:var(--cream)} .auth-submit[disabled]{opacity:0.55; cursor:not-allowed} .auth-submit.is-ready{background:var(--accent); color:#fff; animation:auth-otp-pulse 0.4s ease} @keyframes auth-otp-pulse{0%{transform:scale(1)}50%{transform:scale(1.02)}100%{transform:scale(1)}} .auth-resend-form{margin-top:16px; text-align:center} .auth-resend-btn{font:inherit; font-size:13px; font-weight:600; letter-spacing:0.06em; color:var(--accent-text); background:transparent; border:none; padding:8px 12px; cursor:pointer; border-radius:6px; transition:background 0.15s ease} .auth-resend-btn:hover:not([disabled]){background:rgba(255, 107, 53, 0.08); text-decoration:underline} .auth-resend-btn[disabled]{color:var(--ink-soft); cursor:not-allowed; opacity:0.7} body.dark .auth-resend-btn{color:var(--accent-text)} body.dark .auth-resend-btn[disabled]{color:rgba(255, 255, 255, 0.5)} @media (max-width:480px){.auth-otp-row{gap:6px} .auth-otp-cell{width:40px; height:50px; font-size:22px}} .dash-shell{display:flex; min-height:100vh; background:var(--cream)} body.dark .dash-shell{background:var(--bg)} .dash-side{width:240px; flex-shrink:0; background:var(--cream-2); border-right:1px solid var(--line); display:flex; flex-direction:column; position:sticky; top:0; height:100vh; overflow-y:auto} body.dark .dash-side{background:var(--bg-2); border-right-color:var(--line)} .dash-side-brand{padding:22px 24px 18px; font-family:'Stalinist One', 'Saira', sans-serif; font-size:14px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); display:block} body.dark .dash-side-brand{color:var(--ink); border-bottom-color:var(--line)} .dash-side-section{padding:14px 0 6px} .dash-side-section + .dash-side-section{border-top:1px solid var(--line)} .dash-side-section-label{font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size:10.5px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--muted); padding:8px 24px 6px} .dash-side-plan-label{padding:8px 8px 6px; border-top:1px solid var(--line); margin-top:4px} .dash-side-item{display:flex; align-items:center; gap:10px; padding:9px 24px; font-family:'Saira', sans-serif; font-size:13.5px; font-weight:600; color:var(--ink); text-decoration:none; border-left:2px solid transparent; background:transparent; border-top:0; border-right:0; border-bottom:0; width:100%; text-align:left; cursor:pointer} .dash-side-item:hover{background:rgba(15, 20, 25, 0.04)} .dash-side-item.is-active{border-left-color:var(--accent-text); background:rgba(255, 107, 53, 0.06); color:var(--ink)} .dash-side-signout-form{margin:0; padding:0} .dash-side-foot{margin-top:auto; padding:14px 24px; border-top:1px solid var(--line); display:flex; align-items:center; gap:10px} .dash-side-foot .foot-avatar{width:32px; height:32px; border-radius:50%; background:var(--ink); color:var(--cream); display:flex; align-items:center; justify-content:center; font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.04em; flex-shrink:0} body.dark .dash-side-foot .foot-avatar{background:var(--ink); color:var(--bg)} .dash-side-foot .foot-meta{min-width:0; flex:1} .dash-side-foot .foot-name{font-family:'Saira', sans-serif; font-size:12px; font-weight:700; color:var(--ink); line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis} .dash-side-foot .foot-email{font-family:'Saira', sans-serif; font-size:10.5px; color:var(--muted); letter-spacing:0.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis} .dash-side-plan-wrap{margin-top:8px; padding:0 14px; flex-shrink:0} .dash-side-plan{border:1px solid; border-radius:12px; padding:14px 14px 12px; font-family:'Saira', sans-serif; position:relative; box-sizing:border-box; word-break:break-word} .dash-side-plan-eyebrow{font-size:10px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; margin-bottom:10px; line-height:1.2} .dash-side-plan-headline{font-size:12px; font-weight:500; line-height:1.35; color:var(--ink); margin-bottom:6px} .dash-side-plan-headline strong{display:inline-block; font-size:22px; font-weight:800; letter-spacing:-0.02em; line-height:1; margin-right:4px; vertical-align:-2px} .dash-side-plan-sub{font-size:11px; font-weight:500; color:var(--muted); line-height:1.35; margin-bottom:4px} .dash-side-plan-cta{display:block; margin-top:10px; padding:9px 12px; border-radius:999px; font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.04em; text-align:center; text-decoration:none; border:1px solid transparent; cursor:pointer; transition:transform 0.18s ease, box-shadow 0.18s ease} .dash-side-plan-cta:hover{transform:translateY(-1px)} .dash-side-plan-cta-quiet{background:transparent} .dash-side-plan-internal{background:linear-gradient(180deg, rgba(74,157,111,0.14), rgba(74,157,111,0.06)); border-color:#4a9d6f} .dash-side-plan-internal .dash-side-plan-eyebrow{color:#2e6e4a} .dash-side-plan-internal .dash-side-plan-headline{color:#2e6e4a} .dash-side-plan-trial{background:linear-gradient(180deg, rgba(255,107,53,0.10), rgba(255,107,53,0.04)); border-color:var(--accent-text)} .dash-side-plan-trial .dash-side-plan-eyebrow{color:var(--accent-text)} .dash-side-plan-trial .dash-side-plan-headline strong{color:var(--accent-text)} .dash-side-plan-trial .dash-side-plan-cta{background:var(--accent); color:#FFFFFF} .dash-side-plan-trial .dash-side-plan-cta:hover{box-shadow:0 6px 18px -6px rgba(255,107,53,0.6)} .dash-side-plan-grace{background:linear-gradient(180deg, rgba(180,40,40,0.10), rgba(180,40,40,0.04)); border-color:#b42828} .dash-side-plan-grace .dash-side-plan-eyebrow{color:#b42828} .dash-side-plan-grace .dash-side-plan-headline strong{color:#b42828} .dash-side-plan-grace .dash-side-plan-cta{background:#b42828; color:#FFFFFF} .dash-side-plan-grace .dash-side-plan-cta:hover{box-shadow:0 6px 18px -6px rgba(180,40,40,0.6)} .dash-side-plan-pro{background:linear-gradient(180deg, rgba(255,107,53,0.08), rgba(255,107,53,0.02)); border-color:rgba(255,107,53,0.4)} .dash-side-plan-pro .dash-side-plan-eyebrow{color:var(--accent-text)} .dash-side-plan-pro .dash-side-plan-headline strong{color:var(--ink)} .dash-side-plan-pro .dash-side-plan-cta-quiet{border-color:var(--line); color:var(--muted)} .dash-side-plan-pro .dash-side-plan-cta-quiet:hover{color:var(--ink); border-color:var(--muted)} .dash-side-plan-free{background:rgba(255,255,255,0.4); border-color:var(--line)} .dash-side-plan-free .dash-side-plan-eyebrow{color:var(--muted)} .dash-side-plan-free .dash-side-plan-headline strong{color:var(--ink)} .dash-side-plan-free .dash-side-plan-cta{background:var(--ink); color:var(--cream)} .dash-side-plan-free .dash-side-plan-cta:hover{box-shadow:0 6px 18px -6px rgba(15,20,25,0.4)} body.dark .dash-side-plan-free{background:rgba(15,20,25,0.4)} body.dark .dash-side-plan-internal{background:linear-gradient(180deg, rgba(74,157,111,0.22), rgba(74,157,111,0.10))} body.dark .dash-side-plan-trial{background:linear-gradient(180deg, rgba(255,107,53,0.18), rgba(255,107,53,0.06))} body.dark .dash-side-plan-grace{background:linear-gradient(180deg, rgba(180,40,40,0.18), rgba(180,40,40,0.06))} body.dark .dash-side-plan-pro{background:linear-gradient(180deg, rgba(255,107,53,0.14), rgba(255,107,53,0.04))} @media (max-width:900px){.dash-side-plan-wrap{display:none}} .dash-app{flex:1; min-width:0; display:flex; flex-direction:column; background:var(--cream)} body.dark .dash-app{background:var(--bg)} .dash-bar{position:sticky; top:0; z-index:10; display:flex; gap:16px; align-items:center; padding:0 32px; height:56px; background:var(--cream-2); border-bottom:1px solid var(--line)} body.dark .dash-bar{background:var(--bg-2); border-bottom-color:var(--line)} .dash-bar-issue{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.24em; text-transform:uppercase; color:var(--muted)} .dash-bar-hamburger{display:none; background:none; border:1px solid var(--line-strong); padding:6px 10px; border-radius:6px; font-family:'Saira', sans-serif; font-size:12px; font-weight:700; cursor:pointer; color:var(--ink)} body.dark .dash-bar-hamburger{border-color:var(--line); color:var(--ink)} .dash-bar-right{margin-left:auto; display:flex; align-items:center; gap:14px} .dash-bar-link{font-family:'Saira', sans-serif; font-size:12px; font-weight:600; color:var(--muted); text-decoration:none} .dash-bar-link:hover{color:var(--ink)} .dash-main{padding:32px 40px 64px; max-width:1100px; width:100%; margin:0 auto; flex:1} @media (max-width:880px){.dash-side{position:fixed; transform:translateX(-100%); z-index:20; box-shadow:0 16px 40px rgba(15, 20, 25, 0.18); transition:transform 200ms ease} body.dark .dash-side{box-shadow:0 16px 40px rgba(0, 0, 0, 0.55)} .dash-side.is-open{transform:translateX(0)} .dash-bar-hamburger{display:inline-flex} .dash-main{padding:24px 20px 48px} .fm-grid{grid-template-columns:1fr}} .dash-page-title{font-family:'Stalinist One', 'Saira', sans-serif; font-size:clamp(28px, 4vw, 38px); margin:0 0 6px; color:var(--ink); line-height:1.05} .dash-page-title em{font-style:normal; color:var(--accent-text)} .dash-page-sub{font-family:'Saira', sans-serif; font-size:13px; color:var(--muted); margin-bottom:24px} .meter-card{background:var(--cream-2); border:1px solid var(--line); padding:28px 32px 24px; margin-bottom:28px; border-radius:var(--radius)} body.dark .meter-card{background:var(--card-bg); border-color:var(--line)} .meter-eyebrow{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text); margin-bottom:10px} .meter-title{font-family:'Stalinist One', 'Saira', sans-serif; font-size:clamp(26px, 4vw, 36px); color:var(--ink); margin:0 0 18px; line-height:1.05} .meter-title em{font-style:normal; color:var(--accent-text)} .meter-bar{display:flex; gap:6px; margin-bottom:14px} .meter-seg{flex:1; height:6px; background:var(--cream); border:1px solid var(--line)} body.dark .meter-seg{background:var(--bg-2); border-color:var(--line)} .meter-seg.is-done{background:var(--accent); border-color:var(--accent-text)} .meter-list{list-style:none; padding:0; margin:0 0 16px; display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:8px 18px} .meter-row{display:flex; align-items:center; gap:10px; font-family:'Saira', sans-serif; font-size:13px; color:var(--ink-2)} .meter-row.is-done{color:var(--ink)} .meter-mark{font-family:'SF Mono', Menlo, Consolas, monospace; font-size:14px; font-weight:700} .meter-row.is-done .meter-mark{color:var(--accent-text)} .meter-cta{margin-left:auto; font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent-text); text-decoration:none; background:none; border:0; cursor:pointer; padding:0} .meter-cta:hover{text-decoration:underline} .meter-action{font-family:'Saira', sans-serif; font-size:13px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent-text); text-decoration:none; border-bottom:1px solid var(--accent); padding-bottom:2px} .dash-grid{display:grid; grid-template-columns:2fr 1fr; gap:22px} @media (max-width:880px){.dash-grid{grid-template-columns:1fr}} .dash-card{background:var(--cream-2); border:1px solid var(--line); padding:22px 24px; border-radius:var(--radius)} body.dark .dash-card{background:var(--card-bg); border-color:var(--line)} .dash-card-eyebrow{font-family:'Saira', sans-serif; font-size:10.5px; font-weight:700; letter-spacing:0.24em; text-transform:uppercase; color:var(--muted); margin-bottom:6px} .dash-card-title{font-family:'Stalinist One', 'Saira', sans-serif; font-size:22px; line-height:1.05; margin:0 0 10px; color:var(--ink)} .dash-card-title em{font-style:normal; color:var(--accent-text)} .dash-card-sub{font-family:'Saira', sans-serif; font-size:14px; color:var(--ink-2); margin:0 0 12px; line-height:1.5} .dash-card-row{display:flex; gap:10px; padding:8px 0; border-top:1px solid var(--line); font-family:'Saira', sans-serif; font-size:13px} .dash-card-row:last-child{border-bottom:1px solid var(--line)} .dash-card-key{font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted); min-width:90px; flex-shrink:0} .dash-card-val{color:var(--ink); flex:1; min-width:0; word-break:break-word} .dash-card-cta{display:inline-block; margin-top:14px; font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--accent-text); text-decoration:none} .dash-card-cta:hover{text-decoration:underline} .dash-link{font-family:'SF Mono', Menlo, Consolas, monospace; font-size:13px; background:var(--cream); padding:8px 12px; border:1px solid var(--line); display:inline-block; border-radius:var(--radius-sm); color:var(--ink)} body.dark .dash-link{background:var(--bg-2); border-color:var(--line)} .dash-link-actions{margin-top:14px; display:flex; gap:8px} .dash-stats{background:var(--cream-2); border:1px solid var(--line); padding:22px 24px 18px; border-radius:var(--radius); margin-bottom:22px} body.dark .dash-stats{background:var(--card-bg); border-color:var(--line)} .dash-stats-head{display:flex; align-items:flex-start; justify-content:space-between; gap:18px; flex-wrap:wrap} .dash-stats-eyebrow{font-family:'Saira', sans-serif; font-size:10.5px; font-weight:700; letter-spacing:0.24em; text-transform:uppercase; color:var(--muted); margin-bottom:4px} .dash-stats-title{font-family:'Stalinist One', 'Saira', sans-serif; font-size:22px; line-height:1.05; margin:0; color:var(--ink)} .dash-stats-title em{font-style:normal; color:var(--accent-text)} .dash-stats-numbers{display:flex; gap:28px; flex-shrink:0} .dash-stat-block{text-align:right; min-width:64px} .dash-stat-num{font-family:'Stalinist One', 'Saira', sans-serif; font-size:32px; line-height:1; color:var(--ink)} .dash-stat-label{font-family:'Saira', sans-serif; font-size:10.5px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--muted); margin-top:4px} .dash-stats-spark{display:flex; align-items:flex-end; gap:2px; height:72px; margin-top:22px; padding-bottom:4px; border-bottom:1px solid var(--line); overflow:hidden} .dash-stat-bar{flex:1; height:var(--bar-h, 0%); min-height:2px; background:var(--line); border-radius:1px 1px 0 0; transition:height 0.25s ease} .dash-stat-bar.has-views{background:var(--accent)} .dash-stat-bar.is-today{outline:1px solid var(--ink); outline-offset:-1px} body.dark .dash-stat-bar.is-today{outline-color:var(--cream)} .dash-stats-foot{font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); margin-top:12px; line-height:1.5} .dash-stats-foot strong{color:var(--accent-text); font-weight:700} @media (max-width:560px){.dash-stats-head{flex-direction:column} .dash-stats-numbers{width:100%; justify-content:flex-start} .dash-stat-block{text-align:left}} .profile-form{max-width:640px; display:flex; flex-direction:column; gap:18px} .profile-field{display:flex; flex-direction:column; gap:6px} .profile-field label{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--muted)} .profile-field .field-hint{font-family:'Saira', sans-serif; font-size:12px; color:var(--muted)} .profile-field input,.profile-field textarea{font-family:'Saira', sans-serif; font-size:15px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:var(--cream); color:var(--ink); width:100%; box-sizing:border-box} .profile-field input:focus,.profile-field textarea:focus{outline:none; border-color:var(--accent-text); box-shadow:0 0 0 3px rgba(255, 107, 53, 0.16)} body.dark .profile-field input,body.dark .profile-field textarea{background:var(--bg-2); border-color:var(--line); color:var(--ink)} .profile-field textarea{min-height:96px; resize:vertical; font-family:'Saira', sans-serif; line-height:1.5} .profile-field .char-count{font-family:'Saira', sans-serif; font-size:11px; color:var(--muted); text-align:right} .profile-submit{align-self:flex-start; min-height:48px; padding:12px 26px; border:none; border-radius:12px; background:var(--accent); color:var(--cream); font-family:'Stalinist One', 'Saira', sans-serif; font-size:13px; text-transform:uppercase; letter-spacing:0.06em; cursor:pointer} .profile-submit:hover{background:var(--accent-text)} .profile-saved{font-family:'Saira', sans-serif; font-size:12.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent-text); margin-bottom:6px; display:none} .profile-saved.is-shown{display:inline-flex; align-items:center; gap:6px} .stub-card{padding:36px 28px; border:1px dashed var(--line); background:transparent; text-align:center; font-family:'Saira', sans-serif; color:var(--muted); border-radius:var(--radius); max-width:560px; margin:24px auto} .stub-card .stub-eyebrow{font-size:10.5px; font-weight:700; letter-spacing:0.24em; text-transform:uppercase; color:var(--accent-text); margin-bottom:8px} .stub-card .stub-title{font-family:'Stalinist One', 'Saira', sans-serif; font-size:22px; color:var(--ink); margin:0 0 6px; line-height:1.05} .stub-card .stub-title em{font-style:normal; color:var(--accent-text)} .stub-card .stub-sub{font-size:14px; max-width:380px; margin:0 auto; line-height:1.5} body.dark .stub-card{border-color:var(--line)} body.dark .stub-card .stub-sub{color:var(--ink-2)} .pf-page{background:var(--cream); min-height:100vh; padding:80px 24px 64px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; color:var(--ink); position:relative} body.dark .pf-page{background:var(--bg)} .pf-grain{position:absolute; inset:0; background:radial-gradient(circle at 12% 0%, rgba(255, 107, 53, 0.04), transparent 40%), radial-gradient(circle at 88% 100%, rgba(255, 107, 53, 0.03), transparent 50%); pointer-events:none} .pf-shell{max-width:920px; margin:0 auto; position:relative} .pf-hero{position:relative; width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); background:var(--cream); border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); min-height:100vh; display:flex; flex-direction:column} body.dark .pf-hero{background:var(--bg); border-color:var(--cream)} .pf-hero-masthead{display:flex; justify-content:space-between; align-items:center; font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; letter-spacing:0.2em; text-transform:uppercase; padding:24px clamp(24px, 5vw, 80px); border-bottom:1px solid var(--line); flex-shrink:0} .pf-hero-masthead-stamp{color:var(--accent-text); font-weight:700} .pf-hero-masthead-mark{color:var(--ink); font-weight:600} body.dark .pf-hero-masthead-mark{color:var(--cream)} .pf-hero-grid{flex:1; display:grid; grid-template-columns:45fr 55fr; gap:0; align-items:stretch; position:relative; padding:0 clamp(24px, 5vw, 80px); min-height:0} .pf-hero-portrait{display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:22px; padding:clamp(40px, 6vw, 96px) clamp(40px, 5vw, 64px) clamp(40px, 6vw, 96px) 0; min-width:0} .pf-hero-id{display:flex; flex-direction:column; justify-content:center; gap:6px; padding:clamp(40px, 6vw, 96px) 0 clamp(40px, 6vw, 96px) clamp(40px, 5vw, 64px); min-width:0; border-left:2px solid var(--accent)} .pf-avatar-wrap{position:relative; display:inline-block} .pf-avatar{width:clamp(280px, 30vw, 440px); height:clamp(280px, 30vw, 440px); border-radius:2px; background:var(--cream-2); object-fit:cover; display:block; border:1px solid var(--line)} .pf-avatar-bar{position:absolute; left:-10px; top:14px; bottom:14px; width:6px; background:var(--accent); border-radius:1px} .pf-avatar-fallback{display:flex; align-items:center; justify-content:center; font-family:'Stalinist One', sans-serif; font-size:clamp(120px, 14vw, 200px); color:var(--ink); background:var(--cream-2); border:1px solid var(--line); border-radius:2px; width:clamp(280px, 30vw, 440px); height:clamp(280px, 30vw, 440px)} .pf-avatar-fallback[hidden]{display:none} body.dark .pf-avatar{border-color:var(--line)} body.dark .pf-avatar-fallback{background:var(--card-bg); color:var(--cream); border-color:var(--line)} .pf-status{display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border:1px solid var(--green); border-radius:999px; font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--green); background:rgba(46, 168, 105, 0.08)} .pf-status-dot{width:8px; height:8px; border-radius:50%; background:var(--green); animation:pf-pulse 1.8s ease-in-out infinite} @keyframes pf-pulse{0%, 100%{transform:scale(1); opacity:1}50%{transform:scale(1.35); opacity:0.55}} .pf-name{font-family:'Stalinist One', 'Saira', sans-serif; font-size:clamp(48px, 6.5vw, 104px); line-height:0.94; letter-spacing:-0.022em; margin:0 0 16px; color:var(--ink); word-break:break-word} .pf-name em{font-style:italic; color:var(--accent-text)} .pf-role{font-family:'Saira', sans-serif; font-size:15px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--muted); margin-bottom:22px} .pf-loc{display:inline-flex; align-items:center; gap:8px; font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); margin-bottom:22px; padding:5px 11px; border:1px dashed var(--line); border-radius:999px; align-self:flex-start} .pf-loc-mark{color:var(--accent-text); font-size:10px} .pf-bio{font-family:'Saira', sans-serif; font-size:clamp(17px, 1.3vw, 21px); line-height:1.55; margin:0 0 30px; color:var(--ink-2); max-width:60ch; white-space:pre-wrap} body.dark .pf-bio{color:rgba(250, 247, 242, 0.78)} .pf-cta-row{display:flex; flex-wrap:wrap; gap:12px} .pf-cta{display:inline-flex; align-items:center; gap:12px; min-height:52px; padding:16px 26px; background:var(--accent); color:var(--cream); font-family:'Stalinist One', sans-serif; font-size:13px; text-transform:uppercase; letter-spacing:0.06em; text-decoration:none; border-radius:12px; transition:background 0.2s ease, transform 0.15s ease} .pf-cta:hover{background:var(--accent-2); transform:translateY(-1px)} .pf-cta:focus-visible{outline:2px solid var(--accent); outline-offset:3px} .pf-cta-quiet{background:transparent; color:var(--ink); border:1px solid var(--ink)} .pf-cta-quiet:hover{background:var(--ink); color:var(--cream); transform:translateY(-1px)} body.dark .pf-cta-quiet{color:var(--cream); border-color:var(--cream)} body.dark .pf-cta-quiet:hover{background:var(--cream); color:var(--ink)} .pf-cta-arrow{transition:transform 0.2s ease} .pf-cta:hover .pf-cta-arrow{transform:translateX(2px)} .pf-hero-stats{display:flex; flex-wrap:wrap; align-items:baseline; gap:12px 18px; padding:22px clamp(24px, 5vw, 80px); border-top:1px solid var(--line); font-family:'Saira', sans-serif; flex-shrink:0} .pf-stat{display:inline-flex; align-items:baseline; gap:6px} .pf-stat-num{font-family:'Stalinist One', sans-serif; font-size:clamp(18px, 1.4vw, 22px); color:var(--ink); letter-spacing:0} body.dark .pf-stat-num{color:var(--cream)} .pf-stat-lbl{font-size:11px; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted)} .pf-stat-sep{color:var(--line); font-size:13px} body.dark .pf-stat-sep{color:rgba(250, 247, 242, 0.25)} .pf-eyebrow{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text); margin-bottom:10px} .pf-card{background:var(--cream-2); border:1px solid var(--line); padding:24px 26px; border-radius:var(--radius); margin-bottom:22px} body.dark .pf-card{background:var(--card-bg); border-color:var(--line)} .pf-card-eyebrow{font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.24em; text-transform:uppercase; color:var(--muted); margin-bottom:10px} .pf-bio{font-family:'Saira', sans-serif; font-size:17px; line-height:1.6; margin:0; color:var(--ink-2); white-space:pre-wrap} .pf-cta{display:inline-flex; align-items:center; gap:10px; min-height:48px; padding:14px 22px; background:var(--accent); color:var(--cream); font-family:'Stalinist One', sans-serif; font-size:13px; text-transform:uppercase; letter-spacing:0.06em; text-decoration:none; border-radius:12px; transition:background 0.2s ease, transform 0.15s ease} .pf-cta:hover{background:var(--accent-2); transform:translateY(-1px)} .pf-cta:focus-visible{outline:2px solid var(--accent); outline-offset:3px} .pf-foot{margin-top:48px; padding-top:24px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between; font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); letter-spacing:0.08em; text-transform:uppercase} .pf-foot-claim{font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--accent-text); text-decoration:none} .pf-foot-claim:hover{text-decoration:underline} .pf-foot-brand em{font-family:'Stalinist One', sans-serif; font-style:normal; color:var(--ink); letter-spacing:0; text-transform:none; margin-left:6px; font-size:13px} .pf-claim-shell{text-align:center; padding:56px 24px; max-width:560px} .pf-claim-sub{font-family:'Saira', sans-serif; font-size:16px; line-height:1.6; color:var(--ink-2); margin:8px 0 28px; max-width:460px; margin-left:auto; margin-right:auto} @media (max-width:900px){.pf-hero{min-height:auto} .pf-hero-grid{grid-template-columns:220px minmax(0, 1fr); padding:0 26px} .pf-hero-portrait{padding:36px 28px 36px 0} .pf-hero-id{padding:36px 0 36px 28px} .pf-avatar{width:220px; height:220px} .pf-avatar-fallback{width:220px; height:220px; font-size:88px} .pf-avatar-bar{left:-7px; top:10px; bottom:10px; width:5px} .pf-bio{font-size:16px}} @media (max-width:640px){.pf-page{padding:56px 20px 48px} .pf-hero{min-height:auto} .pf-hero-masthead{font-size:9.5px; padding:16px 20px; letter-spacing:0.14em} .pf-hero-grid{grid-template-columns:1fr; padding:0 20px} .pf-hero-portrait{flex-direction:row; align-items:center; justify-content:flex-start; gap:16px; padding:24px 0 24px 0; border-bottom:2px solid var(--accent)} .pf-hero-id{padding:24px 0 28px 0; border-left:0} .pf-avatar-wrap{padding-left:0} .pf-avatar{width:96px; height:96px} .pf-avatar-fallback{width:96px; height:96px; font-size:38px} .pf-avatar-bar{left:-6px; top:6px; bottom:6px; width:4px} .pf-name{font-size:clamp(36px, 9vw, 52px); margin-bottom:10px} .pf-bio{font-size:15.5px; margin-bottom:22px} .pf-cta-row{flex-direction:column; align-items:stretch} .pf-cta{justify-content:center} .pf-hero-stats{gap:8px 12px; padding:16px 20px} .pf-stat-lbl{font-size:9.5px} .pf-foot{flex-direction:column; align-items:flex-start; gap:12px}} @media (prefers-reduced-motion:reduce){.pf-status-dot, .pf-cta, .pf-cta-arrow{animation:none !important; transition:none !important}} .profile-field-toggle{padding:18px 22px; border:1px solid var(--line); border-radius:var(--radius); background:var(--cream-2)} body.dark .profile-field-toggle{background:var(--card-bg); border-color:var(--line)} .toggle-row{display:flex; align-items:center; gap:18px; cursor:pointer; margin:0} .toggle-text{flex:1; min-width:0} .toggle-label{display:block; font-family:'Saira', sans-serif; font-size:14px; font-weight:700; color:var(--ink); margin-bottom:4px; letter-spacing:0.01em} .toggle-row input[type="checkbox"]{position:absolute; width:1px; height:1px; opacity:0; pointer-events:none} .toggle-track{position:relative; flex-shrink:0; width:48px; height:28px; background:var(--line); border-radius:999px; transition:background 0.18s ease} .toggle-thumb{position:absolute; top:3px; left:3px; width:22px; height:22px; background:var(--cream); border-radius:50%; box-shadow:0 1px 3px rgba(15, 20, 25, 0.18); transition:transform 0.18s ease} .toggle-row input[type="checkbox"]:checked ~ .toggle-track{background:var(--accent)} .toggle-row input[type="checkbox"]:checked ~ .toggle-track .toggle-thumb{transform:translateX(20px)} .toggle-row input[type="checkbox"]:focus-visible ~ .toggle-track{outline:2px solid var(--accent); outline-offset:3px} body.dark .toggle-thumb{background:var(--cream)} .share-locked{display:flex; gap:14px; align-items:flex-start; padding:16px 22px; margin:16px 0 32px; border:1px solid #d4a017; background:#fff8e7; color:#5c4400; border-radius:var(--radius); font-family:'Saira', sans-serif; font-size:14px; line-height:1.55} body.dark .share-locked{background:#2a2510; border-color:#d4a017; color:#f5e1a4} .share-locked a{color:var(--accent-text); text-decoration:underline} .share-locked-dot{flex-shrink:0; width:10px; height:10px; border-radius:50%; background:#d4a017; margin-top:6px} .share-locked em{font-style:italic} .share-grid{display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:22px; margin-bottom:28px} .share-card{background:var(--cream-2); border:1px solid var(--line); border-radius:var(--radius); padding:24px 26px} body.dark .share-card{background:var(--card-bg); border-color:var(--line)} .share-card-eyebrow{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--muted); margin-bottom:16px} .share-social-card{grid-column:1 / -1} .share-qr-card{display:flex; flex-direction:column; align-items:center; text-align:center} .share-qr-frame{width:232px; height:232px; background:#fff; border:1px solid var(--line); border-radius:8px; padding:12px; margin-bottom:16px; display:flex; align-items:center; justify-content:center} .share-qr-img{width:100%; height:100%; display:block; image-rendering:pixelated} .share-qr-download{font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent-text); text-decoration:none; border:1px solid var(--line); border-radius:999px; padding:9px 18px; transition:background 0.15s ease, border-color 0.15s ease} .share-qr-download:hover{background:var(--accent); color:var(--cream); border-color:var(--accent-text)} .share-link-row{display:flex; gap:8px; align-items:stretch; margin-bottom:8px} .share-link-text{flex:1; font-family:'Saira', sans-serif; font-size:13px; font-weight:600; background:#fff; border:1px solid var(--line); border-radius:8px; padding:12px 14px; color:var(--ink); word-break:break-all; overflow-x:auto} body.dark .share-link-text{background:var(--bg-2); color:var(--ink)} .share-copy-btn{flex-shrink:0; font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; background:var(--accent); color:var(--cream); border:none; border-radius:8px; padding:0 18px; cursor:pointer; transition:background 0.15s ease} .share-copy-btn:hover{background:var(--accent-text)} .share-copy-btn.is-copied{background:#2a7a44} .share-status{font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); min-height:18px; margin-bottom:14px} .share-link-meta{font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); line-height:1.55} .share-link-meta em{font-style:italic; color:var(--accent-text); font-weight:600} .share-action{display:flex; align-items:center; gap:16px; padding:16px 22px; margin-bottom:10px; border-radius:var(--radius); text-decoration:none; color:#fff; transition:transform 0.15s ease, box-shadow 0.15s ease} .share-action:last-child{margin-bottom:0} .share-action:hover{transform:translateY(-1px); box-shadow:0 4px 14px rgba(15, 20, 25, 0.16)} .share-action-wa{background:#25d366} .share-action-li{background:#0a66c2} .share-action-mail{background:var(--ink-2)} .share-action-tw{background:#000} body.dark .share-action-mail{background:var(--muted)} .share-action-name{font-family:'Stalinist One', sans-serif; font-size:16px; text-transform:uppercase; letter-spacing:0.04em; flex:1} .share-action-sub{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:500; text-transform:uppercase; letter-spacing:0.18em; opacity:0.86; flex-shrink:0} .share-action-arrow{font-family:'Saira', sans-serif; font-size:20px; font-weight:700; flex-shrink:0} .share-og{background:var(--cream-2); border:1px solid var(--line); border-radius:var(--radius); padding:24px 26px; margin-bottom:32px} body.dark .share-og{background:var(--card-bg); border-color:var(--line)} .share-og-card{display:grid; grid-template-columns:minmax(0, 360px) minmax(0, 1fr); gap:22px; align-items:center; text-decoration:none; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:8px; padding:14px; transition:transform 0.15s ease} body.dark .share-og-card{background:var(--bg-2)} .share-og-card:hover{transform:translateY(-1px)} .share-og-image{width:100%; aspect-ratio:1.91 / 1; background:var(--cream-2); border-radius:6px; overflow:hidden} body.dark .share-og-image{background:var(--cream)} .share-og-img{width:100%; height:100%; object-fit:cover; display:block} .share-og-meta{font-family:'Saira', sans-serif; padding:6px 4px} .share-og-domain{font-size:11px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted); margin-bottom:6px} .share-og-title{font-family:'Stalinist One', sans-serif; font-size:18px; line-height:1.18; margin-bottom:6px; color:var(--ink); letter-spacing:0.01em} .share-og-desc{font-size:13px; line-height:1.5; color:var(--ink-2); margin-bottom:8px} body.dark .share-og-desc{color:var(--ink-2)} .share-og-url{font-size:11.5px; color:var(--muted); text-transform:uppercase; letter-spacing:0.08em} .share-og-hint{margin-top:14px; font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); line-height:1.55} .share-og-hint code{font-size:11.5px; background:#fff; border:1px solid var(--line); border-radius:4px; padding:1px 6px} body.dark .share-og-hint code{background:var(--bg-2)} @media (max-width:720px){.share-grid{grid-template-columns:1fr} .share-og-card{grid-template-columns:1fr} .share-link-row{flex-direction:column} .share-copy-btn{padding:12px 18px}} .meter-pro-card{padding:28px 30px} .dash-card-actions{margin-top:18px; display:flex; flex-wrap:wrap; gap:10px} .dash-table{width:100%; border-collapse:collapse; font-family:'Saira', sans-serif; font-size:13px; margin-top:14px} .dash-table th, .dash-table td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--line)} .dash-table th{font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted)} body.dark .dash-table th, body.dark .dash-table td{border-color:var(--line)} .dash-badge{display:inline-block; padding:3px 9px; font-size:11px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; border-radius:999px; border:1px solid var(--line); color:var(--ink); background:var(--cream-2)} .dash-badge-captured{background:rgba(255,107,53,0.12); color:var(--accent-text); border-color:var(--accent-text)} .dash-badge-failed{background:rgba(180,40,40,0.08); color:#b42828; border-color:#b42828} .dash-badge-refunded{background:rgba(120,120,120,0.10); color:var(--muted)} body.dark .dash-badge{background:var(--card-bg)} .fm-shell{flex:1; width:100%; max-width:var(--container); margin:0 auto; padding:28px 28px 60px; display:flex; flex-direction:column; gap:24px; font-family:'Saira', sans-serif} .fm-top{display:flex; align-items:center; gap:24px; padding-bottom:18px; border-bottom:1px solid var(--line)} .fm-brand{font-family:'Stalinist One', 'Saira', sans-serif; font-weight:400; font-size:22px; letter-spacing:-0.01em; color:var(--ink); text-decoration:none; flex-shrink:0} .fm-brand-dot{color:var(--accent-text)} .fm-tabs{display:flex; gap:4px; align-items:center; flex:1} .fm-tab{font-family:'Saira', sans-serif; font-size:13.5px; font-weight:600; letter-spacing:0.01em; color:var(--muted); text-decoration:none; padding:8px 14px; border-radius:999px; border:1px solid transparent; transition:color 0.15s ease, background 0.15s ease, border-color 0.15s ease} .fm-tab:hover{color:var(--ink); background:var(--cream-2)} .fm-tab.is-active{color:var(--ink); background:var(--cream-2); border-color:var(--line)} .fm-top-right{display:flex; gap:8px; align-items:center; flex-shrink:0} .fm-plan-pill{display:inline-flex; align-items:center; font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.03em; padding:7px 12px; border-radius:999px; border:1px solid; text-decoration:none; white-space:nowrap; transition:transform 0.18s ease, box-shadow 0.18s ease} .fm-plan-pill:hover{transform:translateY(-1px)} .fm-plan-pill-internal{background:linear-gradient(180deg, rgba(74,157,111,0.14), rgba(74,157,111,0.06)); border-color:#4a9d6f; color:#2e6e4a} .fm-plan-pill-trial{background:linear-gradient(180deg, rgba(255,107,53,0.10), rgba(255,107,53,0.04)); border-color:var(--accent-text); color:var(--accent-text)} .fm-plan-pill-trial:hover{box-shadow:0 4px 14px -4px rgba(255,107,53,0.5)} .fm-plan-pill-grace{background:linear-gradient(180deg, rgba(180,40,40,0.10), rgba(180,40,40,0.04)); border-color:#b42828; color:#b42828} .fm-plan-pill-pro{background:linear-gradient(180deg, rgba(255,107,53,0.08), rgba(255,107,53,0.02)); border-color:rgba(255,107,53,0.4); color:var(--ink)} .fm-plan-pill-free{background:var(--ink); border-color:var(--ink); color:var(--cream)} .fm-share-btn{font-family:'Saira', sans-serif; font-size:12.5px; font-weight:700; letter-spacing:0.03em; padding:7px 14px; border-radius:999px; border:1px solid var(--ink); background:var(--ink); color:var(--cream); cursor:pointer; transition:transform 0.18s ease; white-space:nowrap} .fm-share-btn:hover{transform:translateY(-1px)} .fm-share-btn[aria-expanded="true"]{background:var(--accent); border-color:var(--accent-text); color:#FFFFFF} .fm-share-popover{background:var(--card-bg); border:1px solid var(--line); border-radius:14px; padding:18px; display:flex; flex-direction:column; gap:14px; box-shadow:var(--shadow); animation:fm-pop-in 0.18s ease-out} @keyframes fm-pop-in{from{opacity:0; transform:translateY(-4px)} to{opacity:1; transform:translateY(0)}} .fm-share-popover[hidden]{display:none} .fm-share-row{display:flex; align-items:center; gap:10px; padding:10px 14px; background:var(--cream-2); border-radius:10px} .fm-share-link{flex:1; font-family:'SFMono-Regular', Menlo, monospace; font-size:12.5px; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .fm-share-copy{font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; padding:6px 12px; border-radius:999px; border:1px solid var(--ink); background:transparent; color:var(--ink); cursor:pointer; transition:background 0.15s ease, color 0.15s ease; flex-shrink:0} .fm-share-copy:hover{background:var(--ink); color:var(--cream)} .fm-share-copy.is-copied{background:var(--accent); border-color:var(--accent-text); color:#FFFFFF} .fm-share-actions{display:grid; grid-template-columns:repeat(4, 1fr); gap:8px} .fm-share-action{display:flex; flex-direction:column; gap:2px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; text-decoration:none; color:var(--ink); transition:border-color 0.15s ease, background 0.15s ease, transform 0.15s ease} .fm-share-action:hover{border-color:var(--accent-text); background:var(--accent-50); transform:translateY(-1px)} .fm-share-action-name{font-family:'Saira', sans-serif; font-size:13px; font-weight:700} .fm-share-action-sub{font-family:'Saira', sans-serif; font-size:10.5px; color:var(--muted); letter-spacing:0.04em} .fm-share-hint{font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); padding:10px 12px; background:var(--cream-2); border-radius:8px; line-height:1.4} .fm-share-hint em{color:var(--accent-text); font-style:normal; font-weight:600} .fm-grid{display:grid; grid-template-columns:1.62fr 1fr; gap:22px; align-items:start} .fm-editor{background:var(--card-bg); border:1px solid var(--line); border-radius:16px; padding:30px 30px 26px; display:flex; flex-direction:column; gap:14px} .fm-editor-eyebrow{font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--accent-text); margin-bottom:-4px} .fm-editor-title{font-family:'Saira', sans-serif; font-weight:800; font-size:clamp(28px, 3.4vw, 38px); line-height:1.05; letter-spacing:-0.025em; color:var(--ink); margin:0} .fm-editor-title em{font-style:italic; color:var(--accent-text); font-weight:700} .fm-editor-sub{font-family:'Saira', sans-serif; font-size:13.5px; color:var(--muted); line-height:1.5; margin:0 0 8px} .fm-flash{font-family:'Saira', sans-serif; font-size:13px; font-weight:600; padding:10px 14px; border-radius:10px; letter-spacing:0.01em} .fm-flash-ok{background:rgba(74,157,111,0.12); color:#2e6e4a; border:1px solid #4a9d6f} .fm-flash-warn{background:rgba(180,40,40,0.08); color:#b42828; border:1px solid #b42828} .fm-base-pill{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; padding:10px 14px; margin-bottom:14px; border:1px solid var(--line, rgba(0,0,0,0.10)); border-radius:10px; background:var(--bg-soft, rgba(0,0,0,0.02)); font-family:'Saira', sans-serif} .fm-base-pill-eyebrow{font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-dim, #707070)} .fm-base-pill-name{font-size:14px; font-weight:700; color:var(--text, #1a1a1a)} .fm-base-pill-sub{font-size:12px; color:var(--text-dim, #707070)} .fm-base-pill-sub a{color:var(--accent, #c14b2a); text-decoration:none; font-weight:600} .fm-base-pill-sub a:hover{text-decoration:underline} .fm-li-mirror{position:absolute; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none} .fm-li-mirror[aria-hidden="true"]{display:block} .fm-autofill{display:flex; align-items:flex-start; gap:10px; padding:12px 14px; background:rgba(255, 107, 53, 0.06); border:1px dashed var(--accent); border-radius:10px; font-family:'Saira', sans-serif; font-size:13px; color:var(--ink-2)} .fm-autofill[hidden]{display:none} .fm-autofill-mark{color:var(--accent-text); font-weight:700; font-family:'Stalinist One', sans-serif; font-size:14px; line-height:1.4} .fm-autofill-text{flex:1; line-height:1.5} .fm-autofill-btn{background:none; border:0; padding:0; font-family:inherit; font-size:inherit; font-weight:700; color:var(--accent-text); text-decoration:underline; text-underline-offset:3px; cursor:pointer} .fm-autofill-btn:hover{color:var(--accent-2)} .fm-autofill-btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:2px} .fm-form{display:flex; flex-direction:column; gap:14px; margin-top:6px} .fm-field{display:flex; flex-direction:column; gap:6px} .fm-field > label{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase; color:var(--muted)} .fm-field-hint{font-family:'Saira', sans-serif; font-size:11px; font-weight:500; color:var(--muted); text-transform:none; letter-spacing:0} .fm-field input,.fm-field textarea{font-family:'Saira', sans-serif; font-size:15px; color:var(--ink); padding:11px 14px; border:1px solid var(--line); border-radius:10px; background:var(--cream); transition:border-color 0.15s ease, background 0.15s ease; outline:none; width:100%; box-sizing:border-box} .fm-field input:focus,.fm-field textarea:focus{border-color:var(--accent-text); background:var(--card-bg)} .fm-field textarea{min-height:84px; resize:vertical; line-height:1.45} .fm-counter{font-family:'Saira', sans-serif; font-size:11px; color:var(--muted); text-align:right; margin-top:-2px} .fm-counter.is-near{color:var(--accent-text); font-weight:700} .fm-field-toggle{margin-top:2px} .fm-toggle-row{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 16px; border:1px solid var(--line); border-radius:10px; cursor:pointer; background:var(--cream)} .fm-toggle-row input[type="checkbox"]{position:absolute; opacity:0; pointer-events:none; width:0; height:0} .fm-toggle-text{display:flex; flex-direction:column; gap:2px; flex:1; min-width:0} .fm-toggle-label{font-family:'Saira', sans-serif; font-size:13.5px; font-weight:600; color:var(--ink); letter-spacing:0; text-transform:none} .fm-toggle-row code{font-family:'SFMono-Regular', Menlo, monospace; font-size:11.5px; color:var(--accent-text); background:var(--cream-2); padding:1px 6px; border-radius:4px} .fm-toggle-track{position:relative; width:38px; height:22px; background:var(--line); border-radius:999px; flex-shrink:0; transition:background 0.18s ease} .fm-toggle-thumb{position:absolute; top:2px; left:2px; width:18px; height:18px; background:#FFFFFF; border-radius:50%; transition:transform 0.18s ease; box-shadow:0 1px 3px rgba(0,0,0,0.15)} .fm-toggle-row input[type="checkbox"]:checked ~ .fm-toggle-track{background:var(--accent)} .fm-toggle-row input[type="checkbox"]:checked ~ .fm-toggle-track .fm-toggle-thumb{transform:translateX(16px)} .fm-save{font-family:'Saira', sans-serif; font-size:14px; font-weight:700; letter-spacing:0.03em; padding:14px 22px; border-radius:999px; border:1px solid var(--accent); background:var(--accent); color:#FFFFFF; cursor:pointer; align-self:flex-start; margin-top:4px; transition:transform 0.18s ease, box-shadow 0.18s ease} .fm-save:hover{transform:translateY(-1px); box-shadow:0 6px 18px -6px rgba(255,107,53,0.6)} .fm-side{display:flex; flex-direction:column; gap:16px} .fm-card{background:var(--card-bg); border:1px solid var(--line); border-radius:14px; padding:22px 22px 18px; display:flex; flex-direction:column; gap:14px} .fm-card-eyebrow{font-family:'Saira', sans-serif; font-size:10.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted)} .fm-card-numbers{display:flex; gap:24px} .fm-card-stat{display:flex; flex-direction:column; gap:2px} .fm-card-num{font-family:'Saira', sans-serif; font-size:30px; font-weight:800; letter-spacing:-0.02em; line-height:1; color:var(--ink)} .fm-card-label{font-family:'Saira', sans-serif; font-size:11px; font-weight:600; color:var(--muted); letter-spacing:0.06em; text-transform:uppercase} .fm-card-spark{display:flex; align-items:flex-end; gap:3px; height:56px; padding:8px 0 4px; border-top:1px solid var(--line); border-bottom:1px solid var(--line)} .fm-card-bar{flex:1; background:var(--cream-2); border-radius:2px; min-height:2px; height:var(--bar-h, 2%); transition:background 0.15s ease} .fm-card-bar.has-views{background:var(--accent)} .fm-card-bar.is-today{outline:1px solid var(--ink); outline-offset:-1px} .fm-card-foot{font-family:'Saira', sans-serif; font-size:11.5px; color:var(--muted); line-height:1.4} .fm-card-link-text{font-family:'SFMono-Regular', Menlo, monospace; font-size:13px; color:var(--ink); padding:10px 12px; background:var(--cream); border:1px solid var(--line); border-radius:8px; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .fm-card-link-cta{font-family:'Saira', sans-serif; font-size:12.5px; font-weight:700; letter-spacing:0.03em; padding:10px 14px; border-radius:999px; border:1px solid var(--ink); background:transparent; color:var(--ink); text-decoration:none; text-align:center; transition:background 0.15s ease, color 0.15s ease} .fm-card-link-cta:hover{background:var(--ink); color:var(--cream)} .fm-card-template{gap:14px} .fm-template-row{display:flex; align-items:center; gap:12px; padding:4px 0 2px} .fm-template-mark{flex:0 0 auto; width:44px; height:44px; border-radius:10px; background:var(--accent); color:var(--cream); display:inline-flex; align-items:center; justify-content:center; font-family:'Saira', sans-serif; font-size:22px; font-weight:800; letter-spacing:-0.01em; line-height:1} .fm-template-meta{display:flex; flex-direction:column; gap:2px; min-width:0} .fm-template-name{font-family:'Saira', sans-serif; font-size:16px; font-weight:700; color:var(--ink); letter-spacing:-0.005em; line-height:1.2} .fm-template-sub{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:500; color:var(--muted); letter-spacing:0.02em} .fm-template-cta{font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.04em; padding:8px 14px; border-radius:999px; border:1px solid var(--line-strong, rgba(15, 20, 25, 0.18)); background:transparent; color:var(--ink); text-decoration:none; text-align:center; transition:background 0.15s ease, color 0.15s ease, border-color 0.15s ease} .fm-template-cta:hover{background:var(--ink); color:var(--cream); border-color:var(--ink)} body.dark .fm-template-mark{background:var(--accent); color:var(--ink)} body.dark .fm-template-name{color:var(--cream)} body.dark .fm-template-cta{color:var(--cream); border-color:rgba(250, 247, 242, 0.22)} body.dark .fm-template-cta:hover{background:var(--cream); color:var(--ink); border-color:var(--cream)} .fm-card-connections{gap:12px} .fm-conn-list{display:flex; flex-direction:column; gap:10px} .fm-conn-row{display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--cream-2)} body.dark .fm-conn-row{background:rgba(255, 255, 255, 0.04); border-color:var(--line)} .fm-conn-icon{display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:8px; background:var(--cream); flex-shrink:0} body.dark .fm-conn-icon{background:rgba(255, 255, 255, 0.08)} .fm-conn-icon svg{display:block} .fm-conn-meta{flex:1; min-width:0} .fm-conn-name{font-size:13px; font-weight:700; color:var(--ink); letter-spacing:0.02em} body.dark .fm-conn-name{color:var(--cream)} .fm-conn-state{font-size:11.5px; color:var(--muted); margin-top:2px; word-break:break-all; line-height:1.4} .fm-conn-state.is-linked{color:#1f6b3a} body.dark .fm-conn-state.is-linked{color:#6ddc8c} .fm-conn-form{margin:0} .fm-conn-btn{font:inherit; font-size:11.5px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; padding:7px 12px; border-radius:999px; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; white-space:nowrap; border:1px solid var(--line-strong); background:transparent; color:var(--ink); transition:background 0.15s ease, border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease} .fm-conn-btn:hover{background:var(--cream); border-color:var(--ink)} .fm-conn-btn-connect{background:var(--ink); color:var(--cream); border-color:var(--ink)} .fm-conn-btn-connect:hover{background:var(--accent-text); border-color:var(--accent-text)} .fm-conn-btn:disabled{opacity:0.4; cursor:not-allowed} body.dark .fm-conn-btn{color:var(--cream); border-color:var(--line)} body.dark .fm-conn-btn:hover{background:rgba(255, 255, 255, 0.08); border-color:var(--cream)} body.dark .fm-conn-btn-connect{background:var(--accent); border-color:var(--accent-text); color:var(--ink)} body.dark .fm-conn-btn-connect:hover{background:var(--accent); border-color:var(--accent-text); opacity:0.85} .fm-conn-empty{font-size:12.5px; color:var(--muted); line-height:1.55; padding:4px 0} .fm-conn-empty code{font-family:'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace; background:var(--cream-2); padding:1px 6px; border-radius:4px; font-size:11.5px; color:var(--ink)} body.dark .fm-conn-empty code{background:rgba(255, 255, 255, 0.08); color:var(--cream)} .fm-conn-err{font-size:12px; color:#b03a1a; background:rgba(255, 107, 53, 0.10); border-left:3px solid var(--accent); padding:8px 12px; border-radius:6px; line-height:1.5} body.dark .fm-conn-err{color:var(--accent-text); background:rgba(255, 107, 53, 0.10)} .fm-conn-ok{font-size:12px; color:#1f6b3a; background:rgba(31, 107, 58, 0.08); border-left:3px solid #1f6b3a; padding:8px 12px; border-radius:6px} body.dark .fm-conn-ok{color:#6ddc8c; background:rgba(109, 220, 140, 0.10); border-left-color:#6ddc8c} .fm-foot{display:flex; justify-content:space-between; align-items:center; padding-top:18px; border-top:1px solid var(--line); gap:14px} .fm-foot-link{font-family:'Saira', sans-serif; font-size:12px; font-weight:600; color:var(--muted); text-decoration:none; padding:6px 10px; border-radius:8px; background:transparent; border:none; cursor:pointer; transition:color 0.15s ease, background 0.15s ease} .fm-foot-link:hover{color:var(--ink); background:var(--cream-2)} .fm-foot-form{display:inline; margin:0; padding:0} body.dark .fm-tab.is-active{background:var(--cream-2); border-color:var(--line)} body.dark .fm-share-popover{background:var(--card-bg)} body.dark .fm-editor,body.dark .fm-card{background:var(--card-bg)} body.dark .fm-field input,body.dark .fm-field textarea,body.dark .fm-toggle-row,body.dark .fm-card-link-text{background:var(--cream)} body.dark .fm-plan-pill-free{background:var(--ink); color:var(--cream)} .fm-bill-figure{display:grid; grid-template-columns:1.1fr 1.4fr; gap:22px; align-items:stretch; padding:22px; border:1px solid var(--line); border-radius:14px; background:var(--cream)} .fm-bill-figure-main{display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:2px; padding-right:18px; border-right:1px solid var(--line)} .fm-bill-figure-num{font-family:'Saira', sans-serif; font-size:clamp(46px, 5.4vw, 64px); font-weight:800; letter-spacing:-0.025em; line-height:0.95; color:var(--ink)} .fm-bill-figure-unit{font-family:'Saira', sans-serif; font-size:13px; font-weight:600; color:var(--muted); letter-spacing:0.04em; margin-top:4px} .fm-bill-figure-detail{display:flex; flex-direction:column; gap:8px; justify-content:center} .fm-bill-figure-row{display:flex; justify-content:space-between; align-items:baseline; gap:14px; font-family:'Saira', sans-serif; font-size:13px; color:var(--muted); padding:6px 0; border-bottom:1px dashed var(--line)} .fm-bill-figure-row:last-child{border-bottom:0} .fm-bill-figure-row strong{font-weight:700; color:var(--ink)} .fm-bill-section{display:flex; flex-direction:column; gap:12px; padding-top:6px} .fm-bill-section + .fm-bill-section{margin-top:6px; padding-top:22px; border-top:1px solid var(--line)} .fm-bill-section-eyebrow{font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--accent-text)} .fm-bill-section-title{font-family:'Saira', sans-serif; font-size:clamp(22px, 2.4vw, 28px); font-weight:800; letter-spacing:-0.022em; line-height:1.1; color:var(--ink); margin:0} .fm-bill-section-title em{font-style:italic; color:var(--accent-text); font-weight:700} .fm-bill-list{list-style:none; padding:0; margin:4px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:8px 22px} .fm-bill-list li{display:flex; gap:8px; align-items:flex-start; font-family:'Saira', sans-serif; font-size:13px; line-height:1.45; color:var(--ink); padding:8px 0} .fm-bill-list li strong{font-weight:700} .fm-bill-list-bullet{color:var(--accent-text); font-weight:800; flex-shrink:0; font-size:15px; line-height:1.1} .fm-bill-steps{list-style:none; padding:0; margin:4px 0 0; display:flex; flex-direction:column; gap:14px; counter-reset:billstep} .fm-bill-step{display:grid; grid-template-columns:48px 1fr; gap:14px; align-items:flex-start; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--cream)} .fm-bill-step-num{font-family:'Saira', sans-serif; font-size:22px; font-weight:800; color:var(--accent-text); letter-spacing:-0.02em; line-height:1} .fm-bill-step-title{font-family:'Saira', sans-serif; font-size:14.5px; font-weight:700; color:var(--ink); margin-bottom:2px} .fm-bill-step-body p{font-family:'Saira', sans-serif; font-size:13px; color:var(--muted); margin:0; line-height:1.45} .fm-bill-faq{gap:0} .fm-bill-faq-item{border-top:1px solid var(--line); padding:0} .fm-bill-faq-item:last-of-type{border-bottom:1px solid var(--line)} .fm-bill-faq-item summary{font-family:'Saira', sans-serif; font-size:14px; font-weight:600; color:var(--ink); padding:14px 36px 14px 0; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px} .fm-bill-faq-item summary::-webkit-details-marker{display:none} .fm-bill-faq-icon{width:12px; height:12px; position:relative; flex-shrink:0} .fm-bill-faq-icon::before,.fm-bill-faq-icon::after{content:''; position:absolute; background:var(--ink); border-radius:1px; transition:transform 0.18s ease} .fm-bill-faq-icon::before{left:5px; top:0; width:2px; height:12px} .fm-bill-faq-icon::after{left:0; top:5px; width:12px; height:2px} .fm-bill-faq-item[open] .fm-bill-faq-icon::before{transform:rotate(90deg)} .fm-bill-faq-body{font-family:'Saira', sans-serif; font-size:13.5px; color:var(--ink); line-height:1.55; padding:0 0 16px} .fm-bill-faq-body p{margin:0} .fm-bill-faq-body code{font-family:'SFMono-Regular', Menlo, monospace; font-size:12px; background:var(--cream-2); padding:1px 6px; border-radius:4px} .fm-card-plan-hero{display:flex; align-items:baseline; gap:6px; padding:4px 0 2px} .fm-card-plan-num{font-family:'Saira', sans-serif; font-size:38px; font-weight:800; letter-spacing:-0.02em; line-height:1; color:var(--ink)} .fm-card-plan-unit{font-family:'Saira', sans-serif; font-size:12px; font-weight:600; color:var(--muted); letter-spacing:0.04em} .fm-card-plan-rows{display:flex; flex-direction:column; gap:0} .fm-card-row{display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); font-family:'Saira', sans-serif; font-size:13px} .fm-card-row:last-child{border-bottom:0} .fm-card-row-key{font-weight:600; color:var(--muted); letter-spacing:0.04em; text-transform:uppercase; font-size:10.5px} .fm-card-row-val{color:var(--ink); font-weight:600; text-align:right; word-break:break-word} .fm-card-cta-row{display:flex; flex-wrap:wrap; gap:8px; margin-top:4px} .fm-card-cta{font-family:'Saira', sans-serif; font-size:13px; font-weight:700; letter-spacing:0.03em; padding:11px 18px; border-radius:999px; border:1px solid var(--accent); background:var(--accent); color:#FFFFFF; cursor:pointer; transition:transform 0.18s ease, box-shadow 0.18s ease; flex:1 1 auto; text-align:center} .fm-card-cta:hover{transform:translateY(-1px); box-shadow:0 6px 18px -6px rgba(255,107,53,0.6)} .fm-card-cancel{font-family:'Saira', sans-serif; font-size:12.5px; font-weight:700; letter-spacing:0.03em; padding:10px 16px; border-radius:999px; border:1px solid var(--ink); background:transparent; color:var(--ink); cursor:pointer; transition:background 0.15s ease, color 0.15s ease} .fm-card-cancel:hover{background:var(--ink); color:var(--cream)} .fm-card-inline-form{margin:0; flex:1 1 auto; display:flex} .fm-card-inline-form .fm-card-cancel{width:100%} .fm-card-compare-table{width:100%; border-collapse:collapse; font-family:'Saira', sans-serif; font-size:12.5px; margin-top:-2px} .fm-card-compare-table th{text-align:left; font-weight:700; font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); padding:6px 8px; border-bottom:1px solid var(--line)} .fm-card-compare-table th:nth-child(2),.fm-card-compare-table th:nth-child(3){text-align:center} .fm-card-compare-table td{padding:9px 8px; border-bottom:1px solid var(--line); color:var(--ink)} .fm-card-compare-table tbody tr:last-child td{border-bottom:0} .fm-card-compare-table td:nth-child(2),.fm-card-compare-table td:nth-child(3){text-align:center; font-weight:700} .fm-card-receipt-list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column} .fm-card-receipt-row{display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; padding:12px 0; border-bottom:1px solid var(--line); font-family:'Saira', sans-serif} .fm-card-receipt-row:last-child{border-bottom:0} .fm-card-receipt-date{font-size:11.5px; color:var(--muted); white-space:nowrap; font-feature-settings:"tnum" 1} .fm-card-receipt-meta{min-width:0} .fm-card-receipt-desc{font-size:13px; font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .fm-card-receipt-sub{font-size:11px; color:var(--muted); margin-top:2px; display:flex; gap:10px; align-items:center; flex-wrap:wrap} .fm-card-receipt-sub a{color:var(--accent-text); font-weight:600; text-decoration:none} .fm-card-receipt-amount{font-size:14px; font-weight:700; color:var(--ink); font-feature-settings:"tnum" 1} .fm-card-empty{display:flex; flex-direction:column; gap:4px; padding:16px 0 4px} .fm-card-empty-title{font-family:'Saira', sans-serif; font-size:14px; font-weight:700; color:var(--ink)} @media (max-width:720px){.fm-bill-figure{grid-template-columns:1fr} .fm-bill-figure-main{border-right:0; border-bottom:1px solid var(--line); padding:0 0 14px} .fm-bill-list{grid-template-columns:1fr} .fm-bill-step{grid-template-columns:36px 1fr}} @media (max-width:900px){.fm-shell{padding:16px 16px 40px} .fm-top{flex-wrap:wrap; gap:10px} .fm-tabs{order:3; width:100%; flex:none} .fm-top-right{margin-left:auto} .fm-grid{grid-template-columns:1fr; gap:16px} .fm-editor{padding:22px 18px} .fm-share-actions{grid-template-columns:repeat(2, 1fr)} .fm-card-num{font-size:26px}} @media (prefers-reduced-motion:reduce){.fm-share-popover{animation:none}} .fm-field-avatar{display:flex; flex-direction:column; gap:10px} .fm-avatar-current{display:flex; align-items:center; gap:16px; padding:14px; border:1px solid var(--line); border-radius:10px; background:var(--card-bg)} .fm-avatar-thumb{width:72px; height:72px; border-radius:999px; object-fit:cover; border:1px solid var(--line); flex-shrink:0} .fm-avatar-actions{display:flex; gap:8px; flex-wrap:wrap} .fm-avatar-btn{font:inherit; font-size:13px; font-weight:600; padding:8px 14px; border-radius:999px; border:1px solid var(--ink); background:var(--ink); color:var(--cream); cursor:pointer; transition:opacity 0.15s ease} .fm-avatar-btn:hover{opacity:0.85} .fm-avatar-btn-quiet{background:transparent; color:var(--ink)} .fm-avatar-btn:disabled{opacity:0.4; cursor:not-allowed} .fm-avatar-dropzone{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:32px 16px; border:2px dashed var(--line); border-radius:10px; background:var(--card-bg); cursor:pointer; text-align:center; transition:border-color 0.15s ease, background 0.15s ease} .fm-avatar-dropzone:hover{border-color:var(--accent-text)} .fm-avatar-dropzone.is-dragover{border-color:var(--accent-text); background:rgba(255, 107, 53, 0.06)} .fm-avatar-dropzone-icon{font-size:28px; font-weight:700; color:var(--accent-text); margin-bottom:4px} .fm-avatar-dropzone-label{font-size:14px; font-weight:600; color:var(--ink)} .fm-avatar-dropzone-sub{font-size:12px; color:var(--ink-soft)} .fm-avatar-progress{display:flex; flex-direction:column; gap:6px} .fm-avatar-progress[hidden]{display:none} .fm-avatar-progress-bar{height:6px; background:var(--line); border-radius:999px; overflow:hidden} .fm-avatar-progress-fill{height:100%; width:0%; background:var(--accent); transition:width 0.2s ease} .fm-avatar-progress-text{font-size:12px; color:var(--ink-soft)} .fm-avatar-error{font-size:13px; color:var(--accent-text); padding:8px 12px; background:rgba(255, 107, 53, 0.08); border-radius:6px; border-left:3px solid var(--accent)} .fm-avatar-error[hidden]{display:none} body.dark .fm-avatar-current,body.dark .fm-avatar-dropzone{background:var(--card-bg); border-color:var(--line)} @media (max-width:600px){.fm-avatar-current{flex-direction:column; align-items:flex-start} .fm-avatar-thumb{width:96px; height:96px}} .pricing-page{padding:60px 0 100px; font-family:'Saira', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif} .pricing-head{margin-bottom:56px; max-width:720px} .pricing-eyebrow{font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text); margin-bottom:14px} .pricing-title{font-family:'Stalinist One', 'Saira', sans-serif; font-size:clamp(40px, 6vw, 76px); line-height:0.98; letter-spacing:-0.02em; margin:0 0 22px; color:var(--ink)} .pricing-title em{font-style:italic; color:var(--accent-text)} .pricing-lede{font-family:'Saira', sans-serif; font-size:18px; line-height:1.55; color:var(--ink-2); margin:0 0 28px; max-width:640px} .pricing-lede strong{font-weight:700; color:var(--ink)} .pricing-current{margin-top:28px; padding:18px 22px; border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:12px; background:var(--card-bg); display:flex; flex-direction:column; gap:4px; max-width:640px} .pricing-current-eyebrow{font-family:'Saira', sans-serif; font-size:10.5px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--muted)} .pricing-current-state{font-family:'Saira', sans-serif; font-size:22px; font-weight:800; letter-spacing:-0.02em; color:var(--ink); line-height:1.2} .pricing-current-sub{font-family:'Saira', sans-serif; font-size:13px; color:var(--muted); margin-top:4px; line-height:1.5} body.dark .pricing-current{background:var(--card-bg-2); border-color:var(--line); border-left-color:var(--accent-text)} .pricing-cta-row{display:flex; flex-wrap:wrap; gap:12px; align-items:center} .pricing-figure{display:grid; grid-template-columns:1fr 1.4fr; gap:0; background:var(--card-bg); border:1px solid var(--ink); border-radius:0; margin-bottom:64px; overflow:hidden} body.dark .pricing-figure{background:var(--card-bg); border-color:var(--cream)} .pricing-figure-main{padding:36px 30px; background:var(--ink); color:var(--cream); display:flex; flex-direction:column; align-items:flex-start; justify-content:center} .pricing-figure-num{font-family:'Stalinist One', sans-serif; font-size:clamp(72px, 11vw, 132px); line-height:0.9; letter-spacing:-0.03em; color:var(--cream)} .pricing-figure-unit{font-family:'Saira', sans-serif; font-size:16px; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent-text); margin-top:4px} .pricing-figure-was-row{display:flex; align-items:baseline; gap:10px; margin-bottom:2px} .pricing-figure-was-label{font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text)} .pricing-figure-was{font-family:'Saira', sans-serif; font-size:clamp(22px, 2.4vw, 28px); font-weight:600; color:var(--cream); opacity:0.55; text-decoration:line-through; text-decoration-thickness:2px; letter-spacing:0.01em} .pricing-figure-now-row{display:flex; align-items:center; gap:14px; flex-wrap:wrap} .pricing-figure-badge{display:inline-block; background:var(--accent); color:var(--cream); font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; padding:6px 12px; border-radius:999px; line-height:1; white-space:nowrap} .pricing-figure-detail{padding:30px 32px; display:flex; flex-direction:column; justify-content:center; gap:4px} .pricing-figure-row{display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:14px 0; border-bottom:1px solid var(--line); font-family:'Saira', sans-serif; font-size:15px; color:var(--muted)} .pricing-figure-row:last-child{border-bottom:none} .pricing-figure-row strong{font-family:'Stalinist One', sans-serif; font-weight:400; font-size:14px; color:var(--ink); text-align:right; letter-spacing:0.02em} .pricing-section{margin-bottom:64px} .pricing-section-eyebrow{font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-text); margin-bottom:12px} .pricing-section-title{font-family:'Stalinist One', 'Saira', sans-serif; font-size:clamp(28px, 4vw, 44px); line-height:1.05; letter-spacing:-0.02em; margin:0 0 28px; color:var(--ink)} .pricing-section-title em{font-style:italic; color:var(--accent-text)} .pricing-list{display:grid; grid-template-columns:1fr 1fr; gap:14px 36px; max-width:880px} .pricing-list-row{display:flex; gap:10px; align-items:flex-start; font-family:'Saira', sans-serif; font-size:15.5px; line-height:1.5; color:var(--ink-2); padding:8px 0; border-bottom:1px solid var(--line)} .pricing-list-row strong{color:var(--ink); font-weight:700} .pricing-list-bullet{color:var(--accent-text); font-family:'Saira', sans-serif; font-weight:700; font-size:18px; flex-shrink:0; line-height:1} .pricing-steps{display:grid; grid-template-columns:repeat(4, 1fr); gap:0; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink)} .pricing-step{padding:26px 22px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:10px} .pricing-step:last-child{border-right:none} .pricing-step-num{font-family:'Stalinist One', sans-serif; font-size:38px; line-height:1; color:var(--accent-text); letter-spacing:-0.02em} .pricing-step-title{font-family:'Stalinist One', sans-serif; font-size:16px; font-weight:400; color:var(--ink); letter-spacing:0.01em} .pricing-step-body p{font-family:'Saira', sans-serif; font-size:14px; line-height:1.5; color:var(--ink-2); margin:0} .pricing-step-body em{font-style:italic; color:var(--accent-text)} .pricing-faq .faq-list{max-width:880px} .pricing-bottom-cta{margin-top:64px; padding:50px 40px; background:var(--cream-2); border:1px solid var(--line); border-radius:14px; text-align:center} body.dark .pricing-bottom-cta{background:var(--card-bg)} .pricing-bottom-sub{font-family:'Saira', sans-serif; font-size:16px; color:var(--muted); margin:0 0 24px} @media (max-width:900px){.pricing-page{padding:36px 0 64px} .pricing-figure{grid-template-columns:1fr} .pricing-figure-main{padding:28px 22px} .pricing-figure-detail{padding:22px} .pricing-list{grid-template-columns:1fr; gap:0} .pricing-steps{grid-template-columns:1fr 1fr} .pricing-step:nth-child(2){border-right:none} .pricing-step:nth-child(-n+2){border-bottom:1px solid var(--line)} .pricing-bottom-cta{padding:36px 22px}} .pf-status{display:inline-flex; align-items:center; gap:8px; margin-top:14px; padding:6px 12px 6px 10px; border:1px solid var(--line); border-radius:999px; background:var(--card-bg); font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-2)} body.dark .pf-status{background:var(--card-bg); border-color:var(--line); color:var(--cream)} .pf-status-dot{width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 0 3px rgba(46, 168, 105, 0.18); animation:pfStatusPulse 1.8s ease-in-out infinite} @keyframes pfStatusPulse{0%, 100%{opacity:1; transform:scale(1)}50%{opacity:0.6; transform:scale(0.85)}} @media (prefers-reduced-motion:reduce){.pf-status-dot{animation:none}} .pf-card-heading{font-family:'Stalinist One', 'Saira', sans-serif; font-size:22px; line-height:1.15; letter-spacing:-0.005em; color:var(--ink); margin:0 0 16px} body.dark .pf-card-heading{color:var(--cream)} .pf-work-rail{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; list-style:none; padding:0; margin:0} .pf-work-cell{background:var(--card-bg); border:1px solid var(--line); border-radius:10px; padding:14px 14px 16px; display:flex; flex-direction:column; gap:8px; min-height:110px} body.dark .pf-work-cell{background:var(--cream-2)} .pf-work-num{font-family:'Stalinist One', 'Saira', sans-serif; font-size:13px; color:var(--accent-text); letter-spacing:0.04em} .pf-work-title{font-family:'Saira', sans-serif; font-size:14.5px; font-weight:700; color:var(--ink); line-height:1.25} body.dark .pf-work-title{color:var(--cream)} .pf-work-sub{font-family:'Saira', sans-serif; font-size:12.5px; color:var(--muted); line-height:1.4; margin-top:2px} @media (max-width:640px){.pf-work-rail{grid-template-columns:1fr} .pf-work-cell{min-height:0}} .pf-proof-numbers{display:grid; grid-template-columns:auto auto 1fr; gap:20px; align-items:center} .pf-proof-stat{display:flex; flex-direction:column; gap:2px} .pf-proof-num{font-family:'Stalinist One', 'Saira', sans-serif; font-size:32px; line-height:1; color:var(--ink); font-variant-numeric:tabular-nums; letter-spacing:-0.01em} body.dark .pf-proof-num{color:var(--cream)} .pf-proof-label{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted); margin-top:4px} .pf-proof-foot{font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); letter-spacing:0.04em; line-height:1.5; text-align:right} @media (max-width:480px){.pf-proof-numbers{grid-template-columns:1fr 1fr; gap:14px} .pf-proof-foot{grid-column:1 / -1; text-align:left}} .pf-contact-cta{display:flex; flex-wrap:wrap; gap:10px; margin-top:4px} .pf-cta-quiet{background:transparent; color:var(--ink); border:1px solid var(--ink)} .pf-cta-quiet:hover{background:var(--ink); color:var(--cream); transform:translateY(-1px)} body.dark .pf-cta-quiet{color:var(--cream); border-color:var(--cream)} body.dark .pf-cta-quiet:hover{background:var(--cream); color:var(--ink)} .pf-foot-meta{display:inline-flex; flex-direction:column; gap:2px; font-family:'Saira', sans-serif; font-size:12.5px; color:var(--ink-2); letter-spacing:0.04em; text-transform:none} .pf-foot-meta strong{font-family:'Saira', sans-serif; font-size:13px; font-weight:700; color:var(--ink); letter-spacing:-0.005em} body.dark .pf-foot-meta{color:var(--ink-2)} body.dark .pf-foot-meta strong{color:var(--cream)} .pf-foot-handle{font-family:'Saira', sans-serif; font-size:11.5px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted)} .pf-foot-top{font-family:'Saira', sans-serif; font-size:12px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink); text-decoration:none; padding:6px 12px; border:1px solid var(--line); border-radius:999px; transition:background 0.2s ease, color 0.2s ease} .pf-foot-top:hover{background:var(--ink); color:var(--cream); border-color:var(--ink)} body.dark .pf-foot-top{color:var(--cream); border-color:var(--line)} body.dark .pf-foot-top:hover{background:var(--cream); color:var(--ink); border-color:var(--cream)} .dash-side-templates{margin-top:4px} .dash-side-tpl-list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:4px} .dash-side-tpl-form{margin:0} .dash-side-tpl-btn{width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 12px; border-radius:8px; border:1px solid var(--line); background:transparent; color:var(--ink); font:inherit; font-size:13px; font-weight:600; text-align:left; cursor:pointer; transition:background 0.18s ease, border-color 0.18s ease, color 0.18s ease} .dash-side-tpl-btn:hover:not(:disabled):not([aria-disabled="true"]){background:var(--cream-2); border-color:var(--ink-2)} .dash-side-tpl.is-active .dash-side-tpl-btn{background:var(--ink); border-color:var(--ink); color:var(--cream); cursor:default} body.dark .dash-side-tpl.is-active .dash-side-tpl-btn{background:var(--cream); color:var(--ink); border-color:var(--cream)} .dash-side-tpl.is-locked .dash-side-tpl-btn{opacity:0.55; cursor:not-allowed} .dash-side-tpl-name{letter-spacing:-0.005em} .dash-side-tpl-mark{display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase} .dash-side-tpl-dot{width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 0 3px rgba(46, 168, 105, 0.2)} .dash-side-tpl.is-active .dash-side-tpl-dot{background:var(--green); box-shadow:0 0 0 3px rgba(255, 255, 255, 0.18)} .dash-side-tpl-state{letter-spacing:0.14em} .dash-side-tpl-arrow{font-size:14px; opacity:0.7} .dash-side-tpl-lock{font-size:10.5px; font-weight:800; letter-spacing:0.16em; padding:2px 7px; border-radius:999px; background:var(--accent-glow-1); color:var(--accent-text); border:1px solid var(--accent-glow-2)} .fm-card-imports{} .fm-import-row{display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--card-bg); margin-bottom:10px} .fm-import-row:last-child{margin-bottom:0} body.dark .fm-import-row{background:rgba(255,255,255,0.02)} .fm-import-meta{flex:1; min-width:0} .fm-import-name{font-size:13px; font-weight:700; color:var(--ink); letter-spacing:0.02em} body.dark .fm-import-name{color:var(--cream)} .fm-import-state{font-size:11.5px; color:var(--muted); margin-top:2px} .fm-import-form{margin:0} .fm-import-sort{display:flex; align-items:center; gap:8px; margin-top:12px; padding-top:10px; border-top:1px dashed var(--line)} .fm-import-sort-label{font-size:10.5px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted)} .fm-import-sort-select{font:inherit; font-size:12px; font-weight:600; padding:5px 10px; border-radius:8px; border:1px solid var(--line-strong); background:var(--card-bg); color:var(--ink); cursor:pointer} .fm-import-sort-select:focus{outline:2px solid var(--accent); outline-offset:1px} body.dark .fm-import-sort-select{background:rgba(255,255,255,0.04); color:var(--cream); border-color:var(--line)} .fm-import-btn{font:inherit; font-size:11.5px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; padding:7px 12px; border-radius:999px; cursor:pointer; border:1px solid var(--line-strong); background:transparent; color:var(--ink); transition:background 0.15s ease, border-color 0.15s ease, opacity 0.15s ease} .fm-import-btn:hover{background:var(--cream-2); border-color:var(--ink)} .fm-import-btn:disabled{opacity:0.4; cursor:not-allowed} body.dark .fm-import-btn{color:var(--cream); border-color:var(--line)} .fm-import-ok{font-size:11.5px; color:#2e6e4a; background:rgba(74,157,111,0.12); border:1px solid #4a9d6f; padding:8px 10px; border-radius:8px; margin-top:10px} .fm-import-err{font-size:11.5px; color:#b42828; background:rgba(180,40,40,0.08); border:1px solid #b42828; padding:8px 10px; border-radius:8px; margin-top:10px} .fm-import-err code{font-family:'JetBrains Mono', monospace; background:var(--cream-2); padding:1px 5px; border-radius:4px; font-size:10.5px} body.dark .fm-import-err{color:#ff8585} body.dark .fm-import-ok{color:#6ddc8c} .pf-card-imports-repos .pf-card-heading{font-size:22px} .pf-repo-list{list-style:none; margin:0; padding:0; display:grid; gap:10px} .pf-repo-row{display:block; padding:14px 16px; border:1px solid var(--line); border-radius:10px; background:var(--card-bg); text-decoration:none; color:var(--ink); transition:border-color 0.15s ease, background 0.15s ease, transform 0.15s ease} .pf-repo-row:hover{border-color:var(--ink); transform:translateY(-1px)} body.dark .pf-repo-row{background:rgba(255,255,255,0.02)} body.dark .pf-repo-row:hover{border-color:var(--cream)} .pf-repo-head{display:flex; align-items:center; gap:8px; font-family:'JetBrains Mono', ui-monospace, monospace; font-size:13.5px; font-weight:700; color:var(--ink); word-break:break-all} body.dark .pf-repo-head{color:var(--cream)} .pf-repo-pin{font-size:13px; opacity:0.7} .pf-repo-desc{font-size:13px; line-height:1.5; color:var(--muted); margin-top:6px} .pf-repo-meta{display:flex; gap:8px; margin-top:10px; flex-wrap:wrap} .pf-repo-pill{display:inline-flex; align-items:center; font-size:11px; font-weight:700; letter-spacing:0.04em; padding:3px 9px; border-radius:999px; background:var(--cream-2); color:var(--ink); border:1px solid var(--line)} body.dark .pf-repo-pill{background:rgba(255,255,255,0.06); color:var(--cream)} .pf-repo-stars{color:#b58900} body.dark .pf-repo-stars{color:#ffd66b} .pf-card-imports-contributions .pf-card-heading{font-size:22px} .pf-contrib-wrap{display:flex; flex-direction:row; gap:8px; align-items:flex-start} .pf-contrib-daycol{display:flex; flex-direction:column; gap:4px; padding-top:22px; font-size:10px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); flex-shrink:0} .pf-contrib-daycol span{height:14px; line-height:14px} .pf-contrib-rail{flex:1; min-width:0; overflow-x:auto; padding-bottom:4px} .pf-contrib-head{display:flex; align-items:baseline; gap:14px; margin-bottom:18px; padding-bottom:14px; border-bottom:1px solid var(--line)} .pf-contrib-head-num{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:36px; font-weight:700; color:var(--accent-text); line-height:1; letter-spacing:-0.02em} body.dark .pf-contrib-head-num{color:var(--cream)} .pf-contrib-head-meta{display:flex; flex-direction:column; gap:2px; min-width:0} .pf-contrib-head-label{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase; color:var(--muted)} .pf-contrib-head-sub{font-size:13px; color:var(--muted); line-height:1.4} .pf-contrib-head-sub strong{color:var(--ink); font-weight:700} body.dark .pf-contrib-head-sub strong{color:var(--cream)} .pf-contrib-monthrow{display:grid; grid-template-columns:repeat(53, 1fr); gap:3px; margin-bottom:6px; font-size:10px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase; color:var(--muted); font-family:'JetBrains Mono', ui-monospace, monospace} .pf-contrib-monthtick{line-height:1} .pf-contrib-chart{display:grid; grid-template-columns:repeat(53, 1fr); grid-template-rows:96px; gap:3px; align-items:end; padding:4px 0 0; border-bottom:1px solid var(--line); position:relative} .pf-contrib-bar-slot{display:flex; align-items:flex-end; height:100%; min-height:0; position:relative} .pf-contrib-bar{width:100%; height:var(--h, 4px); min-height:4px; background:var(--cream-3); border-radius:2px 2px 0 0; transition:background 0.15s ease, transform 0.15s ease; cursor:pointer; position:relative} .pf-contrib-bar:hover{transform:scaleY(1.06); transform-origin:bottom; filter:brightness(1.08)} .pf-contrib-bar.is-active{background:var(--accent)} .pf-contrib-bar.is-current{outline:1.5px solid var(--ink); outline-offset:1px} body.dark .pf-contrib-bar{background:rgba(255,255,255,0.10)} body.dark .pf-contrib-bar.is-active{background:var(--accent)} .pf-contrib-axis{display:flex; align-items:center; justify-content:flex-end; gap:8px; margin-top:10px; font-family:'JetBrains Mono', ui-monospace, monospace; font-size:10px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase; color:var(--muted)} .pf-contrib-axis-bar{display:flex; align-items:flex-end; gap:2px; height:14px; width:60px} .pf-contrib-axis-tick{flex:1; background:var(--accent); border-radius:1px 1px 0 0; min-height:2px} .pf-card-imports-profile .pf-card-heading{font-size:18px} .pf-li-headline{font-family:'Saira', sans-serif; font-size:17px; font-weight:600; line-height:1.4; color:var(--ink); margin:0 0 6px; letter-spacing:-0.005em} body.dark .pf-li-headline{color:var(--cream)} .pf-li-name{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted); margin:0 0 10px} .pf-li-meta{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:10px} .pf-li-pill{display:inline-flex; align-items:center; font-size:12px; font-weight:600; padding:4px 10px; border-radius:999px; background:var(--cream-2); color:var(--ink); border:1px solid var(--line); font-family:'JetBrains Mono', ui-monospace, monospace} body.dark .pf-li-pill{background:rgba(255,255,255,0.06); color:var(--cream)} .pf-li-pill-link{text-decoration:none; color:var(--accent-text); border-color:var(--accent-text); transition:background 0.15s ease, color 0.15s ease} .pf-li-pill-link:hover{background:var(--accent); color:var(--cream)} .pf-li-note{font-size:12px; color:var(--muted); margin:8px 0 0; font-style:italic} .fm-featured-empty{font-size:13px; color:var(--muted); font-style:italic} .fm-featured-hint{font-size:12px; color:var(--muted); margin-bottom:12px; line-height:1.5} .fm-featured-form{display:flex; flex-direction:column; gap:12px} .fm-featured-list{display:flex; flex-direction:column; gap:6px; max-height:320px; overflow-y:auto; padding-right:4px} .fm-featured-row{display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid var(--line); border-radius:6px; background:var(--cream-2); cursor:pointer; transition:border-color 0.15s ease, transform 0.15s ease} .fm-featured-row:hover{border-color:var(--ink); transform:translateY(-1px)} .fm-featured-row.is-featured{border-color:var(--accent-text); background:rgba(255, 107, 53, 0.06)} body.dark .fm-featured-row{background:rgba(255,255,255,0.03); color:var(--cream)} body.dark .fm-featured-row:hover{border-color:var(--cream)} body.dark .fm-featured-row.is-featured{background:rgba(255, 138, 91, 0.10); border-color:var(--accent-text)} .fm-featured-check{width:16px; height:16px; accent-color:var(--accent-text); flex-shrink:0; cursor:pointer} .fm-featured-body{display:flex; align-items:center; gap:8px; min-width:0; flex:1; flex-wrap:wrap} .fm-featured-name{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:12px; font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; flex:1} body.dark .fm-featured-name{color:var(--cream)} .fm-featured-lang{font-size:10px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; padding:2px 6px; border-radius:4px; background:var(--cream-3); color:var(--ink)} body.dark .fm-featured-lang{background:rgba(255,255,255,0.08); color:var(--cream)} .fm-featured-stars{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; font-weight:600; color:var(--muted); white-space:nowrap} .fm-featured-private{font-size:9px; font-weight:700; letter-spacing:0.10em; text-transform:uppercase; padding:2px 6px; border-radius:4px; background:rgba(255, 107, 53, 0.12); color:var(--accent-text); border:1px solid rgba(255, 107, 53, 0.30)} body.dark .fm-featured-private{background:rgba(255, 138, 91, 0.15); color:#ffaa7a; border-color:rgba(255, 138, 91, 0.35)} .fm-featured-save{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; padding:10px 14px; border:1.5px solid var(--ink); background:var(--ink); color:var(--cream); border-radius:6px; cursor:pointer; transition:background 0.15s ease, color 0.15s ease} .fm-featured-save:hover{background:var(--cream); color:var(--ink)} body.dark .fm-featured-save{border-color:var(--cream); background:var(--cream); color:var(--ink)} body.dark .fm-featured-save:hover{background:var(--ink); color:var(--cream)} .fm-marketing-state{font-size:12.5px; color:var(--muted); line-height:1.5} .fm-marketing-state code{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; padding:1px 4px; border-radius:3px; background:var(--cream-3); color:var(--ink)} body.dark .fm-marketing-state code{background:rgba(255,255,255,0.08); color:var(--cream)} .pf-exp-list,.pf-edu-list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column} .pf-exp-row,.pf-edu-row{display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--line)} .pf-exp-row:last-child,.pf-edu-row:last-child{border-bottom:0} .pf-exp-main,.pf-edu-main{flex:1; min-width:0} .pf-exp-title,.pf-edu-school{font-family:'Newsreader', Georgia, serif; font-size:16px; font-weight:600; color:var(--ink); line-height:1.3} body.dark .pf-exp-title,body.dark .pf-edu-school{color:var(--cream)} .pf-exp-org,.pf-edu-deg{font-size:13px; color:var(--muted); margin-top:2px} .pf-exp-loc{color:var(--accent-text); font-weight:500} .pf-exp-when,.pf-edu-when{font-family:'JetBrains Mono', ui-monospace, monospace; font-size:11px; font-weight:600; color:var(--muted); white-space:nowrap; padding-top:4px; flex-shrink:0} .pf-loc-text{font-family:'Newsreader', Georgia, serif; font-size:18px; font-weight:500; color:var(--ink); line-height:1.4} body.dark .pf-loc-text{color:var(--cream)} .fm-completion-bar{margin:10px 0 14px; height:6px; background:rgba(0,0,0,0.06); border-radius:999px; overflow:hidden} .fm-completion-bar-fill{height:100%; background:var(--accent); border-radius:999px; transition:width 0.3s ease} .fm-completion-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px} .fm-completion-row{display:flex; align-items:center; gap:10px; font-family:'Saira', sans-serif; font-size:13px; color:var(--ink)} .fm-completion-mark{font-size:12px; color:var(--muted); width:14px; text-align:center} .fm-completion-label{font-weight:500} body.dark .fm-completion-bar{background:rgba(250,247,242,0.10)} body.dark .fm-completion-row{color:var(--cream)} .fm-spotlight-locked{margin:8px 0 0; padding:12px 14px; background:rgba(255,107,53,0.06); border-left:2px solid var(--accent); font-family:'Saira', sans-serif; font-size:13px; color:var(--muted)} .fm-spotlight-locked a{color:var(--accent-text); text-decoration:none; font-weight:600} .fm-spotlight-form{display:flex; flex-direction:column; gap:12px; margin-top:12px} .fm-spotlight-row{display:grid; grid-template-columns:2fr 1fr; gap:12px} .fm-spotlight-form label{display:flex; flex-direction:column; gap:4px; font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted)} .fm-spotlight-form input,.fm-spotlight-form select{font-family:'Saira', sans-serif; font-size:14px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:var(--cream); color:var(--ink); text-transform:none; letter-spacing:0; font-weight:400} .fm-spotlight-save{align-self:flex-start; background:var(--accent); color:var(--cream); border:0; cursor:pointer; font-family:'Stalinist One', sans-serif; text-transform:uppercase; letter-spacing:0.06em} .fm-spotlight-status{font-family:'Saira', sans-serif; font-size:13px; color:var(--muted)} .fm-spotlight-status[data-kind="ok"]{color:#2a8d4f} .fm-spotlight-status[data-kind="err"]{color:#c0392b} .fm-spotlight-preview{display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:8px; font-family:'Saira', sans-serif; font-size:14px; background:rgba(255,107,53,0.04)} .fm-spotlight-preview .pf-spotlight-eyebrow{color:var(--accent-text)} .fm-spotlight-preview .fm-avatar-btn-quiet{margin-left:auto} .fm-visually-hidden{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap; border:0} .fm-work-rail-hint{margin:4px 0 10px; font-family:'Saira', sans-serif; font-size:13px; color:var(--text-dim, #707070)} .fm-work-rail-rows{display:flex; flex-direction:column; gap:8px; margin-bottom:10px} .fm-work-rail-row{display:grid; grid-template-columns:minmax(120px, 0.6fr) minmax(180px, 1fr) auto; gap:8px; align-items:center} .fm-work-rail-cell{display:flex} .fm-work-rail-cell input{width:100%; font-family:'Saira', sans-serif; font-size:14px; padding:9px 10px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink, #181818)} .fm-work-rail-cell input:focus{outline:none; border-color:var(--accent-text); box-shadow:0 0 0 3px rgba(255, 107, 53, 0.18)} .fm-work-rail-remove{width:32px; height:32px; border:1px solid var(--line); border-radius:6px; background:transparent; color:var(--text-dim, #707070); font-size:18px; line-height:1; cursor:pointer; padding:0} .fm-work-rail-remove:hover{background:rgba(192, 57, 43, 0.08); border-color:#c0392b; color:#c0392b} .fm-work-rail-actions{display:flex; align-items:center; gap:10px; flex-wrap:wrap} .fm-work-rail-status{font-family:'Saira', sans-serif; font-size:13px; margin-left:4px} .fm-work-rail-status[data-kind="ok"]{color:#2a8d4f} .fm-work-rail-status[data-kind="err"]{color:#c0392b} @media (max-width:540px){.fm-work-rail-row{grid-template-columns:1fr} .fm-work-rail-remove{width:100%; height:36px}} .fm-field-seo{border:1px solid var(--line); border-radius:8px; padding:0; background:rgba(0,0,0,0.02)} .fm-seo-summary{cursor:pointer; list-style:none; padding:12px 14px; display:flex; align-items:center; justify-content:space-between; font-family:'Saira', sans-serif; font-size:13px; font-weight:600; color:var(--ink)} .fm-seo-summary::-webkit-details-marker{display:none} .fm-seo-summary-meta{font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted)} .fm-seo-body{padding:0 14px 14px; display:flex; flex-direction:column; gap:12px} .fm-seo-hint{margin:0; font-family:'Saira', sans-serif; font-size:12px; color:var(--muted)} .fm-seo-field{display:flex; flex-direction:column; gap:4px; font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted)} .fm-seo-field input,.fm-seo-field textarea{font-family:'Saira', sans-serif; font-size:14px; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:var(--cream); color:var(--ink); text-transform:none; letter-spacing:0; font-weight:400} .fm-seo-save{align-self:flex-start; background:var(--ink); color:var(--cream); border:0; cursor:pointer; font-family:'Stalinist One', sans-serif; text-transform:uppercase; letter-spacing:0.06em} .fm-seo-status{font-family:'Saira', sans-serif; font-size:13px; color:var(--muted)} .fm-seo-status[data-kind="ok"]{color:#2a8d4f} .fm-seo-status[data-kind="err"]{color:#c0392b} body.dark .fm-field-seo{background:rgba(250,247,242,0.04)} body.dark .fm-seo-field input,body.dark .fm-seo-field textarea{background:var(--bg); color:var(--cream)} .pf-avatar-video{width:100%; height:100%; object-fit:cover; display:block} .pf-avatar-fallback-img{display:none} @media (prefers-reduced-motion:reduce){.pf-avatar-video{animation:none}} .pf-spotlight{display:flex; align-items:center; gap:12px; padding:14px 18px; margin:24px 0 0; border-top:2px solid var(--accent); border-bottom:1px solid var(--line); font-family:'Saira', sans-serif; background:linear-gradient(180deg, rgba(255,107,53,0.06) 0%, transparent 100%); animation:pf-spotlight-in 360ms ease-out both} .pf-spotlight-eyebrow{font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent-text)} .pf-spotlight-emoji{font-size:18px; flex-shrink:0} .pf-spotlight-text{font-size:15px; font-weight:600; color:var(--ink); flex-grow:1} .pf-spotlight-cta{display:inline-flex; align-items:center; gap:6px; font-family:'Stalinist One', sans-serif; font-size:11px; text-transform:uppercase; letter-spacing:0.06em; background:var(--accent); color:var(--cream); padding:8px 14px; border-radius:999px; text-decoration:none; transition:background 0.18s ease} .pf-spotlight-cta:hover{background:var(--accent-2)} .pf-spotlight-empty .pf-spotlight-text{color:var(--muted); font-weight:400; font-size:13px} @keyframes pf-spotlight-in{from{opacity:0; transform:translateY(-12px)} to{opacity:1; transform:translateY(0)}} @media (prefers-reduced-motion:reduce){.pf-spotlight{animation:none}} body.dark .pf-spotlight{background:rgba(255,107,53,0.10); border-bottom-color:rgba(250,247,242,0.12)} body.dark .pf-spotlight-text{color:var(--cream)} .fm-field-fonts{border-top:1px dashed var(--line); padding-top:16px; margin-top:16px} .fm-fonts-summary{display:flex; justify-content:space-between; align-items:center; cursor:pointer; list-style:none; font-family:'Stalinist One', sans-serif; font-size:13px; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink)} .fm-fonts-summary::-webkit-details-marker{display:none} .fm-fonts-summary::after{content:'+'; font-family:'Saira', sans-serif; font-size:18px; color:var(--accent-text)} .fm-field-fonts[open] .fm-fonts-summary::after{content:'−'} .fm-fonts-summary-meta{font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); text-transform:none; letter-spacing:0; font-weight:400} .fm-fonts-pro{display:inline-block; font-family:'Saira', sans-serif; font-size:10px; letter-spacing:0.06em; background:var(--accent); color:var(--cream); padding:2px 6px; border-radius:4px; margin-left:6px; text-transform:uppercase; vertical-align:middle} .fm-fonts-body{padding-top:14px; display:grid; gap:12px} .fm-fonts-locked{border:1px dashed var(--line-strong); padding:14px; background:var(--cream-2); font-size:13px; color:var(--muted)} .fm-fonts-lock-eyebrow{display:block; font-family:'Stalinist One', sans-serif; font-size:11px; text-transform:uppercase; letter-spacing:0.08em; color:var(--accent-text); margin-bottom:4px} .fm-fonts-locked a{color:var(--accent-text); font-weight:600} .fm-fonts-hint{font-size:12.5px; color:var(--muted); line-height:1.5} .fm-fonts-hint code{background:var(--cream-2); padding:1px 6px; font-size:11.5px} .fm-fonts-field{display:grid; gap:4px} .fm-fonts-field span{font-size:11.5px; color:var(--muted); text-transform:uppercase; letter-spacing:0.06em} .fm-fonts-field input{border:1px solid var(--line-strong); background:var(--cream); padding:8px 10px; font-family:inherit; font-size:14px; color:var(--ink); border-radius:0} .fm-fonts-field input:focus{outline:none; border-color:var(--accent-text)} .fm-fonts-drop{border:2px dashed var(--line-strong); padding:24px; text-align:center; background:var(--cream-2); cursor:pointer; transition:background 0.15s ease, border-color 0.15s ease} .fm-fonts-drop:hover, .fm-fonts-drop.is-over{background:rgba(255,107,53,0.06); border-color:var(--accent-text)} .fm-fonts-drop-text strong{display:block; font-family:'Stalinist One', sans-serif; font-size:14px; color:var(--ink); margin-bottom:4px} .fm-fonts-drop-sub{font-size:11.5px; color:var(--muted); text-transform:uppercase; letter-spacing:0.06em} .fm-fonts-progress{position:relative; height:16px; background:var(--cream-2); border:1px solid var(--line); overflow:hidden} .fm-fonts-progress-bar{position:absolute; inset:0 auto 0 0; width:0; background:var(--accent); transition:width 0.18s ease} .fm-fonts-progress-label{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--ink); mix-blend-mode:difference} .fm-fonts-status{font-size:12.5px; color:var(--muted)} .fm-fonts-status[data-kind="ok"]{color:#1d6e44} .fm-fonts-status[data-kind="err"]{color:var(--accent-2)} .fm-fonts-list{list-style:none; padding:0; margin:0; display:grid; gap:8px} .fm-fonts-row{display:grid; grid-template-columns:1fr auto auto; gap:10px; align-items:center; padding:10px 12px; border:1px solid var(--line); background:var(--cream); transition:opacity 0.2s ease} .fm-fonts-row.is-removing{opacity:0.4} .fm-fonts-row-name strong{display:block; font-size:14px; color:var(--ink); margin-bottom:2px} .fm-fonts-row-status{display:inline-block; font-family:'Saira', sans-serif; font-size:10px; letter-spacing:0.06em; text-transform:uppercase; padding:2px 6px; border-radius:4px} .fm-fonts-row-status-pending{background:rgba(255,107,53,0.12); color:var(--accent-2)} .fm-fonts-row-status-approved{background:rgba(46,168,105,0.12); color:#1d6e44} .fm-fonts-row-status-rejected{background:rgba(192,58,43,0.12); color:var(--red)} .fm-fonts-row-meta code{font-size:11.5px; color:var(--muted); background:var(--cream-2); padding:1px 6px; word-break:break-all} .fm-fonts-row-remove{border:1px solid var(--line-strong); background:transparent; color:var(--ink); width:28px; height:28px; font-size:18px; line-height:1; cursor:pointer; transition:background 0.15s ease, color 0.15s ease} .fm-fonts-row-remove:hover{background:var(--accent); color:var(--cream); border-color:var(--accent-text)} body.dark .fm-field-fonts{border-top-color:rgba(250,247,242,0.12)} body.dark .fm-fonts-summary{color:var(--cream)} body.dark .fm-fonts-field input{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.16); color:var(--cream)} body.dark .fm-fonts-field input:focus{border-color:var(--accent-text)} body.dark .fm-fonts-drop{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.16)} body.dark .fm-fonts-drop-text strong{color:var(--cream)} body.dark .fm-fonts-drop:hover, body.dark .fm-fonts-drop.is-over{background:rgba(255,107,53,0.12)} body.dark .fm-fonts-progress{background:rgba(250,247,242,0.06); border-color:rgba(250,247,242,0.12)} body.dark .fm-fonts-hint code{background:rgba(250,247,242,0.08)} body.dark .fm-fonts-locked{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.16)} body.dark .fm-fonts-row{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.12)} body.dark .fm-fonts-row-name strong{color:var(--cream)} body.dark .fm-fonts-row-meta code{background:rgba(250,247,242,0.06); color:var(--cream)} body.dark .fm-fonts-row-remove{border-color:rgba(250,247,242,0.16); color:var(--cream)} .fm-bill-cycle{display:inline-flex; gap:0; margin-bottom:16px; border:1px solid var(--line-strong); border-radius:999px; padding:2px; background:var(--cream-2)} .fm-bill-cycle-btn{border:0; background:transparent; padding:8px 16px; font-family:'Saira', sans-serif; font-size:12.5px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; color:var(--muted); cursor:pointer; border-radius:999px; transition:background 0.18s ease, color 0.18s ease; display:inline-flex; align-items:center; gap:6px} .fm-bill-cycle-btn:hover{color:var(--ink)} .fm-bill-cycle-btn.is-active{background:var(--ink); color:var(--cream)} .fm-bill-cycle-save{display:inline-block; background:var(--accent); color:var(--cream); font-size:9.5px; letter-spacing:0.06em; padding:2px 6px; border-radius:4px; font-weight:700} .pricing-cycle{display:inline-flex; gap:0; margin-bottom:24px; border:1px solid var(--line-strong); border-radius:999px; padding:3px; background:var(--cream-2)} .pricing-cycle-btn{border:0; background:transparent; padding:8px 18px; font-family:'Saira', sans-serif; font-size:13px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; color:var(--muted); cursor:pointer; border-radius:999px; transition:background 0.18s ease, color 0.18s ease; display:inline-flex; align-items:center; gap:6px} .pricing-cycle-btn:hover{color:var(--ink)} .pricing-cycle-btn.is-active{background:var(--ink); color:var(--cream)} .pricing-cycle-save{display:inline-block; background:var(--accent); color:var(--cream); font-size:10px; letter-spacing:0.06em; padding:2px 6px; border-radius:4px; font-weight:700} body.dark .fm-bill-cycle{background:rgba(250,247,242,0.06); border-color:rgba(250,247,242,0.16)} body.dark .fm-bill-cycle-btn{color:var(--cream)} body.dark .fm-bill-cycle-btn.is-active{background:var(--cream); color:var(--ink)} body.dark .pricing-cycle{background:rgba(250,247,242,0.06); border-color:rgba(250,247,242,0.16)} body.dark .pricing-cycle-btn{color:var(--cream)} body.dark .pricing-cycle-btn.is-active{background:var(--cream); color:var(--ink)} @media (prefers-reduced-motion:reduce){.fm-bill-cycle-btn, .pricing-cycle-btn{transition:none}} .fm-field-links{border-top:1px dashed var(--line); padding-top:16px; margin-top:16px} .fm-links-summary{display:flex; justify-content:space-between; align-items:center; cursor:pointer; list-style:none; font-family:'Stalinist One', sans-serif; font-size:13px; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink)} .fm-links-summary::-webkit-details-marker{display:none} .fm-links-summary::after{content:'+'; font-family:'Saira', sans-serif; font-size:18px; color:var(--accent-text)} .fm-field-links[open] .fm-links-summary::after{content:'−'} .fm-links-summary-meta{font-family:'Saira', sans-serif; font-size:12px; color:var(--muted); text-transform:none; letter-spacing:0; font-weight:400} .fm-links-body{padding-top:14px; display:grid; gap:12px} .fm-links-hint{font-size:12.5px; color:var(--muted)} .fm-links-hint a{color:var(--accent-text); font-weight:600} .fm-links-add{display:grid; gap:8px; padding:12px; border:1px solid var(--line); background:var(--cream-2)} .fm-links-add-row{display:grid; gap:4px} .fm-links-add-row span{font-size:11px; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted)} .fm-links-add-row input, .fm-links-add-row select{border:1px solid var(--line-strong); background:var(--cream); padding:7px 10px; font-family:inherit; font-size:13.5px; color:var(--ink); border-radius:0} .fm-links-add-row input:focus, .fm-links-add-row select:focus{outline:none; border-color:var(--accent-text)} .fm-links-status{font-size:12.5px; color:var(--muted)} .fm-links-status[data-kind="ok"]{color:#1d6e44} .fm-links-status[data-kind="err"]{color:var(--accent-2)} .fm-links-list{list-style:none; padding:0; margin:0; display:grid; gap:6px} .fm-link-row{display:grid; grid-template-columns:auto 1fr auto auto auto; gap:10px; align-items:center; padding:8px 10px; border:1px solid var(--line); background:var(--cream); transition:opacity 0.2s ease} .fm-link-row.is-removing{opacity:0.4} .fm-link-row.is-dragging{opacity:0.5; border-style:dashed} .fm-link-row-handle{border:0; background:transparent; color:var(--muted); cursor:grab; font-size:12px; padding:0 4px} .fm-link-row-handle:active{cursor:grabbing} .fm-link-row-body{min-width:0} .fm-link-row-label{display:block; font-size:13px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis} .fm-link-row-url{display:block; font-size:11.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis} .fm-link-row-icon{display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; background:var(--ink); color:var(--cream); font-family:'JetBrains Mono', monospace; font-size:11px; border-radius:4px} .fm-link-row-layout{font-size:11.5px; padding:4px 6px; border:1px solid var(--line-strong); background:var(--cream); color:var(--ink)} .fm-link-row-remove{border:1px solid var(--line-strong); background:transparent; color:var(--ink); width:24px; height:24px; font-size:16px; line-height:1; cursor:pointer} .fm-link-row-remove:hover{background:var(--accent); color:var(--cream); border-color:var(--accent-text)} body.dark .fm-field-links{border-top-color:rgba(250,247,242,0.12)} body.dark .fm-links-summary{color:var(--cream)} body.dark .fm-links-add{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.12)} body.dark .fm-links-add-row input, body.dark .fm-links-add-row select{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.16); color:var(--cream)} body.dark .fm-link-row{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.12)} body.dark .fm-link-row-label{color:var(--cream)} body.dark .fm-link-row-icon{background:var(--cream); color:var(--ink)} body.dark .fm-link-row-layout{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.16); color:var(--cream)} body.dark .fm-link-row-remove{border-color:rgba(250,247,242,0.16); color:var(--cream)} .pf-card-links{margin-bottom:16px} .pf-link-list{list-style:none; padding:0; margin:0; display:grid; gap:8px} .pf-link-stack{grid-template-columns:1fr} .pf-link-row{border:1px solid var(--line); background:var(--cream); transition:background 0.15s ease, border-color 0.15s ease} .pf-link-row:hover{background:var(--cream-2); border-color:var(--line-strong)} .pf-link-anchor{display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; padding:14px 16px; color:var(--ink); text-decoration:none} .pf-link-icon{display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; background:var(--ink); color:var(--cream); font-family:'JetBrains Mono', monospace; font-size:12px; border-radius:4px} .pf-link-label{font-size:14px; font-weight:600; letter-spacing:-0.01em} .pf-link-arrow{font-size:14px; color:var(--accent-text); transition:transform 0.15s ease} .pf-link-anchor:hover .pf-link-arrow{transform:translateX(2px)} .pf-link-grid{grid-template-columns:repeat(2, 1fr); gap:10px} .pf-link-tile{border:1px solid var(--line); background:var(--cream); transition:background 0.15s ease, border-color 0.15s ease} .pf-link-tile:hover{background:var(--cream-2); border-color:var(--line-strong)} .pf-link-tile .pf-link-anchor{padding:18px 16px; grid-template-rows:auto auto auto; grid-template-columns:1fr; gap:8px} .pf-link-carousel{display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:4px; -webkit-overflow-scrolling:touch} .pf-link-slide{flex:0 0 220px; scroll-snap-align:start; border:1px solid var(--line); background:var(--cream); transition:background 0.15s ease, border-color 0.15s ease} .pf-link-slide:hover{background:var(--cream-2); border-color:var(--line-strong)} .pf-link-row-youtube .pf-link-icon,.pf-link-row-spotify .pf-link-icon,.pf-link-tile-youtube .pf-link-icon,.pf-link-tile-spotify .pf-link-icon,.pf-link-slide-youtube .pf-link-icon,.pf-link-slide-spotify .pf-link-icon{background:var(--accent)} body.dark .pf-link-row, body.dark .pf-link-tile, body.dark .pf-link-slide{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.12)} body.dark .pf-link-row:hover, body.dark .pf-link-tile:hover, body.dark .pf-link-slide:hover{background:rgba(250,247,242,0.08); border-color:rgba(250,247,242,0.18)} body.dark .pf-link-anchor{color:var(--cream)} body.dark .pf-link-icon{background:var(--cream); color:var(--ink)} body.dark .pf-link-row-youtube .pf-link-icon,body.dark .pf-link-row-spotify .pf-link-icon,body.dark .pf-link-tile-youtube .pf-link-icon,body.dark .pf-link-tile-spotify .pf-link-icon,body.dark .pf-link-slide-youtube .pf-link-icon,body.dark .pf-link-slide-spotify .pf-link-icon{background:var(--accent); color:var(--cream)} @media (max-width:600px){.pf-link-grid{grid-template-columns:1fr} .pf-link-slide{flex:0 0 180px}} @media (prefers-reduced-motion:reduce){.pf-link-arrow, .pf-link-row, .pf-link-tile, .pf-link-slide{transition:none}} .onboarding-page{min-height:calc(100vh - 200px); display:flex; align-items:center; padding:48px 24px} .onboarding-shell{max-width:720px; margin:0 auto; width:100%} .onboarding-eyebrow{font-family:'Saira', sans-serif; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent-text); margin-bottom:12px} .onboarding-title{font-family:'Stalinist One', sans-serif; font-size:clamp(36px, 6vw, 56px); line-height:1.05; letter-spacing:-0.02em; color:var(--ink); margin-bottom:12px} .onboarding-title em{font-family:'Stalinist One', sans-serif; color:var(--accent-text); font-style:italic} .onboarding-lede{font-size:16px; color:var(--muted); max-width:540px; margin-bottom:32px; line-height:1.5} .onboarding-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px} .onboarding-chip{border:1px solid var(--line-strong); background:var(--cream); padding:14px 16px; cursor:pointer; font-family:'Saira', sans-serif; font-size:14px; color:var(--ink); text-align:left; transition:background 0.15s ease, border-color 0.15s ease} .onboarding-chip:hover{background:var(--cream-2); border-color:var(--accent-text)} .onboarding-chip.is-on{background:var(--ink); color:var(--cream); border-color:var(--ink)} .onboarding-chip-big{padding:18px 18px; display:block; width:100%; text-align:left; margin-bottom:8px} .onboarding-chip-name{display:block; font-weight:600; font-size:15px} .onboarding-chip-sub{display:block; font-size:12px; color:var(--muted); margin-top:4px} .onboarding-chip.is-on .onboarding-chip-sub{color:rgba(250,247,242,0.7)} .onboarding-surfaces{display:grid; gap:8px; margin-bottom:24px} .onboarding-foot{margin-top:24px; text-align:right} .onboarding-skip{font-family:'Saira', sans-serif; font-size:12px; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted); text-decoration:none} .onboarding-skip:hover{color:var(--accent-text)} body.dark .onboarding-page{background:var(--ink)} body.dark .onboarding-title{color:var(--cream)} body.dark .onboarding-chip{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.16); color:var(--cream)} body.dark .onboarding-chip:hover{background:rgba(250,247,242,0.08)} body.dark .onboarding-chip.is-on{background:var(--cream); color:var(--ink); border-color:var(--cream)} body.dark .onboarding-chip-sub{color:rgba(250,247,242,0.5)} body.dark .onboarding-skip{color:rgba(250,247,242,0.5)} body.dark .onboarding-skip:hover{color:var(--accent-text)} .community-directory{padding:32px 0 48px; border-top:1px solid var(--line)} .community-directory-head{margin-bottom:24px} .community-directory-eyebrow{font-family:'Saira', sans-serif; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent-text); margin-bottom:8px} .community-directory-title{font-family:'Stalinist One', sans-serif; font-style:italic; font-size:32px; color:var(--ink); margin-bottom:16px} .community-directory-form{display:grid; grid-template-columns:1fr 180px auto; gap:8px; max-width:720px} .community-directory-search, .community-directory-cat{border:1px solid var(--line-strong); background:var(--cream); padding:10px 14px; font-family:inherit; font-size:14px; color:var(--ink); border-radius:0} .community-directory-search:focus, .community-directory-cat:focus{outline:none; border-color:var(--accent-text)} .community-directory-empty{padding:48px; border:1px dashed var(--line); text-align:center; color:var(--muted); font-size:14px} .community-directory-empty a{color:var(--accent-text); font-weight:600} .community-directory-grid{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:12px} .community-card{border:1px solid var(--line); background:var(--cream); transition:background 0.15s ease, border-color 0.15s ease} .community-card:hover{background:var(--cream-2); border-color:var(--line-strong)} .community-card-anchor{display:grid; grid-template-columns:60px 1fr; gap:14px; padding:16px; color:var(--ink); text-decoration:none; align-items:center} .community-card-avatar{width:60px; height:60px; background:var(--ink); color:var(--cream); display:flex; align-items:center; justify-content:center; overflow:hidden; border-radius:50%} .community-card-avatar img{width:100%; height:100%; object-fit:cover} .community-card-initial{font-family:'Stalinist One', sans-serif; font-size:24px} .community-card-name{font-size:15px; font-weight:700; color:var(--ink); margin-bottom:2px} .community-card-role{font-size:12.5px; color:var(--accent-text); margin-bottom:2px} .community-card-cat{font-size:11px; text-transform:uppercase; letter-spacing:0.06em; color:var(--muted); margin-bottom:4px} .community-card-handle{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--muted)} .community-pager{margin-top:24px; display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:13px; color:var(--muted)} .community-pager-link{font-family:'Saira', sans-serif; font-weight:600; color:var(--ink); text-decoration:none; text-transform:uppercase; letter-spacing:0.04em; font-size:12px} .community-pager-link:hover{color:var(--accent-text)} body.dark .community-directory{border-top-color:rgba(250,247,242,0.12)} body.dark .community-directory-title{color:var(--cream)} body.dark .community-directory-search, body.dark .community-directory-cat{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.16); color:var(--cream)} body.dark .community-directory-empty{border-color:rgba(250,247,242,0.16)} body.dark .community-card{background:rgba(250,247,242,0.04); border-color:rgba(250,247,242,0.12)} body.dark .community-card:hover{background:rgba(250,247,242,0.08)} body.dark .community-card-anchor{color:var(--cream)} body.dark .community-card-avatar{background:var(--cream); color:var(--ink)} body.dark .community-card-name{color:var(--cream)} body.dark .community-pager-link{color:var(--cream)} @media (max-width:600px){.community-directory-form{grid-template-columns:1fr} .community-directory-grid{grid-template-columns:1fr}} .tpl-screen{display:flex; flex-direction:column; gap:22px} .tpl-screen-head{display:flex; flex-direction:column; gap:6px} .tpl-screen-eyebrow{font-family:'Saira', sans-serif; font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--accent-text)} .tpl-screen-title{font-family:'Saira', sans-serif; font-weight:800; font-size:clamp(28px, 3.4vw, 38px); line-height:1.05; letter-spacing:-0.025em; color:var(--ink); margin:0} .tpl-screen-title em{font-style:italic; color:var(--accent-text); font-weight:700} .tpl-screen-sub{font-family:'Saira', sans-serif; font-size:13.5px; line-height:1.55; color:var(--muted); max-width:60ch; margin:0} .tpl-gallery{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:16px} .tpl-card{display:flex; flex-direction:column; gap:12px; padding:18px; border-radius:14px; border:1px solid var(--line); background:var(--card-bg); transition:border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; position:relative} .tpl-card.is-active{border-color:var(--accent-text); box-shadow:0 0 0 1px var(--accent), 0 12px 30px -18px rgba(255, 107, 53, 0.5)} .tpl-card.is-locked{opacity:0.78} .tpl-card.is-default:not(.is-locked) .tpl-card-thumb{background:var(--cream-2)} .tpl-card-head{display:flex; flex-direction:column; gap:4px} .tpl-card-eyebrow{font-family:'Saira', sans-serif; font-size:10.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted)} .tpl-card-name{font-family:'Saira', sans-serif; font-weight:800; font-size:22px; letter-spacing:-0.01em; color:var(--ink); margin:0} .tpl-card-desc{font-family:'Saira', sans-serif; font-size:12.5px; line-height:1.5; color:var(--muted); margin:0} .tpl-card-thumb{aspect-ratio:16 / 10; border-radius:10px; border:1px solid var(--line); background:var(--cream-2); display:flex; align-items:center; justify-content:center; gap:10px; color:var(--ink-2); font-family:'Saira', sans-serif} .tpl-card-thumb-letter{font-weight:800; font-size:44px; letter-spacing:-0.02em; line-height:1} .tpl-card-thumb-id{font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--muted)} .tpl-card-badges{display:flex; flex-wrap:wrap; gap:6px; min-height:22px} .tpl-badge{font-family:'Saira', sans-serif; font-size:10.5px; font-weight:800; letter-spacing:0.16em; text-transform:uppercase; padding:3px 8px; border-radius:999px; border:1px solid var(--line); color:var(--muted); background:transparent} .tpl-badge-base{color:var(--ink); border-color:var(--ink-2); background:var(--cream-2)} .tpl-badge-pro{color:var(--accent-text); border-color:var(--accent-text); background:rgba(255, 107, 53, 0.08)} .tpl-badge-active{color:var(--cream); background:var(--ink); border-color:var(--ink)} .tpl-card-foot{margin-top:auto} .tpl-card-form{margin:0; display:flex} .tpl-btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:11px 14px; border-radius:10px; border:1px solid var(--ink); background:var(--ink); color:var(--cream); font-family:'Saira', sans-serif; font-size:13px; font-weight:700; letter-spacing:0.02em; cursor:pointer; transition:background 0.18s ease, color 0.18s ease, border-color 0.18s ease; text-decoration:none} .tpl-btn:hover{background:var(--accent); border-color:var(--accent-text)} .tpl-btn-active{background:transparent; color:var(--ink); border-color:var(--ink-2); cursor:default} .tpl-btn-locked{background:transparent; color:var(--text-dim, #707070); border:1px dashed var(--line-strong, rgba(255,255,255,0.18)); cursor:not-allowed; opacity:0.75} .tpl-btn-locked:hover{background:transparent; color:var(--text-dim, #707070); border-color:var(--line-strong, rgba(255,255,255,0.18)); transform:none} .tpl-btn-lock{font-size:14px} .tpl-screen-foot{padding-top:4px} .tpl-foot-link{font-family:'Saira', sans-serif; font-size:12.5px; font-weight:700; letter-spacing:0.06em; color:var(--muted); text-decoration:none} .tpl-foot-link:hover{color:var(--accent-text)} body.dark .tpl-card{background:var(--card-bg); border-color:var(--line)} body.dark .tpl-card.is-active{border-color:var(--accent-text)} body.dark .tpl-card-thumb{background:rgba(255, 255, 255, 0.04)} body.dark .tpl-card-name{color:var(--cream)} body.dark .tpl-card-desc{color:rgba(250, 247, 242, 0.7)} body.dark .tpl-card-eyebrow{color:rgba(250, 247, 242, 0.55)} body.dark .tpl-badge-base{background:rgba(255, 255, 255, 0.06); color:var(--cream); border-color:rgba(255, 255, 255, 0.18)} body.dark .tpl-badge-active{background:var(--cream); color:var(--ink); border-color:var(--cream)} body.dark .tpl-btn-active{background:transparent; color:var(--cream); border-color:rgba(250, 247, 242, 0.3)} body.dark .tpl-screen-sub{color:rgba(250, 247, 242, 0.7)} body.dark .tpl-foot-link{color:rgba(250, 247, 242, 0.6)} body.dark .tpl-foot-link:hover{color:var(--accent-text)} @media (max-width:720px){.tpl-gallery{grid-template-columns:repeat(2, 1fr)}} @media (max-width:480px){.tpl-gallery{grid-template-columns:1fr}} @media (prefers-reduced-motion:reduce){.tpl-card, .tpl-btn{transition:none} .tpl-card.is-active{box-shadow:0 0 0 1px var(--accent)}} .auth-explainer{margin-top:28px; padding-top:22px; border-top:1px solid var(--line); font-size:var(--text-sm); line-height:1.65; color:var(--ink-2); opacity:0.78} body.dark .auth-explainer{color:var(--ink-2); opacity:0.7} .auth-explainer h3{font-size:11px; letter-spacing:0.22em; text-transform:uppercase; font-weight:700; color:var(--ink); opacity:0.9; margin:0 0 10px} .auth-explainer p{margin:0 0 10px} .auth-explainer p:last-child{margin-bottom:0} .auth-explainer a{color:var(--accent-text); font-weight:600} .auth-explainer code{font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:12px; background:var(--cream-2, rgba(0,0,0,0.04)); padding:1px 5px; border-radius:3px} body.dark .auth-explainer code{background:rgba(255,255,255,0.06)} .seo-page{max-width:920px; margin:0 auto; padding:80px 24px 96px} .seo-breadcrumb{display:flex; gap:8px; align-items:center; font-size:13px; letter-spacing:0.04em; color:var(--text-dim, #707070); margin-bottom:32px} .seo-breadcrumb a{color:var(--ink, #0B0E12); text-decoration:none; border-bottom:1px solid currentColor} .seo-hero{border-bottom:1px solid var(--line, rgba(0,0,0,0.08)); padding-bottom:56px; margin-bottom:64px} .seo-eyebrow{font-size:12px; letter-spacing:0.22em; text-transform:uppercase; font-weight:700; color:var(--accent-text, #C2410C); margin:0 0 16px} .seo-title{font-family:'Saira', system-ui, sans-serif; font-size:clamp(34px, 6vw, 56px); font-weight:800; letter-spacing:-0.02em; line-height:1.05; margin:0 0 20px; color:var(--ink, #0B0E12)} .seo-lede{font-size:clamp(17px, 2vw, 20px); line-height:1.55; max-width:640px; color:var(--ink, #0B0E12); opacity:0.85; margin:0 0 32px} .seo-cta-row{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px} .seo-cta{display:inline-flex; align-items:center; gap:8px; padding:14px 22px; border-radius:999px; font-weight:600; font-size:15px; text-decoration:none; border:1px solid transparent; transition:transform 120ms ease, background-color 120ms ease} .seo-cta-primary{background:var(--accent, #C2410C); color:#fff} .seo-cta-primary:hover{transform:translateY(-1px); background:var(--accent-2, #9A3412)} .seo-cta-secondary{background:transparent; color:var(--ink, #0B0E12); border-color:var(--line-strong, rgba(0,0,0,0.18))} .seo-cta-secondary:hover{background:rgba(0,0,0,0.04)} body.dark .seo-cta-secondary{color:#fff; border-color:rgba(255,255,255,0.18)} body.dark .seo-cta-secondary:hover{background:rgba(255,255,255,0.06)} .seo-meta-line{display:flex; flex-wrap:wrap; gap:6px 12px; align-items:center; font-size:13px; color:var(--text-dim, #707070); margin:0} .seo-section{padding:48px 0; border-bottom:1px solid var(--line, rgba(0,0,0,0.06))} .seo-section-title{font-family:'Saira', system-ui, sans-serif; font-size:clamp(22px, 3vw, 28px); font-weight:700; letter-spacing:-0.01em; margin:0 0 24px; color:var(--ink, #0B0E12)} .seo-points{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:18px 28px} .seo-points li{padding:16px 18px; border:1px solid var(--line, rgba(0,0,0,0.08)); border-radius:12px; background:rgba(255,255,255,0.4)} .seo-points strong{display:block; font-size:15px; font-weight:700; margin-bottom:6px; color:var(--ink, #0B0E12)} .seo-points span{font-size:14px; line-height:1.5; color:var(--ink, #0B0E12); opacity:0.8} .seo-feature-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:16px} .seo-feature-card{padding:20px 18px; border:1px solid var(--line, rgba(0,0,0,0.08)); border-radius:12px; background:rgba(255,255,255,0.5)} .seo-feature-card h3{font-size:15px; font-weight:700; margin:0 0 8px; color:var(--ink, #0B0E12)} .seo-feature-card p{font-size:14px; line-height:1.5; margin:0; color:var(--ink, #0B0E12); opacity:0.78} .seo-steps{list-style:none; padding:0; margin:0; counter-reset:seostep; display:grid; gap:16px} .seo-steps li{display:grid; grid-template-columns:44px 1fr; gap:16px; padding:18px 20px; border:1px solid var(--line, rgba(0,0,0,0.08)); border-radius:12px; background:rgba(255,255,255,0.4)} .seo-step-num{width:36px; height:36px; border-radius:50%; background:var(--accent, #C2410C); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:16px} .seo-steps h3{font-size:16px; font-weight:700; margin:0 0 4px; color:var(--ink, #0B0E12)} .seo-steps p{font-size:14px; line-height:1.55; margin:0; color:var(--ink, #0B0E12); opacity:0.8} .seo-truth{list-style:none; padding:0; margin:0; display:grid; gap:10px} .seo-truth li{position:relative; padding:12px 16px 12px 36px; border-left:2px solid var(--accent, #C2410C); background:rgba(194,65,12,0.06); border-radius:0 8px 8px 0; font-size:14px; line-height:1.55; color:var(--ink, #0B0E12)} .seo-truth li::before{content:"✓"; position:absolute; left:12px; top:12px; color:var(--accent, #C2410C); font-weight:700} .seo-faq-list{margin:0; padding:0; display:grid; gap:12px} .seo-faq-item{border:1px solid var(--line, rgba(0,0,0,0.08)); border-radius:10px; padding:14px 18px; background:rgba(255,255,255,0.4)} .seo-faq-item dt{font-weight:700; font-size:15px; color:var(--ink, #0B0E12); margin-bottom:6px} .seo-faq-item dd{margin:0; font-size:14px; line-height:1.55; color:var(--ink, #0B0E12); opacity:0.82} .seo-cta-band{margin-top:56px; padding:40px 24px; text-align:center; border:1px solid var(--line-strong, rgba(0,0,0,0.18)); border-radius:16px; background:rgba(255,255,255,0.5)} .seo-cta-band h2{font-family:'Saira', system-ui, sans-serif; font-size:clamp(22px, 3vw, 30px); font-weight:700; margin:0 0 12px; color:var(--ink, #0B0E12)} .seo-cta-band p{font-size:15px; line-height:1.55; margin:0 0 24px; color:var(--ink, #0B0E12); opacity:0.78} @media (max-width:600px){.seo-page{padding:48px 16px 64px} .seo-hero{padding-bottom:40px; margin-bottom:40px} .seo-section{padding:36px 0}} body.dark .seo-points li,body.dark .seo-feature-card,body.dark .seo-steps li,body.dark .seo-truth li,body.dark .seo-faq-item,body.dark .seo-cta-band{background:rgba(255,255,255,0.04); border-color:rgba(255,255,255,0.10)} body.dark .seo-points strong,body.dark .seo-points span,body.dark .seo-feature-card h3,body.dark .seo-feature-card p,body.dark .seo-steps h3,body.dark .seo-steps p,body.dark .seo-faq-item dt,body.dark .seo-faq-item dd,body.dark .seo-cta-band h2,body.dark .seo-cta-band p{color:#fff} .colophon-nav{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:32px 48px; width:100%; margin:24px 0; text-align:left} .colophon-nav-col{display:flex; flex-direction:column; gap:8px} .colophon-nav-heading{font-size:11px; letter-spacing:0.22em; text-transform:uppercase; font-weight:700; margin:0 0 6px; color:var(--ink, #0B0E12); opacity:0.7} .colophon-nav-col a{font-size:14px; color:var(--ink, #0B0E12); text-decoration:none; padding:2px 0; border-bottom:1px solid transparent; width:fit-content; transition:border-color 120ms ease} .colophon-nav-col a:hover{border-bottom-color:var(--ink, #0B0E12)} .footer .container{display:grid; grid-template-columns:auto 1fr auto; gap:32px; align-items:start} @media (max-width:760px){.footer .container{grid-template-columns:1fr} .colophon-nav{grid-template-columns:repeat(2, minmax(0, 1fr)); gap:24px}} body.dark .colophon-nav-heading,body.dark .colophon-nav-col a{color:#fff} body.dark .colophon-nav-col a:hover{border-bottom-color:#fff} .trust-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:16px; margin-top:32px} .trust-card{padding:22px 22px 20px; border:1px solid var(--line, rgba(0,0,0,0.08)); border-radius:14px; background:rgba(255,255,255,0.5)} .trust-card h3{font-family:'Saira', system-ui, sans-serif; font-size:16px; font-weight:700; margin:0 0 8px; color:var(--ink, #0B0E12)} .trust-card p{font-size:14px; line-height:1.55; margin:0; color:var(--ink, #0B0E12); opacity:0.78} .trust-lead{font-size:clamp(15px, 2vw, 18px); line-height:1.55; max-width:640px; color:var(--ink, #0B0E12); opacity:0.78; margin:12px 0 0} .trust-foot{margin-top:24px; font-size:14px; color:var(--text-dim, #707070); display:flex; flex-wrap:wrap; gap:6px 12px} .trust-foot a{color:var(--ink, #0B0E12); border-bottom:1px solid currentColor; text-decoration:none} body.dark .trust-card{background:rgba(255,255,255,0.04); border-color:rgba(255,255,255,0.10)} body.dark .trust-card h3,body.dark .trust-card p,body.dark .trust-lead,body.dark .trust-foot a{color:#fff} .legal-page{max-width:760px; margin:0 auto; padding:80px 24px 96px} .legal-eyebrow{font-size:12px; letter-spacing:0.22em; text-transform:uppercase; font-weight:700; color:var(--accent-text, #C2410C); margin:0 0 16px} .legal-title{font-family:'Saira', system-ui, sans-serif; font-size:clamp(32px, 5vw, 48px); font-weight:800; letter-spacing:-0.02em; margin:0 0 12px; color:var(--ink, #0B0E12); overflow-wrap:anywhere} .legal-meta{font-size:13px; color:var(--text-dim, #707070); margin:0 0 48px} .legal-section{border-top:1px solid var(--line, rgba(0,0,0,0.08)); padding:32px 0} .legal-section h2{font-family:'Saira', system-ui, sans-serif; font-size:22px; font-weight:700; margin:0 0 16px; color:var(--ink, #0B0E12)} .legal-section p,.legal-section li{font-size:15px; line-height:1.65; color:var(--ink, #0B0E12); opacity:0.85} .legal-section ul{padding-left:22px} .legal-section code{font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:13px; background:rgba(0,0,0,0.05); padding:1px 6px; border-radius:4px} body.dark .legal-section{border-top-color:rgba(255,255,255,0.10)} body.dark .legal-section code{background:rgba(255,255,255,0.08); color:#fff} .trust-card:focus-within,.legal-section:focus-within{outline:2px solid var(--accent, #C2410C); outline-offset:2px} a:focus-visible,button:focus-visible,[role="button"]:focus-visible{outline:2px solid var(--accent, #C2410C); outline-offset:2px; border-radius:4px}