/* GSX 2026 booth display. Brand palette (customer-read), committed dark. */
:root{
  --deep-blue:#162354; --deep-blue-2:#0d1538; --deep-purple:#4c1d95; --purple:#6f51a1;
  --light-purple:#ae8cc0; --light-blue:#33a8df; --light-gray:#f3f3f3; --deep-gray:#4d4d4f;
  --ink:#ffffff; --ink-dim:rgba(243,243,243,.62); --line:rgba(174,140,192,.28);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--deep-blue-2);color:var(--ink);font-family:Roboto,"Helvetica Neue",Arial,sans-serif;overflow:hidden}
.stage{position:absolute;width:1920px;height:1080px;transform-origin:top left;overflow:hidden;
  background:
    radial-gradient(900px 600px at 50% 52%, rgba(111,81,161,.45), transparent 70%),
    radial-gradient(700px 500px at 8% 100%, rgba(51,168,223,.18), transparent 70%),
    linear-gradient(180deg,var(--deep-blue) 0%,var(--deep-blue-2) 100%)}
.topbar{position:absolute;left:80px;right:80px;top:48px;height:64px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:22px;font-size:34px;font-weight:700;letter-spacing:.02em}
.logo .mark{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--deep-purple),var(--light-blue));position:relative}
.logo .mark:after{content:"";position:absolute;inset:11px;border-radius:50%;background:var(--deep-blue-2)}
.logo .rule{width:1px;height:38px;background:var(--line)}
.logo .product{font-weight:300;font-size:30px;letter-spacing:.06em}
.logo .product b{font-weight:700}
.eyebrow{font-size:16px;letter-spacing:.14em;text-transform:uppercase;color:var(--light-blue);font-weight:500}
.tag{font-size:20px;font-weight:300;color:var(--ink-dim);letter-spacing:.02em}
.ticker{position:absolute;left:80px;right:80px;bottom:44px;height:48px;border-top:1px solid var(--line);display:flex;align-items:center;gap:36px;font-family:"Roboto Mono",ui-monospace,Menlo,monospace;font-size:17px;color:var(--ink-dim);white-space:nowrap;overflow:hidden}
.ticker .live{color:var(--light-blue);display:flex;align-items:center;gap:10px;font-weight:500}
.ticker .live i{font-size:10px;animation:blink 1.4s infinite}
.ticker span.ev b{color:var(--ink);font-weight:500}
@keyframes blink{50%{opacity:.25}}
.col-label{font-size:18px;letter-spacing:.16em;text-transform:uppercase;color:var(--light-purple);font-weight:500;display:flex;align-items:center;gap:14px}
.col-label .n{width:36px;height:36px;border-radius:4px;background:var(--deep-purple);display:grid;place-items:center;color:#fff;font-size:18px;letter-spacing:0}
.sentence{position:absolute;left:80px;right:80px;bottom:120px;text-align:center;font-size:40px;font-weight:300;line-height:1.25;text-wrap:balance;color:var(--ink)}
.sentence b{font-weight:700;color:var(--light-blue)}
.sentence em{font-style:normal;font-weight:700;color:var(--light-purple)}
.cam{position:absolute;right:80px;top:140px;display:flex;align-items:center;gap:12px;font-size:16px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-dim);border:1px solid var(--line);border-radius:6px;padding:10px 16px}
.cam .dot{width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 12px #22c55e}
@media (prefers-reduced-motion: reduce){ *{animation:none!important;transition:none!important} }