[hidden]{display:none!important}
:root{--fg:#39ff7a;--dim:#1f9e4c;--faint:#0f4a26;--bg:#030a05;--hi:#c8ffd8;--warn:#ffb347;--say:#e8ffe8;--event:#ffd27a;--panel:#06140b}
body.amber{--fg:#ffb000;--dim:#b37400;--faint:#4a3000;--bg:#0a0600;--hi:#ffe2a8;--say:#fff2d6;--event:#ff8f5a;--panel:#140d02}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--fg);font-family:"IBM Plex Mono","DejaVu Sans Mono",Menlo,Consolas,monospace;font-size:15px;line-height:1.35}
body::after{content:"";position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px);mix-blend-mode:multiply;z-index:50}
body::before{content:"";position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 120px rgba(0,0,0,.85);z-index:49}
.glow{text-shadow:0 0 6px color-mix(in srgb,var(--fg) 55%,transparent)}
a{color:var(--hi)}
button,input,textarea,select{font:inherit;color:var(--fg);background:var(--panel);border:1px solid var(--dim);border-radius:0}
button{cursor:pointer;padding:6px 10px}
button:hover,button:focus-visible{background:var(--fg);color:var(--bg);outline:none}
input:focus,textarea:focus{outline:1px solid var(--fg)}
pre{margin:0;white-space:pre;font:inherit}
.app>*{min-width:0}
.app{display:grid;height:100dvh;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-rows:auto minmax(0,1fr) auto;gap:0}
header{grid-column:1/-1;display:flex;gap:12px;align-items:center;padding:6px 12px;border-bottom:1px solid var(--faint);white-space:nowrap;overflow:hidden}
header .title{font-weight:bold;letter-spacing:.12em}
header .clock{color:var(--hi)}
header .sp{flex:1}
header button{padding:2px 8px;font-size:13px}
#mapPane{border-right:1px solid var(--faint);overflow:auto;padding:10px;display:flex;flex-direction:column;gap:8px}
#map{color:var(--fg);font-size:13px;line-height:1.15}
#here{color:var(--dim);font-size:13px;white-space:pre-wrap}
#log{overflow-y:auto;padding:10px 14px;white-space:pre-wrap;word-wrap:break-word}
#log .l{margin:0 0 6px}
#log .me{color:var(--dim)}
#log .out{color:var(--fg)}
#log .say,#log .tell{color:var(--say)}
#log .tell{font-style:italic}
#log .event{color:var(--event)}
#log .clock{color:var(--hi);opacity:.85;text-align:center;margin:10px 0}
#log .err{color:var(--warn)}
#log .sys{color:var(--dim)}
#log pre{overflow-x:auto}
.thinking{color:var(--dim);padding:0 14px 4px;min-height:1.3em;font-size:13px}
.bar{grid-column:1/-1;border-top:1px solid var(--faint);padding:8px 10px calc(8px + env(safe-area-inset-bottom))}
.quick{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
.quick button{flex:0 0 auto;font-size:13px;padding:4px 9px}
.row{display:flex;gap:8px;align-items:center}
.prompt{color:var(--hi)}
#cmd{flex:1;min-width:0;padding:9px;font-size:16px;background:transparent;border:1px solid var(--faint)}
.join{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:30;background:var(--bg);padding:16px;overflow:auto}
.join .box{max-width:760px;width:100%}
.join pre.banner{font-size:clamp(7px,1.9vw,15px);color:var(--fg)}
.join p{color:var(--dim);max-width:62ch}
.join .row{margin-top:14px}
.join input{flex:1;padding:10px;font-size:16px}
.join .err{color:var(--warn);min-height:1.3em}
.tag{display:inline-block;border:1px solid var(--warn);color:var(--warn);padding:0 6px;font-size:12px;letter-spacing:.08em}
.cursor::after{content:"█";animation:blink 1s steps(1) infinite;margin-left:2px}
@keyframes blink{50%{opacity:0}}
@media (max-width:760px){
  html,body{font-size:14px}
  .app{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto}
  #mapPane{border-right:0;border-bottom:1px solid var(--faint);max-height:34dvh;padding:6px 8px}
  #mapPane.collapsed #map,#mapPane.collapsed #here{display:none}
  #here{display:none}
  header{padding:5px 8px;gap:8px}
  header .wname{display:none}
}
@media (min-width:761px){#mapToggle{display:none}}
