/* showcase/assets/lens.css — shared visual DNA from B_lens, used by all 3 proposals */
:root{
  --surface:#111316;
  --surface-low:#1a1c1f;
  --surface-mid:#1e2023;
  --surface-high:#282a2d;
  --surface-highest:#333538;
  --outline:#414754;
  --on-surface:#e2e2e6;
  --on-surface-variant:#c1c6d7;
  --on-surface-dim:#8b90a0;
  --primary:#4cd6ff;
  --primary-dim:#009dc1;
  --on-primary:#003543;
  --secondary:#59dad1;
  --tertiary:#fbbc00;
  --error:#ffb4ab;
  --pink:#ff6b9d;
  --violet:#a78bfa;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--surface);color:var(--on-surface);font-family:"Inter",system-ui,sans-serif;font-size:15px;line-height:1.5;letter-spacing:-0.003em;}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums;}
.serif{font-family:"Fraunces",Georgia,serif;}
::selection{background:rgba(76,214,255,.3);}
a{color:inherit}

/* Top nav (replay) */
nav.top{position:fixed;top:0;left:0;right:0;z-index:50;padding:18px 32px;display:flex;justify-content:space-between;align-items:center;background:rgba(17,19,22,.72);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(65,71,84,.08);}
nav.top .brand{font-size:15px;font-weight:700;letter-spacing:-0.02em;color:var(--primary);text-decoration:none;}
nav.top .center{display:flex;align-items:center;gap:14px;font-size:12px;color:var(--on-surface-variant);}
nav.top .runs-picker{appearance:none;background:rgba(40,42,45,.6);color:var(--on-surface);border:1px solid rgba(65,71,84,.4);border-radius:999px;padding:8px 32px 8px 14px;font-family:inherit;font-size:12px;letter-spacing:.04em;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--on-surface-dim) 50%),linear-gradient(135deg,var(--on-surface-dim) 50%,transparent 50%);background-position:calc(100% - 16px) 50%, calc(100% - 12px) 50%;background-size:4px 4px;background-repeat:no-repeat;}
nav.top .status{display:flex;align-items:center;gap:14px;font-size:12px;color:var(--on-surface-variant);}
nav.top .status .dot{width:8px;height:8px;border-radius:50%;background:var(--secondary);box-shadow:0 0 12px var(--secondary);animation:pulse 1.8s ease-in-out infinite;}
@keyframes pulse{50%{opacity:.4;}}

/* Glossary tooltip — dotted underline */
.gl{border-bottom:1px dotted rgba(193,198,215,.45);cursor:help;position:relative;}
.gl:hover{border-bottom-color:var(--primary);color:var(--on-surface);}
.gl-pop{position:fixed;z-index:200;max-width:300px;padding:14px 16px;background:rgba(40,42,45,.96);backdrop-filter:blur(16px);border:1px solid rgba(76,214,255,.25);border-radius:14px;box-shadow:0 16px 60px rgba(0,0,0,.5);pointer-events:none;opacity:0;transition:opacity .15s;}
.gl-pop.show{opacity:1;}
.gl-pop .term{font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--primary);margin-bottom:6px;}
.gl-pop .plain{font-size:13px;line-height:1.5;color:var(--on-surface-variant);text-wrap:pretty;}

/* Common typography */
.eyebrow{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--primary);font-weight:600;display:flex;align-items:center;gap:10px;}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--primary);}
h2.section{font-size:clamp(40px,5vw,72px);font-weight:800;letter-spacing:-0.035em;line-height:1.02;margin:0 0 24px;}
h2.section .accent{color:var(--primary);}
h2.section .soft{color:var(--on-surface-dim);font-weight:300;}

/* Pills */
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;background:var(--surface-low);border:1px solid rgba(65,71,84,.25);border-radius:999px;font-size:11px;color:var(--on-surface-variant);letter-spacing:.04em;}
.pill .d{width:6px;height:6px;border-radius:50%;background:var(--secondary);}
.pill.hot{color:var(--primary);border-color:rgba(76,214,255,.25);}
.pill.warn{color:var(--tertiary);border-color:rgba(251,188,0,.25);}
.pill.err{color:var(--error);border-color:rgba(255,180,171,.25);}

/* Verb chip — used on cards and stamps */
.verb-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:6px;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-family:"JetBrains Mono",monospace;}
.verb-open_new{background:rgba(76,214,255,.12);color:var(--primary);}
.verb-close{background:rgba(255,180,171,.12);color:var(--error);}
.verb-cancel_pending{background:rgba(167,139,250,.14);color:var(--violet);}
.verb-replace{background:rgba(89,218,209,.12);color:var(--secondary);}
.verb-hold{background:rgba(251,188,0,.12);color:var(--tertiary);}
.verb-stand_aside{background:rgba(139,144,160,.18);color:var(--on-surface-variant);}