
:root{
  /* —— raw brand palette (reference; components use the semantic vars below) —— */
  --core-violet:#8a2be2; --core-soft-violet:#a855f7; --core-royal:#5b5cff;
  --core-cyan:#00e5d3; --core-digital:#00b4ff;
  --mr-blue:#2563ff; --mr-cyan:#18d6ff; --mr-violet:#7c3aed; --mr-gold:#d6a84f;
  --ms-rose:#ff4fd8; --ms-magenta:#e056fd; --ms-violet:#a855f7; --ms-cyan:#67e8f9; --ms-pearl:#fff7fb;

  /* —— fonts —— */
  --font-display:"Space Grotesk",-apple-system,system-ui,sans-serif;
  --font-body:"Inter",-apple-system,system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,monospace;
  --font-editorial:"Playfair Display",Georgia,serif;

  /* —— spacing scale (4px base) —— */
  --sp-xxs:4px; --sp-xs:8px; --sp-s:12px; --sp-m:16px; --sp-l:24px;
  --sp-xl:36px; --sp-2xl:56px; --sp-3xl:80px; --sp-4xl:120px;

  /* —— radius —— */
  --r-xs:4px; --r-s:8px; --r-m:12px; --r-l:18px; --r-xl:22px; --r-pill:999px;

  /* —— motion —— */
  --ease:cubic-bezier(.2,.7,.2,1); --dur:.3s; --dur-fast:.18s; --dur-slow:.55s;

  /* —— SEMANTIC defaults = engine / core (neutral dark) —— */
  --bg:#050713; --bg-2:#0d1024;
  --ink:#f4f7fb; --ink-2:#aab2c0; --ink-3:#6e7689;
  --accent:#00e5d3; --accent-2:#5b5cff; --violet:#8a2be2; --gold:#d6a84f; --pearl:#fff7fb;
  --grad:linear-gradient(135deg,#a855f7 0%,#5b5cff 45%,#00e5d3 100%);
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.16);
  --card-grad:linear-gradient(180deg,rgba(15,18,48,.4),rgba(11,13,31,.4));
  --shadow-accent:rgba(91,92,255,.5);
  --display-style:normal; /* MsEgo flips key headings to editorial italic */
  --grid-alpha:.02; --glow-alpha:.10;
}

