/* SummitKin v3 "Ridge" tokens. Two families (OFL): Martian Grotesk for display, Onest for text and survey figures. */
@font-face{font-family:"Martian Grotesk";src:url(../fonts/MartianGrotesk-VF.woff2) format("woff2");font-weight:100 1000;font-stretch:75% 200%;font-display:swap}
@font-face{font-family:"Onest";src:url(../fonts/Onest-VF.woff2) format("woff2");font-weight:400 600;font-display:swap}
@font-face{font-family:"Onest Fallback";src:local("Arial");size-adjust:104%;ascent-override:92%;descent-override:22%;line-gap-override:0%}
:root{
 /* depth ramp: abyss -> ground -> plate -> lit */
 --c-abyss:#060F1C;--c-ground:#0A1626;--c-mass:#0E1D31;--c-mask:#0C1A2C;--c-plate:#101F33;--c-lit:#16283F;
 --c-line:#22344B;--c-line-ui:#6F86A0;
 --c-text:#E6EDF5;--c-text-2:#A9B8C9;--c-muted:#8A9BB0;
 /* mint is energy: hot core + soft halo */
 --c-mint:#A8E6C4;--c-mint-core:#E8FFF2;--c-mint-halo:rgba(168,230,196,.18);--c-mint-ink:#06231A;
 /* contour lines (canvas reads these) */
 --contour-hair:rgba(200,222,245,.10);--contour-ridge:rgba(214,232,255,.26);
 --f-display:"Martian Grotesk",ui-sans-serif,system-ui,sans-serif;--f-text:"Onest","Onest Fallback",ui-sans-serif,system-ui,sans-serif;--f-mono:var(--f-text);
 --r-control:8px;--r-card:12px;--r-pill:999px;
 /* motion tokens */
 --ease-out:cubic-bezier(.16,1,.3,1);--ease-ui:cubic-bezier(.2,0,0,1);--ease-settle:cubic-bezier(.33,1,.68,1);
 --t-ui-fast:160ms;--t-ui:220ms;--t-ui-slow:260ms;--t-ambient:720ms;--t-pulse:1100ms;--t-draw-in:2600ms;
}
*{box-sizing:border-box}
button,input,select,textarea{margin:0;padding:0}
html,body{margin:0;background:var(--c-ground);color:var(--c-text);font:400 16px/1.6 var(--f-text);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;letter-spacing:-.003em}
a{color:inherit}
.display{font-family:var(--f-display);font-stretch:106%;font-weight:500;letter-spacing:-.022em}
.mono{font-family:var(--f-text);font-size:13px;letter-spacing:0;font-variant-numeric:tabular-nums}
.muted{color:var(--c-muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:var(--r-control);font:500 15px/1 var(--f-text);text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform var(--t-ui-fast) var(--ease-ui),background var(--t-ui-fast) var(--ease-ui)}
.btn:active{transform:translateY(1px) scale(.985)}
.btn-primary{background:var(--c-mint);color:var(--c-mint-ink)}
.btn-primary:hover{box-shadow:inset 0 -2px 0 var(--c-mint-ink)}
.btn-ghost{background:transparent;color:var(--c-text);border-color:var(--c-line-ui)}
.btn-ghost:hover{box-shadow:inset 0 -2px 0 var(--c-mint)}
.tlink{display:inline-flex;align-items:center;justify-content:center;min-height:48px;min-width:48px;font-weight:500;font-size:15px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:8px;text-decoration-color:var(--c-line-ui)}
.tlink:hover{text-decoration-color:var(--c-mint)}
header nav a{position:relative}
header nav a::after{content:"";position:absolute;left:16px;right:16px;bottom:8px;height:2px;background:var(--c-mint);transform:scaleX(0);transform-origin:left;transition:transform var(--t-ui) var(--ease-ui);pointer-events:none}
header nav a:hover::after{transform:scaleX(1)}
.lsw{display:inline-flex;align-items:center;font:500 13px/1 var(--f-text);letter-spacing:.02em}
.lsw button{min-width:48px;min-height:48px;padding:0 8px;background:none;border:0;color:var(--c-text-2);font:inherit;cursor:pointer}
.lsw button span{position:relative;padding:4px 0}
.lsw button span::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background-image:linear-gradient(var(--c-mint),var(--c-mint));transform:scaleX(0);transform-origin:left;transition:transform var(--t-ui) var(--ease-ui)}
.lsw button:hover span::after,.lsw button[aria-pressed=true] span::after{transform:scaleX(1)}
.lsw button[aria-pressed=true]{color:var(--c-mint)}
.lsw i{font-style:normal;color:var(--c-muted)}
.tabs{position:relative}
.tabs .glide{position:absolute;top:0;left:0;height:2px;width:48px;background-image:linear-gradient(var(--c-mint),var(--c-mint));transform:translateX(0);transition:transform var(--t-ui) var(--ease-ui),width var(--t-ui) var(--ease-ui);pointer-events:none}
:focus-visible{outline:none;box-shadow:0 0 0 2px var(--c-ground),0 0 0 4px var(--c-mint)}
.brand{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;font:500 15px/1 var(--f-display);font-stretch:106%;letter-spacing:-.01em;min-width:48px;min-height:48px}
.brand svg{width:22px;height:22px}
canvas.field{position:absolute;inset:0;width:100%;height:100%;display:block}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}


