/* THE FLOOR — one world, one look.
   Tokens: ink (the dark), phosphor (screens), amber (warm room light), jacket (ODIN orange, the player only), sell red. */
:root{
  --ink:#0b0907;
  --ink2:#15110d;
  --phos:#7cff9b;       /* CRT phosphor */
  --phos-dim:#3f9f5a;
  --phos-bg:#04110a;
  --amber:#ffc46b;
  --jacket:#ff5001;
  --sell:#ff5a4a;
  --paper:#efe6d2;
  --frame:#cbbf9f;      /* beige plastic */
  --vt:"VT323", ui-monospace, "Lucida Console", Consolas, monospace;
  --logo:"Big Shoulders Display", Impact, "Arial Narrow", sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--ink);color:var(--paper);overflow:hidden;
  font-family:var(--vt);-webkit-tap-highlight-color:transparent;touch-action:none;user-select:none;-webkit-user-select:none}
canvas#gl{position:fixed;inset:0;width:100%;height:100%;display:block;image-rendering:pixelated}
button{font:inherit;color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--amber);outline-offset:2px}

/* ---------- TITLE (ODIN SX, 2026-09-30 v2): the 1997 title card over the live 3D floor ---------- */
.screen{position:fixed;inset:0;z-index:20;display:grid;place-items:end center;background:transparent}
.plate{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;
  filter:saturate(.95) contrast(1.05);animation:drift 28s ease-in-out infinite alternate}
@keyframes drift{from{transform:scale(1.04) translate(0,0)}to{transform:scale(1.12) translate(-2%,1%)}}
body.no3d .plate{display:block}
body.no3d .screen{background:#000}
.plate-grade{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(ellipse 85% 75% at 50% 45%,rgba(0,0,0,0) 45%,rgba(0,0,0,.55) 100%),
  linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,.5) 58%,rgba(0,0,0,.93) 100%),
  repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px)}