/* ============ MrEgo · A (dark, base) ============ */
[data-face="mr"]{
  --bg:#050713; --bg-2:#0d1024;
  --ink:#f4f7fb; --ink-2:#aab2c0; --ink-3:#6e7689;
  --accent:#18d6ff; --accent-2:#2563ff; --violet:#7c3aed; --gold:#d6a84f;
  --grad:linear-gradient(135deg,#7c3aed 0%,#2563ff 50%,#18d6ff 100%);
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.16);
  --card-grad:linear-gradient(180deg,rgba(15,18,48,.4),rgba(11,13,31,.4));
  --shadow-accent:rgba(37,99,255,.5);
  --display-style:normal;
}
/* MrEgo · D (light) — explicit or auto+OS-light */
[data-face="mr"][data-mode="light"],
[data-face="mr"][data-mode="dark"]{ /* dark kept by base; light overrides next */ }
[data-face="mr"][data-mode="light"]{
  --bg:#f5f7fb; --bg-2:#ffffff;
  --ink:#0b1226; --ink-2:#46546c; --ink-3:#586679;
  --accent:#0e9aa8; --accent-2:#3949c0; --violet:#6d28d9;
  --grad:linear-gradient(135deg,#3949c0 0%,#6d28d9 50%,#0e9aa8 100%);
  --line:rgba(11,18,38,.14); --line-2:rgba(11,18,38,.24);
  --card-grad:linear-gradient(180deg,#ffffff,#f5f7fb);
  --shadow-accent:rgba(57,73,192,.35); --grid-alpha:.03; --glow-alpha:.06;
}

/* ============ MsEgo · B (dark, base) ============ */
[data-face="ms"]{
  --bg:#06051a; --bg-2:#140f2e;
  --ink:#fff7fb; --ink-2:#b8b5c8; --ink-3:#6e6980;
  --accent:#ff4fd8; --accent-2:#a855f7; --violet:#a855f7; --gold:#d6a84f; --pearl:#fff7fb;
  --grad:linear-gradient(135deg,#ff4fd8 0%,#a855f7 50%,#67e8f9 100%);
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.16);
  --card-grad:linear-gradient(180deg,rgba(26,11,46,.45),rgba(6,5,26,.5));
  --shadow-accent:rgba(255,79,216,.5);
  --display-style:italic;
}
/* MsEgo · C (light) — explicit or auto+OS-light */
[data-face="ms"][data-mode="light"]{
  --bg:#f6f1e8; --bg-2:#ffffff;
  --ink:#1a0f24; --ink-2:#5a4a5f; --ink-3:#6a5e70;
  --accent:#c2185b; --accent-2:#7c3aed; --violet:#7c3aed; --gold:#a47532;
  --grad:linear-gradient(135deg,#c2185b 0%,#7c3aed 50%,#1e8a94 100%);
  --line:rgba(26,15,36,.16); --line-2:rgba(26,15,36,.26);
  --card-grad:linear-gradient(180deg,#ffffff,#f6f1e8);
  --shadow-accent:rgba(194,24,91,.3); --grid-alpha:.03; --glow-alpha:.05;
}

/* ============ neutral · engine light ============ */
[data-face="neutral"][data-mode="light"]{
  --bg:#f5f7fb; --bg-2:#ffffff;
  --ink:#0b1226; --ink-2:#46546c; --ink-3:#586679;
  --accent:#5b5cff; --accent-2:#8a2be2;
  --line:rgba(11,18,38,.14); --line-2:rgba(11,18,38,.24);
  --card-grad:linear-gradient(180deg,#ffffff,#f5f7fb);
  --shadow-accent:rgba(91,92,255,.35); --grid-alpha:.03; --glow-alpha:.06;
}

/* ============ auto = follow the visitor's OS ============ */
@media (prefers-color-scheme: light){
  [data-face="mr"][data-mode="auto"]{
    --bg:#f5f7fb; --bg-2:#ffffff;
    --ink:#0b1226; --ink-2:#46546c; --ink-3:#586679;
    --accent:#0e9aa8; --accent-2:#3949c0; --violet:#6d28d9;
    --grad:linear-gradient(135deg,#3949c0 0%,#6d28d9 50%,#0e9aa8 100%);
    --line:rgba(11,18,38,.14); --line-2:rgba(11,18,38,.24);
    --card-grad:linear-gradient(180deg,#ffffff,#f5f7fb);
    --shadow-accent:rgba(57,73,192,.35); --grid-alpha:.03; --glow-alpha:.06;
  }
  [data-face="ms"][data-mode="auto"]{
    --bg:#f6f1e8; --bg-2:#ffffff;
    --ink:#1a0f24; --ink-2:#5a4a5f; --ink-3:#6a5e70;
    --accent:#c2185b; --accent-2:#7c3aed; --violet:#7c3aed; --gold:#a47532;
    --grad:linear-gradient(135deg,#c2185b 0%,#7c3aed 50%,#1e8a94 100%);
    --line:rgba(26,15,36,.16); --line-2:rgba(26,15,36,.26);
    --card-grad:linear-gradient(180deg,#ffffff,#f6f1e8);
    --shadow-accent:rgba(194,24,91,.3); --grid-alpha:.03; --glow-alpha:.05;
  }
  [data-face="neutral"][data-mode="auto"]{
    --bg:#f5f7fb; --bg-2:#ffffff;
    --ink:#0b1226; --ink-2:#46546c; --ink-3:#586679;
    --accent:#5b5cff; --accent-2:#8a2be2;
    --line:rgba(11,18,38,.14); --line-2:rgba(11,18,38,.24);
    --card-grad:linear-gradient(180deg,#ffffff,#f5f7fb);
    --shadow-accent:rgba(91,92,255,.35); --grid-alpha:.03; --glow-alpha:.06;
  }
}

/* ============ base document ============ */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:
    radial-gradient(900px 600px at 90% -10%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 60%),
    radial-gradient(800px 600px at -10% 80%, color-mix(in srgb, var(--violet, #8a2be2) 9%, transparent), transparent 60%),
    var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
/* faint engineering grid behind everything */
.ego-grid::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(128,128,160,var(--grid-alpha)) 1px, transparent 1px),
    linear-gradient(90deg, rgba(128,128,160,var(--grid-alpha)) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse at 50% 30%, black 30%, transparent 75%);
}
a{color:inherit;text-decoration:none}


/* —— typography helpers —— */
.ego-display{font-family:var(--font-display);font-weight:400;letter-spacing:-.025em;line-height:1.05;color:var(--ink)}
.ego-display.editorial{font-family:var(--font-editorial);font-style:var(--display-style)}
.ego-h2{font-family:var(--font-display);font-weight:400;font-size:clamp(28px,4vw,40px);letter-spacing:-.025em;color:var(--ink)}
.ego-h3{font-family:var(--font-display);font-weight:500;font-size:20px;letter-spacing:-.01em;color:var(--ink)}
.ego-mono{font-family:var(--font-mono);letter-spacing:.04em}
.ego-grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.ego-muted{color:var(--ink-2)}
.ego-dim{color:var(--ink-3)}

/* —— eyebrow —— */
.ego-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-2);padding:6px 12px;border:1px solid var(--line-2);border-radius:var(--r-pill);
  background:color-mix(in srgb,var(--ink) 3%,transparent);
}
.ego-eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent);animation:ego-pulse 1.6s ease-in-out infinite}

/* —— pill —— */
.ego-pill{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  padding:5px 11px;border:1px solid var(--line-2);border-radius:var(--r-pill);
  color:var(--ink-2);background:color-mix(in srgb,var(--ink) 2%,transparent);
}
.ego-pill .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent)}
.ego-pill.live{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 35%,transparent)}
.ego-pill.live .dot{animation:ego-pulse 1.6s ease-in-out infinite}
.ego-pill.draft{color:var(--ink-3)}
.ego-pill.draft .dot{background:var(--ink-3);box-shadow:none}

/* —— buttons —— */
.ego-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 18px;font-size:13px;font-weight:500;font-family:var(--font-body);
  border-radius:var(--r-s);border:1px solid transparent;cursor:pointer;
  transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur) var(--ease),opacity var(--dur-fast);
  color:var(--ink);
}
.ego-btn:hover{transform:translateY(-1px)}
.ego-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}
.ego-btn-primary{background:var(--grad);color:#fff;box-shadow:0 12px 32px -10px var(--shadow-accent)}
.ego-btn-primary:hover{box-shadow:0 16px 40px -10px var(--shadow-accent)}
.ego-btn-ghost{background:color-mix(in srgb,var(--ink) 4%,transparent);border-color:var(--line-2)}
.ego-btn-gold{background:transparent;color:var(--gold);border-color:color-mix(in srgb,var(--gold) 45%,transparent)}

/* —— input —— */
.ego-input{
  width:100%;padding:13px 16px;background:color-mix(in srgb,var(--ink) 4%,transparent);
  border:1px solid var(--line-2);border-radius:var(--r-s);color:var(--ink);
  font-family:var(--font-body);font-size:14px;outline:none;
  transition:border-color var(--dur-fast),box-shadow var(--dur-fast);
}
.ego-input::placeholder{color:var(--ink-3)}
.ego-input:focus{border-color:var(--accent-2);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-2) 18%,transparent)}
.ego-label{display:block;font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin:14px 0 6px}