html,body{height:auto;overflow-x:hidden}
.hero{position:relative;height:100vh;overflow:hidden;background:var(--c-ground);touch-action:none}
canvas.field{z-index:0;pointer-events:none}
.sheet{position:relative;z-index:3;height:100%;pointer-events:none}
.sheet a{pointer-events:auto}
nav.top{display:flex;align-items:center;justify-content:space-between;padding:16px 48px}
.brand{background:var(--c-ground);border-radius:8px;padding:0 12px}
.nav-links{display:flex;align-items:center;gap:8px;background:var(--c-ground);border-radius:12px;padding:0 8px}
.nav-links a{position:relative}
.nav-links a::after{content:"";position:absolute;left:8px;right:8px;bottom:6px;height:2px;background:var(--c-mint);transform:scaleX(0);transform-origin:left;transition:transform var(--t-ui) var(--ease-ui)}
.nav-links a:hover::after{transform:scaleX(1)}
.copy{position:absolute;left:48px;top:112px;width:min(480px,34vw);z-index:4}
h1{font-size:40px;line-height:1.12;margin:0 0 16px;max-width:12em;font-variation-settings:"wdth" 106,"wght" 500}
.lead .d{display:block}
.lead .m{display:none}
.lead .ln{display:block;white-space:nowrap}
.lead{font-size:18px;line-height:1.45;color:var(--c-text-2);margin:0 0 16px;max-width:34em}
.acts{display:flex;gap:16px;align-items:center}
.roomwrap{position:absolute;z-index:4;top:88px;left:68%;width:360px;margin:0;transform:translateX(-50%)}
.room{background:#060F1C;border:1px solid var(--c-line);border-radius:12px;overflow:hidden;transition:box-shadow var(--t-ui) var(--ease-ui)}
.room:hover{box-shadow:inset 0 0 0 1px var(--c-mint)}
.bar{display:flex;align-items:center;gap:16px;height:40px;padding:0 16px}
.live{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 12px;border-radius:999px;border:1px solid var(--c-line-ui);font:500 13px/1 var(--f-text);letter-spacing:.04em;color:var(--c-muted)}
.live i{width:6px;height:6px;border-radius:999px;background:var(--c-line-ui)}
.room.on .live{border-color:var(--c-mint);color:var(--c-mint)}
.room.on .live i{background:var(--c-mint)}
.when{font:400 13px/1 var(--f-text);font-variant-numeric:tabular-nums;color:var(--c-text-2)}
.stage{position:relative;height:132px;margin:8px;border-radius:8px;background:#04101D;border:1px solid var(--c-line);overflow:hidden}
.host{position:absolute;left:8px;right:8px;top:8px;bottom:44px;border-radius:8px;background:#2A4A68;border:1px solid var(--c-line);overflow:hidden}
.room.on .host{border-color:#A8E6C4}
.host em{position:absolute;left:8px;bottom:8px;z-index:2;font-style:normal;font:500 13px/1 var(--f-text);color:#E6EDF5}
.voice{display:none;position:absolute;right:20px;top:50%;height:24px;transform:translateY(-50%);align-items:center;gap:4px}
.room.on .voice{display:flex}
.voice span{width:2px;height:8px;border-radius:999px;background:#A8E6C4}
.voice span:nth-child(2){height:16px}
.voice span:nth-child(3){height:24px}
.voice span:nth-child(4){height:20px}
.voice span:nth-child(5){height:12px}
.voice span:nth-child(6){height:16px}
.dock{position:absolute;left:8px;bottom:8px;z-index:2;display:flex;gap:8px}
.mic,.ico{width:28px;height:28px;border-radius:8px;display:grid;place-items:center}
.mic{background:var(--c-mint);color:var(--c-mint-ink)}
.ico{border:1px solid var(--c-line-ui);color:var(--c-text);background:#0A1626}
.mic svg,.ico svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#seat{position:absolute;z-index:4;width:48px;height:2px;background:rgba(168,230,196,.8);pointer-events:none}
@media (max-width:820px){
 nav.top{padding:8px 16px}.nav-links{display:none}
 .copy{left:16px;right:16px;top:268px;width:auto}
 .roomwrap{top:88px;left:12px;right:12px;width:auto;transform:none}
 .stage{height:108px}.bar{height:36px}
 .host{bottom:40px}
 h1.display{font-size:28px;line-height:1.12;margin:0 0 8px;max-width:none;white-space:nowrap;font-variation-settings:"wdth" 78,"wght" 500}
 .lead .d{display:none}
 .lead .m{display:block}
 .lead{font-size:16px;line-height:1.4;margin:0 0 8px;max-width:none}
}
