:root{--screen:#8fffb0;--amber:#ffb000;--enj:#ff2e88;--ash:#c9c9b8;--cyan:#39ffd0;--void:#06070a}
  *{box-sizing:border-box;margin:0;padding:0;user-select:none}
  html,body{height:100%;background:#000;overflow:hidden;font-family:'VT323',monospace;color:var(--screen)}
  #app{position:fixed;inset:0}canvas{display:block;cursor:grab}canvas:active{cursor:grabbing}
  #flash{position:fixed;inset:0;z-index:5;pointer-events:none;opacity:0;mix-blend-mode:screen}
  #madness{position:fixed;inset:0;z-index:5;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 50%,rgba(255,46,136,0) 38%,rgba(255,46,136,.35) 100%)}
  #grain{position:fixed;inset:0;z-index:6;pointer-events:none;mix-blend-mode:overlay;opacity:.1;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}
  @keyframes fl{0%,96%{opacity:1}97%{opacity:.9}98%{opacity:1}99%{opacity:.85}100%{opacity:1}}
  body.motion #grain{animation:fl 7s infinite}

  #alert{position:fixed;z-index:8;left:50%;top:16%;transform:translate(-50%,0);text-align:center;font-family:'Anton',sans-serif;
    font-size:clamp(22px,4vw,46px);letter-spacing:3px;color:var(--enj);text-shadow:0 0 18px var(--enj),0 0 4px #000;opacity:0;pointer-events:none;transition:opacity .15s}
  #alert.show{opacity:1}
  #hint{position:fixed;z-index:8;left:50%;top:46%;transform:translate(-50%,-50%);font-size:clamp(15px,2vw,20px);letter-spacing:2px;color:var(--ash);text-align:center;text-shadow:0 0 8px #000;pointer-events:none;transition:opacity .5s;line-height:1.5}
  #hint .k{color:var(--screen)}
  #tag{position:fixed;z-index:8;left:16px;top:13px;font-size:14px;letter-spacing:2px;color:var(--ash);text-shadow:0 0 6px #000;line-height:1.3}#tag b{color:var(--enj);text-shadow:0 0 8px var(--enj)}

  /* controles demo (arriba derecha) */
  /* STREAM LIMPIO: panel de controles OCULTO (cámara de seguridad real, sin botones a la vista). La operación va por consola con __REFUGIO.*; los listeners siguen vivos (display:none no los borra). Para mostrarlo en debug: poné display:flex. */
  #panel{display:none!important;position:fixed;z-index:9;right:12px;top:12px;flex-direction:column;align-items:flex-end;gap:7px;background:rgba(6,7,10,.55);padding:9px 11px;border:1px solid rgba(201,201,184,.2)}
  .ctl{display:flex;align-items:center;gap:7px;font-size:14px;letter-spacing:1px;color:var(--ash)}
  input[type=range]{-webkit-appearance:none;appearance:none;width:150px;height:6px;background:rgba(143,255,176,.18);outline:none;border:1px solid rgba(143,255,176,.35)}
  input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:18px;background:var(--screen);box-shadow:0 0 10px var(--screen);cursor:pointer}
  input[type=range]::-moz-range-thumb{width:13px;height:18px;border:0;background:var(--screen);box-shadow:0 0 10px var(--screen)}
  .btn{font-family:'VT323',monospace;font-size:15px;letter-spacing:1px;background:transparent;color:var(--ash);border:1px solid rgba(201,201,184,.4);padding:2px 9px;cursor:pointer;transition:.12s}
  .btn:hover{color:var(--screen);border-color:var(--screen);box-shadow:0 0 10px rgba(143,255,176,.3)}
  .btn.on{color:#000;background:var(--screen);border-color:var(--screen)}
  .seg{display:flex;border:1px solid rgba(201,201,184,.4)}.seg .btn{border:0;border-left:1px solid rgba(201,201,184,.25)}.seg .btn:first-child{border-left:0}
  #craftui{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:31;width:330px;max-width:92vw;border:1px solid rgba(255,200,120,.4);background:rgba(11,9,7,.97);border-radius:8px;padding:14px 16px;font-family:'VT323',monospace;display:none;box-shadow:0 10px 50px rgba(0,0,0,.7)}
  #craftui .ctitle{font-size:16px;letter-spacing:1px;color:#ffcf90;margin-bottom:6px}
  #craftui #cclose{float:right;cursor:pointer;color:#9aa3b0;font-size:18px;line-height:1}#craftui #cclose:hover{color:#fff}
  #craftui .csec{font-size:11px;letter-spacing:2px;color:#7a8088;margin:9px 0 4px}
  #craftui .crow{display:flex;flex-wrap:wrap;gap:5px}
  #craftui .crow .btn{font-size:13px;padding:4px 8px;color:#e0d6c0;border-color:rgba(255,200,120,.35)}
  #craftui .crow .btn:hover{border-color:#ffcf90;box-shadow:0 0 8px rgba(255,200,120,.3)}
  #craftui .cseq{font-size:13px;color:#cfe0d0;background:rgba(255,255,255,.05);border-radius:4px;padding:7px 9px;margin:9px 0;min-height:16px;line-height:1.4}
  #craftui .cstate{font-size:15px;color:#bfc4cc;margin:6px 0}#craftui .cstate b{color:#ffcf90}
  #craftui{width:360px;max-height:88vh;overflow-y:auto}
  #craftui .cinv{display:flex;flex-wrap:wrap;gap:4px 9px;font-size:13px;color:#cfe0d0}
  #craftui .cinv .ci{opacity:.55}#craftui .cinv .ci.has{opacity:1}#craftui .cinv .ci b{color:#ffcf90}
  #craftui #crecipes{display:flex;flex-direction:column;gap:5px}
  #craftui .rcp{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.04);border:1px solid rgba(255,200,120,.18);border-radius:5px;padding:5px 8px}
  #craftui .rcp .ic{font-size:18px;width:22px;text-align:center}
  #craftui .rcp .info{flex:1;min-width:0}
  #craftui .rcp .nm{font-size:14px;color:#f0e6d0;letter-spacing:.5px}
  #craftui .rcp .nd{font-size:12px;color:#9aa3b0}#craftui .rcp .nd .ok{color:#9fe0b0}#craftui .rcp .nd .no{color:#ff6b8a}
  #craftui .rcp .mk{font-size:12px;padding:3px 9px;color:#e0d6c0;border:1px solid rgba(255,200,120,.4);background:transparent;cursor:pointer;font-family:'VT323',monospace;border-radius:3px}
  #craftui .rcp .mk:hover:not(:disabled){border-color:#ffcf90;box-shadow:0 0 8px rgba(255,200,120,.3);color:#fff}
  #craftui .rcp .mk:disabled{opacity:.3;cursor:default}
  #craftui .ccat{font-size:10px;letter-spacing:2px;color:#8a7a5a;margin:6px 0 1px}
  #robotui{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:30;width:280px;border:1px solid rgba(143,255,176,.45);background:rgba(8,12,16,.96);border-radius:8px;padding:13px 15px;font-family:'VT323',monospace;display:none;box-shadow:0 10px 50px rgba(0,0,0,.65)}
  #robotui #rclose{float:right;cursor:pointer;color:#9aa3b0;font-size:18px;line-height:1}#robotui #rclose:hover{color:#fff}
  #inv .slot svg{width:26px;height:26px}#res .r svg{width:17px;height:17px;vertical-align:-3px}.slot.tablet{border-color:rgba(143,255,176,.5)}
  #robotui .rtitle{font-size:15px;letter-spacing:1px;color:#8fffb0;margin-bottom:5px}
  #robotui .rbar{font-size:12px;color:#9aa3b0;margin-bottom:5px}
  #robotui .rbar span{display:block;margin-bottom:2px}
  #robotui .rt{height:6px;background:rgba(255,255,255,.09);border-radius:3px;overflow:hidden}
  #robotui .rf{height:100%;border-radius:3px;transition:width .3s}
  #robotui .rstatus{font-size:13px;color:#cfe0d0;margin:5px 0;letter-spacing:1px;text-align:center}
  #robotui .rbtns{display:flex;flex-direction:column;gap:4px}
  #robotui .rbtns .btn{font-size:13px;text-align:center;padding:3px;width:100%}
  #robotui .btn:disabled{opacity:.3}
  .prow{display:flex;gap:6px}

  /* STATS (arriba izquierda, bajo el tag) */
  #stats{position:fixed;right:14px;bottom:14px;z-index:9;display:flex;flex-direction:column;gap:9px;width:196px}
  /* MAPA (abajo izquierda) */
  #map{position:fixed;left:14px;bottom:14px;z-index:9;width:196px;border:1px solid rgba(143,255,176,.22);background:rgba(10,16,20,.6);padding:6px;border-radius:6px}
  #map canvas{display:block}
  #map .blip{position:absolute;width:8px;height:8px;border-radius:50%;background:#8fffb0;box-shadow:0 0 9px #8fffb0;animation:bk .8s steps(2) infinite}
  .sbar .lab{font-size:13px;letter-spacing:.5px;display:flex;justify-content:space-between;color:#9aa3b0;margin-bottom:3px;text-transform:uppercase}
  .sbar .track{height:6px;background:rgba(255,255,255,.09);border-radius:3px;overflow:hidden}
  .sbar .fill{height:100%;width:100%;transition:width .3s;border-radius:3px}
  .sbar.low .lab{color:#fff;animation:bk .6s steps(2) infinite}
  @keyframes bk{50%{opacity:.4}}

  /* INVENTARIO (abajo centro) */
  #inv{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:9;display:flex;gap:6px}
  .slot{width:46px;height:46px;border:1px solid rgba(201,201,184,.4);background:rgba(6,7,10,.6);display:flex;align-items:center;justify-content:center;font-size:23px;position:relative;cursor:pointer;transition:.1s}
  .slot:hover{border-color:var(--screen);box-shadow:0 0 10px rgba(143,255,176,.3)}
  .slot .cnt{position:absolute;right:3px;bottom:0;font-size:13px;color:var(--screen);text-shadow:0 0 4px #000}
  .slot.empty{opacity:.3;cursor:default}.slot.empty:hover{border-color:rgba(201,201,184,.4);box-shadow:none}

  /* #boot (pantalla de carga): su CSS vive INLINE en el <head> de index.html para pintar en el primer instante. Acá sólo queda .blink por si lo usa otro overlay. */
  .blink{animation:bk2 1s steps(2) infinite}@keyframes bk2{50%{opacity:0}}
  /* ===== MENÚ DE INICIO (estética CCTV: selección de modo sobre el feed en vivo) ===== */
  #startmenu{position:fixed;inset:0;z-index:26;display:none;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,rgba(4,8,6,.62),rgba(2,3,4,.9) 78%);font-family:'VT323',monospace;-webkit-tap-highlight-color:transparent}
  #startmenu.show{display:flex;animation:smIn .35s ease}
  @keyframes smIn{from{opacity:0}to{opacity:1}}
  #startmenu .sm-scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,0) 0,rgba(0,0,0,0) 2px,rgba(0,0,0,.28) 3px,rgba(0,0,0,0) 4px);mix-blend-mode:multiply;opacity:.7}
  #startmenu .sm-frame{position:relative;width:min(560px,90vw);padding:26px 30px 22px;background:linear-gradient(180deg,rgba(7,16,11,.82),rgba(3,8,6,.88));border:1px solid rgba(143,255,176,.34);box-shadow:0 0 40px rgba(0,0,0,.7),inset 0 0 60px rgba(57,255,160,.05);text-align:center}
  #startmenu .sm-head{display:flex;align-items:center;gap:10px;font-size:14px;letter-spacing:2px;color:var(--ash);margin-bottom:18px}
  #startmenu .sm-rec{color:var(--enj);text-shadow:0 0 8px var(--enj)}
  #startmenu .sm-ch{color:var(--screen)}
  #startmenu .sm-bars{margin-left:auto;display:inline-flex;align-items:flex-end;gap:2px;height:12px}
  #startmenu .sm-bars i{width:3px;background:var(--screen);box-shadow:0 0 5px var(--screen);animation:rtSig 1.1s steps(1,end) infinite}
  #startmenu .sm-bars i:nth-child(1){height:4px}#startmenu .sm-bars i:nth-child(2){height:7px;animation-delay:.12s}#startmenu .sm-bars i:nth-child(3){height:10px;animation-delay:.24s}#startmenu .sm-bars i:nth-child(4){height:12px;animation-delay:.36s}
  #startmenu .sm-id{color:var(--amber);text-shadow:0 0 8px var(--amber);font-weight:bold}
  #startmenu .sm-title{font-family:'Anton',sans-serif;font-size:clamp(40px,9vw,72px);letter-spacing:6px;color:var(--screen);text-shadow:0 0 26px rgba(143,255,176,.55),0 0 4px #000;line-height:1;position:relative;animation:smGlitch 6s steps(1,end) infinite}
  @keyframes smGlitch{0%,96%,100%{transform:none;opacity:1}97%{transform:translate(-2px,0);opacity:.85}98%{transform:translate(2px,0);color:var(--cyan)}99%{transform:translate(-1px,0)}}
  #startmenu .sm-sub{font-size:18px;letter-spacing:8px;color:var(--ash);margin-top:4px}
  #startmenu .sm-amb{margin-top:16px;font-size:18px;letter-spacing:1px;color:var(--screen)}#startmenu .sm-amb b{color:var(--amber);text-shadow:0 0 8px var(--amber)}
  #startmenu .sm-lore{margin:10px auto 22px;max-width:440px;font-size:17px;line-height:1.3;color:var(--ash);text-shadow:0 0 6px #000}
  #startmenu .sm-btns{display:flex;flex-direction:column;gap:12px}
  #startmenu .sm-btn{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:13px 18px;background:rgba(6,12,9,.6);border:1px solid rgba(143,255,176,.45);color:var(--screen);font-family:'VT323',monospace;font-size:23px;letter-spacing:2px;cursor:pointer;text-align:left;transition:background .12s,box-shadow .12s,border-color .12s}
  #startmenu .sm-btn small{font-size:14px;letter-spacing:1px;color:var(--ash)}
  #startmenu .sm-btn:hover{background:rgba(57,255,160,.14);border-color:var(--screen);box-shadow:0 0 16px rgba(57,255,160,.3)}
  #startmenu .sm-btn-amber{border-color:rgba(255,176,0,.5);color:var(--amber)}
  #startmenu .sm-btn-amber small{color:rgba(255,176,0,.65)}
  #startmenu .sm-btn-amber:hover{background:rgba(255,176,0,.12);border-color:var(--amber);box-shadow:0 0 16px rgba(255,176,0,.3)}
  #startmenu .sm-foot{margin-top:18px;font-size:13px;letter-spacing:2px;color:rgba(201,201,184,.5)}
  @media (max-width:760px){#startmenu .sm-frame{padding:20px 18px}#startmenu .sm-btn{font-size:20px}}
  /* BLUR gaussiano de la escena detrás del MENÚ DE INICIO (sólo mientras el menú está activo). También en los overlays de config/lore para cohesión. */
  #startmenu.show,#configPanel.show,#lorePanel.show{-webkit-backdrop-filter:blur(7px) saturate(.9);backdrop-filter:blur(7px) saturate(.9)}
  /* ===== RUEDITA DE CONFIG (discreta, esquina inferior derecha sobre el LIVE; visible en ambos modos) ===== */
  #gearBtn{position:fixed;right:14px;bottom:46px;z-index:12;width:32px;height:32px;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;color:var(--screen);background:rgba(6,12,9,.5);border:1px solid rgba(143,255,176,.32);box-shadow:0 0 10px rgba(0,0,0,.4);opacity:.55;transition:opacity .15s,box-shadow .15s,border-color .15s}
  #gearBtn:hover{opacity:1;border-color:var(--screen);box-shadow:0 0 14px rgba(57,255,160,.35)}
  #gearBtn svg{display:block;filter:drop-shadow(0 0 4px rgba(57,255,160,.4))}
  @media (max-width:760px){#gearBtn{right:10px;bottom:40px;width:30px;height:30px}}
  /* ===== PANEL DE CONFIG + PANEL DE LORE (overlays CCTV) ===== */
  #configPanel,#lorePanel{position:fixed;inset:0;z-index:24;display:none;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,rgba(4,8,6,.55),rgba(2,3,4,.84) 82%);font-family:'VT323',monospace;cursor:pointer}
  #lorePanel{z-index:25}
  #configPanel.show,#lorePanel.show{display:flex;animation:smIn .25s ease}
  #configPanel .cfg-frame,#lorePanel .lp-frame{position:relative;width:min(480px,90vw);padding:18px 22px 18px;background:linear-gradient(180deg,rgba(7,16,11,.92),rgba(3,8,6,.95));border:1px solid rgba(143,255,176,.36);box-shadow:0 0 40px rgba(0,0,0,.7),inset 0 0 50px rgba(57,255,160,.05);cursor:default}
  #lorePanel .lp-frame{width:min(580px,92vw)}
  #configPanel .cfg-head{display:flex;align-items:center;margin-bottom:16px}
  #configPanel .cfg-title{font-size:19px;letter-spacing:3px;color:var(--screen);text-shadow:0 0 8px rgba(57,255,160,.45)}
  #configPanel .cfg-x{margin-left:auto;width:28px;height:28px;background:transparent;border:1px solid rgba(143,255,176,.3);color:var(--ash);font-family:'VT323',monospace;font-size:18px;cursor:pointer;line-height:1}
  #configPanel .cfg-x:hover{color:var(--screen);border-color:var(--screen)}
  #configPanel .cfg-row{display:flex;flex-wrap:wrap;align-items:center;gap:9px;padding:11px 0;border-top:1px solid rgba(143,255,176,.12)}
  #configPanel .cfg-label{flex:0 0 100%;font-size:14px;letter-spacing:2px;color:var(--ash)}
  #configPanel .cfg-btn,#lorePanel .cfg-btn{padding:9px 14px;background:rgba(6,12,9,.6);border:1px solid rgba(143,255,176,.42);color:var(--screen);font-family:'VT323',monospace;font-size:19px;letter-spacing:1px;cursor:pointer;transition:background .12s,box-shadow .12s,border-color .12s}
  #configPanel .cfg-btn:hover,#lorePanel .cfg-btn:hover{background:rgba(57,255,160,.14);border-color:var(--screen);box-shadow:0 0 14px rgba(57,255,160,.3)}
  #configPanel .cfg-sub{font-size:16px;color:var(--ash);border-color:rgba(201,201,184,.3)}
  #configPanel .cfg-lang{display:flex;align-items:center;gap:8px}
  #configPanel .cfg-lng{width:46px;padding:7px 0;text-align:center;background:rgba(6,12,9,.6);border:1px solid rgba(143,255,176,.32);color:var(--ash);font-family:'VT323',monospace;font-size:18px;letter-spacing:1px;cursor:pointer}
  #configPanel .cfg-lng.on{color:#000;background:var(--screen);border-color:var(--screen)}
  #configPanel .cfg-soon{font-size:14px;color:rgba(255,176,0,.7);letter-spacing:1px;opacity:0;transition:opacity .2s}
  #configPanel .cfg-soon.show{opacity:1}
  #lorePanel .lp-head{font-size:15px;letter-spacing:3px;color:var(--amber);text-shadow:0 0 8px rgba(255,176,0,.4);margin-bottom:12px}#lorePanel .lp-rec{color:var(--enj);text-shadow:0 0 8px var(--enj)}
  #lorePanel .lp-body{max-height:60vh;overflow-y:auto;font-size:18px;line-height:1.45;color:#bdf5cf;text-shadow:0 0 6px rgba(143,255,176,.25),0 0 2px #000;white-space:pre-wrap;padding-right:6px}
  #lorePanel .lp-body::-webkit-scrollbar{width:8px}#lorePanel .lp-body::-webkit-scrollbar-thumb{background:rgba(57,255,160,.3)}
  #lorePanel .lp-foot{margin-top:14px;text-align:right}
  @media (max-width:760px){#configPanel .cfg-btn{font-size:17px}#lorePanel .lp-body{font-size:16px;max-height:64vh}}
  /* ===== SWAP DE HUD: en modo juego se oculta el HUD CCTV y se muestra el HUD de juego ===== */
  #gamehud{position:fixed;left:18px;bottom:18px;z-index:9;display:none;font-family:'VT323',monospace;pointer-events:none}
  body.gamemode #gamehud{display:block}
  body.gamemode #camhud,body.gamemode #panel{display:none} /* CAM/LIVE + panel del operador → ocultos en juego (vuelven en livestream) */
  body.gamemode #map{display:block;left:14px;top:14px;bottom:auto} /* MODO BETA: el minimapa SÍ se muestra (guía + destello de tareas); reubicado arriba-izq, libre del HUD de abajo. El marcador = el jugador (que es R-01). */
  /* Los pensamientos de Beeko SÍ se muestran en juego (atmósfera/narrativa), pero reubicados ARRIBA-centro para no pisar el prompt [E] (que va abajo-centro). Livestream: quedan abajo como siempre. */
  /* MODO JUEGO: el cuadro de pensamiento va ABAJO DEL CENTRO (anclado al bottom → crece hacia arriba). Así NO se cruza con el panel de transmisión (arriba,
     top:96px) ni pisa el prompt [E] (bottom:96px) ni la barra de energía/inventario (bottom:18px) ni la ruedita (abajo-der). En livestream queda donde estaba. */
  body.gamemode #beeko{top:auto;bottom:168px}
  #gamehud .gh-energy{display:flex;flex-direction:column;gap:3px}
  #gamehud .gh-label{font-size:15px;letter-spacing:3px;color:var(--screen);text-shadow:0 0 8px rgba(57,255,160,.5),0 0 2px #000}
  #gamehud .gh-bar{width:220px;height:16px;border:1px solid rgba(143,255,176,.45);background:rgba(6,12,9,.55);box-shadow:inset 0 0 10px rgba(0,0,0,.5)}
  #gamehud .gh-bar i{display:block;height:100%;width:100%;background:var(--screen);box-shadow:0 0 10px var(--screen);transition:width .12s linear,background .25s,box-shadow .25s}
  #gamehud .gh-colony{margin-top:7px;font-size:16px;letter-spacing:2px;color:var(--ash);text-shadow:0 0 4px #000}#gamehud .gh-colony b{color:var(--screen);text-shadow:0 0 8px rgba(57,255,160,.55)}#gamehud .gh-cstar{color:var(--screen);text-shadow:0 0 8px var(--screen)}
  #gamehud .gh-bees{margin-top:3px;font-size:16px;letter-spacing:2px;color:var(--ash);text-shadow:0 0 4px #000}#gamehud .gh-bees b{color:var(--amber);text-shadow:0 0 8px rgba(255,176,0,.5)}#gamehud .gh-bstar{color:var(--amber);text-shadow:0 0 8px var(--amber)}
  #gamehud .gh-inv{margin-top:9px}#gamehud .gh-slots{display:flex;gap:7px;margin-top:3px;pointer-events:auto}
  #gamehud .gh-slot{width:34px;height:34px;border:1px solid rgba(143,255,176,.32);background:rgba(6,12,9,.5);box-shadow:inset 0 0 8px rgba(0,0,0,.5)}
  #gamehud .gh-slot.filled{border-color:rgba(110,255,192,.7);box-shadow:0 0 12px rgba(57,255,170,.4),inset 0 0 8px rgba(57,255,170,.15);cursor:pointer;display:flex;align-items:center;justify-content:center;color:#6effc0;font-size:20px;text-shadow:0 0 8px #39ffaa}
  /* Panel del ítem de misterio (lore) */
  #itemPanel{position:fixed;inset:0;z-index:22;display:none;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,rgba(4,8,6,.5),rgba(2,3,4,.82) 80%);font-family:'VT323',monospace;cursor:pointer}
  #itemPanel.show{display:flex;animation:smIn .25s ease}
  #itemPanel .ip-frame{position:relative;width:min(560px,90vw);padding:18px 24px 16px;background:linear-gradient(180deg,rgba(7,16,11,.92),rgba(3,8,6,.95));border:1px solid rgba(110,255,192,.4);box-shadow:0 0 40px rgba(0,0,0,.7),inset 0 0 50px rgba(57,255,170,.05)}
  #itemPanel .ip-head{font-size:15px;letter-spacing:3px;color:var(--amber);text-shadow:0 0 8px rgba(255,176,0,.4);margin-bottom:12px}#itemPanel .ip-rec{color:var(--enj);text-shadow:0 0 8px var(--enj)}
  #itemPanel .ip-body{font-size:19px;line-height:1.4;color:#bdf5cf;text-shadow:0 0 7px rgba(143,255,176,.28),0 0 2px #000;white-space:pre-wrap}
  #itemPanel .ip-foot{margin-top:14px;font-size:13px;letter-spacing:2px;color:rgba(201,201,184,.55);text-align:right}
  @media (max-width:760px){#gamehud .gh-slot{width:30px;height:30px}#itemPanel .ip-frame{padding:16px 16px}#itemPanel .ip-body{font-size:17px}}
  @media (max-width:760px){#gamehud{left:12px;bottom:12px}#gamehud .gh-bar{width:160px}}
  /* ---- Panel de interacción narrativa (TV / radio / computadora) — mismo lenguaje CCTV que itemPanel, con 3 variantes de color. Ancho para que TODO el texto entre sin scroll. ---- */
  #objPanel{position:fixed;inset:0;z-index:23;display:none;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,rgba(4,8,6,.5),rgba(2,3,4,.85) 80%);font-family:'VT323',monospace;cursor:pointer}
  #objPanel.show{display:flex;animation:smIn .25s ease}
  #objPanel .op-frame{position:relative;width:min(880px,95vw);max-height:96vh;overflow:hidden;padding:16px 26px 14px;background:linear-gradient(180deg,rgba(7,16,11,.94),rgba(3,8,6,.97));border:1px solid rgba(110,255,192,.4);box-shadow:0 0 40px rgba(0,0,0,.72),inset 0 0 50px rgba(57,255,170,.05);cursor:default}
  #objPanel .op-head{font-size:15px;letter-spacing:3px;color:var(--amber);text-shadow:0 0 8px rgba(255,176,0,.4);margin-bottom:10px}#objPanel .op-rec{color:var(--enj);text-shadow:0 0 8px var(--enj)}
  #objPanel .op-main{display:block}
  #objPanel .op-body{font-size:17px;line-height:1.34;color:#bdf5cf;text-shadow:0 0 7px rgba(143,255,176,.28),0 0 2px #000;white-space:pre-wrap}
  #objPanel .op-foot{margin-top:10px;font-size:13px;letter-spacing:2px;color:rgba(201,201,184,.55);text-align:right}
  #objPanel .op-screen{display:none;position:relative;width:300px;flex:0 0 auto;aspect-ratio:4/3;border:2px solid rgba(120,150,170,.45);box-shadow:0 0 24px rgba(80,140,200,.22),inset 0 0 30px rgba(0,0,0,.6);background:#000;overflow:hidden}
  #objPanel .op-screen canvas{width:100%;height:100%;display:block;image-rendering:pixelated}
  /* TV: pantalla (canvas) + caption lado a lado → menos alto, todo visible */
  #objPanel.m-tv .op-main{display:flex;gap:20px;align-items:flex-start}
  #objPanel.m-tv .op-screen{display:block}
  #objPanel.m-tv .op-body{flex:1 1 auto;color:#cfe6ff;font-size:16px;text-shadow:0 0 6px rgba(140,190,255,.25),0 0 2px #000}
  #objPanel.m-tv .op-frame{border-color:rgba(120,170,210,.45)}
  #objPanel.m-tv .op-head{color:#9fd0ff;text-shadow:0 0 8px rgba(120,180,255,.5)}
  #objPanel.m-term .op-frame{border-color:rgba(57,255,160,.5)}
  #objPanel.m-term .op-head{color:var(--screen);text-shadow:0 0 8px rgba(57,255,160,.5)}
  #objPanel.m-term .op-body{color:#9dffc4;font-size:16px;text-shadow:0 0 7px rgba(57,255,160,.3),0 0 2px #000}
  #objPanel.m-radio .op-frame{border-color:rgba(255,176,0,.45)}
  #objPanel.m-radio .op-head{color:var(--amber)}
  #objPanel.m-radio .op-body{color:#ffe2ad;text-shadow:0 0 7px rgba(255,176,0,.3),0 0 2px #000}
  @media (max-width:760px){#objPanel .op-frame{width:94vw;padding:14px 16px}#objPanel .op-body,#objPanel.m-term .op-body,#objPanel.m-tv .op-body{font-size:15px}#objPanel.m-tv .op-main{flex-direction:column;align-items:center}#objPanel.m-tv .op-screen{width:min(280px,72vw)}}
  /* ===== CARTA DE DECISIÓN (#cardPanel) — modelada sobre #objPanel, verde/ámbar CRT. EXCLUSIVO del modo juego (sólo recibe .show vía JS gateado a gameMode). El fondo NO cierra. ===== */
  #cardPanel{position:fixed;inset:0;z-index:26;display:none;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,rgba(4,8,6,.6),rgba(2,3,4,.9) 80%);font-family:'VT323',monospace;cursor:default}
  #cardPanel.show{display:flex;animation:smIn .25s ease}
  #cardPanel .cp-frame{position:relative;width:min(560px,92vw);max-height:92vh;overflow-y:auto;padding:18px 26px 16px;background:linear-gradient(180deg,rgba(7,16,11,.95),rgba(3,8,6,.98));border:1px solid rgba(110,255,192,.45);box-shadow:0 0 44px rgba(0,0,0,.75),inset 0 0 50px rgba(57,255,170,.05)}
  #cardPanel .cp-head{font-size:15px;letter-spacing:3px;color:var(--amber);text-shadow:0 0 8px rgba(255,176,0,.4);margin-bottom:12px}#cardPanel .cp-rec{color:var(--enj);text-shadow:0 0 8px var(--enj)}
  #cardPanel .cp-body{font-size:19px;line-height:1.4;color:#bdf5cf;text-shadow:0 0 7px rgba(143,255,176,.28),0 0 2px #000;white-space:pre-wrap;margin-bottom:16px}
  #cardPanel .cp-opts{display:flex;flex-direction:column;gap:9px}
  #cardPanel .cp-foot{margin-top:14px;text-align:right;min-height:1px}
  .cp-btn{display:block;width:100%;text-align:left;padding:11px 15px;background:rgba(6,12,9,.6);border:1px solid rgba(143,255,176,.42);color:var(--screen);font-family:'VT323',monospace;font-size:19px;letter-spacing:1px;cursor:pointer;transition:background .12s,box-shadow .12s,border-color .12s}
  .cp-btn:hover{background:rgba(57,255,160,.14);border-color:var(--screen);box-shadow:0 0 14px rgba(57,255,160,.3)}
  .cp-btn.cp-cont{width:auto;display:inline-block;text-align:center;color:var(--amber);border-color:rgba(255,176,0,.5)}
  .cp-btn.cp-cont:hover{background:rgba(255,176,0,.12);border-color:var(--amber);box-shadow:0 0 14px rgba(255,176,0,.3)}
  @media (max-width:760px){#cardPanel .cp-frame{width:94vw;padding:15px 16px}#cardPanel .cp-body{font-size:17px}.cp-btn{font-size:17px}}
  /* ===== FINAL DE LA HISTORIA (#storyEnd) — pantalla completa, look CRT (como la pantalla de carga). EXCLUSIVO del modo juego. ===== */
  #storyEnd{position:fixed;inset:0;z-index:27;display:none;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#06140d 0%,#020403 84%);font-family:'VT323',monospace;overflow:hidden;isolation:isolate}
  #storyEnd.show{display:flex;animation:smIn .4s ease}
  #storyEnd .se-scan{position:absolute;inset:0;pointer-events:none;z-index:3;background:repeating-linear-gradient(rgba(0,0,0,0) 0 2px,rgba(0,0,0,.28) 2px 4px);opacity:.6;mix-blend-mode:multiply}
  #storyEnd .se-vig{position:absolute;inset:0;pointer-events:none;z-index:4;box-shadow:inset 0 0 180px rgba(0,0,0,.9)}
  #storyEnd .se-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:12px;width:min(640px,92vw);text-align:center;padding:22px 34px}
  #storyEnd .se-top{font-size:13px;letter-spacing:4px;color:var(--amber);opacity:.85}#storyEnd .se-rrec{color:var(--enj);text-shadow:0 0 8px var(--enj)}
  #storyEnd .se-title{font-family:'Anton',sans-serif;font-size:42px;letter-spacing:7px;color:var(--screen);text-shadow:1.8px 0 rgba(255,40,90,.5),-1.8px 0 rgba(40,210,255,.45),0 0 26px rgba(57,255,160,.55);margin:2px 0 4px}
  #storyEnd .se-body{font-size:17px;line-height:1.45;color:#bdf5cf;text-shadow:0 0 7px rgba(143,255,176,.28),0 0 2px #000;white-space:pre-wrap;max-width:580px;max-height:70vh;overflow-y:auto;text-align:left;padding-right:4px}
  #storyEnd .se-body::-webkit-scrollbar{width:7px}#storyEnd .se-body::-webkit-scrollbar-thumb{background:rgba(57,255,160,.3)}
  #storyEnd .se-foot{margin-top:14px}
  @media (max-width:760px){#storyEnd .se-title{font-size:34px}#storyEnd .se-body{font-size:17px}#storyEnd .se-inner{padding:22px 18px}}
  /* Prompt de interacción [E] (sólo modo juego, sólo cerca de algo interactuable) */
  #ghPrompt{position:fixed;left:50%;bottom:96px;transform:translateX(-50%) translateY(6px);z-index:10;display:none;padding:7px 16px;font-family:'VT323',monospace;font-size:21px;letter-spacing:2px;color:var(--screen);background:rgba(6,12,9,.7);border:1px solid rgba(143,255,176,.5);box-shadow:0 0 16px rgba(57,255,160,.25),0 0 3px #000;text-shadow:0 0 8px rgba(57,255,160,.5);opacity:0;transition:opacity .15s,transform .15s;pointer-events:none}
  body.gamemode #ghPrompt.show{display:block;opacity:1;transform:translateX(-50%) translateY(0)}
  #joy{position:fixed;left:24px;bottom:24px;z-index:11;width:92px;height:92px;border-radius:50%;border:1px solid rgba(143,255,176,.4);background:rgba(6,7,10,.4);display:none}
  #stick{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:rgba(143,255,176,.5);box-shadow:0 0 12px var(--screen)}
  body.touch #joy{display:block}
  #prompt{position:fixed;left:50%;bottom:74px;transform:translateX(-50%);z-index:10;display:none;font-family:'VT323',monospace;font-size:18px;letter-spacing:1px;background:rgba(6,7,10,.85);color:var(--screen);border:1px solid var(--screen);padding:6px 16px;cursor:pointer;box-shadow:0 0 14px rgba(143,255,176,.3)}
  #prompt.disabled{color:var(--ash);border-color:rgba(201,201,184,.5);box-shadow:none;cursor:default}
  #res{position:fixed;left:50%;top:12px;transform:translateX(-50%);z-index:9;display:flex;align-items:center;gap:13px;background:rgba(6,7,10,.6);border:1px solid rgba(201,201,184,.2);padding:7px 13px;flex-wrap:wrap;justify-content:center;max-width:94vw}
  #res .r{display:flex;align-items:center;gap:4px;font-size:16px;color:var(--ash)}
  #res .r .rv{color:var(--screen);font-size:18px;min-width:14px;text-align:right}
  #res .nuc{display:flex;flex-direction:column;gap:2px;min-width:160px}
  #res .nuc .nl{font-size:13px;letter-spacing:1px;color:var(--cyan);display:flex;justify-content:space-between}
  #res .nuc .nt{height:9px;background:rgba(0,0,0,.5);border:1px solid rgba(57,255,208,.4)}
  #res .nuc .nf{height:100%;width:80%;background:#39ffd0;box-shadow:0 0 10px #39ffd0;transition:width .2s,background .2s}
  #inv .slot .hlbl{position:absolute;bottom:-15px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:1px;color:var(--ash);white-space:nowrap}
  #inv{bottom:24px}
  /* popup glow-rosa: la lógica de decisión se removió en el pivote, pero el CSS se CONSERVA para reusar como telemetría en Fase 3 (CARGANDO, ENJAMBRE LIBERADO, ABEJAS: N) */
  #decision{position:fixed;inset:0;z-index:24;display:none;align-items:center;justify-content:center;background:rgba(6,7,10,.8);padding:20px}
  #decision .dbox{max-width:440px;border:1px solid var(--enj);background:rgba(10,8,12,.96);padding:22px;box-shadow:0 0 30px rgba(255,46,136,.3)}
  #decision .dh{font-family:'Anton',sans-serif;font-size:22px;letter-spacing:2px;color:var(--enj);text-shadow:0 0 12px var(--enj);margin-bottom:10px}
  #decision .dt{font-size:19px;letter-spacing:1px;color:#e8e8df;line-height:1.4;margin-bottom:18px}
  #decision .dbtns{display:flex;gap:12px}
  #decision .dbtns .btn{flex:1;font-size:18px;padding:9px}

  /* HOLDERS — lectura/payoff de refugiados (P0) */
  #holdout{width:168px;margin-top:1px;padding:5px 7px;border:1px solid rgba(143,255,176,.22);background:rgba(6,7,10,.5);border-radius:4px}
  #holdout .hl{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;letter-spacing:1px;color:#9aa3b0}
  #holdout #ro-in{font-family:'Anton',sans-serif;font-size:20px;color:var(--screen);text-shadow:0 0 9px rgba(143,255,176,.55)}
  #holdout #ro-in i{font-size:11px;color:#9aa3b0;font-style:normal}
  #holdout .hbar{height:7px;background:rgba(143,255,176,.1);border:1px solid rgba(143,255,176,.3);margin:4px 0 3px;overflow:hidden}
  #holdout #ro-fill{height:100%;width:0;background:linear-gradient(90deg,#39ffd0,#8fffb0);box-shadow:0 0 10px var(--screen);transition:width .18s}
  #holdout .hl2{display:flex;justify-content:space-between;font-size:12px;letter-spacing:1px;color:var(--enj);min-height:14px}
  #holdout #ro-cons{color:#ff7abf}
  #holdout .hl3{font-size:11px;letter-spacing:.5px;color:#7e8790;margin-top:2px}
  #holdout .hl3 b{color:#cfe0d0}#holdout .hl3 b.warn{color:var(--amber)}
  #holdout.full{border-color:rgba(255,176,0,.5);box-shadow:0 0 14px rgba(255,176,0,.25)}
  #holdout.full #ro-in{color:var(--amber);text-shadow:0 0 10px rgba(255,176,0,.6)}
  #holdout.full #ro-fill{background:linear-gradient(90deg,#ffd86a,#ffb000);box-shadow:0 0 12px var(--amber)}
  #holdout.hin{animation:hflash .35s ease-out}#holdout.hout{animation:hflashO .35s ease-out}
  @keyframes hflash{0%{background:rgba(143,255,176,.2)}100%{background:rgba(6,7,10,.5)}}
  @keyframes hflashO{0%{background:rgba(255,46,136,.2)}100%{background:rgba(6,7,10,.5)}}
  /* pulso "tocá esto" hasta el primer uso */
  @keyframes cuePulse{0%,100%{box-shadow:0 0 0 rgba(143,255,176,0)}50%{box-shadow:0 0 13px rgba(143,255,176,.6)}}
  #holdout.cue,input#holders.cue{animation:cuePulse 1.25s ease-in-out infinite}
  /* ticks flotantes (+N entran / −N afuera) — feedback sin depender del audio */
  #ticks{position:fixed;right:16px;top:150px;z-index:10;pointer-events:none;width:172px;height:0}
  #ticks .tick{position:absolute;right:6px;font-family:'Anton',sans-serif;font-size:18px;letter-spacing:1px;opacity:0;animation:tickUp 1s ease-out forwards;text-shadow:0 0 8px #000,0 0 4px #000;white-space:nowrap}
  @keyframes tickUp{0%{opacity:0;transform:translateY(8px)}18%{opacity:1}100%{opacity:0;transform:translateY(-30px)}}

  /* ===== OVERLAY DE CÁMARA DE SEGURIDAD (sub-paso 6) — bordes, no tapa el búnker. Lee de STREAM. ===== */
  #camhud{position:fixed;inset:0;z-index:8;pointer-events:none;font-family:'VT323',monospace;letter-spacing:1px}
  #camhud .ch-tl{position:absolute;left:16px;top:12px;font-size:22px;color:var(--amber);text-shadow:0 0 8px rgba(255,176,0,.45),0 0 3px #000}
  /* LÍNEA DE ESTADO de la unidad: 2ª línea bajo "CAM XX — ZONA" (telemetría verde, monoespaciada). No choca: va en el bloque top-left, debajo del CAM. */
  #camhud #ch-status{font-size:16px;letter-spacing:1px;line-height:1.1;margin-top:3px;color:var(--screen);text-shadow:0 0 7px rgba(143,255,176,.4),0 0 3px #000;white-space:nowrap}
  #camhud .ch-rec{color:#ff3b3b;text-shadow:0 0 8px rgba(255,59,59,.6),0 0 3px #000;margin-right:7px;animation:recBlink 1.5s steps(1,end) infinite}
  @keyframes recBlink{0%,58%{opacity:1}59%,100%{opacity:.16}}
  #camhud .ch-tr{position:absolute;right:16px;top:12px;text-align:right;line-height:1.1}
  #camhud #ch-time{display:block;font-size:26px;color:var(--screen);text-shadow:0 0 8px rgba(143,255,176,.45),0 0 3px #000}
  #camhud .ch-day{font-size:17px;color:var(--ash);letter-spacing:2px;text-shadow:0 0 3px #000}
  #camhud .ch-day b{color:var(--screen);font-weight:400;text-shadow:0 0 7px rgba(143,255,176,.5)}
  #camhud .ch-br{position:absolute;right:16px;bottom:14px;display:flex;align-items:flex-end;gap:10px}
  #camhud .ch-bars{display:inline-flex;align-items:flex-end;gap:3px;height:20px}
  #camhud .ch-bars i{display:block;width:4px;background:var(--screen);box-shadow:0 0 5px rgba(143,255,176,.45);animation:sigFlutter 2.6s ease-in-out infinite}
  #camhud .ch-bars i:nth-child(1){height:6px;animation-delay:0s}
  #camhud .ch-bars i:nth-child(2){height:10px;animation-delay:.5s}
  #camhud .ch-bars i:nth-child(3){height:14px;animation-delay:1s}
  #camhud .ch-bars i:nth-child(4){height:20px;animation-delay:.25s}
  @keyframes sigFlutter{0%,100%{opacity:.92}40%{opacity:.5}68%{opacity:1}}
  #camhud #ch-sig{font-size:20px;color:var(--screen);letter-spacing:2px;text-shadow:0 0 8px rgba(143,255,176,.45),0 0 3px #000;animation:sigDim 3.4s ease-in-out infinite}
  @keyframes sigDim{0%,100%{opacity:1}50%{opacity:.72}}
  #camhud .ch-bee-line{display:block;margin-top:4px;font-size:15px;letter-spacing:1.5px;color:var(--ash);text-shadow:0 0 3px #000;opacity:.85} /* telemetría discreta: abejas liberadas, bajo el contador de días */
  #camhud .ch-bee-line b{color:var(--amber);font-weight:400;text-shadow:0 0 7px rgba(255,176,0,.45),0 0 3px #000}
  #camhud .ch-bee{color:var(--amber);text-shadow:0 0 7px rgba(255,176,0,.5);margin-right:3px}
  /* INDICADOR DE EVENTO: franja superior CENTRAL, bajo el "CAM XX — ZONA", sin tapar timestamp (der) ni REC (izq) ni el cuadro de Beeko (abajo). Visible toda la duración (atado a STREAM.event). */
  #camhud #ch-event{position:absolute;left:50%;top:44px;transform:translateX(-50%);font-family:'VT323',monospace;font-size:22px;letter-spacing:2px;white-space:nowrap;padding:1px 12px;border:1px solid rgba(255,80,50,.45);background:rgba(34,5,5,.34);border-radius:2px;color:#ff4a30;text-shadow:0 0 10px rgba(255,60,40,.7),0 0 3px #000;opacity:0;transition:opacity .22s}
  #camhud #ch-event.on{opacity:1;animation:evBlink 1.1s steps(1,end) infinite}
  #camhud #ch-event.blackout{color:#ffb028;border-color:rgba(255,176,40,.5);text-shadow:0 0 10px rgba(255,176,40,.6),0 0 3px #000}
  @keyframes evBlink{0%,70%{opacity:1}71%,100%{opacity:.42}}

  /* ===== CUADRO DE PENSAMIENTOS DE BEEKO (capa de la transmisión, no captura clicks) ===== */
  #beeko{position:fixed;left:50%;bottom:40px;transform:translateX(-50%) translateY(12px);z-index:8;width:min(680px,92vw);opacity:0;pointer-events:none;font-family:'VT323',monospace;transition:opacity .55s ease,transform .55s ease}
  #beeko.show{opacity:1;transform:translateX(-50%) translateY(0)}
  #beeko .bk-frame{position:relative;display:flex;gap:14px;align-items:stretch;padding:12px 18px 12px 12px;background:linear-gradient(180deg,rgba(6,18,11,.80),rgba(3,10,7,.86));border:1px solid rgba(60,255,160,.30);box-shadow:0 0 26px rgba(0,0,0,.55),inset 0 0 34px rgba(57,255,136,.05)}
  /* esquinas técnicas (corchetes) */
  #beeko .bk-frame::before,#beeko .bk-frame::after{content:'';position:absolute;width:15px;height:15px;border:2px solid rgba(80,255,170,.6);pointer-events:none}
  #beeko .bk-frame::before{left:-1px;top:-1px;border-right:0;border-bottom:0}
  #beeko .bk-frame::after{right:-1px;bottom:-1px;border-left:0;border-top:0}
  #beeko .bk-portrait{position:relative;flex:0 0 118px;width:118px;height:118px;background:#04130c;border:1px solid rgba(60,255,160,.26);overflow:hidden}
  #beeko .bk-portrait canvas{width:100%;height:100%;display:block;image-rendering:auto;filter:saturate(.9) brightness(1.03) contrast(1.04)}
  #beeko .bk-portrait::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.26) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.35) 100%);mix-blend-mode:multiply}
  #beeko .bk-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center;padding-right:4px}
  #beeko .bk-name{font-family:'Anton',sans-serif;font-size:16px;letter-spacing:2px;color:var(--amber);text-shadow:0 0 8px rgba(255,176,0,.4),0 0 3px #000;margin-bottom:5px}
  #beeko .bk-text{font-size:21px;line-height:1.16;color:#bdf5cf;text-shadow:0 0 7px rgba(143,255,176,.32),0 0 2px #000;min-height:2.3em;white-space:pre-wrap;word-break:break-word}
  #beeko .bk-scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.10) 0 1px,transparent 1px 3px);mix-blend-mode:overlay}

  /* ===== CUADRO DE TRANSMISIÓN DE LA RADIO (señal saliente) — arriba-centro, BAJO los badges. No choca: REC/CAM/STATUS (top-izq), time/day/bees (top-der), badge de evento (centro, más arriba) ni el cuadro de Beeko (abajo). SIN retrato (lo distingue del pensamiento). ===== */
  #radiotx{position:fixed;left:50%;top:96px;transform:translateX(-50%) translateY(-8px);z-index:8;width:min(600px,68vw);opacity:0;pointer-events:none;font-family:'VT323',monospace;transition:opacity .5s ease,transform .5s ease}
  #radiotx.show{opacity:1;transform:translateX(-50%) translateY(0)}
  #radiotx .rt-frame{position:relative;padding:7px 16px 10px;background:linear-gradient(180deg,rgba(8,16,20,.82),rgba(3,8,11,.86));border:1px solid rgba(120,210,255,.34);box-shadow:0 0 22px rgba(0,0,0,.5),inset 0 0 26px rgba(80,180,255,.05)}
  #radiotx .rt-head{display:flex;align-items:center;gap:9px;margin-bottom:5px}
  #radiotx .rt-title{font-size:16px;letter-spacing:2px;color:var(--cyan);text-shadow:0 0 8px rgba(120,210,255,.5),0 0 3px #000}
  #radiotx .rt-sig{display:inline-flex;align-items:flex-end;gap:2px;height:13px}
  #radiotx .rt-sig i{display:block;width:3px;background:var(--cyan);box-shadow:0 0 5px rgba(120,210,255,.5);animation:rtSig 1s steps(1,end) infinite}
  #radiotx .rt-sig i:nth-child(1){height:4px;animation-delay:0s}
  #radiotx .rt-sig i:nth-child(2){height:7px;animation-delay:.12s}
  #radiotx .rt-sig i:nth-child(3){height:10px;animation-delay:.24s}
  #radiotx .rt-sig i:nth-child(4){height:13px;animation-delay:.36s}
  @keyframes rtSig{0%,100%{opacity:1}50%{opacity:.3}}
  #radiotx .rt-dot{margin-left:auto;width:9px;height:9px;border-radius:50%;background:#ff5a30;box-shadow:0 0 9px rgba(255,90,48,.8);animation:rtRec 1.1s steps(1,end) infinite}
  @keyframes rtRec{0%,55%{opacity:1}56%,100%{opacity:.25}}
  #radiotx .rt-text{font-size:19px;line-height:1.18;color:#bfe6ff;text-shadow:0 0 7px rgba(120,210,255,.3),0 0 2px #000;min-height:1.2em;white-space:pre-wrap;word-break:break-word}

  /* SEÑAL ENTRANTE — ámbar/rojo, intencionalmente DISTINTO del cyan del OUTBOUND. Lee como alerta/intrusión. Mismo lugar (top), bajo los badges. */
  #radioin{position:fixed;left:50%;top:96px;transform:translateX(-50%) translateY(-8px);z-index:8;width:min(560px,64vw);opacity:0;pointer-events:none;font-family:'VT323',monospace;transition:opacity .45s ease,transform .45s ease}
  #radioin.show{opacity:1;transform:translateX(-50%) translateY(0)}
  #radioin .ri-frame{position:relative;padding:7px 16px 10px;background:linear-gradient(180deg,rgba(24,12,6,.84),rgba(11,4,3,.88));border:1px solid rgba(255,150,60,.36);box-shadow:0 0 22px rgba(0,0,0,.5),inset 0 0 26px rgba(255,90,40,.06);animation:riFlick 2.6s steps(1,end) infinite}
  @keyframes riFlick{0%,92%,100%{border-color:rgba(255,150,60,.36)}94%{border-color:rgba(255,60,40,.7)}96%{border-color:rgba(255,150,60,.22)}}
  #radioin .ri-head{display:flex;align-items:center;gap:9px;margin-bottom:5px}
  #radioin .ri-title{font-size:16px;letter-spacing:2px;color:var(--amber);text-shadow:0 0 8px rgba(255,160,60,.55),0 0 3px #000}
  #radioin .ri-sig{display:inline-flex;align-items:flex-end;gap:2px;height:13px}
  #radioin .ri-sig i{display:block;width:3px;background:var(--amber);box-shadow:0 0 5px rgba(255,160,60,.55);animation:riSig 1.3s steps(1,end) infinite}
  #radioin .ri-sig i:nth-child(1){height:11px;animation-delay:0s}
  #radioin .ri-sig i:nth-child(2){height:5px;animation-delay:.21s}
  #radioin .ri-sig i:nth-child(3){height:13px;animation-delay:.07s}
  #radioin .ri-sig i:nth-child(4){height:7px;animation-delay:.34s}
  @keyframes riSig{0%,100%{opacity:.25}50%{opacity:1}}
  #radioin .ri-dot{margin-left:auto;width:9px;height:9px;border-radius:50%;background:#ff3a28;box-shadow:0 0 10px rgba(255,58,40,.85);animation:riRec .7s steps(1,end) infinite}
  @keyframes riRec{0%,40%{opacity:1}41%,100%{opacity:.2}}
  #radioin .ri-text{font-size:18px;line-height:1.2;color:#ffcf9a;text-shadow:0 0 7px rgba(255,140,60,.32),0 0 2px #000;min-height:1.2em;white-space:pre-wrap;word-break:break-word;letter-spacing:1px}

  @media (max-width:760px){
    #beeko{bottom:30px;width:94vw}
    body.gamemode #beeko{bottom:150px}   /* mobile: pensamiento abajo del centro, despejado del prompt/HUD */
    #beeko .bk-portrait{flex:0 0 84px;width:84px;height:84px}
    #beeko .bk-text{font-size:18px}
    #radiotx{top:82px;width:92vw} #radiotx .rt-title{font-size:13px;letter-spacing:1px} #radiotx .rt-text{font-size:16px}
    #radioin{top:82px;width:92vw} #radioin .ri-title{font-size:13px;letter-spacing:1px} #radioin .ri-text{font-size:15px}
    /* overlay top comprimido en pantalla angosta: achicamos las dos columnas para que la 2ª línea (STATUS) no choque con DAY/BEES ni con la badge de evento */
    #camhud .ch-tl{font-size:15px} #camhud #ch-status{font-size:12px;margin-top:2px}
    #camhud #ch-time{font-size:18px} #camhud .ch-day{font-size:12px;letter-spacing:1px} #camhud .ch-bee-line{font-size:11px}
    #camhud #ch-event{top:62px;font-size:15px;padding:1px 8px} /* baja la badge para librar el bloque top-left de 2 líneas */
  }