/* —— card —— */
.ego-card{background:var(--card-grad);border:1px solid var(--line);border-radius:var(--r-l);padding:24px;box-shadow:0 1px 2px rgba(0,0,0,.04),0 14px 34px -22px rgba(0,0,0,.30)}
.ego-card-hairline{border:1px solid var(--line);border-radius:var(--r-m);padding:18px;background:color-mix(in srgb,var(--ink) 2%,transparent)}

/* —— feature card with icon tile —— */
.ego-feature{padding:22px;border:1px solid var(--line);border-radius:var(--r-m);background:var(--card-grad);display:flex;flex-direction:column;gap:10px}
.ego-icon-tile{
  width:38px;height:38px;border-radius:var(--r-s);display:grid;place-items:center;
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent-2) 18%,transparent),color-mix(in srgb,var(--accent) 8%,transparent));
  border:1px solid var(--line-2);color:var(--accent);
}

/* —— toggle —— */
.ego-toggle{width:36px;height:20px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--ink) 12%,transparent);border:1px solid var(--line-2);position:relative;cursor:pointer;transition:background var(--dur-fast),border-color var(--dur-fast);flex-shrink:0}
.ego-toggle::after{content:"";position:absolute;top:1px;left:1px;width:16px;height:16px;border-radius:50%;background:var(--ink-2);transition:transform var(--dur-fast) var(--ease),background var(--dur-fast)}
.ego-toggle.on{background:color-mix(in srgb,var(--accent) 25%,transparent);border-color:color-mix(in srgb,var(--accent) 50%,transparent)}
.ego-toggle.on::after{transform:translateX(16px);background:var(--accent)}

/* —— agent badge (the recurring "live agent" chip) —— */
.ego-agent-badge{
  display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--r-pill);
  border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);
  background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--ink);
  font-family:var(--font-body);font-size:13px;cursor:pointer;
}
.ego-agent-badge .spark{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--grad);color:#fff;font-size:12px}
.ego-agent-badge .pulse{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent);animation:ego-pulse 1.6s ease-in-out infinite}

