/* GALAXY - a mainframe console: phosphor on dark glass, fanfold paper for the
   printout. Everything is monospace because everything in 1971 was. */
:root{
  --paper:#04120c;
  --ink:#5bff9a;
  --dim:#1f6b45;
  --warm:#ffc65b;
  --hot:#ff7a6b;
  --panel:#07190f;
  --edge:#164a30;
  --sheet:#0a2015;
  --text:#bdf3d4;
  --mono:"DejaVu Sans Mono","Liberation Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  background:var(--paper);
  color:var(--text);
  font-family:var(--mono);
  font-size:13px;
  overflow:hidden;
  -webkit-text-size-adjust:100%;
}
#app{display:flex;flex-direction:column;height:100%}

#masthead{
  display:flex;align-items:center;gap:12px;
  padding:7px 12px;
  border-bottom:1px solid var(--edge);
  background:linear-gradient(180deg,#0b2416,#061a10);
  flex:0 0 auto;flex-wrap:wrap;
}
#masthead .brand{
  font-weight:700;letter-spacing:.34em;color:var(--ink);
  text-shadow:0 0 9px rgba(91,255,154,.55);
}
#mast-turn{color:var(--warm)}
#mast-score{color:#8fd8b2;font-size:12px}
.grow{flex:1 1 auto}

