
@font-face { font-family: "Geist"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("fonts/Geist-Regular.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fonts/Geist-Medium.woff2") format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("fonts/Geist-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("fonts/GeistMono-Regular.woff2") format("woff2"); }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fonts/GeistMono-Medium.woff2") format("woff2"); }
:root {
  color-scheme: dark;
  --bg: #0A0A0B;
  --surface: #121214;
  --surface-2: #18181B;
  --line: #1F1F22;
  --line-2: #232327;
  --line-card: #26262A;
  --line-3: #2E2E33;
  --text: #F2F2EF;
  --text-2: #A3A3A8;
  --text-3: #8B8B91;
  --text-4: #C9C9CE;
  --icon: #6B6B71;
  --new: #8FE3D3;
  --new-line: #234B44;
  --growth: #FFB547;
  --growth-line: #5C4320;
  --neutral-line: #333338;
  --brand-ink: #13786A;          
  --ct-bg: #000000;              
  --ink-on-primary: #0A0A0B;     
  --growth-point: #FFD08A;       
  --new-point: #C6F4EA;
  --neutral-point: #F2F2EF;
  --dash: rgba(242, 242, 239, 0.7);
  --selection-fill: rgba(143, 227, 211, 0.10);
  --focus: #8FE3D3;
  --grad-primary: linear-gradient(180deg, #C6F4EA 0%, #8FE3D3 48%, #74D6C3 52%, #8FE3D3 100%);
  --shadow-primary: inset 0 1px 0 rgba(255, 255, 255, 0.7), inset 0 -1px 0 rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(143, 227, 211, 0.35), 0 8px 24px rgba(143, 227, 211, 0.18);
  --shadow-primary-hover: inset 0 1px 0 rgba(255, 255, 255, 1), inset 0 -1px 0 rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(143, 227, 211, 0.45), 0 8px 24px rgba(143, 227, 211, 0.24);
  --grad-secondary: linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.03));
  --shadow-secondary: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 0 0 1px rgba(255, 255, 255, 0.10);
  --shadow-secondary-hover: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 0 0 1px rgba(255, 255, 255, 0.16);
  --grad-card: linear-gradient(180deg, #18181B 0%, #121214 40%, #101012 100%);
  --shadow-card: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 24px 48px rgba(0, 0, 0, 0.45);
  --shadow-card-tool: inset 0 1px 0 rgba(255, 255, 255, 0.07);   
  --grad-metal: linear-gradient(180deg, #FFFFFF 0%, #F2F2EF 48%, #B9B9B6 52%, #E9E9E6 100%);
  --metal-darkest: #B9B9B6;      
  --grad-tag-growth: linear-gradient(180deg, rgba(255, 181, 71, 0.16), rgba(255, 181, 71, 0.04));
  --grad-tag-new: linear-gradient(180deg, rgba(143, 227, 211, 0.16), rgba(143, 227, 211, 0.04));
  --grad-tag-neutral: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02));
  --shadow-tag: inset 0 1px 0 rgba(255, 255, 255, 0.08);
  --grad-icon: linear-gradient(180deg, rgba(143, 227, 211, 0.22), rgba(143, 227, 211, 0.05));
  --shadow-icon: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 0 0 1px rgba(143, 227, 211, 0.25);
  --shadow-avatar: inset 0 1px 0 rgba(255, 255, 255, 0.18);   
  --grad-pill: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
  --shadow-pill: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 0 0 1px rgba(255, 255, 255, 0.08);
  --glow-page: radial-gradient(ellipse 70% 38% at 50% 18%, rgba(143, 227, 211, 0.09), transparent 70%);
  --glow-page-side: radial-gradient(ellipse 60% 70% at 30% 20%, rgba(143, 227, 211, 0.09), transparent 70%);
  --glow-card: radial-gradient(ellipse at center, rgba(143, 227, 211, 0.20), transparent 70%);
  --glow-blur: blur(40px);
  --grad-panel: radial-gradient(ellipse 60% 80% at 50% 0%, rgba(143, 227, 211, 0.16), transparent 70%), linear-gradient(180deg, #18181B 0%, #101012 100%);
  --glass-header: rgba(10, 10, 11, 0.6);
  --glass-blur: blur(12px);
  --glass-line: rgba(255, 255, 255, 0.06);
  --grad-row-selected: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02));
  --grad-row-hover: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
  --shadow-frame: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
  --grad-curve-box-growth: linear-gradient(180deg, rgba(255, 181, 71, 0.06), rgba(255, 181, 71, 0));
  --grad-curve-box-new: linear-gradient(180deg, rgba(143, 227, 211, 0.06), rgba(143, 227, 211, 0));
  --grad-curve-box-neutral: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0));
  --shadow-curve-box: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --grad-curve-fill: rgba(255, 181, 71, 0.10);
  --grad-curve-fill-new: rgba(143, 227, 211, 0.10);
  --grad-curve-fill-neutral: rgba(201, 201, 206, 0.08);
  --shadow-curve: drop-shadow(0 0 6px rgba(255, 181, 71, 0.6));
  --shadow-curve-new: drop-shadow(0 0 6px rgba(143, 227, 211, 0.5));
  --shadow-curve-neutral: none;
  --shadow-cursor: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.5));
  --edit-fill: rgba(143, 227, 211, 0.16);
  --scrim: rgba(10, 10, 11, 0.72);
  --font-sans: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --t-display: 96px;
  --t-closing: 56px;
  --t-h2: 40px;
  --t-demo-1: 32px;
  --t-demo-2: 28px;
  --t-h3: 22px;
  --t-lead: 20px;
  --t-18: 18px;
  --t-16: 16px;
  --t-15: 15px;
  --t-14: 14px;
  --t-13: 13px;
  --t-12: 12px;
  --lh-display: 1.02;
  --lh-tight: 1;
  --lh-heading: 1.1;
  --lh-ui: 1.4;
  --lh-lead: 1.5;
  --lh-body: 1.55;
  --lh-report: 1.6;
  --track-display: -0.045em;
  --track-closing: -0.04em;
  --track-h2: -0.03em;
  --track-demo: -0.025em;
  --track-h3: -0.015em;
  --track-eyebrow: 0.08em;
  --w-regular: 400;
  --w-medium: 500;
  --w-semibold: 600;
  --s-1: 1px;
  --s-2: 2px;
  --s-4: 4px;
  --s-8: 8px;
  --s-10: 10px;
  --s-12: 12px;
  --s-14: 14px;
  --s-16: 16px;
  --s-20: 20px;
  --s-22: 22px;
  --s-24: 24px;
  --s-28: 28px;
  --s-32: 32px;
  --s-36: 36px;
  --s-40: 40px;
  --s-48: 48px;
  --s-56: 56px;
  --s-64: 64px;
  --s-72: 72px;
  --s-80: 80px;
  --s-96: 96px;
  --s-120: 120px;
  --s-128: 128px;
  --r-pill: 999px;
  --r-24: 24px;
  --r-20: 20px;
  --r-16: 16px;
  --r-12: 12px;
  --r-10: 10px;
  --r-8: 8px;
  --r-6: 6px;
  --r-4: 4px;
  --r-round: 50%;
  --container: 1200px;
  --gutter: 24px;
  --side: 32px;
  --header-h: 72px;
  --demo-header-h: 64px;
  --banner-h: 32px;
  --logo-h: 24px;
  --logo-h-demo: 20px;
  --logo-h-foot: 22px;
  --mark-h: 72px;
  --icon-tile: 44px;
  --icon-glyph: 22px;
  --chevron: 16px;
  --thumb: 56px;
  --frame-h: 300px;
  --frame-h-demo: 280px;
  --frame-h-vision: 360px;
  --frame-h-phone: 220px;
  --frame-h-side: 150px;
  --frame-w-phone: 220px;
  --curve-h: 132px;
  --point: 10px;
  --point-last: 14px;
  --inset-w: 88px;
  --inset-h: 68px;
  --avatar: 72px;
  --demo-box-h: 420px;
  --menu-btn: 44px;
  --track-w: 320px;
  --stroke: 1.6px;
  --hairline: 1px;
  --rule: 2px;
  --tilt: 6deg;
  --tilt-depth: 2400px;
  --rise: -2px;
  --text-measure: 620px;
  --scrollbar: 6px;
  --frame-gap: 8px;
  --metal-pad: 0.12em;
  --lh-btn: 1.25;
  --row-who: 200px;
  --row-who-demo: 240px;
  --row-when: 120px;
  --col-status: 112px;
  --col-status-demo: 150px;
  --col-visits: 200px;
  --col-visits-demo: 300px;
  --aside-max: 560px;
  --glow-h: 2900px;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --t-hover: 150ms;
  --t-frame: 400ms;
  --t-frame-gap: 150ms;
  --t-curve: 900ms;
  --t-screen: 300ms;
  --frame-rise: 8px;
}
@media (max-width: 1023px) {
  :root { --t-display: 64px; --t-closing: 40px; --t-h2: 32px; }
}
@media (max-width: 599px) {
  :root { --t-display: 44px; --t-closing: 32px; --t-h2: 28px; --t-h3: 20px; --t-lead: 17px; --side: 16px;
    --header-h: 64px; --logo-h: 20px; --frame-h: 220px; --frame-h-demo: 220px; --frame-h-vision: 260px; --demo-box-h: 220px; }
}
