/* TIFE terminal theme — v1.3 standard screen.
   Green phosphor default; amber via body[data-theme=amber]; per-game accent
   via --g override (game.skin.accent). Layout: status / [location|story|player]
   / context-action bands / quick row. Below 1000px the sidebars yield to the
   bands (movement band = exits, inventory band = pack), which scroll
   horizontally — the story always reads first. */
:root{--g:#19f58b;--g2:#86ffc0;--dim:#4c9b75;--line:#08733f;--bg:#010503;--panel:#04100b;--muted:#87b89e}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#000;color:var(--g);font-family:Consolas,"Courier New",monospace}
button,input{font:inherit}
body[data-textsize=s]{font-size:13px}body[data-textsize=l]{font-size:18px}
body[data-theme=amber]{--g:#ffb000;--g2:#ffd766;--dim:#9a7420;--line:#5a3f08;--bg:#050301;--panel:#100a04;--muted:#c9ae7a}

.tife-shell{height:100vh;display:grid;grid-template-rows:46px minmax(0,1fr) auto 46px;background:radial-gradient(circle at 55% 40%,#06130d 0,var(--bg) 48%,#000 100%)}
body[data-theme=amber] .tife-shell{background:radial-gradient(circle at 55% 40%,#130d06 0,var(--bg) 48%,#000 100%)}

/* status bar */
.statusbar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:0 16px;border:1px solid var(--line);background:rgba(3,10,7,.96)}
.brand{font-weight:900;letter-spacing:.12em;color:var(--g2);text-shadow:0 0 8px var(--g);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.statusbar .sep{color:var(--dim);font-weight:400}
.status-right{display:flex;gap:8px;align-items:center;white-space:nowrap;color:var(--muted)}
.status-right b{color:var(--g2)}

/* main grid */
.main-grid{min-height:0;display:grid;grid-template-columns:230px minmax(420px,1fr) 250px;gap:10px;padding:10px;border-left:1px solid var(--line);border-right:1px solid var(--line)}
.pane{min-height:0;display:grid;gap:8px;align-content:start}
.pane-left{grid-template-rows:auto 1fr}
.pane-right{grid-template-rows:auto 1fr}
.pane-center{grid-template-rows:26px minmax(0,1fr) 48px;border:1px solid var(--line);background:#000}
.story-label{margin:0;padding:5px 12px 0;font-size:11px;letter-spacing:.14em;color:var(--dim);border-bottom:1px solid var(--line)}
.panel{border:1px solid var(--line);background:linear-gradient(180deg,rgba(5,19,13,.9),rgba(1,8,5,.9));padding:10px;overflow:auto;box-shadow:inset 0 0 22px rgba(0,255,130,.025);min-height:0}
.panel h2{margin:0 0 8px;padding-bottom:6px;border-bottom:1px solid var(--line);font-size:13px;letter-spacing:.08em}
.panel p{margin:7px 0 0;color:var(--muted);font-size:12px;line-height:1.35}
#exit-list{display:grid;gap:5px}
#exit-list button{border:0;background:none;color:var(--g);text-align:left;padding:3px;cursor:pointer;width:100%}
#exit-list button:hover{color:var(--g2)}

/* story window */
.screen{overflow-y:auto;padding:22px 24px;font-size:14px;line-height:1.55;white-space:pre-wrap;text-shadow:0 0 6px rgba(25,245,139,.45);background:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) 1px,transparent 1px,transparent 4px),#000}
body[data-theme=amber] .screen{text-shadow:0 0 6px rgba(255,176,0,.45)}
.output{margin:0 0 16px}
.output.title{font-weight:bold;color:var(--g2)}
.output.command{color:#c3ffe1}
body[data-theme=amber] .output.command{color:#ffe9bf}
.output.system{color:#57c68c}
body[data-theme=amber] .output.system{color:#d8a545}
.output.error{color:#ffe36c}
.output.prompt{color:var(--dim);font-style:italic;margin:4px 0 0}
.command-line{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;border-top:1px solid var(--line);padding:7px 12px;background:rgba(7,16,13,.9)}
.command-line span{font-size:20px;color:var(--g2)}
.command-line input{width:100%;background:rgba(2,8,6,.9);border:1px solid var(--line);color:var(--g);padding:8px;outline:none}
.command-line input:focus{border-color:var(--g)}
.command-line button,.quickrow button,.dialog-head button,#dialog-body button,.band-row button{color:var(--g);background:#03130c;border:1px solid var(--line);padding:8px 12px;cursor:pointer}
body[data-theme=amber] .command-line button,body[data-theme=amber] .quickrow button,body[data-theme=amber] #dialog-body button,body[data-theme=amber] .band-row button{background:#130d04}
.band-row button:hover,.quickrow button:hover,#dialog-body button:hover{background:#0b3824;color:#c8ffe3}
body[data-theme=amber] .band-row button:hover,body[data-theme=amber] .quickrow button:hover,body[data-theme=amber] #dialog-body button:hover{background:#3a2a08;color:#ffe9bf}

/* context-action bands */
.context-actions{border-left:1px solid var(--line);border-right:1px solid var(--line);background:linear-gradient(180deg,#03100b,#020805);padding:8px 14px 10px;max-height:34vh;overflow-y:auto}
body[data-theme=amber] .context-actions{background:linear-gradient(180deg,#100b03,#080502)}
.ca-title{margin:0 0 6px;font-size:11px;letter-spacing:.14em;color:var(--dim)}
.band{margin-bottom:6px}
.band[hidden]{display:none}
.band h3{margin:4px 0 5px;font-size:10px;letter-spacing:.1em;color:var(--dim);text-transform:uppercase}
.band-row{display:flex;flex-wrap:wrap;gap:7px}
.band-row button{padding:7px 12px}

/* quick row */
.quickrow{display:flex;justify-content:center;align-items:center;gap:14px;border:1px solid var(--line);background:#030806}
body[data-theme=amber] .quickrow{background:#080603}
.quickrow button{min-width:110px}

/* meters & panel rows */
.meter{margin-bottom:9px;font-size:12px}
.meter span{color:var(--muted)}
.meter .meter-val{float:right;color:var(--g2)}
.progress{height:5px;background:#0b2118;margin:4px 0;clear:both}
body[data-theme=amber] .progress{background:#211a0b}
.progress i{display:block;height:100%;background:var(--g)}
#inventory-panel .row button{border:0;background:none;color:var(--g);padding:2px 0;cursor:pointer;text-align:left;width:100%}
#inventory-panel .row button:hover{color:var(--g2)}
.row{padding:5px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.45}
.locked{color:#688376}
.complete{color:var(--g2)}

/* dialog */
dialog{width:min(780px,92vw);max-height:82vh;background:#020906;color:var(--g);border:1px solid var(--g);padding:0}
body[data-theme=amber] dialog{background:#090602}
.dialog-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:10px 14px}
.dialog-head h2{margin:0;font-size:15px}
#dialog-body{padding:16px;max-height:65vh;overflow:auto;white-space:normal}
#dialog-body pre{white-space:pre;overflow-x:auto}
#dialog-body pre.map{display:grid;place-items:center;text-align:center}
#dialog-body .row{border-bottom:1px solid var(--line)}
#dialog-body button.active{background:var(--g);color:#000}
.tabrow{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.save-row{padding:8px 0;border-bottom:1px solid var(--line)}

/* responsive: story first, sidebars yield to the bands */
@media(max-width:1000px){
  .tife-shell{height:100dvh;grid-template-rows:44px minmax(0,1fr) auto 44px}
  .main-grid{grid-template-columns:1fr;padding:8px;gap:8px}
  .pane-left,.pane-right{display:none}
  .context-actions{max-height:38vh}
  .band-row{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
  .band-row button{white-space:nowrap;flex:0 0 auto}
  .quickrow{gap:6px;padding:0 6px}
  .quickrow button{min-width:0;flex:1;padding:8px 4px;font-size:12px}
  .status-right span:nth-child(-n+2){display:none} /* keep Score · time */
}