.chip{
  font-family:var(--mono);font-size:11px;letter-spacing:.09em;
  background:#0d2c1c;color:var(--text);
  border:1px solid var(--edge);border-radius:2px;
  padding:5px 9px;cursor:pointer;
}
.chip:hover{border-color:var(--ink);color:#fff}
.chip.on{background:#14472c;border-color:var(--ink);color:#eaffe8}
.chip.go{background:#17532f;border-color:#3fd888;color:#e9fff0;font-weight:700}
.mini{
  font-family:var(--mono);font-size:11px;background:#0d2c1c;color:var(--text);
  border:1px solid var(--edge);border-radius:2px;padding:3px 8px;cursor:pointer;margin-right:5px;
}
.mini.on{background:#14472c;border-color:var(--ink);color:#fff}

#body{display:flex;flex:1 1 auto;min-height:0}
#board{position:relative;flex:1 1 auto;min-width:0;overflow:hidden;background:var(--paper)}
#chart{position:absolute;left:0;top:0;display:block;touch-action:none;cursor:crosshair}
#card{
  position:absolute;display:none;pointer-events:none;
  background:rgba(4,20,12,.94);border:1px solid var(--ink);
  padding:7px 9px;font-size:11px;line-height:1.5;max-width:250px;
  box-shadow:0 0 16px rgba(0,0,0,.7);z-index:5;
}
#card .ct{color:var(--ink);font-weight:700;letter-spacing:.11em}
#card .ct2{color:var(--warm);margin-top:3px}

#console{
  flex:0 0 428px;max-width:52%;
  display:flex;flex-direction:column;min-height:0;
  border-left:1px solid var(--edge);background:var(--panel);
}
#key{
  display:flex;flex-wrap:wrap;gap:9px;align-items:center;
  padding:7px 10px;border-bottom:1px solid var(--edge);font-size:10px;
}
#key .sw{display:inline-flex;align-items:center;gap:4px;letter-spacing:.06em}
#key .dot{width:9px;height:9px;border-radius:50%;display:inline-block}
#key .sep{width:1px;height:13px;background:var(--edge);margin:0 3px}

#modes{display:flex;gap:6px;align-items:center;padding:7px 10px;border-bottom:1px solid var(--edge);flex-wrap:wrap}
.note{font-size:10px;color:#5f9d7d}

#tabs{display:flex;flex-wrap:wrap;gap:2px;padding:6px 8px;border-bottom:1px solid var(--edge)}
.tab{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;
  background:transparent;color:#79bb96;border:1px solid transparent;
  padding:4px 7px;cursor:pointer;border-radius:2px;
}
.tab:hover{color:#fff}
.tab.on{background:#12402a;border-color:var(--edge);color:#eaffe8}

#pane{flex:1 1 auto;overflow:auto;padding:9px 11px;min-height:0}
.sheet{
  margin:0 0 9px;white-space:pre;font-family:var(--mono);font-size:11.5px;line-height:1.55;
  color:#cdf6de;
  background:repeating-linear-gradient(180deg,var(--sheet),var(--sheet) 18px,#0c2718 18px,#0c2718 36px);
  border:1px solid var(--edge);padding:8px 10px;overflow-x:auto;
}
.rowbar{display:flex;align-items:center;gap:6px;margin-bottom:7px;flex-wrap:wrap}
.alloc{border:1px solid var(--edge);padding:8px 10px;background:#08200f}
.alloc .hd{color:var(--ink);letter-spacing:.14em;font-size:10.5px;margin-bottom:6px}
.slider{display:grid;grid-template-columns:78px 1fr 42px;align-items:center;gap:7px;margin-bottom:5px}
.slider .lab{font-size:10.5px;letter-spacing:.07em;color:#9fdcbb}
.slider .val{font-size:10.5px;text-align:right;color:var(--warm)}
.slider .note{grid-column:1/-1;margin-top:-3px}
.rng{width:100%;accent-color:#3fd888;height:16px}

#msg{
  padding:6px 11px;font-size:11px;color:var(--warm);
  border-top:1px solid var(--edge);min-height:26px;
}
#orderbar{display:flex;align-items:center;gap:6px;padding:8px 10px;border-top:1px solid var(--edge)}
#orderbar .prompt{color:var(--ink);font-weight:700}
#order{
  flex:1 1 auto;min-width:0;background:#03150c;color:#dcffe9;
  border:1px solid var(--edge);padding:7px 8px;font-family:var(--mono);font-size:12px;
  text-transform:uppercase;
}
#order:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 1px rgba(91,255,154,.28)}

#setup,#endsheet,#reviewsheet{
  position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(2,10,6,.9);z-index:20;padding:18px;overflow:auto;
}
#setup[hidden],#endsheet[hidden],#reviewsheet[hidden]{display:none}
.sheetbox{
  width:min(620px,100%);background:var(--panel);border:1px solid var(--ink);
  padding:22px;box-shadow:0 0 44px rgba(0,0,0,.8);
}
.sheetbox h1{
  margin:0 0 6px;font-size:23px;letter-spacing:.4em;color:var(--ink);
  text-shadow:0 0 13px rgba(91,255,154,.4);
}
.sheetbox .sub{margin:0 0 15px;font-size:12px;line-height:1.6;color:#93c9ac}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.opts label{display:flex;flex-direction:column;gap:4px;font-size:10.5px;letter-spacing:.1em;color:#8fcbaa}
.opts select,.opts input{
  background:#03150c;color:#dcffe9;border:1px solid var(--edge);
  padding:6px 7px;font-family:var(--mono);font-size:12px;
}
.warn{color:var(--warm);font-size:11px;min-height:15px;margin:11px 0 0}
.btns{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
#end-body{
  white-space:pre;font-family:var(--mono);font-size:12px;line-height:1.6;
  background:var(--sheet);border:1px solid var(--edge);padding:11px;overflow-x:auto;
}

@media (max-width:900px){
  #body{flex-direction:column}
  #console{flex:1 1 auto;max-width:none;border-left:none;border-top:1px solid var(--edge)}
  #board{flex:0 0 46%}
  .opts{grid-template-columns:1fr}
}


/* v2.1.1 usability controls */
.linkchip{display:inline-flex;align-items:center;text-decoration:none;color:inherit}
#savesheet{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(2,10,6,.9);z-index:25;padding:18px;overflow:auto}
#savesheet[hidden]{display:none}
.save-list{display:grid;gap:8px;margin-top:12px}
.save-row{display:grid;grid-template-columns:minmax(110px,1fr) 2fr auto auto auto;gap:7px;align-items:center;border:1px solid var(--edge);padding:8px;background:var(--sheet)}
.save-row .meta{font-size:10.5px;color:#93c9ac;line-height:1.4}
.save-tools{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.filechip{position:relative;overflow:hidden;cursor:pointer}
.filechip input{position:absolute;inset:0;opacity:0;cursor:pointer}
.legacy-actions{margin-top:8px}
#btn-audio.off{opacity:.55;text-decoration:line-through}
@media (max-width:700px){
  #masthead{gap:3px;flex-wrap:wrap;height:auto;min-height:38px}
  .save-row{grid-template-columns:1fr 1fr}.save-row .meta{grid-column:1/-1}
  .save-row .slot-name{grid-column:1/-1}
}

.audio-level{display:flex;align-items:center;gap:7px;font-size:10.5px;color:#93c9ac;border:1px solid var(--edge);padding:4px 7px}.audio-level input{width:110px}

/* v2.1.1 save import target */
.import-target{display:inline-flex;align-items:center;gap:.45rem;font:inherit;color:inherit}.import-target select{font:inherit;background:#0b1014;color:inherit;border:1px solid currentColor;padding:.35rem .45rem}


/* v2.2.0 strategic map and workflow */
.overlay-control{display:inline-flex;align-items:center;gap:5px;font-size:10px;letter-spacing:.07em;color:#93c9ac;border:1px solid var(--edge);padding:3px 6px;background:#0d2c1c}
.overlay-control select{font:inherit;background:#03150c;color:#dcffe9;border:0;outline:none;padding:2px}
.eventlog{position:absolute;left:10px;top:10px;z-index:4;max-width:min(460px,70%);pointer-events:none;background:rgba(3,18,12,.88);border:1px solid rgba(91,255,154,.35);padding:6px 9px;font-size:10.5px;line-height:1.45;color:#9fdcbb;display:none;box-shadow:0 0 14px rgba(0,0,0,.45)}
.eventlog.show{display:block}.eventlog strong{color:var(--warm)}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}.detail-card{border:1px solid var(--edge);background:#08200f;padding:8px}.detail-card h3{margin:0 0 6px;color:var(--ink);font-size:10.5px;letter-spacing:.12em}.detail-card .kv{display:grid;grid-template-columns:1fr auto;gap:4px 8px;font-size:10.5px}.detail-card .kv b{color:var(--warm);font-weight:400}.action-buttons{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
@media(max-width:700px){.overlay-control{order:3}.detail-grid{grid-template-columns:1fr}.eventlog{max-width:92%}}

/* v2.4.0 diplomacy and notification controls */
.eventlog{display:flex;flex-direction:column;gap:4px;max-width:min(520px,70vw)}
.event-item{font:inherit;text-align:left;border:1px solid rgba(255,255,255,.22);background:rgba(0,0,0,.7);color:inherit;padding:5px 8px;cursor:pointer}
.event-item:hover,.event-item:focus{border-color:currentColor;outline:none}
.detail-card .action-buttons{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}

/* v2.9 Galactic Society */
.notice-card{display:block;width:100%;text-align:left;color:inherit;background:var(--sheet);font-family:var(--mono);cursor:pointer;margin:7px 0}
.notice-card:hover{border-color:var(--ink)}
.crisis-decision{border-top:1px solid var(--edge);padding-top:7px;margin-top:7px}
/* v3.0 Galactic Age - unified command sidebar */
.command-sidebar{position:fixed;z-index:60;right:-390px;top:0;width:min(380px,92vw);height:100vh;background:rgba(7,18,14,.98);border-left:1px solid rgba(112,237,161,.45);box-shadow:-10px 0 30px rgba(0,0,0,.42);padding:12px;box-sizing:border-box;overflow:auto;transition:right .18s ease;color:#a9efc6;font:12px/1.45 "DejaVu Sans Mono",monospace}.command-sidebar.open{right:0}.command-sidebar-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(112,237,161,.25);padding-bottom:9px;margin-bottom:8px}.command-zoom{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 12px}.command-sidebar section{border:1px solid rgba(112,237,161,.20);padding:9px;margin:0 0 9px;background:rgba(37,70,52,.13)}.command-sidebar h3{font-size:12px;letter-spacing:.08em;margin:0 0 8px;color:#d7ffe6}.cmd-kv{display:grid;grid-template-columns:1fr auto;gap:5px 10px}.cmd-kv b{text-align:right;color:#eafff0}.cmd-line{padding:5px 0;border-top:1px dotted rgba(112,237,161,.18)}.cmd-line:first-child{border-top:0}
@media(max-width:900px){.command-sidebar{width:92vw}.overlay-control{max-width:175px}}