.title-card{position:relative;display:grid;justify-items:center;gap:10px;padding:0 16px calc(7vh + env(safe-area-inset-bottom,0px));text-align:center}
.presents{display:flex;align-items:center;gap:10px;font-size:20px;letter-spacing:.18em;color:#fff;text-shadow:0 2px 0 #000}
.spark{width:26px;height:26px}
.logo{margin:0;font-family:var(--logo);font-weight:900;font-style:italic;text-transform:uppercase;
  font-size:clamp(88px,17vw,200px);line-height:.82;letter-spacing:.01em;white-space:nowrap;
  padding:0 .16em 0 .06em;margin:0 -.1em 0 -.06em;
  filter:drop-shadow(0 3px 0 #3a1400) drop-shadow(0 6px 0 #1a0800) drop-shadow(0 12px 18px rgba(0,0,0,.7))}
.logo span{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#fff}
.logo .lo{background-image:linear-gradient(180deg,#ffffff 0%,#fff3d6 45%,#e9d3a6 70%,#bfa37a 100%)}
.logo .hi{background-image:linear-gradient(180deg,#fff7df 0%,#ffd08a 34%,#ff7a1f 60%,#ff5001 100%);padding-right:.06em}
.tag{margin:0;font-size:24px;color:var(--paper);text-shadow:0 2px 0 #000}
.tag2{color:#cfe8dc;font-size:.86em}
.start{margin-top:14px;background:none;border:0;cursor:pointer;font-size:38px;letter-spacing:.16em;color:#fff;
  text-shadow:0 0 12px rgba(255,196,107,.8),0 0 2px #fff,0 3px 0 #000;padding:8px 18px;min-height:44px}
.start:focus-visible{outline:none}
.blink{animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{opacity:.3}}
.fineprint{margin:4px 0 0;font-size:17px;color:#b9ad96;text-shadow:0 2px 0 #000}
.title-replay{position:absolute;left:16px;top:calc(12px + env(safe-area-inset-top,0px));margin:0;font-size:16px;letter-spacing:.14em;color:#d8cdb6;text-shadow:0 2px 0 #000}
.screen.out{animation:fadeout .7s ease forwards}
@keyframes fadeout{to{opacity:0;visibility:hidden}}
@media (max-width:560px){
  .presents{font-size:15px;letter-spacing:.12em}
  .tag{font-size:21px}
  .start{font-size:32px}
}

/* ---------- HUD ---------- */
#hud{position:fixed;inset:0;z-index:10;pointer-events:none}
.chip{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));display:flex;align-items:center;gap:8px;
  background:rgba(8,6,4,.72);border:2px solid #5d5240;box-shadow:inset 0 0 0 1px #000;padding:3px 10px 2px;font-size:19px;letter-spacing:.06em}
#status{left:12px}
#status i{width:9px;height:9px;background:#777}
#status.live i{background:var(--phos);box-shadow:0 0 8px var(--phos)}
#status.snap i{background:var(--amber)}
#status.live span{color:var(--phos)}
#status.snap span{color:var(--amber)}
.btn{right:12px;pointer-events:auto;cursor:pointer}
.btn:hover{border-color:var(--amber)}
.jump{position:absolute;right:16px;bottom:calc(20px + env(safe-area-inset-bottom,0px));width:76px;height:76px;border-radius:50%;
  pointer-events:auto;cursor:pointer;touch-action:none;font-size:20px;letter-spacing:.06em;color:#000;
  background:radial-gradient(circle at 40% 35%,#ffe0b0,var(--amber) 55%,#b8741f);border:3px solid #3a2410;box-shadow:0 4px 0 #1a0f06,0 8px 18px rgba(0,0,0,.5)}
.jump:active{transform:translateY(3px);box-shadow:0 1px 0 #1a0f06}

.dlg{position:absolute;left:50%;transform:translateX(-50%);
  background:linear-gradient(180deg,rgba(30,24,16,.94),rgba(10,8,6,.94));
  border:2px solid var(--frame);box-shadow:0 0 0 2px #000,0 8px 24px rgba(0,0,0,.6);
  padding:8px 16px 7px;font-size:22px;line-height:1.1;white-space:nowrap}
#prompt{bottom:calc(26px + env(safe-area-inset-bottom,0px));display:flex;gap:14px;align-items:baseline;pointer-events:auto;cursor:pointer;max-width:calc(100vw - 32px)}
#prompt b{color:var(--amber);font-weight:400;letter-spacing:.06em}
#prompt span{color:var(--paper);overflow:hidden;text-overflow:ellipsis}
#prompt em{font-style:normal;color:#000;background:var(--amber);padding:0 6px}
.hint{top:calc(58px + env(safe-area-inset-top,0px));font-size:20px;color:#e4d9c2;transition:opacity .6s}
.hint kbd{font:inherit;color:#000;background:var(--paper);padding:0 5px;margin:0 2px}
#ticker{position:absolute;left:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));display:grid;gap:4px;justify-items:start}
#ticker .tk{background:rgba(4,17,10,.85);border:1px solid var(--phos-dim);color:var(--phos);padding:1px 8px;font-size:19px;animation:tk 6s ease forwards}
#ticker .tk.s{color:var(--sell);border-color:#7a2a22;background:rgba(20,5,4,.85)}
#ticker .tk.r{color:var(--amber);border-color:#6d5327}
#ticker .tk.rp{opacity:.85;border-style:dashed}
/* v2 chips: replay + who's on the floor */
.replay{top:calc(12px + env(safe-area-inset-top,0px));right:96px;color:#d8ccb2}
.replay i{width:9px;height:9px;background:#5d5240}
.replay.on{color:var(--amber);border-color:#8a6a2a}
.replay.on i{background:var(--amber);box-shadow:0 0 8px var(--amber)}
.people{left:12px;top:calc(48px + env(safe-area-inset-top,0px));color:var(--amber)}
.people i{width:9px;height:9px;background:var(--jacket);box-shadow:0 0 8px var(--jacket)}
.tag2{color:#cfe8dc;font-size:.86em}
#menu-page .buy{color:var(--phos)} #menu-page .sell{color:var(--sell)} #menu-page .route{color:var(--amber)}
@keyframes tk{0%{opacity:0;transform:translateY(8px)}6%{opacity:1;transform:none}85%{opacity:1}100%{opacity:0}}
@media (max-width:640px){
  #ticker{display:none}
  .dlg{font-size:19px;white-space:normal;text-align:center;width:max-content;max-width:calc(100vw - 32px)}
  #prompt{flex-wrap:wrap;justify-content:center;gap:4px 10px}
  .hint{top:calc(54px + env(safe-area-inset-top,0px))}
  .chip{font-size:17px}
  .replay{left:12px;right:auto;top:calc(46px + env(safe-area-inset-top,0px));white-space:nowrap}
  .people{top:calc(80px + env(safe-area-inset-top,0px))}
  #status{max-width:calc(100vw - 110px);overflow:hidden;white-space:nowrap}
  .hint{top:calc(116px + env(safe-area-inset-top,0px))}
  .crt-in{--u:.2em}
  table.t td{white-space:normal}
}

/* ---------- TERMINAL ---------- */
#term{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:max(12px,env(safe-area-inset-top,0px)) 12px max(12px,env(safe-area-inset-bottom,0px));background:rgba(0,0,0,.35)}
.crt{position:relative;width:min(1100px,100%);height:min(760px,calc(100vh - 24px),calc(100dvh - 24px));border-radius:22px;
  background:var(--frame);padding:clamp(10px,2.2vw,26px);
  box-shadow:inset 0 2px 0 #f3ead3,inset 0 -3px 0 #8b8066,0 20px 60px rgba(0,0,0,.8)}
.crt-in{--u:.5em;position:relative;height:100%;min-height:0;border-radius:18px/22px;overflow:hidden;background:
  radial-gradient(120% 90% at 50% 45%,#0a2415 0%,var(--phos-bg) 60%,#010604 100%);
  color:var(--phos);text-shadow:0 0 6px rgba(124,255,155,.45);display:grid;grid-template-rows:auto 1fr auto;
  box-shadow:inset 0 0 60px rgba(0,0,0,.85);font-size:clamp(18px,2.1vw,24px);line-height:1.12;transform-origin:50% 50%}
.scan{position:absolute;inset:clamp(10px,2.2vw,26px);border-radius:18px/22px;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 2px,transparent 2px 4px);mix-blend-mode:multiply}
.crt.on .crt-in{animation:crton .42s cubic-bezier(.2,.8,.2,1)}
.crt.off .crt-in{animation:crtoff .32s ease-in forwards}
@keyframes crton{0%{transform:scale(1,.004);filter:brightness(2)}45%{transform:scale(1,.004);filter:brightness(2)}100%{transform:none;filter:none}}
@keyframes crtoff{0%{transform:none}60%{transform:scale(1,.004);filter:brightness(2)}100%{transform:scale(0,.004);filter:brightness(2)}}
.t-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 18px 8px;border-bottom:1px dashed var(--phos-dim);white-space:nowrap}
.t-head b{overflow:hidden;text-overflow:ellipsis;min-width:0}
.t-head b{font-weight:400;letter-spacing:.08em}
#t-stat{color:var(--phos-dim)}
#t-stat.snap{color:var(--amber)}
/* the terminal's one column never grows past the screen: its nowrap title made every page wider than a phone (2026-09-30) */
.crt-in{grid-template-columns:minmax(0,1fr)}
#t-body{overflow:auto;min-height:0;padding:10px 18px;scrollbar-color:var(--phos-dim) transparent}
#t-foot{padding:8px 18px 12px;border-top:1px dashed var(--phos-dim);color:var(--phos-dim);display:flex;flex-wrap:wrap;gap:6px 18px}
#t-foot button{background:none;border:0;cursor:pointer;color:var(--phos);padding:0}
#t-foot button:hover{background:var(--phos);color:#000}
.t-lede{margin:0 0 10px;color:var(--phos)}
.t-lede em{font-style:normal;color:var(--amber)}
.muted{color:var(--phos-dim)}
.buy{color:var(--phos)} .sell{color:var(--sell);text-shadow:0 0 6px rgba(255,90,74,.4)} .route{color:var(--amber);text-shadow:0 0 6px rgba(255,196,107,.4)}
table.t{width:100%;border-collapse:collapse}
table.t th{font-weight:400;text-align:left;color:var(--phos-dim);padding:2px 8px 4px 0;white-space:nowrap}
table.t td{padding:2px 8px 2px 0;white-space:nowrap;vertical-align:top}
table.t td.n,table.t th.n{text-align:right}
table.t tr.row{cursor:pointer}
table.t tr.row:hover td,table.t tr.sel td{background:rgba(124,255,155,.14)}
table.t tr.sel td:first-child{box-shadow:inset 3px 0 0 var(--phos)}
.bar{display:inline-block;height:.62em;vertical-align:.05em;background:var(--phos)}
.bar.s{background:var(--sell)} .bar.u{background:var(--amber)} .bar.e{background:#1d4a2b}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:3px 18px;margin:0 0 12px}
.kv dt{color:var(--phos-dim)} .kv dd{margin:0}
.big{font-size:1.9em;line-height:1;letter-spacing:.02em}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px 28px}
.sect{margin:10px 0 4px;color:var(--amber);letter-spacing:.08em}
a.x{color:var(--amber);text-decoration:none;border-bottom:1px dashed var(--amber);pointer-events:auto}
@media (max-width:640px){ .t-head{flex-direction:column;gap:2px} table.t .hide-s{display:none} }

/* ---------- MENU ---------- */
#menu{position:fixed;inset:0;z-index:40;display:grid;place-items:center;background:rgba(0,0,0,.55);padding:16px}
.win{width:min(560px,100%);max-height:100%;overflow:auto;background:linear-gradient(180deg,#2a2217,#0f0c08);border:2px solid var(--frame);box-shadow:0 0 0 2px #000,0 20px 60px rgba(0,0,0,.8);padding:18px 22px;font-size:24px}
.win h2{margin:0 0 10px;font-family:var(--logo);font-style:italic;font-weight:900;font-size:40px;color:var(--amber);letter-spacing:.04em}
#menu-list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
#menu-list button{width:100%;text-align:left;background:none;border:0;cursor:pointer;padding:3px 8px}
#menu-list button:hover,#menu-list button.sel{background:var(--paper);color:#000}
#menu-list button.sel::before,#menu-list button:hover::before{content:"▶ "}
#menu-page{margin-top:12px;font-size:21px;line-height:1.25;color:#e4d9c2}
#menu-page p{margin:0 0 10px}
#menu-page kbd{font:inherit;color:#000;background:var(--paper);padding:0 5px}
.noscript{position:fixed;inset:0;display:grid;place-items:center;font-size:24px}
/* ---------- CHAT (js/chat.js): one public room + the trade stream ----------
   Every class is c- prefixed: bare .hint/.on/.live/.r/.s are already styled
   elsewhere in this file and would bleed in (a bare .hint shifted chat lines 58px). */
.chat{position:absolute;left:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));pointer-events:auto;z-index:2;font-size:19px;line-height:1.12}
body.chat-on #ticker{display:none}
.chat .c-fab{display:none;position:relative;background:rgba(8,6,4,.78);border:2px solid #5d5240;box-shadow:inset 0 0 0 1px #000;padding:4px 12px 3px;font-size:19px;letter-spacing:.08em;color:var(--amber);cursor:pointer}
.chat .c-dot{position:absolute;top:-5px;right:-5px;width:10px;height:10px;background:var(--jacket);box-shadow:0 0 8px var(--jacket)}
.chat:not(.c-open) .c-fab{display:block}
.chat:not(.c-open) .c-box{display:none}
.c-box{width:min(420px,calc(100vw - 24px));display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;height:min(300px,42vh);
  background:linear-gradient(180deg,rgba(14,11,8,.86),rgba(6,5,3,.9));border:2px solid #5d5240;box-shadow:inset 0 0 0 1px #000,0 8px 24px rgba(0,0,0,.5)}
.c-head{min-width:0;display:flex;align-items:center;gap:6px;border-bottom:1px solid #3a3226;padding:2px 4px 0}
.c-tabs{display:flex;gap:2px}
.c-tabs button{background:none;border:0;border-bottom:2px solid transparent;color:#b9ad96;cursor:pointer;padding:2px 7px 1px;letter-spacing:.06em;font-size:18px}
.c-tabs button.c-on{color:var(--amber);border-bottom-color:var(--amber)}
.c-tabs button:hover{color:var(--paper)}
.c-tabs i{font-style:normal;color:var(--jacket);margin-left:4px;font-size:15px}
.c-tabs i:empty{display:none}
.c-state{margin-left:auto;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:16px;letter-spacing:.06em;color:#8f846f}
.c-state.c-live{color:var(--phos)} .c-state.c-local{color:var(--amber)} .c-state.c-offline{color:var(--sell)}
.c-min{background:none;border:0;color:#b9ad96;cursor:pointer;font-size:22px;padding:0 6px;line-height:1}
.c-min:hover{color:var(--amber)}
.c-list{list-style:none;margin:0;padding:4px 6px;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#5d5240 transparent}
.c-l{position:relative;padding:1px 0;word-break:break-word;color:var(--paper)}
.c-l b{font-weight:400;letter-spacing:.02em}
.c-l.c-mine span{color:#fff}
.c-l.c-tr{font-size:16px;color:var(--phos);opacity:.9}
.c-l.c-tr.c-s{color:var(--sell)} .c-l.c-tr.c-r{color:var(--amber)}
.c-l.c-sys{font-size:16px;color:#9d927c}
.c-l.c-sys.c-hint{color:var(--amber)}
.c-act{display:none;position:absolute;right:0;top:0;font-style:normal;background:rgba(6,5,3,.95);padding-left:6px}
.c-l.c-msg:hover .c-act,.c-l.c-msg.c-sel .c-act{display:inline-flex;gap:4px}
.c-act button{background:none;border:1px solid #5d5240;color:#b9ad96;cursor:pointer;font-size:15px;padding:0 5px;line-height:1.2}
.c-act button:hover{color:#000;background:var(--amber);border-color:var(--amber)}
.c-rules{padding:4px 8px;border-top:1px solid #3a3226;font-size:16px;color:#e4d9c2;max-height:9em;overflow:auto}
.c-rules p{margin:0 0 2px}
.c-foot{min-width:0;border-top:1px solid #3a3226;padding:4px 6px 3px}
.c-foot form{display:flex;gap:6px;align-items:center}
.c-foot input{flex:1;min-width:0;font:inherit;font-size:19px;color:var(--paper);background:rgba(0,0,0,.55);border:1px solid #5d5240;padding:2px 6px;
  text-transform:uppercase;user-select:text;-webkit-user-select:text;touch-action:auto}
.c-foot input:focus{outline:none;border-color:var(--amber)}
.c-foot input::placeholder{color:#7d735f}
.c-foot input:disabled{opacity:.6}
.c-foot button{flex:none;background:var(--paper);color:#000;border:0;cursor:pointer;padding:1px 8px;font-size:18px;letter-spacing:.06em}
.c-foot button:hover{background:var(--amber)}
.c-foot .c-rbtn{background:none;color:#b9ad96;border:1px solid #5d5240}
.c-me{color:var(--amber);cursor:pointer;white-space:nowrap;font-size:18px;max-width:40%;overflow:hidden;text-overflow:ellipsis;flex:none}
.c-me:hover{text-decoration:underline}
.c-why{margin:2px 2px 0;min-height:1.1em;font-size:16px;color:#b9ad96}
.c-why:empty{display:none}
.c-why.c-bad{color:#ff8a7a} .c-why.c-ok{color:var(--phos)} .c-why.c-care{color:#ffd9a0} .c-why.c-dim{color:#8f846f}
@media (max-width:640px){
  .chat{left:8px;right:auto}
  .c-box{width:calc(100vw - 110px);height:38vh;font-size:17px}
  .c-head{gap:2px}
  .c-tabs button{padding:2px 4px 1px;font-size:15px}
  .c-state{font-size:14px}
  .c-min{padding:0 4px}
  .c-me{max-width:30%;font-size:16px}
  .c-foot input{font-size:16px}
}

/* moderators: a gold badge nobody else can get (the room sets it), and their tools */
.c-badge{font-style:normal;color:#ffd24a;margin-right:4px;text-shadow:0 0 6px rgba(255,210,74,.6)}
.c-l.c-modmsg span{color:#fff3c4}
.c-ismod .c-box{border-color:#8a6a1e}
.c-act button[data-act="mban"]{color:#ff8a7a;border-color:#7a2a22}
.c-modp{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:3px 0 4px;font-size:17px;color:#ffd24a}
.c-modp span{margin-right:auto}
.c-modp button{background:none;border:1px solid #8a6a1e;color:#ffd24a;cursor:pointer;padding:0 6px;font-size:16px}
.c-modp button:hover{background:#ffd24a;color:#000}
#menu-page .modrow{display:flex;flex-wrap:wrap;gap:8px}
#menu-page .modrow button{background:var(--paper);color:#000;border:0;cursor:pointer;padding:2px 10px;font-size:20px}
#menu-page .modrow button:hover{background:#ffd24a}
#menu-page .modrow input{flex:1;min-width:0;font:inherit;font-size:20px;color:var(--paper);background:rgba(0,0,0,.55);border:1px solid #8a6a1e;padding:2px 8px;user-select:text;-webkit-user-select:text;touch-action:auto}
#menu-page #modwhy{color:#ff8a7a;min-height:1em}

@media (prefers-reduced-motion:reduce){ .plate{animation:none} .blink{animation:none} .crt.on .crt-in,.crt.off .crt-in{animation:none} }

/* THE POOL HALL: the table game inside the CRT */
.pool-wrap{display:flex;justify-content:center;margin:4px 0 6px}
.pool-cv{width:100%;max-width:880px;max-height:calc(100dvh - 250px);aspect-ratio:880/480;object-fit:contain;touch-action:none;border-radius:6px;cursor:crosshair;display:block}
.pool-stat{text-align:center;color:var(--phos);letter-spacing:.04em}
.pool-stat b{color:var(--amber, #ffc46b);font-weight:normal}
.pool-help{text-align:center;margin:4px 0 0;font-size:.8em}

/* ---------- odinOS on the west-balcony desk (js/odinos.js) ---------- */
#os{position:fixed;inset:0;z-index:36;pointer-events:none}
#os.up{background:#0A0A0A}
#os .os-shell{position:absolute;inset:0;display:flex;flex-direction:column;transform-origin:0 0;pointer-events:auto;will-change:transform,opacity;
  padding:env(safe-area-inset-top,0px) max(9px,env(safe-area-inset-right,0px)) max(9px,env(safe-area-inset-bottom,0px)) max(9px,env(safe-area-inset-left,0px));
  background:linear-gradient(180deg,#ddd3b8,#cfc4a6 40%,#bfb393);border-radius:12px;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.45),inset 0 -3px 0 rgba(0,0,0,.18)}
#os.up .os-shell{border-radius:0}
#os .os-bar{flex:none;height:36px;display:flex;align-items:center;gap:10px;padding:0 4px;font:20px/1 "VT323",ui-monospace,monospace;color:#5a5140;white-space:nowrap;overflow:hidden}
#os .os-led{flex:none;width:9px;height:9px;border-radius:50%;background:#4dff7a;box-shadow:0 0 6px #4dff7a}
#os .os-bar b{font-weight:400;color:#2a2620;letter-spacing:.04em;font-size:22px}
#os .os-where{overflow:hidden;text-overflow:ellipsis;letter-spacing:.06em}
#os .os-up{margin-left:auto;flex:none;display:flex;align-items:center;gap:8px;font:20px/1 "VT323",ui-monospace,monospace;letter-spacing:.06em;color:#ffc46b;background:#2a2620;border:0;border-radius:4px;padding:5px 12px;min-height:30px;cursor:pointer}
#os .os-up:hover,#os .os-up:focus-visible{background:#3a342a;outline:2px solid #FF5001;outline-offset:1px}
#os .os-up kbd{font:inherit;font-size:16px;color:#9a8e70;border:1px solid #5a5140;border-radius:3px;padding:1px 4px}
#os .os-glass{position:relative;flex:1;min-height:0;background:#0A0A0A;border-radius:8px;overflow:hidden;box-shadow:0 0 0 3px #2a2620,0 0 0 5px #b3a888}
#os iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#0A0A0A;display:block}
#os .os-glass::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:8px;box-shadow:inset 0 0 70px rgba(0,0,0,.32),inset 0 0 12px rgba(0,0,0,.4)}
#os .os-boot{position:absolute;inset:0;z-index:1;display:grid;place-items:center;background:#0A0A0A;transition:opacity .45s ease}
#os .os-boot.gone{opacity:0;pointer-events:none}
#os .os-logo{display:grid;justify-items:center;gap:10px;font-family:"VT323",ui-monospace,monospace}
#os .os-logo .spark{width:64px;height:auto;filter:drop-shadow(0 0 8px rgba(255,80,1,.6))}
#os .os-logo b{font-weight:400;font-size:52px;line-height:1;color:#f3efe6;text-shadow:0 0 8px rgba(243,239,230,.35)}
#os .os-logo span{font-size:20px;letter-spacing:.2em;color:#8a8478}
#os .os-load{display:block;width:180px;height:6px;background:#262626;overflow:hidden;border-radius:3px}
#os .os-load i{display:block;width:40%;height:100%;background:#FF5001;animation:osload 1.6s ease-in-out infinite}
@keyframes osload{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}
@media (pointer:coarse){#os .os-up{min-height:40px}#os .os-up kbd{display:none}}
@media (max-width:640px){#os .os-where{display:none}}
@media (prefers-reduced-motion:reduce){#os .os-shell{transition:none!important}#os .os-load i{animation:none;width:100%}}
#hud.seated{opacity:0;transition:opacity .3s;pointer-events:none}
#hud.seated *{pointer-events:none!important}
#os .os-note{margin:6px 0 0;max-width:30em;text-align:center;font-size:20px;line-height:1.25;color:#bdb6a6;padding:0 16px}
/* ODINWIRE on the east balcony desk (js/odinos.js): its own boot card, in ODINWIRE's dress */
#os[data-kind="odinwire"] .os-glass,#os[data-kind="odinwire"] .os-boot,#os[data-kind="odinwire"] iframe{background:#000}
#os .os-logo b.ow-mark{font:italic 900 48px/1 "Arial Black",Arial,sans-serif;letter-spacing:-.04em;color:#FF5001;text-shadow:none}
#os .os-logo b.ow-mark span{font:inherit;letter-spacing:inherit;color:#fff}
#os[data-kind="odinwire"] .os-load{height:10px;border:1px solid #666;background:#111;border-radius:0;padding:1px}
#os[data-kind="odinwire"] .os-load i{background:repeating-linear-gradient(90deg,#FF5001 0 7px,transparent 7px 9px)}

/* ---------- THE CIGAR BAR: the humidor card (cigars.js) ---------- */
#hum{position:fixed;inset:0;z-index:32;display:flex;align-items:center;justify-content:center;padding:max(12px,env(safe-area-inset-top,0px)) 12px max(12px,env(safe-area-inset-bottom,0px));background:rgba(8,4,2,.5);font-family:"VT323",ui-monospace,monospace;animation:humin .28s ease-out}
#hum.out{animation:humout .26s ease-in forwards}
@keyframes humin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes humout{to{opacity:0;transform:translateY(8px)}}
#hum .hum-box{width:min(920px,100%);max-height:calc(100dvh - 24px);display:flex;flex-direction:column;border-radius:10px;overflow:hidden;color:#efe0c0;
  background:linear-gradient(180deg,#3b2414 0,#2a180c 100%);box-shadow:0 0 0 3px #1a0e06,0 0 0 5px #b08a3e,0 18px 60px rgba(0,0,0,.6)}
#hum .hum-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 20px 6px;border-bottom:1px solid rgba(176,138,62,.35)}
#hum .hum-head b{font-weight:400;font-size:34px;letter-spacing:.08em;color:#ffc46b;text-shadow:0 0 10px rgba(255,160,60,.35)}
#hum .hum-head span{font-size:18px;letter-spacing:.14em;color:#b89868}
#hum .hum-lede{margin:8px 20px 6px;font-size:19px;line-height:1.2;color:#cdb890}
#hum .hum-list{list-style:none;margin:0;padding:4px 12px 8px;overflow:auto;flex:1;min-height:0}
#hum .hum-row{width:100%;display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr) auto;align-items:center;gap:6px 16px;padding:6px 10px;margin:2px 0;
  font:inherit;color:inherit;text-align:left;background:transparent;border:1px solid transparent;border-radius:6px;cursor:pointer}
#hum .hum-row canvas{width:100%;max-width:300px;height:auto;aspect-ratio:420/54;display:block}
#hum .hum-row.sel,#hum .hum-row:hover{background:rgba(255,196,107,.08);border-color:rgba(176,138,62,.55)}
#hum .hum-row.sel{box-shadow:inset 3px 0 0 #ffc46b}
#hum .hum-txt{display:flex;flex-direction:column;min-width:0;line-height:1.08}
#hum .hum-txt b{font-weight:400;font-size:24px;letter-spacing:.05em;color:#ffe2a8}
#hum .hum-spec{font-size:16px;letter-spacing:.06em;color:#b89868}
#hum .hum-notes{font-size:17px;letter-spacing:.04em;color:#d8c49c}
#hum .hum-txt em{font-style:normal;font-size:17px;color:#a08868}
#hum .hum-str{display:flex;flex-direction:column;align-items:flex-end;font-size:15px;letter-spacing:.08em;color:#b89868;white-space:nowrap}
#hum .hum-str i{font-style:normal;font-size:18px;color:#ffc46b;letter-spacing:.1em}
#hum .hum-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;padding:8px 16px 12px;border-top:1px solid rgba(176,138,62,.35)}
#hum .hum-say{font-size:19px;letter-spacing:.05em;color:#ffc46b;min-height:1.2em}
#hum .hum-x{flex:none;margin-left:auto;font:inherit;font-size:19px;letter-spacing:.06em;color:#2a180c;background:#ffc46b;border:0;border-radius:4px;padding:5px 12px;min-height:34px;cursor:pointer}
@media (max-width:700px){
  #hum .hum-row{grid-template-columns:1fr auto;gap:2px 10px}
  #hum .hum-row canvas{grid-column:1/-1;max-width:260px}
  #hum .hum-txt em{display:none}
  #hum .hum-head b{font-size:28px}
  #hum .hum-say{font-size:17px}
}
/* ---------- THE SMOKE ROOM: the bar at the foot of the screen while you sit ---------- */
#seat{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:20;display:flex;align-items:center;gap:12px;max-width:calc(100vw - 24px);
  padding:8px 10px 8px 14px;border-radius:8px;background:rgba(26,14,6,.88);box-shadow:0 0 0 2px #1a0e06,0 0 0 3px #b08a3e;font-family:"VT323",ui-monospace,monospace;color:#efe0c0}
#seat canvas{width:150px;height:auto;aspect-ratio:200/30;flex:none}
#seat .seat-txt{display:flex;flex-direction:column;line-height:1.05;min-width:0;flex:1 1 auto}
#seat .seat-txt b{font-weight:400;font-size:21px;letter-spacing:.05em;color:#ffe2a8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#seat .seat-txt span{font-size:15px;letter-spacing:.06em;color:#b89868;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#seat button{flex:none;font:inherit;font-size:19px;letter-spacing:.06em;border:0;border-radius:4px;padding:5px 12px;min-height:34px;cursor:pointer;color:#2a180c;background:#ffc46b}
#seat button[data-act="up"]{color:#ffc46b;background:#3a2414}
#seat kbd{font:inherit;font-size:15px;border:1px solid currentColor;border-radius:3px;padding:0 4px;opacity:.7}
@media (pointer:coarse){#seat button{min-height:42px}}
@media (max-width:560px){#seat canvas{display:none}#seat .seat-txt span{display:none}}
@media (prefers-reduced-motion:reduce){#hum,#hum.out{animation:none}}

/* ---------- THE BOOT (js/boot.js), 1 Oct 2026 ---------- */
.boot{position:fixed;inset:0;z-index:200;background:#000;display:grid;place-items:center;overflow:hidden;color:#fff;outline:none;cursor:default;
  transition:opacity .8s ease}
.boot>*{grid-area:1/1}
.boot::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 1px,transparent 1px 3px),
  radial-gradient(ellipse 80% 70% at 50% 50%,transparent 55%,rgba(0,0,0,.7) 100%)}
.boot-c{display:grid;justify-items:center;gap:14px;text-align:center;padding:0 16px}
.boot-mark,.boot-name,.boot-presents,.boot-load{opacity:0}
.boot-spark{width:clamp(70px,11vw,110px);height:auto;display:block}
.boot-name{font-family:var(--logo);font-weight:800;font-size:clamp(20px,3.6vw,38px);letter-spacing:.32em;padding-left:.32em;color:#fff;
  text-shadow:0 0 18px rgba(255,120,40,.35)}
.boot-presents{font-size:clamp(17px,2vw,22px);letter-spacing:.7em;padding-left:.7em;color:#b9ad96}
.boot-press{display:grid;justify-items:center;gap:8px;font-size:clamp(24px,3.4vw,34px);letter-spacing:.18em;color:#fff;
  text-shadow:0 0 12px rgba(255,196,107,.8),0 0 2px #fff;transition:opacity .6s ease;text-align:center;padding:0 16px;opacity:0}
.boot.prompt .boot-press{opacity:1}
.boot.prompt{cursor:pointer}
.boot-press small{font-size:16px;letter-spacing:.14em;color:#8f8676;text-shadow:none}
.boot-press .t{display:none}
@media (pointer:coarse){.boot-press .k{display:none}.boot-press .t{display:inline}}
.boot.on{cursor:default}
.boot.on .boot-press{opacity:0}
.boot-crt{width:100%;height:100%;background:#fff6e2;opacity:0;pointer-events:none;transform:scale(0,.004)}
.boot.on .boot-crt{animation:bootcrt .55s ease-out forwards}
@keyframes bootcrt{0%{opacity:1;transform:scale(0,.004)}35%{opacity:1;transform:scale(1,.004)}62%{opacity:.85;transform:scale(1,1)}100%{opacity:0;transform:scale(1,1)}}
.boot.logo .boot-mark{animation:bootignite 1.4s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes bootignite{0%{opacity:0;transform:scale(.7);filter:blur(10px) brightness(3)}45%{opacity:1;filter:blur(0) brightness(1.8) drop-shadow(0 0 30px #ff5001)}
  100%{opacity:1;transform:scale(1);filter:drop-shadow(0 0 16px rgba(255,80,1,.6))}}
.boot.name .boot-name{animation:bootname 1.3s ease-out forwards}
@keyframes bootname{from{opacity:0;letter-spacing:.7em}to{opacity:1;letter-spacing:.32em}}
.boot.presents .boot-presents{animation:bootin 1s ease-out forwards}
@keyframes bootin{from{opacity:0}to{opacity:1}}
.boot.loading .boot-c{transition:opacity .6s;opacity:0}
.boot-load{align-self:end;justify-self:end;margin:0 calc(22px + env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) 0;
  display:flex;align-items:center;gap:12px;font-size:22px;letter-spacing:.2em;color:#d8cdb6;transition:opacity .4s}
.boot.loading .boot-load,.boot.pre .boot-load{opacity:1}
.boot.pre .bl-t{display:none}
.boot-disc{width:26px;height:26px;border-radius:50%;background:conic-gradient(#ff5001,#ffc46b,#7cff9b,#6bb8ff,#c86bff,#ff5001);
  -webkit-mask:radial-gradient(circle,transparent 3px,#000 4px);mask:radial-gradient(circle,transparent 3px,#000 4px);animation:bootspin .5s linear infinite}
@keyframes bootspin{to{transform:rotate(360deg)}}
.boot-dots::after{content:'...';animation:bootdots 1.4s ease-in-out infinite}
@keyframes bootdots{0%,100%{opacity:.25}50%{opacity:1}}
.boot-flash{background:#fff;opacity:0;width:100%;height:100%;pointer-events:none}
.boot.flash .boot-flash{animation:bootflash .45s ease-out}
@keyframes bootflash{0%{opacity:0}15%{opacity:.85}100%{opacity:0}}
.boot.flash{background:transparent}
.boot.flash .boot-load{opacity:0}
.boot.gone{opacity:0;pointer-events:none}
/* failsafe: if js/boot.js never ran (it marks the screen 'alive'), the boot screen gets out of the way after 6 s */
.boot:not(.alive){animation:bootfailsafe .4s 6s forwards}
@keyframes bootfailsafe{to{opacity:0;visibility:hidden;pointer-events:none}}
@media (prefers-reduced-motion:reduce){.boot.on .boot-crt{animation:none}.boot.flash .boot-flash{animation:none}.boot-disc{animation-duration:2s}}