/* —— divider —— */
.ego-divider{height:1px;background:linear-gradient(90deg,transparent,var(--line-2),transparent);margin:28px 0}

/* —— motion —— */
@keyframes ego-pulse{50%{opacity:.4}}
@keyframes ego-orbit{to{transform:rotate(360deg)}}
.ego-orb{width:48px;height:48px;border-radius:50%;background:conic-gradient(from 0deg,var(--accent-2),var(--violet,#8a2be2),var(--accent),var(--accent-2));animation:ego-orbit 3s linear infinite;position:relative}
.ego-orb::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--bg)}
@media (prefers-reduced-motion: reduce){
  .ego-orb,.ego-pill.live .dot,.ego-eyebrow .dot,.ego-agent-badge .pulse{animation:none}
}

/* —— EgoOS mark (orbiting rings) —— */
.ego-mark{width:100%;height:100%;display:block;overflow:visible}
.ego-mark-r1,.ego-mark-r2,.ego-mark-r3{transform-box:view-box;transform-origin:120px 120px}
.ego-mark-r1{animation:ego-orbit 140s linear infinite}
.ego-mark-r2{animation:ego-orbit 90s linear infinite reverse}
.ego-mark-r3{animation:ego-orbit 60s linear infinite}
@media (prefers-reduced-motion: reduce){.ego-mark-r1,.ego-mark-r2,.ego-mark-r3{animation:none}}


@keyframes ego-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* ===== interactive hero logo ===== */
.hero-logo3d{position:relative;width:88%;max-width:420px;aspect-ratio:1;margin:0 auto;perspective:1200px;cursor:pointer;animation:ego-float 8s ease-in-out infinite;--prox:0}
.hero-logo3d .hero-logo-svg{width:100%;height:100%;display:block;
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition:transform .5s var(--ease),filter .4s;transform-style:preserve-3d;
  filter:drop-shadow(0 0 calc(40px + var(--prox)*60px) rgba(91,92,255,calc(.35 + var(--prox)*.3))) drop-shadow(0 0 calc(20px + var(--prox)*40px) rgba(0,229,211,calc(.2 + var(--prox)*.25)))}
.hero-logo3d.is-hot .hero-logo-svg{filter:drop-shadow(0 0 90px rgba(91,92,255,.65)) drop-shadow(0 0 50px rgba(0,229,211,.45)) drop-shadow(0 0 30px rgba(168,85,247,.35))}
.hl-halo{animation:hl-halo 6s ease-in-out infinite;transform-origin:120px 120px;transform-box:view-box}
@keyframes hl-halo{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.04)}}
.hl-ring-1,.hl-ring-2,.hl-ring-3,.hl-arc,.hl-particles,.hl-particles-rev,.hl-sparkle,.hl-sparkle-rays,.hl-pulse,.hl-core,.hl-sparkle-center{transform-origin:120px 120px;transform-box:view-box}
.hl-ring-1{animation:hl-spin 50s linear infinite}
.hl-ring-2{animation:hl-spin 38s linear infinite reverse}
.hl-ring-3{animation:hl-spin 70s linear infinite}
.hl-ring-1,.hl-ring-2,.hl-ring-3{transition:animation-duration .6s}
.hero-logo3d.is-hot .hl-ring-1{animation-duration:10s}
.hero-logo3d.is-hot .hl-ring-2{animation-duration:7s}
.hero-logo3d.is-hot .hl-ring-3{animation-duration:14s}
@keyframes hl-spin{to{transform:rotate(360deg)}}
.hl-arc{animation:hl-arc 8s ease-in-out infinite}
@keyframes hl-arc{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
.hl-particles{animation:hl-spin 30s linear infinite}
.hl-particles-rev{animation:hl-spin 22s linear infinite reverse}
.hl-accents{animation:hl-twinkle 3.5s ease-in-out infinite}
@keyframes hl-twinkle{0%,100%{opacity:.7}50%{opacity:.25}}
.hl-sparkle-rays{animation:hl-spin 12s linear infinite}
.hl-sparkle-center{animation:hl-center 2.4s ease-in-out infinite}
@keyframes hl-center{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.6);opacity:.6}}
.hl-core{animation:hl-coreglow 4s ease-in-out infinite}
@keyframes hl-coreglow{0%,100%{opacity:.9;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
.hero-logo3d.is-hot .hl-core{opacity:1}
.hl-pulse-burst{animation:hl-pulse-burst 1.6s var(--ease) forwards}
.hl-pulse-auto{animation:hl-pulse-auto 2.2s ease-out forwards}
@keyframes hl-pulse-burst{0%{transform:scale(.4);opacity:1}100%{transform:scale(6);opacity:0}}
@keyframes hl-pulse-auto{0%{transform:scale(.6);opacity:.7}100%{transform:scale(5.5);opacity:0}}
.hl-cursor{pointer-events:none;opacity:.7}
.hl-hint{position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);font-family:var(--font-mono);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3);opacity:0;transition:opacity .4s;pointer-events:none;white-space:nowrap}
.hero-logo3d:hover .hl-hint{opacity:1}

