:root {
  

  
  --p-ink: #0c0f17;
  --p-ink-hover: #262a33;
  --p-white: #fff;
  --p-grey-50: #fbfbfc;   
  --p-grey-100: #f3f4f7;  
  --p-grey-200: #eef0f2;  
  --p-grey-250: #e9ecef;  
  --p-grey-300: #e1e5ea;  
  --p-studio: #e7e7e7;    
  --p-film-fallback: #c9cdd2;
  --p-film-dark: #0b0d12;

  
  --p-ink-a62: rgba(12,15,23,.62);
  --p-ink-a35: rgba(12,15,23,.35);
  --p-ink-a13: rgba(12,15,23,.13);
  --p-ink-a12: rgba(12,15,23,.12);
  --p-ink-a10: rgba(12,15,23,.10);
  --p-ink-a08: rgba(12,15,23,.08);
  --p-ink-a07: rgba(12,15,23,.07);
  --p-ink-a06: rgba(12,15,23,.06);
  --p-ink-a88: rgba(12,15,23,.88);  

  
  --p-white-a92: rgba(255,255,255,.92);
  --p-white-a90: rgba(255,255,255,.9);
  --p-white-a86: rgba(255,255,255,.86);
  --p-white-a70: rgba(255,255,255,.7);
  --p-white-a16: rgba(255,255,255,.16);
  --p-black-a45: rgba(0,0,0,.45);

  
  --p-blue: #216bff;
  --p-blue-a45: rgba(33,107,255,.45);
  --p-blue-a18: rgba(33,107,255,.18);
  --p-light-a: rgba(120,160,245,.38);   
  --p-light-b: rgba(185,201,243,.22);   
  --p-field-top: #f4f5f8;
  --p-field-bottom: #e9edf6;

  
  --p-shade-a38: rgba(6,9,18,.38);
  --p-shade-a62: rgba(6,9,18,.62);
  --p-shade-a0: rgba(6,9,18,0);

  
  --color-bg: var(--p-grey-200);
  --color-text: var(--p-ink);                
  --color-text-muted: var(--p-ink-a62);      
  --color-rule: var(--p-ink-a12);            
  --color-surface-panel: var(--p-grey-100);
  --color-surface-window: var(--p-grey-50);
  --color-surface-window-bar: var(--p-grey-100);
  --color-surface-studio: var(--p-studio);
  --color-surface-placeholder: var(--p-grey-300);
  --color-surface-film: var(--p-film-dark);
  --color-surface-film-fallback: var(--p-film-fallback);
  --color-accent: var(--p-ink);              
  --color-accent-hover: var(--p-ink-hover);
  --color-on-accent: var(--p-white);
  --color-on-film: var(--p-white);
  --color-on-film-muted: var(--p-white-a90);
  --color-on-film-control: var(--p-white-a16);
  --color-on-film-button: var(--p-white-a92);       
  --color-on-film-button-hover: var(--p-white-a86);
  --color-focus: var(--p-ink);
  --color-focus-on-film: var(--p-white);
  --color-signal: var(--p-blue);             

  
  --font-sans: "Geist", system-ui, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, Menlo, monospace;
  --font-weight-regular: 400;
  --font-weight-light: 300;                  

  --font-size-display: clamp(40px, calc(28.11px + 3.048vw), 72px);   
  --line-height-display: 1;
  --letter-spacing-display: -.045em;
  --font-size-title: clamp(32px, calc(26.06px + 1.524vw), 48px);     
  --line-height-title: 1.08;
  --letter-spacing-title: -.03em;
  --font-size-spec: clamp(28px, calc(26.51px + .381vw), 32px);       
  --letter-spacing-spec: -.04em;
  --font-size-heading: clamp(20px, calc(18.51px + .381vw), 24px);    
  --line-height-heading: 1.3;
  --letter-spacing-heading: -.015em;
  --font-size-lead: clamp(17px, calc(15.89px + .286vw), 20px);       
  --line-height-lead: 1.45;
  --font-size-body: 17px;
  --line-height-body: 1.6;
  --font-size-small: 15px;                       
  --line-height-small: 1.5;
  --font-size-caption: 13px;                     
  --font-size-label: 12px;                       
  --line-height-label: 1.4;
  --letter-spacing-label: .06em;
  --letter-spacing-cjk: 0;                       

  
  --max: 1360px;                                            
  --gut: clamp(20px, calc(9.6px + 2.667vw), 48px);          
  --sec: clamp(120px, calc(90.29px + 7.619vw), 200px);      

  
  --space-4: 4px; --space-8: 8px; --space-12: 12px; --space-16: 16px; --space-20: 20px; --space-24: 24px;
  --space-32: 32px; --space-40: 40px; --space-48: 48px; --space-64: 64px; --space-96: 96px;
  
  --space-rule-label: var(--space-16);      
  --space-title-text: var(--space-24);      
  --space-label-title: var(--space-40);     
  --space-text-action: var(--space-32);     
  --space-group: var(--space-48);           
  --space-block: clamp(64px, calc(52.11px + 3.048vw), 96px);   
  --space-row: var(--space-16);             
  --space-row-lg: var(--space-20);          

  
  --bp: 860px;

  
  --radius-field: 20px;     
  --radius-media: 16px;     
  --radius-capsule: var(--radius-media);
  --radius-window: 10px;    
  --radius-pill: 999px;     
  --radius-focus: 3px;

  
  --control-h: 48px;        
  --control-h-sm: 40px;     

  
  --shadow-capsule: 0 10px 30px -18px var(--p-ink-a35);
  --ring-capsule: inset 0 0 0 1px var(--p-ink-a06), inset 0 1px 0 var(--p-white-a70);
  --ring-menu: inset 0 0 0 1px var(--p-ink-a06);
  --shadow-window: 0 0 0 1px var(--p-ink-a08), 0 28px 70px var(--p-ink-a10), 0 14px 32px var(--p-ink-a06);
  --blur-frost: blur(24px) saturate(1.8);
  --blur-control: blur(8px);
  --frost-capsule: linear-gradient(180deg, rgba(255,255,255,.55), rgba(244,245,247,.42));
  --frost-menu: rgba(246,247,249,.9);
  --film-shade: linear-gradient(180deg, var(--p-shade-a38) 0%, var(--p-shade-a0) 22%, var(--p-shade-a0) 45%, var(--p-shade-a62) 100%);
  --filmbox-shade: linear-gradient(180deg, transparent 50%, var(--p-black-a45));
  --field-bg: radial-gradient(55% 75% at 50% 112%, var(--p-light-a), var(--p-light-b) 45%, transparent 75%), linear-gradient(180deg, var(--p-field-top), var(--p-field-bottom));
  --stage-bg: linear-gradient(180deg, var(--p-grey-250), var(--p-grey-300));
  --glim-glow: 0 0 0 3px var(--p-blue-a18), 0 0 18px 6px var(--p-blue-a45);

  
  --z-nav: 30;
  --z-intro: 80;
  --z-dev: 95;   

  
  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-std: cubic-bezier(.25,.46,.45,.94);
  --ease-in-exit: cubic-bezier(.42,0,1,1);   
  --ease-inout: cubic-bezier(.65,0,.35,1);   
  --t-press: 60ms;      
  --t-base: 180ms;      
  --t-move: 320ms;      
  --t-reveal: 800ms;    
  --t-mask: 1400ms;     
  --t-exit: var(--t-base);   
  --press: .98;
  --nudge: 3px;
  --zoom: 1.025;
  --rise: 12px;
  --line-stagger: 90ms;    
  --line-rise: 20%;
  --line-blur: 10px;
  --reveal-stagger: 80ms;  
  --mask-stagger: 80ms;
  --mask-band: 40%;
  --reveal-at: 85%;        

  
  --nav-height: 76px;
  --nav-height-solid: 56px;
  --nav-inset: 12px;
  --nav-gap: 32px;
  --nav-links-gap: 32px;
  --btn-height: var(--control-h);
  --btn-height-nav: var(--control-h-sm);
  --btn-height-play: var(--control-h);
  --btn-pad: 20px;
  --btn-pad-play: 24px;
  --btn-gap: 12px;
  --control-round: var(--control-h-sm);  
  --window-bar-height: 34px;
  --window-bar-rule: var(--p-ink-a07);
  --window-dot: 10px;
  --window-dot-fill: var(--p-ink-a13);
  --glim-size: 6px;                      
  --focus-width: 1px;
  --focus-offset: 3px;
  
  --plate-stagger: 120ms;
  --plate-tick-stagger: 35ms;

  
  --bg: var(--color-bg);
  --ink: var(--color-text);
  --grey: var(--color-text-muted);
  --rule: var(--color-rule);
  --t-1: var(--font-size-display);
  --t-2: var(--font-size-title);
  --t-3: var(--font-size-heading);
  --t-body: var(--font-size-body);
  --ease: var(--ease-out);
  --ease-legacy: var(--ease-out);
  --ease-focus: var(--ease-out);
  --color-text-soft: var(--color-text-muted);
  --font-size-film-sub: var(--font-size-lead);
  --line-height-film-sub: var(--line-height-lead);
  --t-fast: var(--t-base);
  --t-fade: var(--t-reveal);
  --t-zoom: var(--t-reveal);
  --t-morph: var(--t-move);
  --btn-height-nav-solid: var(--control-h-sm);
  --bp-phone: var(--bp);
  --bp-tablet: var(--bp);

  color-scheme: light;
}