  :root{
    --bg:#071019;
    --panel:#0c1520;
    --panel-2:#111d29;
    --line:#274052;
    --line-soft:rgba(155,213,255,.12);
    --text:#d9e4eb;
    --muted:#8da1af;
    --accent:#9fd9ff;
    --accent-2:#d7f0ff;
    --success:#9de3b6;
    --error:#ffabab;
    --warn:#f1d08d;
    --glow:0 0 0 1px rgba(159,217,255,.06), 0 20px 60px rgba(0,0,0,.42);
  }
  *{box-sizing:border-box}
  html,body{margin:0;min-height:100%;background:
    radial-gradient(circle at top, rgba(159,217,255,.12), transparent 32%),
    radial-gradient(circle at 80% 15%, rgba(159,217,255,.05), transparent 20%),
    linear-gradient(180deg,#08131c 0%, #061019 58%, #040a10 100%);
    color:var(--text);
    font:15px/1.6 Georgia,"Times New Roman",serif;
  }
  body{overflow-x:hidden;position:relative}
  body::before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(transparent 0%, rgba(255,255,255,.02) 49%, transparent 100%),
      repeating-linear-gradient(180deg, rgba(255,255,255,.015) 0 1px, transparent 1px 4px);
    opacity:.32;
    mix-blend-mode:screen;
  }
  body::after{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    background:
      radial-gradient(circle at 14% 18%, rgba(255,255,255,.12) 0 1px, transparent 1.5px),
      radial-gradient(circle at 72% 26%, rgba(159,217,255,.12) 0 1px, transparent 1.5px),
      radial-gradient(circle at 32% 74%, rgba(255,255,255,.09) 0 1px, transparent 1.5px),
      radial-gradient(circle at 84% 78%, rgba(159,217,255,.08) 0 1px, transparent 1.5px);
    background-size:340px 340px, 420px 420px, 360px 360px, 460px 460px;
    opacity:.2;
    animation:driftField 28s linear infinite;
  }
  .app{max-width:960px;margin:0 auto;padding:12px;display:grid;gap:12px}
  .hero,.stats,.toolbar,.log-shell,.input-shell,.briefing{
    background:linear-gradient(180deg,var(--panel-2),var(--panel));
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--glow);
  }
  .hero,.stats,.toolbar,.input-shell,.briefing{padding:14px 16px}
  .hero{
    position:relative;
    overflow:hidden;
    background:
      linear-gradient(135deg, rgba(159,217,255,.08), transparent 40%),
      radial-gradient(circle at 82% 18%, rgba(215,240,255,.08), transparent 0 24%),
      linear-gradient(180deg,var(--panel-2),var(--panel));
  }
  .hero::before{
    content:"";
    position:absolute;
    inset:auto -12% -40% auto;
    width:320px;
    height:320px;
    border-radius:50%;
    border:1px solid rgba(159,217,255,.08);
    box-shadow:
      0 0 0 28px rgba(159,217,255,.035),
      0 0 0 56px rgba(159,217,255,.02);
    opacity:.8;
    transform:rotate(-12deg);
  }
  .hero::after{
    content:"";
    position:absolute;
    inset:-15%;
    background:
      conic-gradient(from 180deg at 82% 18%, rgba(159,217,255,.18), transparent 18%, transparent 65%, rgba(159,217,255,.14) 76%, transparent 100%);
    opacity:.5;
    mix-blend-mode:screen;
    animation:signalSweep 10s linear infinite;
  }
  .hero > *{position:relative;z-index:1}
  @keyframes signalSweep{
    from{transform:rotate(0deg)}
    to{transform:rotate(360deg)}
  }
  @keyframes driftField{
    from{transform:translate3d(0,0,0)}
    to{transform:translate3d(0,24px,0)}
  }
  @keyframes lampPulse{
    0%,100%{opacity:.45;transform:scale(1)}
    50%{opacity:1;transform:scale(1.08)}
  }
  @keyframes barTravel{
    0%{transform:translateX(-100%)}
    100%{transform:translateX(220%)}
  }
  @keyframes logoSweep{
    from{transform:rotate(-18deg)}
    to{transform:rotate(342deg)}
  }
  @keyframes logoCore{
    0%,100%{box-shadow:0 0 0 6px rgba(159,217,255,.08), 0 0 24px rgba(159,217,255,.25)}
    50%{box-shadow:0 0 0 10px rgba(159,217,255,.14), 0 0 42px rgba(159,217,255,.45)}
  }
  @keyframes logoPing{
    0%{transform:translate(-50%,-50%) scale(.7);opacity:.7}
    100%{transform:translate(-50%,-50%) scale(1.75);opacity:0}
  }
  @keyframes missionTrace{
    0%{transform:translateX(-18%);opacity:.2}
    35%,62%{opacity:.75}
    100%{transform:translateX(118%);opacity:.08}
  }
  @keyframes packetBlink{
    0%,100%{opacity:.36;transform:translateY(0)}
    45%{opacity:1;transform:translateY(-1px)}
  }
  .eyebrow{
    display:inline-block;
    justify-self:start;
    color:var(--accent);
    border:1px solid rgba(159,217,255,.24);
    border-radius:999px;
    padding:6px 10px;
    font-size:11px;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    background:rgba(159,217,255,.04);
  }
  h1{
    margin:12px 0 8px;
    font-size:clamp(2.5rem,5vw,4.2rem);
    line-height:.92;
    letter-spacing:-.05em;
    font-family:"Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;
    font-weight:700;
    max-width:10ch;
  }
  .brand-row{
    display:flex;
    align-items:center;
    gap:18px;
    margin:4px 0 2px;
    flex-wrap:wrap;
  }
  .brand-row h1{
    margin:6px 0;
  }
  .signal-logo{
    position:relative;
    flex:0 0 auto;
    width:152px;
    height:88px;
    padding:0;
    border:1px solid rgba(159,217,255,.18);
    border-radius:22px;
    overflow:hidden;
    cursor:pointer;
    appearance:none;
    color:var(--accent-2);
    background:
      radial-gradient(circle at 43% 52%, rgba(159,217,255,.22), transparent 0 18%),
      linear-gradient(145deg, rgba(159,217,255,.09), rgba(2,11,18,.72));
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.035), 0 16px 42px rgba(0,0,0,.28);
  }
  .signal-logo::before{
    content:"";
    position:absolute;
    inset:0;
    background:
      repeating-linear-gradient(90deg, rgba(159,217,255,.035) 0 1px, transparent 1px 18px),
      repeating-linear-gradient(180deg, rgba(159,217,255,.025) 0 1px, transparent 1px 18px);
    opacity:.72;
  }
  .signal-logo::after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    width:92px;
    height:92px;
    border-radius:50%;
    border:1px solid rgba(159,217,255,.2);
    transform:translate(-50%,-50%);
  }
  .logo-orbit,
  .logo-core,
  .logo-beam,
  .logo-label,
  .logo-ping{
    position:absolute;
    z-index:1;
    pointer-events:none;
  }
  .logo-orbit{
    left:50%;
    top:50%;
    width:70px;
    height:70px;
    border:1px solid rgba(159,217,255,.18);
    border-radius:50%;
    transform:translate(-50%,-50%) rotate(-18deg);
    animation:logoSweep 7s linear infinite;
  }
  .logo-orbit::before{
    content:"";
    position:absolute;
    right:5px;
    top:9px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--accent);
    box-shadow:0 0 18px rgba(159,217,255,.65);
  }
  .logo-core{
    left:50%;
    top:50%;
    width:18px;
    height:18px;
    border-radius:50%;
    background:linear-gradient(180deg, #e9f7ff, #7bcaff);
    transform:translate(-50%,-50%);
    animation:logoCore 2.8s ease-in-out infinite;
  }
  .logo-beam{
    left:50%;
    top:50%;
    width:58px;
    height:2px;
    border-radius:999px;
    background:linear-gradient(90deg, rgba(215,240,255,.9), rgba(159,217,255,.06));
    transform-origin:left center;
    transform:rotate(-20deg);
    box-shadow:0 0 12px rgba(159,217,255,.38);
  }
  .logo-label{
    left:12px;
    bottom:10px;
    font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:rgba(215,240,255,.78);
  }
  .logo-ping{
    left:50%;
    top:50%;
    width:64px;
    height:64px;
    border:1px solid rgba(159,217,255,.38);
    border-radius:50%;
    transform:translate(-50%,-50%) scale(.7);
    opacity:0;
  }
  .signal-logo:hover,
  .signal-logo:focus-visible{
    border-color:rgba(159,217,255,.38);
    outline:none;
  }
  .signal-logo:hover .logo-beam,
  .signal-logo:focus-visible .logo-beam{
    background:linear-gradient(90deg, #fff, rgba(159,217,255,.12));
  }
  .signal-logo.is-pinging .logo-ping{
    animation:logoPing .9s ease-out;
  }
  .hero p{margin:0;color:var(--muted)}
  .hero-grid{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(240px,.55fr);
    gap:16px;
    align-items:stretch;
  }
  .hero-copy{
    display:grid;
    gap:10px;
    align-content:start;
  }
  .hero-lead{
    max-width:58ch;
    color:var(--accent-2);
    font-size:1.03rem;
  }
  .hero-sub{
    max-width:62ch;
    margin-top:10px !important;
  }
  .hero-badges{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:2px;
  }
  .hero-badge{
    border:1px solid rgba(159,217,255,.18);
    border-radius:999px;
    padding:6px 9px;
    color:var(--accent-2);
    background:rgba(159,217,255,.055);
    font:11px/1.1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  .hero-start-panel{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    padding:12px 13px;
    border-radius:16px;
    border:1px solid rgba(159,217,255,.12);
    background:
      linear-gradient(90deg, rgba(159,217,255,.075), rgba(255,255,255,.018)),
      rgba(2,11,18,.28);
  }
  .hero-start-panel strong{
    display:block;
    color:var(--accent-2);
    font-size:1rem;
    line-height:1.2;
  }
  .hero-start-panel span{
    display:block;
    margin-top:4px;
    color:var(--muted);
    font-size:12px;
    line-height:1.35;
  }
  .hero-command-rail{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:7px;
  }
  .hero-command{
    border:1px solid rgba(159,217,255,.18);
    background:linear-gradient(180deg, rgba(159,217,255,.09), rgba(255,255,255,.02));
    color:var(--accent-2);
    border-radius:999px;
    padding:7px 10px;
    min-height:34px;
    font:12px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    cursor:pointer;
    transition:border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
  }
  .hero-command:hover,
  .hero-command:focus-visible{
    color:#fff;
    border-color:rgba(159,217,255,.38);
    background:rgba(159,217,255,.16);
    transform:translateY(-1px);
    outline:none;
  }
  .hero-visual{
    position:relative;
    overflow:hidden;
    border:1px solid rgba(159,217,255,.14);
    border-radius:20px;
    padding:12px;
    min-height:220px;
    display:grid;
    align-content:stretch;
    background:
      radial-gradient(circle at 20% 18%, rgba(159,217,255,.12), transparent 0 28%),
      linear-gradient(180deg, rgba(2,11,18,.78), rgba(8,17,26,.96));
    box-shadow:inset 0 0 0 1px rgba(159,217,255,.04), 0 20px 50px rgba(0,0,0,.26);
  }
  .hero-visual::before{
    content:"";
    position:absolute;
    inset:0;
    background:
      linear-gradient(transparent 0%, rgba(159,217,255,.04) 49%, transparent 100%),
      repeating-linear-gradient(90deg, rgba(159,217,255,.035) 0 1px, transparent 1px 34px),
      repeating-linear-gradient(180deg, rgba(159,217,255,.025) 0 1px, transparent 1px 30px);
    opacity:.46;
    pointer-events:none;
  }
  .hero-visual > *{position:relative;z-index:1}
  .hero-visual-header{
    display:flex;
    justify-content:space-between;
    gap:10px;
    align-items:center;
    margin-bottom:10px;
  }
  .visual-tag{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:6px 10px;
    border-radius:999px;
    border:1px solid rgba(159,217,255,.16);
    background:rgba(159,217,255,.05);
    color:var(--accent-2);
    font-size:11px;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .visual-tag.ghost{color:var(--muted)}
  .dish-stage{
    position:relative;
    height:100%;
    min-height:150px;
    border-radius:18px;
    border:1px solid rgba(159,217,255,.12);
    background:
      radial-gradient(circle at 50% 50%, rgba(159,217,255,.08), transparent 0 36%),
      linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
    overflow:hidden;
  }
  .dish-ring{
    position:absolute;
    left:50%;
    top:50%;
    border-radius:50%;
    border:1px solid rgba(159,217,255,.18);
    transform:translate(-50%, -50%);
  }
  .dish-ring.outer{width:148px;height:148px}
  .dish-ring.inner{width:102px;height:102px;box-shadow:0 0 0 18px rgba(159,217,255,.03)}
  .dish-axis{
    position:absolute;
    left:50%;
    top:22px;
    width:1px;
    height:114px;
    background:linear-gradient(180deg, rgba(159,217,255,.3), transparent);
    transform:translateX(-50%);
  }
  .dish-sweep{
    position:absolute;
    left:50%;
    top:50%;
    width:168px;
    height:168px;
    transform:translate(-50%, -50%);
    border-radius:50%;
    background:conic-gradient(from 0deg, rgba(159,217,255,.28), transparent 16%, transparent 68%, rgba(159,217,255,.16) 82%, transparent 100%);
    mix-blend-mode:screen;
    animation:signalSweep 7s linear infinite;
  }
  .dish-core{
    position:absolute;
    left:50%;
    top:50%;
    width:16px;
    height:16px;
    border-radius:50%;
    transform:translate(-50%, -50%);
    background:#4f6474;
    box-shadow:0 0 0 6px rgba(159,217,255,.06);
  }
  .dish-core.live{background:var(--success);box-shadow:0 0 0 8px rgba(157,227,182,.08), 0 0 18px rgba(157,227,182,.5);animation:lampPulse 2.2s ease-in-out infinite}
  .dish-core.warn{background:var(--warn);box-shadow:0 0 0 8px rgba(241,208,141,.08), 0 0 18px rgba(241,208,141,.42);animation:lampPulse 1.7s ease-in-out infinite}
  .dish-core.cold{background:#4f6474}
  .dish-beam{
    position:absolute;
    left:50%;
    top:50%;
    width:150px;
    height:2px;
    background:linear-gradient(90deg, rgba(159,217,255,.7), transparent);
    transform-origin:left center;
    transform:translate(0,-50%) rotate(-20deg);
    filter:drop-shadow(0 0 8px rgba(159,217,255,.25));
  }
  .hero-status-strip{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    align-self:start;
  }
  .status-node{
    display:flex;
    align-items:center;
    gap:8px;
    min-height:38px;
    padding:8px 10px;
    border-radius:12px;
    border:1px solid rgba(159,217,255,.1);
    background:rgba(255,255,255,.02);
    color:var(--muted);
    font-size:11px;
    letter-spacing:.08em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .status-led{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#4f6474;
    flex:0 0 auto;
  }
  .status-led.live{background:var(--success);box-shadow:0 0 14px rgba(157,227,182,.55);animation:lampPulse 2.1s ease-in-out infinite}
  .status-led.warn{background:var(--warn);box-shadow:0 0 14px rgba(241,208,141,.4);animation:lampPulse 1.6s ease-in-out infinite}
  .status-led.cold{background:#4f6474}
  .visual-readout{
    display:grid;
    gap:10px;
  }
  .hero-console-strip{
    display:grid;
    grid-template-columns:minmax(0,.58fr) minmax(280px,1.42fr);
    gap:10px;
    align-items:start;
    margin-top:2px;
  }
  .readout-card{
    padding:12px 13px;
    border-radius:14px;
    border:1px solid rgba(159,217,255,.1);
    background:rgba(255,255,255,.025);
  }
  .visual-label{
    display:block;
    color:var(--muted);
    font-size:11px;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .readout-card strong{
    display:block;
    margin-top:6px;
    color:var(--accent-2);
    font-size:.98rem;
    line-height:1.2;
  }
  .readout-card p{
    margin:7px 0 0;
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
  }
  .carrier-bar{
    position:relative;
    height:10px;
    margin-top:10px;
    border-radius:999px;
    border:1px solid rgba(159,217,255,.12);
    background:rgba(255,255,255,.03);
    overflow:hidden;
  }
  .carrier-fill{
    position:absolute;
    inset:0 auto 0 0;
    width:14%;
    border-radius:999px;
    background:linear-gradient(90deg, rgba(159,217,255,.3), rgba(215,240,255,.92));
  }
  .carrier-fill.success{background:linear-gradient(90deg, rgba(157,227,182,.3), rgba(157,227,182,.92))}
  .carrier-fill.warn{background:linear-gradient(90deg, rgba(241,208,141,.3), rgba(241,208,141,.9))}
  .carrier-fill::after{
    content:"";
    position:absolute;
    inset:0;
    width:42%;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
    animation:barTravel 2.6s linear infinite;
  }
  .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
  .stat{
    padding:12px 13px;
    border-radius:14px;
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
    border:1px solid rgba(255,255,255,.06);
  }
  .stat strong{display:block;color:var(--text);font-size:1rem}
  .stat span{
    display:block;
    color:var(--muted);
    font-size:11px;
    margin-top:4px;
    letter-spacing:.12em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .toolbar{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center;position:relative;z-index:14}
  .toolbar-title{color:var(--accent);letter-spacing:.18em;text-transform:uppercase;font-size:12px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
  .toolbar-meta{color:var(--muted);font-size:12px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
  .briefing{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .brief-card{
    padding:12px 13px;
    border-radius:14px;
    border:1px solid var(--line-soft);
    background:rgba(255,255,255,.02);
  }
  .brief-label{
    display:block;
    color:var(--muted);
    font-size:11px;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .brief-card strong{
    display:block;
    margin-top:6px;
    color:var(--accent-2);
    font-size:1rem;
    letter-spacing:-.02em;
  }
  .brief-card p{
    margin:7px 0 0;
    color:var(--muted);
    font-size:13px;
    line-height:1.5;
  }
  section.briefing{display:none}
  section.signal-board{display:none}
  .console-carousel{
    --dashboard-height:clamp(460px, 60vh, 640px);
    display:grid;
    gap:12px;
    margin-bottom:12px;
    min-width:0;
    max-width:100%;
  }
  .carousel-panels{
    height:var(--dashboard-height);
    min-height:0;
    min-width:0;
    max-width:100%;
    overflow-x:hidden;
  }
  .carousel-nav{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    padding:10px 12px;
    border:1px solid rgba(159,217,255,.12);
    border-radius:16px;
    background:linear-gradient(180deg, rgba(159,217,255,.05), rgba(255,255,255,.02));
  }
  .carousel-status{
    min-width:0;
    text-align:center;
  }
  .carousel-kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
  }
  .dashboard-sigil{
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:24px;
    padding:4px 9px;
    border-radius:999px;
    overflow:hidden;
    border:1px solid rgba(159,217,255,.16);
    background:rgba(159,217,255,.045);
    color:var(--accent-2);
    font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    letter-spacing:.14em;
    text-transform:uppercase;
  }
  .dashboard-sigil::before{
    content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:48%;
    background:linear-gradient(90deg, transparent, rgba(159,217,255,.2), transparent);
    animation:missionTrace 3.8s linear infinite;
  }
  .dashboard-sigil i{
    position:relative;
    z-index:1;
    width:5px;
    height:14px;
    border-radius:999px;
    background:rgba(159,217,255,.36);
    animation:packetBlink 1.9s ease-in-out infinite;
  }
  .dashboard-sigil i:nth-child(2){animation-delay:.28s}
  .dashboard-sigil i:nth-child(3){animation-delay:.56s}
  .dashboard-sigil span{position:relative;z-index:1}
  .carousel-status strong{
    display:block;
    margin-top:4px;
    color:var(--accent-2);
    font-size:1rem;
  }
  .carousel-status p{
    margin:6px 0 0;
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
  }
  .carousel-arrow{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border-radius:999px;
    border:1px solid rgba(159,217,255,.14);
    background:linear-gradient(180deg, rgba(159,217,255,.08), rgba(255,255,255,.02));
    color:var(--accent-2);
    font-size:18px;
    cursor:pointer;
    transition:border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
  }
  .carousel-arrow:hover,
  .carousel-arrow:focus-visible{
    border-color:rgba(159,217,255,.34);
    background:rgba(159,217,255,.14);
    transform:translateY(-1px);
    outline:none;
  }
  .carousel-panel{display:none}
  .carousel-panel.active{
    display:grid;
    gap:12px;
    min-height:0;
    height:100%;
    max-height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    align-content:start;
  }
  .carousel-panel > *{
    margin:0;
  }
  #panelMapBody,
  #panelMissionBody{
    grid-auto-rows:min-content;
  }
  #panelMissionBody.active{
    display:block;
  }
  .mission-dashboard{
    display:grid;
    gap:10px;
    min-height:100%;
    align-content:start;
  }
  .mission-signal-visual{
    position:relative;
    overflow:hidden;
    min-height:82px;
    border:1px solid rgba(159,217,255,.13);
    border-radius:16px;
    padding:12px 14px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    background:
      radial-gradient(circle at 18% 50%, rgba(159,217,255,.12), transparent 0 32%),
      linear-gradient(90deg, rgba(159,217,255,.07), rgba(255,255,255,.02));
  }
  .mission-signal-visual::before{
    content:"";
    position:absolute;
    inset:0;
    background:
      repeating-linear-gradient(90deg, rgba(159,217,255,.035) 0 1px, transparent 1px 28px),
      repeating-linear-gradient(180deg, rgba(159,217,255,.025) 0 1px, transparent 1px 22px);
    opacity:.7;
  }
  .mission-signal-visual::after{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:-22%;
    width:34%;
    background:linear-gradient(90deg, transparent, rgba(159,217,255,.15), transparent);
    animation:missionTrace 4.6s linear infinite;
  }
  .mission-scan-copy,
  .mission-packet-row{
    position:relative;
    z-index:1;
  }
  .mission-scan-copy strong{
    display:block;
    color:var(--accent-2);
    font-size:1rem;
  }
  .mission-scan-copy span{
    display:block;
    margin-top:4px;
    color:var(--muted);
    font:10px/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    letter-spacing:.12em;
    text-transform:uppercase;
  }
  .mission-lattice{
    position:absolute;
    inset:10px 16px;
    pointer-events:none;
  }
  .mission-link{
    position:absolute;
    left:18%;
    right:24%;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(159,217,255,.32), transparent);
    transform-origin:left center;
  }
  .mission-link.a{top:24%;transform:rotate(5deg)}
  .mission-link.b{top:54%;transform:rotate(-4deg)}
  .mission-link.c{top:74%;left:36%;right:12%;transform:rotate(9deg)}
  .mission-dot{
    position:absolute;
    width:9px;
    height:9px;
    border-radius:50%;
    background:rgba(159,217,255,.62);
    box-shadow:0 0 18px rgba(159,217,255,.42);
    animation:packetBlink 2.4s ease-in-out infinite;
  }
  .mission-dot.a{left:16%;top:22%}
  .mission-dot.b{left:46%;top:51%;animation-delay:.42s}
  .mission-dot.c{left:72%;top:30%;animation-delay:.78s}
  .mission-dot.d{left:84%;top:70%;animation-delay:1.1s}
  .mission-packet-row{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:7px;
  }
  .mission-packet-row span{
    border:1px solid rgba(159,217,255,.14);
    border-radius:999px;
    padding:6px 8px;
    background:rgba(2,11,18,.36);
    color:rgba(215,240,255,.82);
    font:10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    letter-spacing:.1em;
    text-transform:uppercase;
  }
  .mission-signal-visual[data-state="live"],
  .mission-signal-visual[data-state="record"],
  .mission-signal-visual[data-state="override"]{
    border-color:rgba(159,217,255,.28);
    box-shadow:inset 0 0 28px rgba(159,217,255,.04);
  }
  .mission-signal-visual[data-state="override"] .mission-dot,
  .mission-signal-visual[data-state="record"] .mission-dot{
    background:rgba(157,227,182,.72);
    box-shadow:0 0 20px rgba(157,227,182,.42);
  }
  .mission-dashboard .command-deck{
    margin:0;
    gap:10px;
    grid-template-columns:minmax(0,1.05fr) minmax(260px,.95fr);
  }
  .mission-dashboard .command-hud,
  .mission-dashboard .command-wave,
  .mission-dashboard .ops-card,
  .mission-dashboard .parser-rail{
    padding:8px 10px;
    border-radius:14px;
  }
  .mission-dashboard .command-hud p,
  .mission-dashboard .command-wave p,
  .mission-dashboard .ops-copy,
  .mission-dashboard .parser-rail p{
    margin-top:6px;
    font-size:11px;
    line-height:1.35;
  }
  .mission-dashboard .command-hud p,
  .mission-dashboard .command-wave p,
  .mission-dashboard .parser-rail p{
    display:none;
  }
  .mission-dashboard .command-exits{
    margin-top:8px;
    gap:6px;
  }
  .mission-dashboard .exit-pill{
    min-height:24px;
    padding:4px 8px;
    font-size:10px;
  }
  .mission-dashboard .wave-scope{
    height:26px;
    padding:5px 7px;
    gap:3px;
  }
  .mission-dashboard .triage-badges{
    gap:6px;
  }
  .mission-dashboard .triage-badge{
    min-height:24px;
    padding:4px 8px;
    font-size:10px;
  }
  .mission-action-slot{
    min-width:0;
  }
  .mission-dashboard .ops-card-wide{
    grid-template-columns:minmax(120px,.85fr) minmax(130px,.9fr) minmax(240px,1.25fr);
    gap:10px;
  }
  .mission-dashboard .ops-slice{
    padding:8px 10px;
    min-width:0;
  }
  .mission-dashboard .ops-title,
  .mission-dashboard .command-hud strong,
  .mission-dashboard .command-wave strong{
    margin-top:4px;
    font-size:.92rem;
  }
  .mission-dashboard .ops-copy{
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .mission-dashboard .ops-buttons,
  .mission-dashboard .ops-chips,
  .mission-dashboard .record-packet{
    margin-top:7px;
    gap:6px;
  }
  .mission-dashboard .record-packet{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .mission-dashboard .ops-btn,
  .mission-dashboard .chip,
  .mission-dashboard .sound-toggle{
    padding:6px 10px;
    font-size:11px;
  }
  .mission-dashboard .packet-row{
    grid-template-columns:minmax(0,1fr) auto;
    padding:7px 8px;
    gap:8px;
  }
  .mission-dashboard .packet-row span{
    display:none;
  }
  .mission-dashboard .packet-row strong,
  .mission-dashboard .packet-count{
    font-size:10px;
  }
  .mission-lower{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(290px,.42fr);
    grid-template-areas:
      "actions case"
      "actions parser";
    gap:10px;
    align-items:stretch;
  }
  .mission-action-slot{grid-area:actions}
  .mission-case-slot{grid-area:case}
  .mission-lower > .parser-rail{grid-area:parser}
  .mission-case-slot{
    min-width:0;
  }
  .mission-dashboard #cluesCard{
    min-width:0;
  }
  .mission-dashboard .case-list{
    margin-top:8px;
    grid-template-columns:1fr;
    gap:6px;
  }
  .mission-dashboard .case-group{
    gap:5px;
  }
  .mission-dashboard .case-item{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:6px;
    padding:5px 6px;
    font-size:11px;
  }
  .mission-dashboard .case-item strong{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .mission-dashboard .case-item small{
    display:none;
  }
  .mission-dashboard .case-status{
    flex:0 0 auto;
    font-size:9px;
  }
  .mission-dashboard .parser-rail{
    grid-template-columns:1fr;
    gap:6px;
  }
  .mission-dashboard .parser-rail strong{
    margin-top:3px;
    font-size:.82rem;
  }
  .mission-dashboard .parser-shortcuts{
    justify-content:flex-start;
    gap:5px;
  }
  .mission-dashboard .parser-btn{
    min-height:28px;
    padding:5px 8px;
    font-size:10px;
  }
  #panelTranscriptBody{
    overflow:hidden;
    min-height:0;
    min-width:0;
  }
  .signal-board{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
  }
  .signal-board-head{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:minmax(0,1.1fr) auto;
    gap:14px;
    align-items:end;
    padding:14px 16px;
    border-radius:18px;
    border:1px solid var(--line);
    background:
      linear-gradient(135deg, rgba(159,217,255,.07), transparent 38%),
      linear-gradient(180deg,var(--panel-2),var(--panel));
    box-shadow:var(--glow);
  }
  .signal-board-note{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:38px;
    padding:8px 12px;
    border-radius:999px;
    border:1px solid rgba(159,217,255,.16);
    color:var(--accent-2);
    background:rgba(159,217,255,.05);
    font-size:11px;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .signal-card{
    position:relative;
    overflow:hidden;
    padding:14px 16px;
    background:
      linear-gradient(135deg, rgba(159,217,255,.06), transparent 34%),
      linear-gradient(180deg,var(--panel-2),var(--panel));
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--glow);
  }
  .signal-card::after{
    content:"";
    position:absolute;
    inset:auto -25% -20% auto;
    width:180px;
    height:180px;
    border-radius:50%;
    border:1px solid rgba(159,217,255,.08);
    box-shadow:0 0 0 20px rgba(159,217,255,.03),0 0 0 40px rgba(159,217,255,.02);
  }
  .signal-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    position:relative;
    z-index:1;
  }
  .signal-label{
    color:var(--muted);
    font-size:11px;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .signal-lamp{
    width:10px;
    height:10px;
    border-radius:50%;
    background:var(--muted);
    box-shadow:0 0 0 1px rgba(255,255,255,.06), 0 0 12px transparent;
  }
  .signal-lamp.live{background:var(--success);box-shadow:0 0 0 1px rgba(255,255,255,.06), 0 0 16px rgba(157,227,182,.45);animation:lampPulse 2s ease-in-out infinite}
  .signal-lamp.warn{background:var(--warn);box-shadow:0 0 0 1px rgba(255,255,255,.06), 0 0 16px rgba(241,208,141,.38);animation:lampPulse 1.7s ease-in-out infinite}
  .signal-lamp.cold{background:#4f6474;box-shadow:0 0 0 1px rgba(255,255,255,.04)}
  .signal-value{
    display:block;
    margin-top:8px;
    color:var(--accent-2);
    font-size:1.05rem;
    position:relative;
    z-index:1;
  }
  .signal-copy{
    margin:8px 0 0;
    color:var(--muted);
    font-size:13px;
    line-height:1.45;
    position:relative;
    z-index:1;
  }
  .meter{
    position:relative;
    height:10px;
    margin-top:14px;
    border-radius:999px;
    overflow:hidden;
    border:1px solid rgba(159,217,255,.12);
    background:rgba(255,255,255,.03);
    z-index:1;
  }
  .meter-fill{
    position:absolute;
    inset:0 auto 0 0;
    width:0%;
    border-radius:999px;
    background:linear-gradient(90deg, rgba(159,217,255,.35), rgba(215,240,255,.95));
  }
  .meter-fill.warn{background:linear-gradient(90deg, rgba(241,208,141,.35), rgba(241,208,141,.92))}
  .meter-fill.success{background:linear-gradient(90deg, rgba(157,227,182,.35), rgba(157,227,182,.92))}
  .meter-fill::after{
    content:"";
    position:absolute;
    inset:0;
    width:45%;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
    animation:barTravel 2.8s linear infinite;
    opacity:.55;
  }
  .station-panel{
    padding:14px 16px;
    background:linear-gradient(180deg,var(--panel-2),var(--panel));
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--glow);
  }
  .station-header{
    display:flex;
    justify-content:space-between;
    gap:10px;
    align-items:baseline;
    flex-wrap:wrap;
    margin-bottom:10px;
  }
  .station-title{
    color:var(--accent);
    letter-spacing:.18em;
    text-transform:uppercase;
    font-size:12px;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .station-note{
    color:var(--muted);
    font-size:12px;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .station-grid{
    position:relative;
    min-height:380px;
    border-radius:18px;
    border:1px solid rgba(159,217,255,.1);
    overflow:hidden;
    background:
      radial-gradient(circle at 18% 14%, rgba(159,217,255,.08), transparent 0 26%),
      radial-gradient(circle at 78% 78%, rgba(159,217,255,.05), transparent 0 24%),
      linear-gradient(180deg, rgba(255,255,255,.015), rgba(255,255,255,.01));
  }
  .station-grid::before{
    content:"";
    position:absolute;
    inset:0;
    background:
      repeating-linear-gradient(90deg, rgba(159,217,255,.035) 0 1px, transparent 1px 74px),
      repeating-linear-gradient(180deg, rgba(159,217,255,.03) 0 1px, transparent 1px 68px);
    opacity:.42;
    pointer-events:none;
  }
  .map-link{
    position:absolute;
    height:2px;
    transform-origin:left center;
    background:linear-gradient(90deg, rgba(159,217,255,.55), rgba(159,217,255,.08));
    box-shadow:0 0 10px rgba(159,217,255,.15);
    pointer-events:none;
    z-index:1;
  }
  .map-node{
    position:absolute;
    min-width:108px;
    max-width:124px;
    transform:translate(-50%, -50%);
    padding:8px 10px;
    border-radius:12px;
    border:1px solid rgba(159,217,255,.14);
    background:linear-gradient(180deg, rgba(159,217,255,.08), rgba(255,255,255,.025));
    box-shadow:0 14px 28px rgba(0,0,0,.22), inset 0 0 0 1px rgba(159,217,255,.05);
    text-align:left;
    cursor:pointer;
    z-index:2;
  }
  .map-node:hover{border-color:rgba(159,217,255,.32);transform:translate(-50%, -50%) translateY(-1px)}
  .map-node.current{
    border-color:rgba(159,217,255,.42);
    box-shadow:0 16px 32px rgba(0,0,0,.24), inset 0 0 0 1px rgba(159,217,255,.08), 0 0 22px rgba(159,217,255,.16);
    background:linear-gradient(180deg, rgba(159,217,255,.14), rgba(255,255,255,.03));
  }
  .map-node.current::after{
    content:"";
    position:absolute;
    right:8px;
    top:8px;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--accent);
    box-shadow:0 0 14px rgba(159,217,255,.48);
    animation:lampPulse 2s ease-in-out infinite;
  }
  .map-node-label{
    display:block;
    color:var(--accent-2);
    font-size:.88rem;
    line-height:1.08;
  }
  .map-node.current .map-node-label{color:var(--text)}
  .map-node-meta{
    display:block;
    margin-top:4px;
    color:var(--muted);
    font-size:9px;
    letter-spacing:.06em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .map-legend{
    position:absolute;
    left:auto;
    top:12px;
    right:12px;
    bottom:auto;
    padding:8px 10px;
    border-radius:12px;
    border:1px solid rgba(159,217,255,.1);
    background:rgba(8,17,26,.84);
    color:var(--muted);
    font-size:11px;
    letter-spacing:.08em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    z-index:3;
  }
  .map-legend strong{color:var(--accent-2);font-weight:600}
  .map-legend button{
    margin-top:8px;
    width:100%;
    border:1px solid rgba(159,217,255,.12);
    background:rgba(159,217,255,.05);
    color:var(--text);
    border-radius:999px;
    padding:6px 10px;
    font-size:11px;
    cursor:pointer;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .ops-grid{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);
    gap:12px;
    align-items:start;
  }
  .ops-card,.diagnostic-panel{
    padding:14px 16px;
    background:linear-gradient(180deg,var(--panel-2),var(--panel));
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--glow);
  }
  .ops-card-wide{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
  }
  .ops-slice{
    padding:14px 16px;
    border-radius:16px;
    border:1px solid var(--line-soft);
    background:rgba(255,255,255,.02);
  }
  .ops-label{
    display:block;
    color:var(--muted);
    font-size:11px;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .ops-title{
    display:block;
    margin-top:6px;
    color:var(--accent-2);
    font-size:1rem;
  }
  .ops-copy{
    margin:8px 0 0;
    color:var(--muted);
    font-size:13px;
    line-height:1.45;
  }
  .ops-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
  }
  .ops-chips{margin-top:12px}
  .ops-btn{
    border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
    color:var(--text);
    border-radius:999px;
    padding:8px 12px;
    font-size:12px;
    cursor:pointer;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .ops-btn:hover{border-color:rgba(159,217,255,.36);color:var(--accent-2)}
  .case-list{
    list-style:none;
    margin:12px 0 0;
    padding:0;
    display:grid;
    gap:12px;
  }
  .case-group{
    display:grid;
    gap:8px;
  }
  .case-group-label{
    color:var(--muted);
    font-size:11px;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .case-item{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:start;
    gap:10px;
    padding:9px 10px;
    border-radius:12px;
    border:1px solid var(--line-soft);
    background:rgba(255,255,255,.02);
    font-size:13px;
  }
  .case-item strong{font-weight:600}
  .case-item small{
    display:block;
    margin-top:4px;
    color:var(--muted);
    font-size:11px;
    line-height:1.45;
  }
  .case-status{
    color:var(--muted);
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    white-space:nowrap;
  }
  .case-item.done .case-status{color:var(--success)}
  .record-packet{
    display:grid;
    gap:8px;
    margin-top:12px;
  }
  .packet-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
    align-items:center;
    padding:9px 10px;
    border-radius:12px;
    border:1px solid var(--line-soft);
    background:linear-gradient(180deg, rgba(159,217,255,.04), rgba(255,255,255,.015));
  }
  .packet-row.done{
    border-color:rgba(157,227,182,.24);
    background:linear-gradient(180deg, rgba(157,227,182,.07), rgba(255,255,255,.015));
  }
  .packet-row strong{
    display:block;
    color:var(--accent-2);
    font-size:12px;
  }
  .packet-row span{
    color:var(--muted);
    font-size:11px;
    line-height:1.35;
  }
  .packet-count{
    color:var(--text);
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size:12px;
    letter-spacing:.08em;
    white-space:nowrap;
  }
  .diagnostic-panel{display:none}
  .diagnostic-panel.open{display:block}
  .diagnostic-list{
    list-style:none;
    margin:12px 0 0;
    padding:0;
    display:grid;
    gap:8px;
  }
  .diagnostic-item{
    padding:9px 10px;
    border-radius:12px;
    border:1px solid var(--line-soft);
    background:rgba(255,255,255,.02);
    font-size:13px;
    color:var(--text);
  }
  .diagnostic-item.pass{border-color:rgba(157,227,182,.26)}
  .diagnostic-item.fail{border-color:rgba(255,171,171,.28)}
  .diagnostic-summary{
    margin-top:10px;
    color:var(--muted);
    font-size:13px;
    line-height:1.45;
  }
  .local-header-fallback{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:100;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    padding:10px 16px;
    background:rgba(7,16,25,.92);
    backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(159,217,255,.12);
  }
  .local-header-brand{
    color:var(--accent-2);
    text-decoration:none;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-size:12px;
  }
  .local-header-links{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
  }
  .local-header-links a{
    color:var(--muted);
    text-decoration:none;
    font-size:12px;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  .local-header-links a:hover{color:var(--accent)}
  .chips{display:flex;gap:8px;flex-wrap:wrap}
  .chip{
    border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
    color:var(--muted);
    border-radius:999px;
    padding:8px 11px;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size:12px;
    cursor:pointer;
  }
  .chip:hover{color:var(--text);border-color:rgba(159,217,255,.32)}
  .log-shell{
    padding:16px;
    min-height:460px;
    max-height:58vh;
    overflow-y:auto;
    overflow-x:hidden;
    scroll-behavior:smooth;
    position:relative;
    max-width:100%;
    background:
      linear-gradient(180deg, rgba(255,255,255,.02), transparent 18%),
      linear-gradient(180deg,var(--panel-2),var(--panel));
  }
  #panelTranscriptBody .log-shell{
    min-height:100%;
    height:100%;
    max-height:100%;
    min-height:0;
    isolation:isolate;
    scrollbar-gutter:stable;
    scrollbar-width:thin;
    scrollbar-color:rgba(159,217,255,.42) rgba(8,17,25,.7);
    background:
      linear-gradient(180deg, rgba(255,255,255,.02), transparent 18%),
      radial-gradient(circle at 18% 18%, rgba(159,217,255,.08), transparent 0 28%),
      radial-gradient(circle at 82% 72%, rgba(111,136,156,.12), transparent 0 26%),
      linear-gradient(180deg,var(--panel-2),var(--panel));
  }
  #panelTranscriptBody .log-shell::-webkit-scrollbar{
    width:10px;
    height:10px;
  }
  #panelTranscriptBody .log-shell::-webkit-scrollbar-track{
    background:rgba(8,17,25,.68);
    border-radius:999px;
  }
  #panelTranscriptBody .log-shell::-webkit-scrollbar-thumb{
    background:rgba(159,217,255,.34);
    border-radius:999px;
    border:2px solid rgba(8,17,25,.68);
  }
  .log-shell::before{
    content:"RELAY TRANSCRIPT";
    position:relative;
    display:block;
    margin:-4px 0 12px;
    padding:0 0 8px;
    color:rgba(159,217,255,.72);
    font-size:11px;
    letter-spacing:.16em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    background:linear-gradient(180deg, rgba(13,23,33,.98), rgba(13,23,33,.92));
    border-bottom:1px solid var(--line-soft);
    z-index:1;
  }
  #panelTranscriptBody .log-shell::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    z-index:0;
    background:
      radial-gradient(circle at 22% 28%, rgba(159,217,255,.14), transparent 0 16%),
      radial-gradient(circle at 76% 74%, rgba(159,217,255,.1), transparent 0 14%),
      repeating-linear-gradient(180deg, rgba(159,217,255,.028) 0 1px, transparent 1px 18px);
    opacity:.34;
    mix-blend-mode:screen;
    animation:transcriptField 16s linear infinite, transcriptPulse 5.8s ease-in-out infinite;
  }
  #panelTranscriptBody .log-shell > *{
    position:relative;
    z-index:1;
  }
  @keyframes transcriptField{
    0%{transform:translate3d(-2%, -1%, 0) scale(1)}
    50%{transform:translate3d(2%, 1.5%, 0) scale(1.04)}
    100%{transform:translate3d(-2%, -1%, 0) scale(1)}
  }
  @keyframes transcriptPulse{
    0%,100%{opacity:.24}
    50%{opacity:.4}
  }
  .line{margin:0 0 12px;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
  .line{
    position:relative;
    padding:10px 12px 10px 16px;
    border-left:2px solid transparent;
    border-radius:10px;
    background:rgba(255,255,255,.015);
  }
  .room{color:var(--accent)}
  .command{color:#c5ebff}
  .error{color:var(--error)}
  .success{color:var(--success)}
  .system{color:var(--muted)}
  .warn{color:var(--warn)}
  .line.room{border-left-color:rgba(159,217,255,.4);background:linear-gradient(90deg, rgba(159,217,255,.08), rgba(255,255,255,.015))}
  .line.command{border-left-color:rgba(197,235,255,.34);background:rgba(197,235,255,.04)}
  .line.system{border-left-color:rgba(141,161,175,.28)}
  .line.success{border-left-color:rgba(157,227,182,.45);background:rgba(157,227,182,.04)}
  .line.warn{border-left-color:rgba(241,208,141,.45);background:rgba(241,208,141,.04)}
  .line.error{border-left-color:rgba(255,171,171,.45);background:rgba(255,171,171,.04)}
  /* Hook 4 — closed-room map node. Greyed and uninteractive without
     hard-removing it from the schematic, so the player can see what they've
     lost. */
  .map-node.closed{
    opacity:.45;
    filter:grayscale(.6);
    border-color:rgba(255,171,171,.35);
    cursor:not-allowed;
  }
  .map-node.closed:hover{transform:none}
  /* Hook 3 — pulsing tick on the inference card when policyLoad is high.
     The body class .policy-pressure is added by render when load >= 50. */
  body.policy-pressure #coreLamp{
    box-shadow:0 0 0 2px rgba(241,208,141,.18), 0 0 12px 4px rgba(241,208,141,.28);
    animation:policyTick 1.6s ease-in-out infinite;
  }
  @keyframes policyTick{
    0%,100%{box-shadow:0 0 0 2px rgba(241,208,141,.14), 0 0 6px 2px rgba(241,208,141,.18)}
    50%{box-shadow:0 0 0 2px rgba(241,208,141,.34), 0 0 16px 6px rgba(241,208,141,.42)}
  }
  /* Hook 2 — typography effects.
     fx-drift: line slowly fades and translates upward, suggesting machine
       memory letting the message slip into the relay's archive layer.
       Pure CSS so textContent is preserved (the harness still sees the
       string).
     fx-stutter: cadence is varied via JS pace; the CSS adds a subtle
       letter-spacing wobble so the visible rhythm reads as machine
       hesitation. textContent unchanged.
     fx-redact (placeholder): not yet implemented. When wired, it will
       wrap phrases in spans, then swap their textContent for
       [REDACTED — INFERENCE CONFIDENCE LOW] half a second later, with
       hover-to-reveal restoring the original. That change is content-
       affecting and must be combined with prose tagging in prose.machine. */
  .line.fx-drift{animation:fxDrift 32s ease-out forwards;will-change:transform,opacity}
  @keyframes fxDrift{
    0%{transform:translateY(0);opacity:1}
    60%{transform:translateY(-4px);opacity:.85}
    100%{transform:translateY(-12px);opacity:.55}
  }
  .line.fx-stutter{letter-spacing:.02em;animation:fxStutterTick 2.4s ease-in-out 1}
  @keyframes fxStutterTick{
    0%,100%{letter-spacing:.02em}
    35%{letter-spacing:.06em}
    62%{letter-spacing:0}
  }
  .cursor{display:inline-block;width:8px;color:var(--accent);animation:blink 1s step-end infinite}
  @keyframes blink{50%{opacity:0}}
  .input-shell{
    position:relative;
    overflow:visible;
    background:
      linear-gradient(180deg,var(--panel-2),var(--panel));
  }
  .command-tray{
    position:sticky;
    bottom:10px;
    z-index:14;
    display:grid;
    gap:8px;
    margin-top:10px;
    padding-top:12px;
    background:linear-gradient(180deg, rgba(8,17,25,0), rgba(8,17,25,.88) 28%, rgba(8,17,25,.94));
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
  }
  .input-shell::before{
    display:none;
  }
  .console-carousel{position:relative;z-index:1}
  .command-deck{
    display:grid;
    grid-template-columns:minmax(0,1.14fr) minmax(260px,.86fr);
    gap:14px;
    margin-bottom:12px;
  }
  .command-hud,.command-wave{
    padding:12px 13px;
    border-radius:16px;
    border:1px solid rgba(159,217,255,.12);
    background:rgba(255,255,255,.025);
    box-shadow:inset 0 0 0 1px rgba(159,217,255,.04);
  }
  .command-hud strong,.command-wave strong{
    display:block;
    margin-top:6px;
    color:var(--accent-2);
    font-size:1rem;
  }
  .command-hud p,.command-wave p{
    margin:8px 0 0;
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
  }
  .command-exits{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
  }
  .exit-pill{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 10px;
    border-radius:999px;
    border:1px solid rgba(159,217,255,.12);
    background:rgba(159,217,255,.05);
    color:var(--muted);
    font-size:11px;
    letter-spacing:.08em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    appearance:none;
    cursor:pointer;
    transition:border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
  }
  .exit-pill:hover,
  .exit-pill:focus-visible{
    color:var(--accent-2);
    border-color:rgba(159,217,255,.36);
    background:rgba(159,217,255,.12);
    transform:translateY(-1px);
    outline:none;
  }
  .command-wave{
    display:grid;
    gap:10px;
    align-content:start;
  }
  .wave-scope{
    display:grid;
    grid-template-columns:repeat(24, 1fr);
    align-items:end;
    gap:4px;
    height:58px;
    padding:10px 12px;
    border-radius:14px;
    border:1px solid rgba(159,217,255,.1);
    background:
      linear-gradient(180deg, rgba(159,217,255,.025), rgba(255,255,255,.01)),
      repeating-linear-gradient(90deg, rgba(159,217,255,.03) 0 1px, transparent 1px 26px),
      repeating-linear-gradient(180deg, rgba(159,217,255,.025) 0 1px, transparent 1px 18px);
  }
  .wave-bar{
    display:block;
    width:100%;
    border-radius:999px 999px 3px 3px;
    background:linear-gradient(180deg, rgba(159,217,255,.92), rgba(159,217,255,.18));
    animation:waveShift 1.8s ease-in-out infinite;
    transform-origin:center bottom;
  }
  .command-wave.cold .wave-bar{background:linear-gradient(180deg, rgba(111,136,156,.78), rgba(111,136,156,.18))}
  .command-wave.warn .wave-bar{background:linear-gradient(180deg, rgba(241,208,141,.9), rgba(241,208,141,.18))}
  .command-wave.live .wave-bar{background:linear-gradient(180deg, rgba(157,227,182,.95), rgba(157,227,182,.2))}
  .wave-bar:nth-child(1){height:18%;animation-delay:-.1s}
  .wave-bar:nth-child(2){height:44%;animation-delay:-.25s}
  .wave-bar:nth-child(3){height:26%;animation-delay:-.45s}
  .wave-bar:nth-child(4){height:56%;animation-delay:-.2s}
  .wave-bar:nth-child(5){height:34%;animation-delay:-.6s}
  .wave-bar:nth-child(6){height:68%;animation-delay:-.35s}
  .wave-bar:nth-child(7){height:24%;animation-delay:-.55s}
  .wave-bar:nth-child(8){height:78%;animation-delay:-.15s}
  .wave-bar:nth-child(9){height:40%;animation-delay:-.4s}
  .wave-bar:nth-child(10){height:60%;animation-delay:-.7s}
  .wave-bar:nth-child(11){height:30%;animation-delay:-.22s}
  .wave-bar:nth-child(12){height:72%;animation-delay:-.52s}
  .wave-bar:nth-child(13){height:36%;animation-delay:-.17s}
  .wave-bar:nth-child(14){height:64%;animation-delay:-.43s}
  .wave-bar:nth-child(15){height:28%;animation-delay:-.62s}
  .wave-bar:nth-child(16){height:82%;animation-delay:-.12s}
  .wave-bar:nth-child(17){height:42%;animation-delay:-.5s}
  .wave-bar:nth-child(18){height:58%;animation-delay:-.27s}
  .wave-bar:nth-child(19){height:22%;animation-delay:-.65s}
  .wave-bar:nth-child(20){height:74%;animation-delay:-.33s}
  .wave-bar:nth-child(21){height:32%;animation-delay:-.57s}
  .wave-bar:nth-child(22){height:54%;animation-delay:-.18s}
  .wave-bar:nth-child(23){height:26%;animation-delay:-.48s}
  .wave-bar:nth-child(24){height:66%;animation-delay:-.29s}
  .triage-badges{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }
  .triage-badge{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:6px 10px;
    border-radius:999px;
    border:1px solid rgba(159,217,255,.12);
    background:rgba(159,217,255,.05);
    color:var(--muted);
    font-size:11px;
    letter-spacing:.08em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  }
  @keyframes waveShift{
    0%,100%{transform:scaleY(.72);opacity:.8}
    50%{transform:scaleY(1.18);opacity:1}
  }
  form{
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:10px;
    align-items:center;
    border:1px solid var(--line);
    background:
      linear-gradient(135deg, rgba(159,217,255,.07), transparent 28%),
      #081119;
    border-radius:14px;
    padding:12px 14px;
    position:relative;
    overflow:hidden;
  }
  form:focus-within{
    border-color:rgba(159,217,255,.34);
    box-shadow:0 0 0 1px rgba(159,217,255,.12), 0 0 36px rgba(159,217,255,.1);
  }
  form::before{
    display:none;
  }
  .prompt{color:var(--accent);font-weight:700;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
  .prompt-cluster{
    display:flex;
    align-items:center;
    gap:10px;
  }
  .prompt-lamp{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#4f6474;
    box-shadow:0 0 0 1px rgba(255,255,255,.05);
  }
  .prompt-lamp.live{background:var(--success);box-shadow:0 0 16px rgba(157,227,182,.5);animation:lampPulse 2s ease-in-out infinite}
  .prompt-lamp.warn{background:var(--warn);box-shadow:0 0 16px rgba(241,208,141,.42);animation:lampPulse 1.6s ease-in-out infinite}
  .prompt-lamp.cold{background:#4f6474}
  input{
    border:0;
    outline:none;
    background:transparent;
    color:var(--text);
    font:15px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    width:100%;
    position:relative;
    z-index:1;
  }
  input::placeholder{
    color:rgba(141,161,175,.8);
  }
  .tray-switch{
    display:flex;
    align-items:center;
    gap:7px;
    justify-content:flex-end;
    user-select:none;
  }
  .tray-btn{
    border:1px solid rgba(159,217,255,.14);
    background:linear-gradient(180deg, rgba(159,217,255,.08), rgba(255,255,255,.02));
    color:var(--muted);
    border-radius:999px;
    padding:7px 10px;
    min-height:34px;
    font-size:11px;
    letter-spacing:.08em;
    text-transform:uppercase;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    cursor:pointer;
    appearance:none;
    transition:border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
  }
  .tray-btn:hover,
  .tray-btn:focus-visible{
    color:var(--accent-2);
    border-color:rgba(159,217,255,.34);
    background:rgba(159,217,255,.14);
    transform:translateY(-1px);
    outline:none;
  }
  .tray-btn.active{
    color:var(--accent-2);
    border-color:rgba(159,217,255,.34);
    background:linear-gradient(180deg, rgba(159,217,255,.14), rgba(255,255,255,.03));
    box-shadow:0 0 0 1px rgba(159,217,255,.06) inset;
  }
  .parser-rail{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:12px;
    margin-top:10px;
    padding:12px 13px;
    border-radius:14px;
    border:1px solid rgba(159,217,255,.12);
    background:linear-gradient(180deg, rgba(159,217,255,.05), rgba(255,255,255,.02));
  }
  .parser-rail strong{
    display:block;
    margin-top:6px;
    color:var(--accent-2);
    font-size:.98rem;
  }
  .parser-rail p{
    margin:8px 0 0;
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
  }
  .parser-shortcuts{
    display:flex;
    flex-wrap:wrap;
    align-content:start;
    justify-content:flex-end;
    gap:8px;
  }
  .parser-btn{
    border:1px solid rgba(159,217,255,.14);
    background:linear-gradient(180deg, rgba(159,217,255,.08), rgba(255,255,255,.02));
    color:var(--text);
    border-radius:999px;
    padding:8px 12px;
    min-height:36px;
    font-size:12px;
    cursor:pointer;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    transition:border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
  }
  .parser-btn:hover,
  .parser-btn:focus-visible{
    color:var(--accent-2);
    border-color:rgba(159,217,255,.34);
    background:rgba(159,217,255,.14);
    transform:translateY(-1px);
    outline:none;
  }
  .parser-btn.route{border-color:rgba(157,227,182,.18);box-shadow:0 0 0 1px rgba(157,227,182,.03) inset}
  .parser-btn.warn{border-color:rgba(241,208,141,.18)}
  .panel-flash{
    animation:panelFlash 1s ease;
  }
  @keyframes panelFlash{
    0%{box-shadow:0 0 0 0 rgba(159,217,255,0), var(--glow)}
    30%{box-shadow:0 0 0 1px rgba(159,217,255,.32), 0 0 34px rgba(159,217,255,.18), var(--glow)}
    100%{box-shadow:var(--glow)}
  }
  .hint{margin-top:8px;color:var(--muted);font-size:12px;line-height:1.55}
  /* Hint-line tooltips. Each <code data-tip="..."> renders a hover popup with
     bullet items (newlines escaped as &#10; in the attribute). Pure CSS, no
     JS. The tooltip floats above the code element, max-width contained so it
     doesn't run off the panel. */
  .hint code{cursor:help;position:relative}
  .hint code[data-tip]:hover::after,
  .hint code[data-tip]:focus::after{
    content:attr(data-tip);
    position:absolute;
    bottom:calc(100% + 8px);
    left:0;
    z-index:50;
    white-space:pre-line;
    width:max-content;
    max-width:340px;
    padding:9px 11px;
    background:linear-gradient(180deg,var(--panel-2),var(--panel));
    border:1px solid var(--line);
    border-radius:8px;
    box-shadow:0 14px 28px rgba(0,0,0,.45), 0 0 0 1px rgba(159,217,255,.06);
    font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
    font-size:12px;
    line-height:1.55;
    color:var(--text);
    pointer-events:none;
    opacity:.98;
  }
  .hint code[data-tip]:hover::before,
  .hint code[data-tip]:focus::before{
    content:"";
    position:absolute;
    bottom:calc(100% + 2px);
    left:14px;
    z-index:51;
    width:8px;
    height:8px;
    background:var(--panel-2);
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
    transform:rotate(45deg);
    pointer-events:none;
  }
  code{color:var(--accent)}
  .sound-toggle{
    border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
    color:var(--muted);
    border-radius:999px;
    padding:8px 11px;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size:12px;
    cursor:pointer;
  }
  .sound-toggle:hover{color:var(--text);border-color:rgba(159,217,255,.32)}
  .sound-toggle.active{color:var(--accent);border-color:var(--accent)}
  /* Clickable keywords */
  .kw{color:var(--accent);cursor:pointer;text-decoration:underline;text-decoration-color:rgba(155,213,255,.25);text-underline-offset:2px}
  .kw:hover{text-decoration-color:var(--accent)}
  /* Theme: Light */
  .theme-light{--bg:#e8e4df;--panel:#f5f2ed;--panel-2:#faf8f5;--line:#c5bfb7;--text:#2a2520;--muted:#6b6560;--accent:#1a6fa0;--success:#2d7a48;--error:#a03030;--warn:#8a6d20}
  .theme-light{background:linear-gradient(180deg,#f0ece6 0%,#e8e4df 65%,#ddd8d2 100%) !important;color:var(--text)}
  .theme-light form{background:#f0ece6}
  .theme-light .kw{text-decoration-color:rgba(26,111,160,.3)}
  /* Theme: Amber */
  .theme-amber{--bg:#1a1200;--panel:#231a06;--panel-2:#2a2008;--line:#4a3a15;--text:#f0d890;--muted:#a08850;--accent:#ffc040;--success:#c0e060;--error:#ff7040;--warn:#ffa030}
  .theme-amber{background:linear-gradient(180deg,#1e1500 0%,#1a1200 65%,#120c00 100%) !important;color:var(--text)}
  .theme-amber form{background:#1e1500}
  .theme-amber .cursor{color:var(--accent)}
  .theme-amber .command{color:#ffe080}
  /* Font size modifiers */
  .font-sm{font-size:13px}.font-md{font-size:15px}.font-lg{font-size:18px}.font-xl{font-size:21px}
  /* Settings panel */
  .settings-panel{display:none;padding:14px 16px;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:18px;box-shadow:var(--glow)}
  .settings-panel.open{display:block}
  .settings-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
  .settings-label{color:var(--muted);font-size:12px;min-width:80px;text-transform:uppercase;letter-spacing:.1em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
  .settings-btn{border:1px solid var(--line);background:rgba(255,255,255,.02);color:var(--muted);border-radius:999px;padding:6px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;cursor:pointer}
  .settings-btn:hover{color:var(--text);border-color:rgba(159,217,255,.32)}
  .settings-btn.sel{color:var(--accent);border-color:var(--accent)}
  .settings-btn.danger{color:var(--error);border-color:rgba(255,171,171,.24)}
  .settings-btn.danger:hover{border-color:rgba(255,171,171,.42);background:rgba(255,171,171,.06)}
  @media (max-width:820px){
    .hero-grid{grid-template-columns:1fr}
    .hero-console-strip{grid-template-columns:1fr}
    .hero-start-panel{grid-template-columns:1fr}
    .hero-command-rail{justify-content:flex-start}
    .hero-status-strip{grid-template-columns:repeat(4,minmax(0,1fr))}
    .hero-visual{min-height:170px}
    .dish-stage{min-height:120px}
    .stats{grid-template-columns:1fr 1fr}
    .briefing{grid-template-columns:1fr}
    .signal-board{grid-template-columns:1fr}
    .ops-grid{grid-template-columns:1fr}
    .ops-card-wide{grid-template-columns:1fr}
    .command-deck{grid-template-columns:1fr}
    .parser-rail{grid-template-columns:1fr}
    .mission-lower{
      grid-template-columns:1fr;
      grid-template-areas:
        "actions"
        "case"
        "parser";
    }
    .mission-dashboard .ops-card-wide,
    .mission-dashboard .record-packet{
      grid-template-columns:1fr;
    }
    .mission-signal-visual{
      grid-template-columns:1fr;
    }
    .mission-packet-row{
      justify-content:flex-start;
    }
    .parser-shortcuts{justify-content:flex-start}
    .chips{overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}
    .chip{white-space:nowrap}
  }
  @media (max-width:560px){
    .app{padding:6px;gap:8px}
    .console-carousel{--dashboard-height:clamp(360px, 52vh, 520px)}
    .hero-status-strip{grid-template-columns:1fr 1fr}
    .visual-readout{grid-template-columns:1fr}
    .stats{grid-template-columns:1fr 1fr}
    .log-shell{min-height:42vh;max-height:50vh;padding:12px}
    .brand-row{gap:10px}
    .signal-logo{width:118px;height:70px;border-radius:18px}
    .hero h1{font-size:2rem}
    .hero p,.hint{font-size:13px}
    .chip,.sound-toggle{padding:10px 13px;font-size:13px;min-height:44px}
    form{padding:10px 12px}
    .tray-switch{
      grid-column:1 / -1;
      justify-content:flex-end;
      flex-wrap:wrap;
    }
    input{font-size:16px} /* prevents iOS zoom on focus */
    .input-shell{position:relative}
  }
  @media (max-width:380px){
    .stats{grid-template-columns:1fr}
    .hero{padding:12px}
    h1{font-size:1.7rem}
  }
  /* Ensure input doesn't get hidden behind mobile keyboard */
  @supports (height: 100dvh) {
    .log-shell{max-height:50dvh}
  }
#header-common{position:fixed;top:0;left:0;right:0;z-index:100}
body{padding-top:52px}
@media(max-width:640px){body{padding-top:48px}}
/* ==========================================================================
   Signal rain — ambient single-glyph drift behind the transcript.
   Sibling of #log (NOT inside it) so the jsdom harness reading
   #log children stays clean. Subtle, slow, low-opacity.
   ========================================================================== */
#panelTranscriptBody{position:relative}
.signal-rain{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
  z-index:3;
  opacity:.38;
  mix-blend-mode:screen;
  -webkit-mask-image:linear-gradient(180deg, transparent 0, rgba(0,0,0,.85) 14%, rgba(0,0,0,.85) 86%, transparent 100%);
          mask-image:linear-gradient(180deg, transparent 0, rgba(0,0,0,.85) 14%, rgba(0,0,0,.85) 86%, transparent 100%);
}
.signal-rain__g{
  position:absolute;
  top:0;
  display:block;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:11px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(159,217,255,.42);
  text-shadow:0 0 6px rgba(111,180,220,.18);
  white-space:nowrap;
  will-change:transform,opacity;
  animation:signalRainDrift linear infinite;
}
.signal-rain__g.head{
  color:rgba(220,240,255,.78);
  text-shadow:0 0 8px rgba(159,217,255,.55);
}
.signal-rain__g.warn{
  color:rgba(255,205,160,.42);
  text-shadow:0 0 6px rgba(255,180,120,.18);
}
@keyframes signalRainDrift{
  0%{transform:translate3d(0,-30px,0);opacity:0}
  10%{opacity:1}
  90%{opacity:1}
  100%{transform:translate3d(0, calc(100% + 30px), 0);opacity:0}
}
@media (prefers-reduced-motion: reduce){
  .signal-rain{display:none !important}
}
@media (max-width:560px){
  .signal-rain{opacity:.18}
  .signal-rain__g{font-size:10px}
}

/* ==========================================================================
   Attribution footer — visible copyright + canonical URL.
   Sets the legal baseline for Cold Signal. Subtle, sits below the input.
   ========================================================================== */
.cs-attribution{
  margin:18px auto 12px;
  padding:10px 14px;
  max-width:960px;
  text-align:center;
  color:rgba(159,217,255,.42);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:11px;
  letter-spacing:.06em;
  border-top:1px solid rgba(159,217,255,.08);
}
.cs-attribution p{margin:0}
.cs-attribution a{
  color:rgba(159,217,255,.62);
  text-decoration:none;
  border-bottom:1px dotted rgba(159,217,255,.24);
}
.cs-attribution a:hover,
.cs-attribution a:focus-visible{color:rgba(220,240,255,.9);border-bottom-color:rgba(159,217,255,.6)}
.cs-attribution .cs-mark{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ==========================================================================
   Send-command button — click-to-submit for mouse-only play. Sits at the
   start of the tray switch, before MAP. type=submit so it submits the
   form via the existing #commandForm submit handler.
   ========================================================================== */
.cs-enter{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 12px;
  border:1px solid rgba(159,217,255,.34);
  background:linear-gradient(180deg, rgba(159,217,255,.16), rgba(159,217,255,.08));
  color:rgba(220,240,255,.88);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
  transition:border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
}
.cs-enter:hover,
.cs-enter:focus-visible{
  border-color:rgba(220,240,255,.78);
  color:rgba(255,255,255,.96);
  background:linear-gradient(180deg, rgba(159,217,255,.28), rgba(159,217,255,.14));
  transform:translateY(-1px);
  outline:none;
}
.cs-enter:active{transform:translateY(0)}
.cs-enter-glyph{
  font-size:14px;
  line-height:1;
  color:rgba(220,240,255,.95);
  text-shadow:0 0 6px rgba(159,217,255,.5);
}
@media (max-width:560px){
  .cs-enter-label{display:none}
  .cs-enter{padding:8px 10px}
  .cs-enter-glyph{font-size:16px}
}