/* ===== scroll reveal ===== */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .9s var(--ease),transform .9s var(--ease);will-change:opacity,transform}
[data-reveal].is-in{opacity:1;transform:translateY(0)}

/* ===== parallax (set --px/--py on a [data-parallax] ancestor) ===== */
[data-parallax-child]{transform:translate(calc(var(--px,0)*14px),calc(var(--py,0)*14px));transition:transform .5s var(--ease)}

/* ===== magnetic ===== */
[data-magnetic]{transition:transform .35s var(--ease)}

/* ===== typewriter caret ===== */
.ego-type-caret{display:inline-block;width:.08em;height:1em;margin-left:.04em;background:var(--accent);vertical-align:-.08em;animation:ego-caret 1s steps(1) infinite}
@keyframes ego-caret{50%{opacity:0}}

/* ===== snapshot stack (gentle spread on hover + seal) ===== */
[data-snap-stack]:hover .ld-snap:nth-child(1){transform:translate(0,-4px) rotate(-4deg);box-shadow:0 22px 48px rgba(0,0,0,.55)}
[data-snap-stack]:hover .ld-snap:nth-child(2){transform:translate(26px,14px) rotate(3deg)}
[data-snap-stack]:hover .ld-snap:nth-child(3){transform:translate(52px,28px) rotate(-2deg)}
.ld-snap.sealing{animation:ego-seal .6s var(--ease)}
@keyframes ego-seal{0%{opacity:0;transform:scale(.9) translateY(-12px)}100%{opacity:1}}

@media (prefers-reduced-motion: reduce){
  .hero-logo3d{animation:none}
  .hl-ring-1,.hl-ring-2,.hl-ring-3,.hl-particles,.hl-particles-rev,.hl-sparkle-rays,.hl-arc,.hl-core,.hl-halo,.hl-sparkle-center{animation:none}
  [data-reveal]{opacity:1;transform:none;transition:none}
}


.ego-ld{width:100%;height:100%;display:block;overflow:visible}
.ego-ld-r1,.ego-ld-r2,.ego-ld-r3,.ego-ld-core,.ego-ld-spark{transform-box:view-box;transform-origin:120px 120px}
.ego-ld-r1{animation:ego-orbit 2.6s linear infinite}
.ego-ld-r2{animation:ego-orbit 1.7s linear infinite reverse}
.ego-ld-r3{animation:ego-orbit 3.6s linear infinite}
.ego-ld-spark{animation:ego-orbit 8s linear infinite}
.ego-ld-core{animation:ego-ldpulse 1.4s ease-in-out infinite}
@keyframes ego-ldpulse{0%,100%{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.14)}}
/* inline loader */
.ego-loader{display:inline-flex;flex-direction:column;align-items:center;gap:12px;color:var(--ink-3);padding:18px}
.ego-loader .mark{display:block;filter:drop-shadow(0 0 16px rgba(91,92,255,.35))}
.ego-loader .lbl{font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase}
/* full-screen blocking overlay (small animation in a compact card) */
.ego-overlay{position:fixed;inset:0;z-index:9998;display:none;place-items:center;cursor:wait;background:color-mix(in srgb,var(--bg) 62%,transparent);backdrop-filter:blur(6px);opacity:0;transition:opacity .18s var(--ease,ease)}
.ego-overlay.show{display:grid;opacity:1}
.ego-overlay .box{display:flex;flex-direction:column;align-items:center;gap:12px;padding:22px 28px;border-radius:var(--r-l);background:color-mix(in srgb,var(--bg-2) 90%,transparent);border:1px solid var(--line-2);box-shadow:0 24px 60px -20px rgba(0,0,0,.6)}
.ego-overlay .mark{width:54px;height:54px;filter:drop-shadow(0 0 16px rgba(91,92,255,.5))}
.ego-overlay .lbl{font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
