*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --green:     #78d872;
  --green-dim: #4f9950;
  --green-lo:  #162115;
  --amber:     #e29a3f;
  --sand:      #d9b98f;
  --cyan:      #89b1bb;
  --orange:    #e07048;
  --red:       #cf5538;
  --bg:        #090807;
  --bg2:       #130f0c;
  --bg3:       #1d1611;
  --border:    #3d2b1c;
  --border-hi: #6e4722;
  --text:      #ddd1bc;
  --text-dim:  #8c775f;
  --font:      'Share Tech Mono', 'Courier New', monospace;
  --sprawl:    #ff4a6b;
}

html, body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  height: 100%;
  overflow: hidden;
}

/* CRT scanlines */
body::after {
  content: '';
  position: fixed; inset: 0;
  background: repeating-linear-gradient(
    0deg, transparent, transparent 2px,
    rgba(0,0,0,0.05) 2px, rgba(0,0,0,0.05) 4px
  );
  pointer-events: none; z-index: 9999;
}

/* ── Shell: titlebar | [sidebar | map+graph | profile] | statusbar ── */
#shell {
  display: grid;
  grid-template-rows: 26px 1fr 20px;
  grid-template-columns: 240px 1fr 200px;
  height: 100vh;
  gap: 1px;
  background: linear-gradient(180deg, rgba(57,39,24,0.88), rgba(22,16,11,0.96));
}
#shell.hidden { display: none; }

/* Title bar */
#titlebar {
  grid-column: 1 / -1; grid-row: 1;
  display: flex; align-items: center; gap: 10px; padding: 0 12px;
  background: linear-gradient(180deg, rgba(38,27,19,0.96), rgba(18,14,11,0.96));
  border-bottom: 1px solid var(--border-hi);
  font-size: 11px; letter-spacing: 2px; color: var(--text-dim);
}
.logo  {
  display: inline-block;
  padding: 1px 8px 0;
  border-left: 2px solid rgba(226,154,63,0.42);
  border-right: 2px solid rgba(226,154,63,0.42);
  background: linear-gradient(180deg, rgba(41,29,20,0.92), rgba(18,13,10,0.96));
  box-shadow: inset 0 1px 0 rgba(255,220,176,0.06), inset 0 -1px 0 rgba(0,0,0,0.34);
  font-family: 'VT323', monospace;
  font-size: 16px;
  color: var(--amber);
  letter-spacing: 3px;
  text-shadow: 0 0 6px rgba(226,154,63,0.22);
}
.sep   { color: var(--text-dim); }
#title-area { color: var(--text); }
#conn-status { margin-left: auto; display: flex; align-items: center; gap: 6px; }
#conn-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--text-dim); transition: background .3s; }
#conn-dot.connected  { background: var(--green); box-shadow: 0 0 6px rgba(120,216,114,0.38); }
#conn-dot.connecting { background: var(--amber); animation: blink .6s infinite; }
#conn-dot.error      { background: var(--red); }

/* ── Titlebar HQ run tags ── */
.hq-tb-tag { border: 1px solid currentColor; font-size: 8px; padding: 1px 6px; letter-spacing: 1px; }
.hq-tb-amber { color: var(--amber); }
.hq-tb-red   { color: var(--red); }
.hq-tb-cyan  { color: var(--cyan); }
.hq-tb-dim   { color: var(--text-dim); }

/* ── HQ run info bar ── */
#hq-infobar {
  display: none;
  align-items: center; gap: 16px; padding: 0 14px;
  height: 30px; border-bottom: 1px solid var(--border-hi);
  background: var(--bg2);
  box-shadow: inset 0 -1px 0 rgba(110,71,34,0.15), inset 0 1px 0 rgba(221,209,188,0.04);
  font-size: 10px; letter-spacing: 1px; flex-shrink: 0;
}
.hq-ib-label      { color: var(--text-dim); margin-right: 3px; font-size: 9px; }
.hq-ib-val        { color: var(--text); }
.hq-ib-area-field { color: var(--text-dim); font-size: 9px; }
.hq-ib-node       { color: var(--text); font-size: 12px; }
.hq-ib-money      { color: var(--sand); font-size: 13px; font-weight: bold; }
.hq-ib-susp       { color: var(--amber); }
.hq-ib-sep        { color: var(--border-hi); }
.hq-susp-meter    { display: inline-flex; gap: 2px; align-items: center; }
.hq-susp-pip      { width: 9px; height: 9px; background: var(--bg3); display: inline-block; }
.hq-susp-pip.on        { background: var(--green); box-shadow: 0 0 4px var(--green); }
.hq-susp-pip.on.amber  { background: var(--amber); box-shadow: 0 0 4px var(--amber); }
.hq-susp-pip.on.red    { background: var(--red);   box-shadow: 0 0 4px var(--red); }
.hq-susp-tick     { color: var(--border-hi); font-size: 11px; line-height: 1; margin: 0 2px; }
.hq-susp-zone     { color: var(--amber); font-size: 11px; margin-left: 5px; letter-spacing: 0.05em; }
.hq-susp-zone.locked { color: var(--red); }
.hq-ib-alert-bar  { display: flex; gap: 2px; align-items: center; }
.hq-ib-aseg       { width: 12px; height: 7px; background: var(--bg3); }
.hq-ib-aseg.on.green { background: var(--green); box-shadow: 0 0 5px var(--green); }
.hq-ib-aseg.on.amber { background: var(--amber); box-shadow: 0 0 5px var(--amber); }
.hq-ib-aseg.on.red   { background: var(--red);   box-shadow: 0 0 5px var(--red); }
#hq-ib-alert { color: var(--text); font-size: 12px; font-weight: bold; margin-left: 4px; }
.hq-ib-alliance {
  border: 1px solid var(--cyan); color: var(--cyan);
  font-size: 9px;
  padding: 1px 7px;
  background: rgba(0,26,34,0.9);
  letter-spacing: 1px;
}

/* ── Left sidebar: log + command bar ── */
#sidebar {
  grid-column: 1; grid-row: 2;
  display: flex; flex-direction: column;
  background: linear-gradient(180deg, rgba(22,17,13,0.98), rgba(11,9,7,0.99));
  border-right: 1px solid var(--border-hi);
  overflow: hidden;
}
.panel-header {
  display: flex; align-items: center; gap: 6px; padding: 4px 10px;
  border-bottom: 1px solid var(--border);
  font-size: 10px;
  letter-spacing: 2px;
  color: var(--text-dim);
  text-transform: uppercase; flex-shrink: 0;
}
.panel-header em { color: var(--sand); font-style: normal; }
#panel-log { display: flex; flex-direction: column; flex: 1; overflow: hidden; }
#panel-log > .panel-header { color: var(--text-dim); border-bottom-color: var(--border-hi); }
#log-entries {
  flex: 1; overflow-y: auto; padding: 8px 9px;
  font-size: 14px; line-height: 1.65; scroll-behavior: smooth;
  display: flex; flex-direction: column; gap: 8px;
}
#log-entries::-webkit-scrollbar { width: 3px; }
#log-entries::-webkit-scrollbar-thumb { background: var(--border-hi); }
.log-placeholder {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.log-entry {
  color: #d0c1ae;
  word-break: break-word;
  padding: 8px 10px 8px 12px;
  border: 1px solid var(--border);
  border-left: 2px solid rgba(126,79,29,0.58);
  background: linear-gradient(180deg, rgba(30,22,16,0.9), rgba(13,10,8,0.95));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.01);
}
.log-entry.new   { color: var(--text); border-left-color: var(--border-hi); }
.log-entry.warn  { color: var(--amber); border-left-color: var(--amber); text-shadow: 0 0 5px rgba(226,154,63,0.2); }
.log-entry.alert { color: #f08a70; border-left-color: var(--red); text-shadow: 0 0 6px rgba(207,85,56,0.32); }
.log-entry.contact {
  color: var(--cyan); font-size: 13px; line-height: 1.5;
  border-left-color: var(--cyan);
  text-shadow: 0 0 6px rgba(137,177,187,0.18);
}
.log-entry-head {
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.log-entry-tag {
  color: #b7a28a;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.log-entry-body {
  color: inherit;
  font-size: 12px;
  line-height: 1.55;
}
.log-entry.new .log-entry-tag { color: var(--text-dim); }
.log-entry.warn .log-entry-tag { color: var(--amber); }
.log-entry.alert .log-entry-tag { color: #ef8a71; }
.log-entry.contact .log-entry-tag { color: var(--cyan); }
.log-placeholder-card {
  min-height: 56px;
}
.log-placeholder-head {
  margin-bottom: 4px;
  color: var(--amber);
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.log-placeholder-body {
  color: #bfae97;
  font-size: 12px;
  line-height: 1.55;
}
#panel-cmd { display: none; }
#world-events-list {
  padding: 8px 9px 10px;
  font-size: 11px;
  color: var(--text-dim);
  line-height: 1.75;
  max-height: 210px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#world-events-list::-webkit-scrollbar { width: 3px; }
#world-events-list::-webkit-scrollbar-thumb { background: var(--border-hi); }
.world-event-card {
  padding: 8px 10px 8px 12px;
  border: 1px solid var(--border);
  border-left: 2px solid rgba(126,79,29,0.58);
  background: linear-gradient(180deg, rgba(30,22,16,0.9), rgba(13,10,8,0.95));
}
.world-event-card.alert { border-left-color: var(--red); }
.world-event-card.warn { border-left-color: var(--amber); }
.world-event-card.tip { border-left-color: var(--cyan); }
.world-event-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.world-event-icon { color: var(--amber); }
.world-event-faction { font-size: 10px; }
.world-event-divider { color: var(--text-dim); }
.world-event-type { color: var(--text-dim); font-size: 9px; }
.world-event-headline {
  color: #b89f81;
  font-size: 11px;
  line-height: 1.55;
}
.world-event-card.alert .world-event-head { color: #ef8a71; }
.world-event-card.warn .world-event-head { color: var(--amber); }
.world-event-card.tip .world-event-head { color: var(--cyan); }
.world-event-empty {
  color: var(--text-dim);
  font-size: 11px;
  letter-spacing: 1px;
}

/* ── Main area: graph panel fills the full content area ── */
#main-area {
  grid-column: 2; grid-row: 2;
  position: relative;
  display: grid; grid-template-rows: 1fr;
  overflow: hidden;
}
#main-area.hq-focus #panel-graph  { border-top: none; background: #010801; }
#main-area.hq-focus #graph-tabs   { display: none; }
#main-area.hq-focus #graph-statusbar { display: none; }
#main-area.hq-focus #hq-actionbar { display: flex; }
#main-area.hq-focus #hq-infobar   { display: flex; }

/* ── Overworld SVG network focus ── */
#main-area.ow-focus #panel-graph  { border-top: none; background: var(--bg); flex-direction: row; }
#main-area.ow-focus #graph-tabs   { display: none; }
#main-area.ow-focus #graph-canvas { display: none; }
#main-area.ow-focus #ow-svg       { display: block; }
#main-area.ow-focus #graph-statusbar { display: none; }
#main-area.ow-focus #ow-side-pane    { display: flex; }
#main-area.ow-focus #ow-faction-zones,
#main-area.ow-focus #ow-watermarks   { display: block; }
#main-area.ow-focus #ow-map-legend   { display: flex; }

#ow-svg {
  display: none; width: 100%; height: 100%;
  position: absolute; inset: 0; z-index: 3;
}

@keyframes ow-pulse {
  0%, 100% { opacity: 0.35; }
  50%       { opacity: 0; }
}
.ow-player-pulse { animation: ow-pulse 1.6s ease-in-out infinite; }
@keyframes ow-player-breathe {
  0%, 100% { opacity: 1.0; }
  50%       { opacity: 0.45; }
}
@keyframes ow-player-arrive {
  0%   { opacity: 0; transform: scale(0.2); }
  60%  { opacity: 1; transform: scale(1.25); }
  100% { opacity: 1; transform: scale(1); }
}
.ow-player-marker {
  transform-box: fill-box; transform-origin: center;
  animation: ow-player-breathe 1.6s ease-in-out infinite;
}
.ow-player-arriving {
  transform-box: fill-box; transform-origin: center;
  animation: ow-player-arrive 0.35s ease-out forwards, ow-player-breathe 1.6s ease-in-out 0.35s infinite;
}

#ow-actionbar {
  display: none; height: 52px; flex-shrink: 0;
  grid-template-columns: 160px 1fr 140px;
  border-top: 1px solid var(--border-hi);
  background: rgba(14,11,9,0.98);
}
#ow-ab-profile {
  display: flex; align-items: center; gap: 16px;
  padding: 0 16px;
  border-right: 1px solid var(--border);
}
.ow-ab-stat { display: flex; flex-direction: column; gap: 2px; }
.ow-ab-stat-lbl { font-size: 7px; letter-spacing: 2px; color: var(--text-dim); }
.ow-ab-stat-btn {
  border: none; background: none; cursor: pointer;
  font-family: var(--font); font-size: 9px; letter-spacing: 2px;
  color: var(--text-dim); padding: 0; transition: color 0.15s;
}
.ow-ab-stat-btn:hover { color: var(--text); }
.ow-ab-stat-btn.new {
  color: var(--cyan); text-shadow: 0 0 6px rgba(53,216,224,0.5);
  animation: glow-pulse 2.4s ease-in-out infinite;
}
#ow-ab-cred { font-size: 11px; color: var(--sand); }
#ow-ab-rank { font-size: 11px; color: var(--text); }
#ow-ab-heat { font-size: 11px; color: var(--text-dim); }
#ow-ab-heat.warm     { color: var(--text-dim); }
#ow-ab-heat.elevated { color: var(--amber); }
#ow-ab-heat.hot      { color: var(--orange); }
#ow-ab-heat.critical { color: var(--red); text-shadow: 0 0 5px rgba(207,85,56,0.4); }
#ow-ab-info {
  display: flex; flex-direction: column; justify-content: center; gap: 3px;
  padding: 0 16px;
}
#ow-ab-lbl  { font-size: 8px; letter-spacing: 2px; color: var(--text-dim); }
#ow-ab-name { font-size: 11px; letter-spacing: 2px; color: var(--amber); }
#ow-ab-move {
  border: none; border-left: 1px solid var(--border-hi);
  background: rgba(226,154,63,0.06); color: rgba(226,154,63,0.28);
  font-family: var(--font); font-size: 11px; letter-spacing: 4px;
  cursor: default; transition: all 0.15s;
}
#ow-ab-move.active { background: rgba(226,154,63,0.15); color: var(--amber); cursor: pointer; }
#ow-ab-move.active:active { background: rgba(226,154,63,0.28); }

#ow-intel-overlay {
  position: absolute; inset: 0; z-index: 30;
  background: rgba(0,0,0,0); pointer-events: none;
  transition: background 0.2s;
}
#ow-intel-overlay.open { background: rgba(0,0,0,0.45); pointer-events: all; }
#ow-intel-sheet {
  position: absolute; bottom: 54px; left: 50%;
  transform: translateX(-50%) translateY(16px);
  width: min(440px, 92%);
  background: rgba(12,10,8,0.98); border: 1px solid var(--border-hi);
  opacity: 0; pointer-events: none;
  transition: opacity 0.18s, transform 0.18s;
}
#ow-intel-overlay.open #ow-intel-sheet {
  opacity: 1; transform: translateX(-50%) translateY(0); pointer-events: all;
}
#ow-intel-header {
  display: flex; align-items: baseline; gap: 10px;
  padding: 12px 16px 8px; border-bottom: 1px solid var(--border);
}
#ow-intel-name { font-size: 15px; letter-spacing: 3px; color: var(--text); }
#ow-intel-faction {
  font-size: 8px; letter-spacing: 2px; padding: 1px 6px; border: 1px solid;
  margin-left: auto;
}
#ow-intel-body { padding: 8px 16px; display: flex; flex-direction: column; gap: 4px; }
.ow-intel-row {
  display: flex; justify-content: space-between;
  font-size: 9px; color: var(--text-dim); letter-spacing: 1px;
}
.ow-intel-row .iv { color: var(--text); }
#ow-intel-events {
  padding: 0 16px 8px; display: flex; flex-direction: column; gap: 3px;
}
.ow-ie {
  font-size: 8px; color: var(--text-dim); padding: 3px 0;
  border-top: 1px solid rgba(61,43,28,0.25);
}
.ow-ie-dot {
  display: inline-block; width: 5px; height: 5px;
  border-radius: 50%; margin-right: 6px; vertical-align: middle;
}
#ow-intel-footer {
  display: grid; grid-template-columns: 1fr 120px;
  border-top: 1px solid var(--border-hi);
}
#ow-intel-dismiss {
  border: none; background: transparent; color: var(--text-dim);
  font-family: var(--font); font-size: 9px; letter-spacing: 2px;
  cursor: pointer; padding: 12px 16px; text-align: left;
}
#ow-intel-dismiss:active { background: rgba(61,43,28,0.2); }
#ow-intel-move {
  border: none; border-left: 1px solid var(--border-hi);
  background: rgba(226,154,63,0.06); color: rgba(226,154,63,0.28);
  font-family: var(--font); font-size: 10px; letter-spacing: 3px;
  cursor: default; padding: 12px; text-align: center; transition: all 0.15s;
}
#ow-intel-move.active { background: rgba(226,154,63,0.16); color: var(--amber); cursor: pointer; }
#ow-intel-move.active:active { background: rgba(226,154,63,0.28); }

/* ── Overworld side panel ── */
#ow-side-pane {
  display: none; width: 280px; flex-shrink: 0;
  flex-direction: column; overflow-y: auto;
  background: linear-gradient(180deg, rgba(14,11,9,0.98), rgba(10,8,7,0.98));
  border-left: 1px solid var(--border);
}
.ow-sb { border-bottom: 1px solid var(--border); padding: 12px 14px; flex-shrink: 0; }
.ow-sb-label { font-size: 8px; letter-spacing: 3px; color: var(--text-dim); margin-bottom: 10px; }
#ow-access-strip {
  padding: 7px 14px; flex-shrink: 0;
  background: rgba(255,153,0,0.07);
  border-bottom: 1px solid rgba(255,153,0,0.22);
  display: flex; align-items: center; gap: 6px;
}
.ow-access-label { font-size: 7px; letter-spacing: 2px; color: var(--amber-dim); }
.ow-access-sep   { font-size: 8px; color: rgba(255,153,0,0.4); }
#ow-access-val   { font-size: 10px; letter-spacing: 2px; color: var(--amber); }
#ow-cur-strip {
  padding: 8px 14px; flex-shrink: 0;
  background: rgba(120,216,114,0.05);
  border-bottom: 1px solid rgba(120,216,114,0.15);
  display: flex; align-items: center; gap: 8px;
}
.ow-cur-label { font-size: 7px; letter-spacing: 2px; color: var(--green-dim); }
#ow-cur-val   { font-size: 10px; letter-spacing: 1px; color: var(--green); }
#ow-loc-faction-tag { font-size: 8px; letter-spacing: 2px; margin-bottom: 5px; }
#ow-loc-name  { font-size: 18px; letter-spacing: 1px; color: var(--text); margin-bottom: 6px; font-family: 'VT323', monospace; }
#ow-loc-enforcement {
  font-size: 8px; letter-spacing: 1px; line-height: 1.6;
  color: #ff5050; border: 1px solid rgba(255,50,50,0.35);
  padding: 5px 8px; margin-bottom: 8px;
}
#ow-loc-heat {
  font-size: 0.8rem; letter-spacing: 1px; line-height: 1.6;
  padding: 5px 8px; margin-bottom: 8px;
}
#ow-loc-heat.heat-warm     { color: var(--amber);  border: 1px solid rgba(226,154,63,0.35); }
#ow-loc-heat.heat-hot      { color: var(--orange); border: 1px solid rgba(224,112,72,0.40); }
#ow-loc-heat.heat-lockdown { color: var(--red);    border: 1px solid rgba(207,85,56,0.50); }
#ow-loc-desc  { font-size: 10px; line-height: 1.6; color: var(--text-dim); margin-bottom: 10px; }
#ow-loc-tags  { display: flex; flex-wrap: wrap; gap: 5px; }
.ow-loc-tag   { padding: 1px 6px; border: 1px solid currentColor; font-size: 8px; letter-spacing: 1px; }
.ow-rivalry-row   { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.ow-rv-side       { font-size: 9px; letter-spacing: 1px; min-width: 58px; flex-shrink: 0; }
.ow-rv-side-b     { text-align: right; }
.ow-rv-track      { flex: 1; height: 4px; background: rgba(61,43,28,0.5); border: 1px solid var(--border); display: flex; overflow: hidden; }
.ow-rv-fill-a     { height: 100%; transition: width 1.2s ease; flex-shrink: 0; }
.ow-rv-fill-b     { height: 100%; transition: width 1.2s ease; flex-shrink: 0; }
.ow-npc-row   { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid rgba(61,43,28,0.4); border-left: 2px solid transparent; padding-left: 6px; }
.ow-npc-row:last-child { border-bottom: none; }
.ow-npc-row.available { cursor: pointer; transition: background 0.1s, border-color 0.1s; }
.ow-npc-row.available:hover { background: rgba(210,150,80,0.08); border-left-color: var(--amber); }
.ow-npc-row.available:active { background: rgba(210,150,80,0.18); }
.ow-npc-action-cue { margin-left: auto; font-size: 8px; letter-spacing: 1.5px; flex-shrink: 0; color: var(--amber); }
.ow-npc-shape { width: 20px; height: 20px; border: 1px solid currentColor; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ow-npc-shape.broker { color: #d9b98f; transform: rotate(45deg); }
.ow-npc-shape.runner { color: var(--amber); clip-path: polygon(20% 0,80% 0,100% 50%,80% 100%,20% 100%,0 50%); }
.ow-npc-shape.tech   { color: var(--green); border-radius: 50%; }
.ow-npc-shape.scout  { color: var(--cyan); clip-path: polygon(50% 0,100% 38%,82% 100%,18% 100%,0 38%); }
.ow-npc-info   { display: flex; flex-direction: column; gap: 2px; }
.ow-npc-handle { font-size: 10px; letter-spacing: 1px; color: var(--text); }
.ow-npc-role   { font-size: 8px; letter-spacing: 1px; color: var(--text-dim); }
.ow-npc-empty  { font-size: 9px; color: var(--text-dim); letter-spacing: 1px; }
#ow-side-move-btn {
  margin: 12px 14px; padding: 9px; flex-shrink: 0;
  border: 1px solid var(--border-hi); background: transparent;
  color: var(--text-dim); font-family: var(--font); font-size: 10px; letter-spacing: 2px;
  cursor: pointer; transition: all 0.15s; display: none;
}
#ow-side-move-btn.visible { display: block; }
#ow-side-move-btn.active  { border-color: var(--amber); color: var(--amber); }
#ow-side-move-btn:hover   { border-color: var(--amber); color: var(--amber); }
#ow-enforcement-panel {
  position: absolute; bottom: 56px; left: 0; right: 0;
  background: rgba(10,5,3,0.96); border-top: 1px solid rgba(255,50,50,0.5);
  padding: 16px 20px; z-index: 20;
}
.ow-enf-header { font-size: 11px; letter-spacing: 2px; color: #ff5050; margin-bottom: 10px; }
.ow-enf-body   { font-size: 10px; line-height: 1.7; color: var(--text-dim); margin-bottom: 14px; }
.ow-enf-actions { display: flex; flex-direction: column; gap: 7px; }
.ow-enf-btn {
  background: transparent; border: 1px solid var(--border-hi);
  color: var(--text-dim); font-family: var(--font); font-size: 10px;
  letter-spacing: 1px; padding: 7px 10px; cursor: pointer; text-align: left;
  transition: all 0.12s;
}
.ow-enf-btn:hover:not(.disabled) { border-color: #ff5050; color: #ff5050; }
.ow-enf-btn.disabled { opacity: 0.35; cursor: default; pointer-events: none; }
.ow-enf-result { font-size: 10px; letter-spacing: 1px; padding: 8px 0; }
.ow-enf-result.ok   { color: var(--green); }
.ow-enf-result.fail { color: #ff5050; }
.ow-feed-sb { flex: 1; min-height: 0; overflow: hidden; }
.ow-feed-line {
  padding: 7px 0; border-bottom: 1px solid rgba(61,43,28,0.35);
  font-size: 11px; line-height: 1.5; color: var(--text-dim);
  animation: ow-feed-in 0.4s ease-out;
}
.ow-feed-kind { margin-right: 5px; }
@keyframes ow-feed-in {
  from { opacity: 0; transform: translateY(-5px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Overworld ambient overlays (inside graph-canvas-wrap) ── */
#ow-faction-zones, #ow-watermarks, #ow-map-legend { display: none; }
#ow-faction-zones {
  position: absolute; inset: 0; pointer-events: none; z-index: 1; overflow: hidden;
}
.ow-fzone {
  position: absolute; border-radius: 50%;
  filter: blur(60px); pointer-events: none;
  animation: ow-zone-breathe 4s ease-in-out infinite;
}
.ow-fzone-vt  { background: rgba(137,177,187,0.18); width: 40%; height: 60%; left: -5%;  top: -10%; animation-delay: 0s; }
.ow-fzone-cv  { background: rgba(142,135,201,0.16); width: 35%; height: 50%; left: -2%;  bottom: -15%; animation-delay: 1.7s; }
.ow-fzone-kd  { background: rgba(216,234,255,0.14); width: 28%; height: 46%; right: 2%;  bottom: 0; animation-delay: 3.1s; }
.ow-fzone-hub { background: rgba(226,154,63,0.10);  width: 36%; height: 55%; left: 38%; top: 15%; animation-delay: 2.3s; }
@keyframes ow-zone-breathe {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.7; transform: scale(1.06); }
}
#ow-watermarks { position: absolute; inset: 0; pointer-events: none; z-index: 2; overflow: hidden; }
.ow-wm {
  position: absolute; font-size: 11px; letter-spacing: 4px;
  opacity: 0.15; pointer-events: none; white-space: nowrap; text-transform: uppercase;
  font-family: var(--font);
}
#ow-map-legend {
  position: absolute; left: 14px; bottom: 14px; z-index: 10;
  gap: 14px; padding: 8px 12px;
  background: rgba(9,8,7,0.88); border: 1px solid var(--border);
  font-size: 9px; letter-spacing: 1px; pointer-events: none;
}
.ow-leg-item { display: flex; align-items: center; gap: 6px; color: var(--text-dim); }
.ow-leg-item + .ow-leg-item { border-left: 1px solid var(--border); padding-left: 14px; }
.ow-leg-dot  { width: 8px; height: 8px; border-radius: 50%; border: 1px solid currentColor; flex-shrink: 0; }

/* Shell-level: collapse sidebar and profile columns during overworld */
#shell.ow-focus {
  grid-template-columns: 0 1fr 0;
}
#shell.ow-focus #sidebar,
#shell.ow-focus #profile { display: none; }

/* Shell-level: collapse sidebar and profile columns during BBS panel (The Wire / Full Duplex) */
#shell.bbs-focus {
  grid-template-columns: 0 1fr 0;
}
#shell.bbs-focus #sidebar,
#shell.bbs-focus #profile { display: none; }

/* Shell-level: collapse sidebar and profile columns during HQ */
#shell.hq-focus {
  grid-template-columns: 0 1fr 0;
  grid-template-rows: 26px 1fr 0;
}
#shell.hq-focus #sidebar,
#shell.hq-focus #profile { display: none; }
#shell.hq-focus #title-area { display: none; }
#shell.hq-focus #statusbar { display: none; }

/* ── Faction chrome: ambient color shifts during HQ runs ── */
[data-hq-faction="kensei"]   { --fac-line: rgba(200,110,40,0.52);  --fac-tint: rgba(200,110,40,0.05); }
[data-hq-faction="vault"]    { --fac-line: rgba(141,184,192,0.50); --fac-tint: rgba(141,184,192,0.05); }
[data-hq-faction="assembly"] { --fac-line: rgba(255,68,102,0.46);  --fac-tint: rgba(255,68,102,0.05); }
[data-hq-faction="civic"]    { --fac-line: rgba(204,68,255,0.44);  --fac-tint: rgba(204,68,255,0.05); }
[data-hq-faction="kessler"]  { --fac-line: rgba(216,234,255,0.50); --fac-tint: rgba(216,234,255,0.05); }

[data-hq-faction] #titlebar     { border-bottom-color: var(--fac-line); }
[data-hq-faction] #hq-infobar   { border-bottom-color: var(--fac-line); }
[data-hq-faction] #hq-right-rail { border-left-color: var(--fac-line); }

/* panel-map no longer participates in the grid; it's an invisible overlay
   container for native panel modals */
#panel-map {
  position: absolute; inset: 0; z-index: 25;
  pointer-events: none;
}
.wire-unread-badge {
  display: inline-block;
  background: #ff2244;
  color: #000;
  font-size: 10px;
  font-weight: bold;
  min-width: 15px;
  height: 15px;
  line-height: 15px;
  padding: 0 3px;
  border-radius: 8px;
  text-align: center;
  vertical-align: middle;
  margin-left: 5px;
  font-family: var(--font);
}


/* ── District shell variants ── */
#shell[data-district-theme="kensei"] {
  background: linear-gradient(180deg, rgba(66,44,24,0.92), rgba(21,15,11,0.98));
}
#shell[data-district-theme="kensei"] #titlebar {
  background: linear-gradient(180deg, rgba(48,31,19,0.98), rgba(21,15,11,0.98));
  border-bottom-color: rgba(179,128,62,0.76);
}
#shell[data-district-theme="kensei"] .logo {
  border-left-color: rgba(217,185,143,0.48);
  border-right-color: rgba(217,185,143,0.48);
  background: linear-gradient(180deg, rgba(46,31,20,0.95), rgba(18,13,10,0.98));
}
#shell[data-district-theme="kensei"] #sidebar,
#shell[data-district-theme="kensei"] #profile {
  background: linear-gradient(180deg, rgba(26,19,14,0.98), rgba(11,9,7,0.99));
}
#shell[data-district-theme="kensei"] .panel-header em {
  color: #d9b98f;
}
#shell[data-district-theme="kensei"] .log-entry,
#shell[data-district-theme="kensei"] .world-event-card {
  border-color: rgba(102,70,36,0.76);
  background: linear-gradient(180deg, rgba(33,23,16,0.92), rgba(14,10,8,0.97));
}
#shell[data-district-theme="kensei"] #statusbar {
  background: linear-gradient(180deg, rgba(22,16,12,0.98), rgba(11,9,7,0.99));
  border-top-color: rgba(179,128,62,0.68);
}
#shell[data-district-theme="kensei"] #term-loc-bar {
  background: linear-gradient(180deg, rgba(33,22,15,0.94), rgba(15,11,8,0.96));
  border-bottom-color: rgba(102,70,36,0.82);
}
#shell[data-district-theme="kensei"] #term-loc-name {
  color: #d9b98f;
  text-shadow: 0 0 10px rgba(217,185,143,0.18);
}
#shell[data-district-theme="kensei"] #term-loc-district {
  color: #c1a681;
}
#shell[data-district-theme="kensei"] #term-content {
  border-left-color: rgba(226,154,63,0.72);
}
#shell[data-district-theme="kensei"] #term-content .term-hint {
  color: #d9b98f;
  border-top-color: rgba(102,70,36,0.82);
}
#shell[data-district-theme="kensei"] #term-footer .term-key {
  color: #d9b98f;
}
#shell[data-district-theme="the-assembly"] {
  background: linear-gradient(180deg, rgba(72,44,25,0.92), rgba(23,16,11,0.98));
}
#shell[data-district-theme="the-assembly"] #titlebar {
  background: linear-gradient(180deg, rgba(51,33,20,0.98), rgba(22,15,11,0.98));
  border-bottom-color: rgba(153,88,43,0.78);
}
#shell[data-district-theme="the-assembly"] .logo {
  border-left-color: rgba(207,85,56,0.55);
  border-right-color: rgba(207,85,56,0.55);
  background: linear-gradient(180deg, rgba(50,31,21,0.94), rgba(19,13,10,0.98));
}
#shell[data-district-theme="the-assembly"] #sidebar,
#shell[data-district-theme="the-assembly"] #profile {
  background: linear-gradient(180deg, rgba(29,20,14,0.98), rgba(12,9,7,0.99));
}
#shell[data-district-theme="the-assembly"] .panel-header em {
  color: #cf8a5e;
}
#shell[data-district-theme="the-assembly"] .log-entry,
#shell[data-district-theme="the-assembly"] .world-event-card {
  border-color: rgba(96,58,32,0.78);
  background: linear-gradient(180deg, rgba(34,23,16,0.92), rgba(15,10,8,0.97));
}
#shell[data-district-theme="the-assembly"] .log-entry::before {
  color: #5a3925;
}
#shell[data-district-theme="the-assembly"] #statusbar {
  background: linear-gradient(180deg, rgba(23,16,12,0.98), rgba(12,9,7,0.99));
  border-top-color: rgba(153,88,43,0.72);
}
#shell[data-district-theme="the-assembly"] #term-loc-bar {
  background: linear-gradient(180deg, rgba(34,22,15,0.94), rgba(16,11,8,0.96));
  border-bottom-color: rgba(96,58,32,0.82);
}
#shell[data-district-theme="the-assembly"] #term-loc-name {
  color: #cf8a5e;
  text-shadow: 0 0 10px rgba(207,138,94,0.2);
}
#shell[data-district-theme="the-assembly"] #term-loc-district {
  color: #a98b69;
}
#shell[data-district-theme="the-assembly"] #term-content {
  border-left-color: rgba(207,85,56,0.72);
}
#shell[data-district-theme="the-assembly"] #term-content .term-hint {
  color: #cf8a5e;
  border-top-color: rgba(96,58,32,0.82);
}
#shell[data-district-theme="the-assembly"] #term-footer .term-key {
  color: #cf8a5e;
}
#panel-graph {
  background: var(--bg2); border-top: 1px solid var(--border-hi);
  display: flex; flex-direction: column; overflow: hidden;
}
#graph-tabs { display: flex; border-bottom: 1px solid var(--border); }
.gtab {
  font-size: 10px; letter-spacing: 2px; padding: 3px 10px;
  color: var(--text-dim); cursor: pointer; border-right: 1px solid var(--border);
  text-transform: uppercase;
}
.gtab.active { color: var(--amber); background: rgba(226,154,63,0.06); }
.gtab:hover  { color: var(--text-dim); }
#graph-canvas-wrap { flex: 1; position: relative; overflow: hidden; transition: opacity 0.18s ease; }
.hq-canvas-dimmed { opacity: 0.38; pointer-events: none; transition: opacity 0.18s ease; }
#hq-tactical-label {
  position: absolute;
  top: 8px;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 9px;
  letter-spacing: 3px;
  color: #2a5a2a;
  pointer-events: none;
  z-index: 2;
  opacity: 0;
  transition: opacity 140ms ease-out;
}
#hq-tactical-label em { color: #4a8a4a; font-style: normal; }
#main-area.hq-focus #hq-tactical-label { opacity: 1; }
/* ── Hostile phase overlay ── */
#hq-phase-banner {
  position: absolute; top: 0; left: 0; right: 0;
  height: 0; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  font-family: 'VT323', monospace; font-size: 13px; letter-spacing: 3px;
  color: var(--amber); background: rgba(0,0,0,0.55);
  pointer-events: none; z-index: 10;
  transition: height 120ms ease-out;
}
#hq-phase-banner.hq-phase-banner-active { height: 28px; }
#hq-contact-callout {
  position: absolute; bottom: 48px; left: 50%; transform: translateX(-50%);
  padding: 5px 14px; background: rgba(0,0,0,0.7); border: 1px solid var(--amber);
  font-family: 'VT323', monospace; font-size: 14px; letter-spacing: 2px;
  color: var(--amber); pointer-events: none; z-index: 10;
  opacity: 0; transition: opacity 140ms ease-in;
}
#hq-contact-callout.hq-contact-callout-show { opacity: 1; }
#hq-contact-callout.hq-contact-danger { border-color: #ff2244; color: #ff7c93; }
#hq-contact-callout.hq-contact-warn   { border-color: var(--amber); color: var(--amber); }
.hq-cc-head { font-weight: normal; }
#hq-actionbar.hq-phase-locked { pointer-events: none; opacity: 0.5; }
#hq-daemon-mitig {
  position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%);
  width: max-content; background: rgba(6,14,18,0.97);
  border: 1px solid rgba(192,96,192,0.55); padding: 10px 12px;
  display: flex; flex-direction: column; align-items: flex-start; gap: 7px;
  z-index: 12; box-shadow: 0 0 24px rgba(192,96,192,0.12), inset 0 0 10px rgba(192,96,192,0.04);
}
.hdm-title { font-family: 'VT323', monospace; font-size: 15px; letter-spacing: 3px; color: #c060c0; text-shadow: 0 0 10px rgba(192,96,192,0.5); }
.hdm-sub { font-size: 0.8rem; letter-spacing: 2px; color: var(--text-dim); margin-top: -3px; }
.hdm-options { display: flex; gap: 8px; }
.hdm-opt {
  display: flex; flex-direction: column; gap: 2px; padding: 6px 10px;
  border: 1px solid var(--border-hi); background: rgba(6,14,18,0.95);
  width: 112px; cursor: pointer; text-align: left;
  font-family: inherit; color: inherit;
}
.hdm-ghost { border-color: rgba(137,177,187,0.25); background: rgba(6,14,18,0.95); }
.hdm-ghost:hover { border-color: rgba(137,177,187,0.55); background: rgba(8,18,22,0.97); }
.hdm-disabled { opacity: 0.45; cursor: default; pointer-events: none; }
.hdm-opt-name { font-size: 11px; letter-spacing: 2px; }
.hdm-ghost .hdm-opt-name { color: var(--cyan); }
.hdm-sleep .hdm-opt-name { color: var(--text-dim); }
.hdm-opt-desc { font-size: 0.8rem; letter-spacing: 0.5px; color: var(--text-dim); line-height: 1.5; }
.hdm-opt-cost { font-size: 0.8rem; letter-spacing: 1px; color: #6a7870; margin-top: 1px; }
.hdm-ghost .hdm-opt-cost { color: rgba(137,177,187,0.55); }
#graph-canvas { display: block; width: 100%; height: 100%; cursor: grab; touch-action: none; }
#graph-canvas:active { cursor: grabbing; }
#graph-statusbar {
  display: flex; align-items: center; gap: 16px; padding: 0 10px;
  font-size: 10px; letter-spacing: 1px; color: var(--text-dim);
  border-top: 1px solid var(--border); height: 16px; flex-shrink: 0;
}
#graph-statusbar .val { color: var(--text); }
#graph-statusbar .hi  { color: var(--amber); }
#graph-statusbar .hq-alert-wrap {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
#graph-statusbar .hq-alert-bar {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
#graph-statusbar .hq-alert-seg {
  width: 12px;
  height: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: inset 0 0 4px rgba(0,0,0,0.5);
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, opacity .16s ease;
  opacity: 0.5;
}
#graph-statusbar .hq-alert-seg.on {
  opacity: 1;
}
#graph-statusbar .hq-alert-seg.green.on {
  background: var(--green);
  border-color: rgba(0,255,65,0.65);
  box-shadow: 0 0 8px rgba(0,255,65,0.38);
}
#graph-statusbar .hq-alert-seg.amber.on {
  background: var(--amber);
  border-color: rgba(255,153,0,0.65);
  box-shadow: 0 0 8px rgba(255,153,0,0.34);
}
#graph-statusbar .hq-alert-seg.red.on {
  background: var(--red);
  border-color: rgba(255,34,68,0.72);
  box-shadow: 0 0 10px rgba(255,34,68,0.36);
}
#hq-actionbar {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 10px;
  border-top: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(2,10,2,0.98), rgba(2,8,2,0.98));
  flex-shrink: 0;
}
#hq-actionbar .hq-action-group {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}
#hq-actionbar .np-btn {
  padding: 5px 16px;
}
#hq-actionbar .np-btn:hover {
  background: linear-gradient(180deg, rgba(16,32,15,0.98), rgba(7,14,7,0.98));
  color: #c7f8c1;
  border-color: var(--green);
  box-shadow: inset 0 1px 0 rgba(195,255,206,0.08), inset 0 -1px 0 rgba(0,0,0,0.46), 0 0 0 1px rgba(120,216,114,0.08);
}
#hq-actionbar .np-btn.danger:hover {
  background: rgba(255,34,68,0.12);
  border-color: var(--red);
  color: var(--red);
}
#hq-actionbar .np-btn.muted:hover {
  background: linear-gradient(180deg, rgba(22,26,18,0.96), rgba(10,12,9,0.98));
  color: var(--text);
  border-color: var(--text-dim);
}
.hq-action-label {
  color: #3a6a3a;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-right: 4px;
}
#hq-legend {
  display: flex;
  flex-wrap: wrap;
  column-gap: 8px;
  row-gap: 3px;
  align-items: center;
  font-size: 11px;
  line-height: 1.05;
  color: var(--text-dim);
}
#hq-legend .hq-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  white-space: nowrap;
}
#hq-legend .hq-legend-glyph {
  display: inline-block;
  min-width: 13px;
  font-size: 14px;
  line-height: 1;
  text-align: center;
}
#hq-legend .hq-legend-label {
  font-size: 11px;
  letter-spacing: 0.5px;
  color: #a8a090;
}
#hq-legend .hq-badge-diagram {
  width: 100%;
  margin-top: 2px;
  display: block;
  border-left: 1px solid #1a3a1a;
  padding-left: 8px;
  box-sizing: border-box;
}
#hq-legend .hq-bdiag-lbl {
  font: 0.8rem 'Share Tech Mono', monospace;
  fill: #7a9070;
  letter-spacing: 0.4px;
}

/* ── HQ ICE encounter popup ── */
#hq-ice-popup {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(2,12,2,0.78);
  z-index: 52;
  cursor: pointer;
}
#hq-ice-popup-inner {
  background: var(--bg2);
  border: 1px solid var(--border-hi);
  box-shadow: 0 0 60px rgba(0,255,65,0.10), 0 0 120px rgba(0,0,0,0.9);
  padding: 20px 28px 18px;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  pointer-events: none;
}
#hq-ice-popup-title {
  font-size: 10px; letter-spacing: 3px; color: var(--text-dim);
  text-transform: uppercase;
}
#hq-ice-cols {
  display: flex; gap: 14px; justify-content: center;
}
.ice-col {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  width: 96px;
}
.ice-col-label {
  font-size: 8px; letter-spacing: 2px; color: var(--text-dim);
  text-transform: uppercase;
}
.ice-die-card {
  width: 88px; height: 86px;
  border: 1px solid var(--border);
  border-radius: 5px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 5px;
  background: rgba(0,0,0,0.35);
  transition: border-color 0.35s, box-shadow 0.35s;
}
.ice-die-card .ice-die-glyph { font-size: 30px; line-height: 1; }
.ice-die-card .ice-die-name  { font-size: 8px; letter-spacing: 1px; color: var(--text-dim); }
.d6-pip-grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); width: 54px; height: 54px; }
.d6-pip-cell { display: flex; align-items: center; justify-content: center; }
.d6-pip      { width: 8px; height: 8px; border-radius: 50%; }
.ice-die-card.ghost  .ice-die-glyph { color: #cc44ff; text-shadow: 0 0 14px rgba(204,68,255,0.7); }
.ice-die-card.shield .ice-die-glyph { color: var(--cyan); text-shadow: 0 0 12px rgba(0,229,255,0.6); }
.ice-die-card.spike  .ice-die-glyph { color: var(--amber); }
.ice-die-card.pulse  .ice-die-glyph { color: var(--green-dim); }
.ice-die-card.blank  .ice-die-glyph { color: var(--text-dim); }
.ice-die-card.result-win  { border-color: rgba(0,255,65,0.65); box-shadow: 0 0 14px rgba(0,255,65,0.22); }
.ice-die-card.result-loss { border-color: rgba(255,34,68,0.65); box-shadow: 0 0 12px rgba(255,34,68,0.18); }
.ice-vs-row {
  display: flex; align-items: center; justify-content: center; width: 100%;
  gap: 6px;
}
.ice-vs-line { flex: 1; height: 1px; background: var(--border); }
.ice-vs-label { font-size: 8px; letter-spacing: 2px; color: var(--border-hi); }
.ice-col-result {
  font-size: 18px; line-height: 1;
  opacity: 0; transition: opacity 0.3s;
  min-height: 22px;
}
.ice-col-result.show { opacity: 1; }
.ice-col-result.win  { color: var(--green); text-shadow: 0 0 10px rgba(0,255,65,0.6); }
.ice-col-result.loss { color: var(--red);   text-shadow: 0 0 10px rgba(255,34,68,0.5); }
#hq-ice-outcome {
  font-size: 13px; letter-spacing: 3px; text-transform: uppercase;
  min-height: 18px; opacity: 0; transition: opacity 0.4s;
}
#hq-ice-outcome.show { opacity: 1; }
#hq-ice-outcome.cracked { color: var(--green); text-shadow: 0 0 14px rgba(0,255,65,0.55); }
#hq-ice-outcome.held    { color: var(--red);   text-shadow: 0 0 12px rgba(255,34,68,0.5); }
#hq-ice-dismiss {
  font-size: 8px; letter-spacing: 2px; color: var(--text-dim);
  opacity: 0; transition: opacity 0.4s;
}
#hq-ice-dismiss.show { opacity: 1; }
#hq-sentinel-decision, #hq-ice-decision {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(2,12,2,0.82);
  z-index: 51;
}
#hq-sentinel-decision-inner, #hq-ice-decision-inner {
  background: var(--bg2);
  padding: 24px 32px 20px;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  min-width: 300px;
}
#hq-sentinel-decision-inner {
  border: 1px solid var(--amber);
  box-shadow: 0 0 40px rgba(255,176,0,0.12), 0 0 120px rgba(0,0,0,0.9);
}
#hq-ice-decision-inner {
  border: 1px solid var(--red);
  box-shadow: 0 0 40px rgba(255,34,68,0.18), 0 0 120px rgba(0,0,0,0.9);
}
#hq-sentinel-decision-title {
  font-size: 10px; letter-spacing: 4px; color: var(--amber);
  text-transform: uppercase;
}
#hq-ice-decision-title {
  font-size: 10px; letter-spacing: 4px; color: var(--red);
  text-transform: uppercase;
}
#hq-sentinel-decision-meta, #hq-ice-decision-meta {
  font-size: 11px; color: var(--text-dim); text-align: center; line-height: 1.7;
}
#hq-sentinel-decision-btns, #hq-ice-decision-btns {
  display: flex; flex-direction: column; gap: 8px; width: 100%;
}
#hq-sentinel-decision-btns button, #hq-ice-decision-btns button {
  background: none;
  border: 1px solid var(--border);
  color: var(--green);
  font-family: inherit; font-size: 11px; letter-spacing: 1px;
  padding: 8px 14px; cursor: pointer; text-align: left;
  transition: background 0.15s, border-color 0.15s;
}
#hq-sentinel-decision-btns button:hover,
#hq-ice-decision-btns button:hover { background: rgba(0,255,65,0.07); border-color: var(--green); }
#hq-sentinel-decision-btns button:disabled,
#hq-ice-decision-btns button:disabled {
  opacity: 0.35;
  cursor: default;
}
.hq-decision-btn-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}
.hq-decision-btn-main {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}
.hq-decision-btn-label {
  flex: 0 0 auto;
  min-width: 0;
}
.hq-decision-btn-risk {
  color: var(--text-dim);
  font-size: 9px;
  letter-spacing: 1px;
  text-transform: uppercase;
  white-space: nowrap;
}
.hq-decision-btn-risk-warn {
  color: var(--amber);
}
.hq-decision-btn-risk-alert {
  color: #ff7a92;
}
.hq-decision-btn-cost {
  flex: 0 0 auto;
  color: var(--amber);
  font-size: 10px;
  text-align: right;
  white-space: nowrap;
}
/* ── Encounter Radial ─────────────────────────────────────── */
#hq-encounter-radial {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(4,6,4,0.68);
  z-index: 51;
}
#hq-enc-wrap {
  display: flex; flex-direction: column; align-items: center; gap: 0;
  width: 468px; max-width: 96vw;
}
#hq-ctx-pills { display: flex; gap: 0; width: 100%; margin-bottom: -1px; }
.hq-ctx-pill {
  flex: 1; padding: 6px 10px 5px;
  background: rgba(10,9,7,0.97); border: 1px solid var(--border);
}
.hq-ctx-pill + .hq-ctx-pill { border-left: none; }
.hq-ctx-pill .k { display: block; font-size: 7px; letter-spacing: 2px; color: var(--text-dim); margin-bottom: 3px; }
.hq-ctx-pill .v { display: block; font-size: 10px; letter-spacing: 1px; }
#hq-orbit-area {
  position: relative; width: 396px; height: 410px; flex-shrink: 0;
  background: radial-gradient(ellipse at 50% 46%, rgba(120,216,114,0.025) 0%, transparent 56%);
  max-width: 96vw;
}
.hq-cres-glow  { fill: none; stroke: var(--fac-line, rgba(120,216,114,0.3)); stroke-width: 6; opacity: 0.22; }
.hq-cres-line  { fill: none; stroke: var(--border-hi); stroke-width: 1; stroke-dasharray: 2 5; }
.hq-cres-spoke { fill: none; stroke: var(--border); stroke-width: 0.5; opacity: 0.6; }
#hq-orbit-ring {
  position: absolute; top: 198px; left: 198px; transform: translate(-50%,-50%);
  width: 252px; height: 252px; border-radius: 50%;
  border: 1px dashed var(--border); pointer-events: none; z-index: 1;
}
#hq-orbit-ring.ice-ring  { border-color: rgba(207,85,56,0.22); }
#hq-orbit-ring.sent-ring { border-color: rgba(226,154,63,0.22); }
#hq-radial-center {
  position: absolute; top: 198px; left: 198px; transform: translate(-50%,-50%);
  width: 128px; height: 128px; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, rgba(30,22,14,0.97), rgba(9,8,7,0.99));
  border: 2px solid var(--border-hi);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px; text-align: center; z-index: 4; pointer-events: none;
  transition: border-color 0.3s, box-shadow 0.3s;
}
#hq-radial-center.ice  { border-color: rgba(207,85,56,0.55); box-shadow: 0 0 0 8px rgba(207,85,56,0.06), 0 0 20px rgba(207,85,56,0.1); }
#hq-radial-center.sent { border-color: rgba(226,154,63,0.6);  box-shadow: 0 0 0 8px rgba(226,154,63,0.06), 0 0 20px rgba(226,154,63,0.1); }
#hq-radial-glyph { font-family: 'VT323', monospace; font-size: 26px; line-height: 1; }
#hq-radial-tier  { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; }
#hq-radial-sep   { width: 42px; height: 1px; background: rgba(207,85,56,0.2); margin: 1px 0; }
#hq-radial-state { font-size: 8px; letter-spacing: 1px; }
#hq-radial-hops  { font-size: 8px; letter-spacing: 1px; color: var(--text-dim); }
#hq-radial-label { font-size: 7px; letter-spacing: 1px; color: var(--text-dim); line-height: 1.4; }
.hq-satellite {
  position: absolute;
  background: radial-gradient(circle at 40% 35%, rgba(27,19,12,0.97), rgba(9,8,7,0.99));
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px; text-align: center;
  cursor: pointer; user-select: none;
  transition: transform 0.12s, box-shadow 0.14s, border-color 0.14s;
  -webkit-tap-highlight-color: transparent;
}
.hq-satellite.core-sat {
  width: 92px; height: 92px; border-radius: 50%;
  border: 1px solid var(--border); box-shadow: 0 0 14px rgba(0,0,0,0.5);
  padding: 10px 8px; z-index: 6;
}
.hq-satellite.core-sat:hover:not(.unavail) { transform: scale(1.05); }
.die-ghost  { border-color: rgba(137,177,187,0.55); }
.die-bluff  { border-color: rgba(217,185,143,0.5);  }
.die-combat { border-color: rgba(207,85,56,0.55);   }
.die-other  { border-color: rgba(120,216,114,0.45); }
.hq-satellite.core-sat:hover:not(.unavail).die-ghost  { border-color: var(--cyan);  box-shadow: 0 0 10px rgba(137,177,187,0.25); }
.hq-satellite.core-sat:hover:not(.unavail).die-bluff  { border-color: var(--sand);  box-shadow: 0 0 10px rgba(217,185,143,0.2); }
.hq-satellite.core-sat:hover:not(.unavail).die-combat { border-color: var(--red);   box-shadow: 0 0 10px rgba(207,85,56,0.25); }
.hq-satellite.core-sat:hover:not(.unavail).die-other  { border-color: var(--green); box-shadow: 0 0 10px rgba(120,216,114,0.2); }
.hq-satellite.selected.die-ghost  { border-color:var(--cyan);  box-shadow:0 0 0 4px rgba(137,177,187,0.1),0 0 18px rgba(137,177,187,0.28); background:radial-gradient(circle at 40% 35%,rgba(16,28,34,0.97),rgba(9,8,7,0.99)); }
.hq-satellite.selected.die-bluff  { border-color:var(--sand);  box-shadow:0 0 0 4px rgba(217,185,143,0.1),0 0 18px rgba(217,185,143,0.24); background:radial-gradient(circle at 40% 35%,rgba(36,29,16,0.97),rgba(9,8,7,0.99)); }
.hq-satellite.selected.die-combat { border-color:var(--red);   box-shadow:0 0 0 4px rgba(207,85,56,0.12), 0 0 18px rgba(207,85,56,0.3);   background:radial-gradient(circle at 40% 35%,rgba(38,16,10,0.97),rgba(9,8,7,0.99)); }
.hq-satellite.selected.die-other  { border-color:var(--green); box-shadow:0 0 0 4px rgba(120,216,114,0.1), 0 0 18px rgba(120,216,114,0.22); }
.hq-satellite.unavail { opacity: 0.35; cursor: default; pointer-events: none; }
.hq-satellite.cres-sat {
  width: 72px; height: 72px;
  border: none; box-shadow: none; border-radius: 0;
  clip-path: polygon(12% 0%, 88% 0%, 100% 12%, 100% 88%, 88% 100%, 12% 100%, 0% 88%, 0% 12%);
  padding: 8px 6px; z-index: 5;
}
.hq-satellite.cres-sat:hover:not(.unavail) { transform: scale(1.06); }
.hq-satellite.cres-sat.selected.die-ghost  { background:radial-gradient(circle at 40% 35%,rgba(16,28,34,0.97),rgba(9,8,7,0.99)); }
.hq-satellite.cres-sat.selected.die-bluff  { background:radial-gradient(circle at 40% 35%,rgba(36,29,16,0.97),rgba(9,8,7,0.99)); }
.hq-satellite.cres-sat.selected.die-combat { background:radial-gradient(circle at 40% 35%,rgba(38,16,10,0.97),rgba(9,8,7,0.99)); }
.hq-cres-border { fill: none; stroke-width: 1.5; }
.hq-cres-border.die-ghost  { stroke: rgba(137,177,187,0.5); }
.hq-cres-border.die-bluff  { stroke: rgba(217,185,143,0.45); }
.hq-cres-border.die-combat { stroke: rgba(207,85,56,0.5); }
.hq-cres-border.die-other  { stroke: rgba(120,216,114,0.4); }
.hq-cres-border.unavail    { stroke: rgba(140,119,95,0.22); stroke-dasharray: 3 3; stroke-width: 1; }
.hq-cres-border.selected.die-ghost  { stroke: var(--cyan);  stroke-width: 2; }
.hq-cres-border.selected.die-bluff  { stroke: var(--sand);  stroke-width: 2; }
.hq-cres-border.selected.die-combat { stroke: var(--red);   stroke-width: 2; }
.hq-cres-border.selected.die-other  { stroke: var(--green); stroke-width: 2; }
.sat-name { font-size: 13px; letter-spacing: 3px; color: var(--text-dim); }
.sat-verb { font-size:  9px; letter-spacing: 2px; color: var(--text-dim); opacity: 0.65; }
.sat-note { font-size:  7px; letter-spacing: 1px; color: var(--text-dim); line-height: 1.3; text-transform: uppercase; white-space: pre-line; }
.cres-sat .sat-name { font-size: 10px; letter-spacing: 1px; }
.cres-sat .sat-verb { font-size:  7px; letter-spacing: 1px; }
.hq-satellite.selected .sat-name { color: var(--text); }
.hq-satellite.selected .sat-verb { opacity: 1; }
.hq-satellite.selected.die-ghost  .sat-name { color: var(--cyan); }
.hq-satellite.selected.die-bluff  .sat-name { color: var(--sand); }
.hq-satellite.selected.die-combat .sat-name { color: var(--red); }
.hq-satellite.selected.die-other  .sat-name { color: var(--green); }
#hq-enc-panel {
  width: 100%; background: rgba(10,9,7,0.98);
  border: 1px solid var(--border-hi); padding: 12px 14px 10px;
}
.hq-enc-brow { font-size: 7px; letter-spacing: 3px; color: var(--text-dim); margin-bottom: 6px; }
#hq-enc-head { font-size: 11px; letter-spacing: 2px; margin-bottom: 10px; min-height: 18px; color: var(--text-dim); }
.hq-det-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin-bottom: 10px; }
.hq-det { border: 1px solid rgba(61,43,28,0.65); padding: 7px 8px; background: rgba(9,8,7,0.5); min-height: 52px; }
.hq-det .k { display: block; font-size: 7px; letter-spacing: 2px; color: var(--text-dim); margin-bottom: 4px; }
.hq-det .v { display: block; font-size: 9px; letter-spacing: 0.5px; line-height: 1.5; color: var(--text-dim); }
.hq-det .v strong { color: var(--text); font-weight: normal; }
.hq-pnl-actions { display: flex; flex-direction: column; gap: 8px; }
.hq-pnl-btns { display: flex; justify-content: flex-end; align-items: center; gap: 8px; }
#hq-sel-copy { font-size: 9px; letter-spacing: 1px; color: var(--text-dim); white-space: nowrap; }
#hq-sel-copy strong { color: var(--green); font-weight: normal; }
#hq-radial-commit {
  padding: 6px 14px; background: transparent;
  border: 1px solid var(--green-dim); color: var(--green);
  font-family: inherit; font-size: 10px; letter-spacing: 2px; cursor: pointer;
  transition: all 0.14s;
}
#hq-radial-commit:hover:not(:disabled) { background: rgba(120,216,114,0.07); }
#hq-radial-commit:disabled { opacity: 0.3; cursor: default; }
#hq-radial-retreat {
  padding: 6px 14px; background: transparent;
  border: 1px solid var(--border); color: var(--text-dim);
  font-family: inherit; font-size: 10px; letter-spacing: 2px; cursor: pointer;
  transition: all 0.14s;
}
#hq-radial-retreat:hover { border-color: var(--red); color: var(--red); }

/* ── Encounter Result Card ───────────────────────────────── */
#hq-encounter-result {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(2,12,2,0.8);
  z-index: 52; cursor: pointer;
}
#hq-encounter-result-inner {
  background: var(--bg2);
  border: 1px solid var(--border);
  padding: 22px 28px 18px;
  min-width: 240px; max-width: 300px;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  text-align: center;
}
#hq-encounter-result-inner.success { border-color: var(--green); box-shadow: 0 0 30px rgba(0,255,65,0.12); }
#hq-encounter-result-inner.failure { border-color: var(--red);   box-shadow: 0 0 30px rgba(255,34,68,0.12); }
#hq-enc-result-action { font-size: 11px; letter-spacing: 3px; color: var(--text-dim); text-transform: uppercase; }
#hq-enc-result-face   { font-size: 22px; letter-spacing: 2px; color: var(--green); }
#hq-enc-result-vs     { font-size: 11px; letter-spacing: 1px; color: var(--text-dim); }
#hq-enc-result-outcome { font-size: 13px; letter-spacing: 3px; text-transform: uppercase; }
#hq-enc-result-outcome.success { color: var(--green); }
#hq-enc-result-outcome.failure { color: var(--red); }
#hq-enc-result-meta   { font-size: 11px; color: var(--text-dim); letter-spacing: 1px; }

/* ── Encounter Panel v2 (entity + die lane shell) (#770) ── */
#hq-encounter-v2 {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(4,6,4,0.72);
  z-index: 52;
}
#hq-ev2-wrap {
  display: flex; flex-direction: column;
  width: 878px; max-width: 96vw; max-height: 90vh;
  background: rgba(1,6,1,0.98);
  border: 1px solid rgba(0,105,34,0.38);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.9), 0 0 80px rgba(0,0,0,0.85);
}
#hq-ev2-body {
  flex: 1; display: grid; grid-template-columns: 252px 1fr; overflow: hidden; min-height: 0;
}
#hq-ev2-left {
  border-right: 1px solid var(--border);
  border-left: 2px solid rgba(185,80,0,0.32);
  display: flex; flex-direction: column; align-items: center;
  padding: 14px 14px 12px;
  background: linear-gradient(180deg, rgba(22,8,0,0.24) 0%, rgba(10,4,0,0.30) 100%);
  overflow: hidden;
  transition: border-left-color 0.2s;
  width: 252px; flex-shrink: 0;
}
#hq-ev2-entity-svg {
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  width: 150px; height: 150px;
}
#hq-ev2-header {
  text-align: center; margin-top: 6px; width: 100%;
}
#hq-ev2-contact-badge {
  font-size: 10px; letter-spacing: 1.5px; display: inline-block; margin-bottom: 3px;
}
.hq-ev2-blink { animation: blink 0.7s step-end infinite; }
#hq-ev2-entity-name {
  font-size: 19px; letter-spacing: 3.5px; text-align: center; margin-top: 2px;
}
#hq-ev2-entity-sub {
  font-size: 9px; letter-spacing: 2px; text-align: center; color: var(--text-dim); margin-top: 3px;
}
.hq-ev2-rule {
  width: 100%; border: none; border-top: 1px solid #0a120a; margin: 10px 0 9px;
}
#hq-ev2-stats {
  width: 100%; display: flex; flex-direction: column; gap: 3px;
}
.hq-ev2-stat-row {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 0.8rem; padding: 2px 0; border-bottom: 1px solid #081108;
}
.hq-ev2-stat-row:last-child { border-bottom: none; }
.hq-ev2-stat-row .k { color: #315831; }
.hq-ev2-stat-row .v { color: #4f8a4f; }
#hq-ev2-consequences {
  width: 100%; display: flex; flex-direction: column; gap: 3px;
}
.hq-ev2-cons-row {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 0.8rem; padding: 2px 0; border-bottom: 1px solid #081108;
}
.hq-ev2-cons-row:last-child { border-bottom: none; }
.hq-ev2-cons-row .label { color: #315831; }
.hq-ev2-cons-row .val   { color: #4f8a4f; }
.hq-ev2-sev-warn   .val { color: rgba(218,148,28,0.86); }
.hq-ev2-sev-danger .val { color: rgba(215,55,48,0.90);  }
.hq-ev2-sev-gold   .val { color: rgba(220,178,32,0.86); }
.hq-ev2-sev-purple .val { color: rgba(190,60,235,0.88); }
#hq-ev2-right {
  flex: 1; display: flex; align-items: stretch; min-height: 0; overflow: hidden;
}

/* ── Lane grid (#771) ── */
#hq-ev2-lanes {
  display: flex; flex-direction: row; width: 100%; height: 100%; gap: 0; overflow: hidden;
}
.hq-ev2-lane {
  flex: 1; display: flex; flex-direction: column;
  border-right: 1px solid var(--border);
  border-top: 3px solid transparent;
  cursor: pointer;
  overflow: hidden;
  transition: border-top-color 0.15s, opacity 0.12s;
}
.hq-ev2-lane:last-child { border-right: none; }
.hq-ev2-lane.active {
  border-top-color: rgba(var(--lane-accent-rgb), 0.85);
  background:
    linear-gradient(180deg, rgba(var(--lane-accent-rgb),0.13), rgba(3,20,7,0.94) 34%),
    rgba(4,22,8,0.96);
  box-shadow:
    inset 0 0 0 1px rgba(var(--lane-accent-rgb),0.20),
    inset 0 12px 26px rgba(var(--lane-accent-rgb),0.07);
}
.hq-ev2-lane:not(.active) { opacity: 0.72; }
/* Lane header */
.ev2-lane-hdr {
  padding: 9px 11px 7px; border-bottom: 1px solid var(--border); flex-shrink: 0;
}
.hq-ev2-lane.active .ev2-lane-hdr {
  border-bottom-color: rgba(var(--lane-accent-rgb), 0.34);
  background: rgba(var(--lane-accent-rgb), 0.07);
}
.ev2-lane-action { font-size: 0.8rem; color: #5eaa5e; letter-spacing: 2px; }
.hq-ev2-lane.active .ev2-lane-action {
  color: rgba(var(--lane-accent-rgb), 1);
  text-shadow: 0 0 12px rgba(var(--lane-accent-rgb), 0.48);
}
.ev2-lane-die  { font-size: 0.8rem; color: #365f36; letter-spacing: 0.8px; margin-top: 2px; }
.ev2-lane-desc { font-size: 0.8rem; color: #315a31; margin-top: 3px; line-height: 1.5; }
.hq-ev2-lane.active .ev2-lane-die  { color: #5c9a5c; }
.hq-ev2-lane.active .ev2-lane-desc { color: #527852; }
/* Face rows */
.ev2-face-row {
  flex: 1; display: flex; flex-direction: column; justify-content: center;
  padding: 9px 12px; border-bottom: 1px solid #060c06; gap: 4px; min-height: 0;
}
.ev2-face-row:last-child { border-bottom: none; }
.ev2-face-row.out-empty { opacity: 0.04; }
.ev2-face-top  { display: flex; align-items: center; gap: 7px; }
.ev2-face-icon { font-size: 14px; line-height: 1; }
.ev2-face-name { font-size: 0.8rem; letter-spacing: 1.2px; }
.ev2-face-pips { margin-left: auto; display: flex; gap: 4px; align-items: center; padding-right: 2px; }
.pip {
  display: inline-block; width: 8px; height: 8px;
  border-radius: 50%; flex-shrink: 0; opacity: 0.62;
}
.hq-ev2-lane.active .pip { opacity: 0.88; }
.ev2-face-result { font-size: 0.8rem; letter-spacing: 0.4px; }
.ev2-face-meta  { display: flex; gap: 8px; align-items: center; margin-top: 1px; }
.ev2-face-noise, .ev2-face-alert { font-size: 0.8rem; letter-spacing: 0.5px; }
/* Outcome palette — must match the outcome strings FaceOutcome() actually
   emits (src/nc_hq_encounter.pas): out-clean, out-partial, out-fail,
   out-noisy. Colors match the locked reference,
   designs/encounter-types-mockup-v3.html. (#905) */
.out-clean   .pip { background: #4aaa4a; }
.out-partial .pip { background: #a88c30; }
.out-fail    .pip { background: #963232; }
.out-noisy   .pip { background: #c07018; }
.out-empty   .pip { background: #2a3a2a; }
.out-empty .ev2-face-name { color: #0c140c; }
.out-clean   .ev2-face-icon, .out-clean   .ev2-face-name { color: #4aaa4a; }
.out-clean   .ev2-face-result                             { color: #6adc6a; }
.out-clean   .ev2-face-noise, .out-clean   .ev2-face-alert { color: #264826; }
.out-partial .ev2-face-icon, .out-partial .ev2-face-name { color: #a88c30; }
.out-partial .ev2-face-result                             { color: #d4b040; }
.out-partial .ev2-face-noise, .out-partial .ev2-face-alert { color: #806420; }
.out-fail    .ev2-face-icon, .out-fail    .ev2-face-name  { color: #963232; }
.out-fail    .ev2-face-result                              { color: #cc4444; }
.out-fail    .ev2-face-noise, .out-fail    .ev2-face-alert { color: #7a2828; }
.out-noisy   .ev2-face-icon, .out-noisy   .ev2-face-name  { color: #c07018; }
.out-noisy   .ev2-face-result                              { color: #e09020; }
.out-noisy   .ev2-face-noise, .out-noisy   .ev2-face-alert { color: rgba(200,115,10,0.85); }
/* Active lane — brightness lift on result line */
.hq-ev2-lane.active .out-clean   .ev2-face-result { color: #88f088; text-shadow: 0 0 10px rgba(40,220,40,0.28); }
.hq-ev2-lane.active .out-partial .ev2-face-result { color: #ecc84a; text-shadow: 0 0 10px rgba(220,185,45,0.22); }
.hq-ev2-lane.active .out-fail    .ev2-face-result { color: #e05252; text-shadow: 0 0 10px rgba(225,65,60,0.24); }
.hq-ev2-lane.active .out-noisy   .ev2-face-result { color: #f4a428; text-shadow: 0 0 10px rgba(235,155,28,0.22); }
.hq-ev2-lane.active .ev2-face-icon,
.hq-ev2-lane.active .ev2-face-name { filter: brightness(1.22); }
.hq-ev2-lane.active .ev2-face-row { border-bottom-color: #0c1a0c; }
#hq-ev2-actions {
  height: 56px; border-top: 1px solid var(--border);
  display: flex; align-items: center; justify-content: flex-start;
  padding: 0 12px; gap: 8px; flex-shrink: 0;
}
#hq-ev2-tools {
  display: flex; gap: 8px; align-items: center; flex: 1;
}
.hq-ev2-tool {
  width: 152px; height: 50px;
  display: flex; flex-direction: column; justify-content: center;
  padding: 0 11px; border-radius: 2px; cursor: pointer;
  border: 1px solid transparent; box-sizing: border-box; user-select: none;
}
.hq-ev2-tool.t-ready {
  border: 1px solid rgba(160,110,8,0.42);
  background: rgba(14,10,2,0.88);
  box-shadow: 0 0 6px rgba(180,130,10,0.12);
}
.hq-ev2-tool.t-ready:hover {
  border-color: rgba(200,150,15,0.72);
  box-shadow: 0 0 12px rgba(200,150,12,0.22);
}
.hq-ev2-tool.t-selected {
  border: 1px solid rgba(230,182,22,0.75);
  border-top: 3px solid rgba(230,182,22,0.95);
  background: rgba(18,13,2,0.95);
  box-shadow: 0 0 16px rgba(220,172,18,0.28), inset 0 0 8px rgba(200,152,10,0.08);
}
.hq-ev2-tool.t-recommended {
  border: 1px solid rgba(218,168,18,0.62);
  border-top: 2px solid rgba(218,168,18,0.82);
  background: rgba(14,10,2,0.90);
  animation: tool-pulse 2.8s ease-in-out infinite;
}
.hq-ev2-tool.t-spent {
  border: 1px solid rgba(80,60,8,0.28);
  background: rgba(8,6,1,0.88);
  cursor: default;
}
.hq-ev2-tool.t-unavailable {
  border: 1px dashed rgba(55,40,2,0.28);
  background: rgba(6,5,1,0.85);
  cursor: default; opacity: 0.55;
}
.hq-ev2-tool .tool-name  { font-size: 0.8rem; letter-spacing: 0.6px; line-height: 1.3; }
.hq-ev2-tool .tool-charge { font-size: 0.8rem; letter-spacing: 0.4px; line-height: 1.2; margin-top: 2px; }
.tool-match-pip { font-size: 9px; color: rgba(240,200,40,0.92); margin-right: 3px; }
.hq-ev2-tool.t-ready    .tool-name   { color: rgba(210,168,32,0.92); }
.hq-ev2-tool.t-ready    .tool-charge { color: rgba(225,178,40,0.88); }
.hq-ev2-tool.t-selected .tool-name   { color: rgba(240,200,42,0.98); }
.hq-ev2-tool.t-selected .tool-charge { color: rgba(240,200,42,0.98); }
.hq-ev2-tool.t-recommended .tool-name   { color: rgba(210,168,32,0.92); }
.hq-ev2-tool.t-recommended .tool-charge { color: rgba(225,178,40,0.88); }
.hq-ev2-tool.t-spent    .tool-name   { color: rgba(100,75,8,0.52); }
.hq-ev2-tool.t-spent    .tool-charge { color: rgba(90,65,6,0.45); }
.hq-ev2-tool.t-unavailable .tool-name   { color: rgba(80,60,6,0.45); }
.hq-ev2-tool.t-unavailable .tool-charge { color: rgba(70,50,4,0.38); }
@keyframes tool-pulse {
  0%, 100% { box-shadow: 0 0 6px rgba(210,162,14,0.18); }
  50%       { box-shadow: 0 0 14px rgba(210,162,14,0.36); }
}
#hq-ev2-retreat {
  margin-left: auto;
  background: none; border: 1px solid rgba(100,20,20,0.35); color: rgba(170,45,45,0.38);
  font-family: var(--font); font-size: 0.8rem; padding: 5px 11px; cursor: pointer;
  letter-spacing: 1px; transition: border-color 0.14s, color 0.14s;
}
#hq-ev2-retreat:hover { border-color: var(--red); color: var(--red); }
#hq-ev2-act {
  background: rgba(0,22,8,0.96); border: 2px solid rgba(0,210,75,0.72);
  color: var(--cyan); font-family: var(--font); font-size: 12px;
  height: 40px; padding: 0 26px; cursor: pointer; letter-spacing: 1.6px;
  box-shadow: 0 0 18px rgba(0,229,255,0.22), inset 0 0 12px rgba(0,180,60,0.08);
  text-shadow: 0 0 10px rgba(0,229,255,0.40);
  transition: opacity 0.14s;
}
#hq-ev2-act:disabled { opacity: 0.3; cursor: default; }
/* Pending state — locked while awaiting encounter_resolve (#773) */
.ev2-pending #hq-ev2-act,
.ev2-pending #hq-ev2-retreat { opacity: 0.45; cursor: default; pointer-events: none; }
.ev2-pending #hq-ev2-lanes,
.ev2-pending #hq-ev2-tools  { pointer-events: none; }

/* ── Result state (#774) ── */
#hq-ev2-result {
  flex: 1; display: flex; flex-direction: column;
  padding: 24px 28px; position: relative; overflow-y: auto;
  background: rgba(28,14,0,0.22);
}
#hq-ev2-result::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg,
    transparent 0%, rgba(185,145,30,0.45) 28%,
    rgba(210,165,40,0.68) 50%,
    rgba(185,145,30,0.45) 72%, transparent 100%);
}
.ev2-res-verb {
  font-size: 28px; letter-spacing: 4px; line-height: 1; margin-bottom: 4px;
}
.ev2-res-verb.v-clean   { color: #4adc6a; text-shadow: 0 0 18px rgba(40,220,60,0.30); }
.ev2-res-verb.v-partial { color: #d4aa30; text-shadow: 0 0 18px rgba(210,165,30,0.28); }
.ev2-res-verb.v-noisy   { color: #e07838; text-shadow: 0 0 18px rgba(225,100,40,0.28); }
.ev2-res-verb.v-fail    { color: #e05252; text-shadow: 0 0 18px rgba(225,60,56,0.28); }
.ev2-res-subtitle {
  font-size: 0.8rem; color: rgba(160,110,20,0.55); letter-spacing: 1.5px; margin-bottom: 14px;
}
.ev2-res-rule {
  width: 100%; border: none; border-top: 1px solid rgba(55,36,0,0.36); margin: 4px 0 12px;
}
.ev2-res-delta-table {
  display: grid; grid-template-columns: 110px 1fr; gap: 5px 14px; margin-bottom: 14px;
}
.ev2-rd-label { font-size: 0.8rem; color: #264826; letter-spacing: 1px; align-self: baseline; }
.ev2-rd-value { font-size: 0.8rem; color: #3a6a3a; letter-spacing: 0.4px; align-self: baseline; }
.ev2-rd-value.warn { color: rgba(195,145,30,0.85); }
.ev2-rd-value.ok   { color: rgba(40,120,60,0.68); }
.ev2-watchdog-hdr {
  font-size: 0.8rem; color: rgba(160,100,20,0.45); letter-spacing: 1.5px; margin-bottom: 5px;
}
.ev2-watchdog-table { display: flex; flex-direction: column; gap: 3px; width: 100%; }
.ev2-watchdog-row {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 0.8rem; color: #1e3a1e; padding: 2px 0; border-bottom: 1px solid #070d07;
}
.ev2-watchdog-row:last-child { border-bottom: none; }
.ev2-watchdog-row .wv       { color: #3a6a3a; }
.ev2-watchdog-row .wv.watch { color: rgba(185,120,20,0.65); }
.ev2-res-noise-text {
  font-size: 0.8rem; color: rgba(80,120,80,0.50); letter-spacing: 0.3px;
  line-height: 1.7; margin-top: 10px; border-top: 1px solid #060e06; padding-top: 8px;
}
/* Entity panel — dimmed in resolved state */
#hq-ev2-left.ev2-resolved { opacity: 0.68; transition: opacity 0.25s; }
/* Badge states for resolved encounters */
.hq-ev2-badge-logged  { font-size: 10px; letter-spacing: 1.5px; display: inline-block;
                         margin-bottom: 3px; color: rgba(180,130,30,0.72); }
.hq-ev2-badge-cleared { font-size: 10px; letter-spacing: 1.5px; display: inline-block;
                         margin-bottom: 3px; color: rgba(40,180,80,0.80); }
/* Result footer buttons */
#hq-ev2-result-actions { margin-left: auto; display: flex; gap: 10px; align-items: center; }
.btn-ev2-log {
  background: none; border: none;
  color: rgba(40,70,40,0.32); font-family: var(--font); font-size: 0.8rem;
  padding: 5px 4px; cursor: pointer; letter-spacing: 1px;
  text-decoration: underline; text-decoration-color: rgba(40,70,40,0.16);
  text-underline-offset: 3px;
}
.btn-ev2-enter {
  background: rgba(0,16,6,0.92); border: 1px solid rgba(0,180,60,0.55);
  color: var(--cyan); font-family: var(--font); font-size: 0.8rem;
  padding: 6px 20px; cursor: pointer; letter-spacing: 1.4px;
  box-shadow: 0 0 12px rgba(0,229,255,0.12);
  transition: border-color 0.14s, box-shadow 0.14s;
}
.btn-ev2-enter:hover {
  border-color: rgba(0,220,80,0.80);
  box-shadow: 0 0 18px rgba(0,229,255,0.20);
}
.btn-ev2-continue {
  background: rgba(0,16,6,0.92); border: 1px solid rgba(0,229,255,0.55);
  color: var(--cyan); font-family: var(--font); font-size: 0.8rem;
  padding: 6px 20px; cursor: pointer; letter-spacing: 1.4px;
  box-shadow: 0 0 12px rgba(0,229,255,0.12);
  transition: border-color 0.14s, box-shadow 0.14s;
}
.btn-ev2-continue:hover {
  border-color: rgba(0,229,255,0.85);
  box-shadow: 0 0 18px rgba(0,229,255,0.26);
}

#hq-document-panel {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(2,12,2,0.88);
  z-index: 53;
}
#hq-document-inner {
  background: var(--bg2);
  border: 1px solid var(--cyan);
  box-shadow: 0 0 40px rgba(0,229,255,0.10), 0 0 120px rgba(0,0,0,0.9);
  padding: 20px 28px 18px;
  display: flex; flex-direction: column; gap: 12px;
  width: min(520px, 90%); max-height: 80vh; overflow-y: auto;
}
#hq-document-header { font-size: 9px; letter-spacing: 3px; color: var(--cyan); text-transform: uppercase; }
#hq-document-fields { display: flex; flex-direction: column; gap: 4px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 8px 0; }
.hq-doc-field { display: flex; gap: 10px; font-size: 11px; line-height: 1.6; }
.hq-doc-key { color: var(--text-dim); letter-spacing: 2px; width: 36px; flex-shrink: 0; text-align: right; }
#hq-document-body { font-size: 11px; line-height: 1.8; color: var(--text); white-space: pre-wrap; }
#hq-document-btns { display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--border); padding-top: 12px; }
#hq-document-btns button {
  background: none; border: 1px solid var(--border); color: var(--green);
  font-family: inherit; font-size: 11px; letter-spacing: 1px;
  padding: 7px 14px; cursor: pointer; flex: 1; min-width: 100px; text-align: left;
  transition: background 0.15s, border-color 0.15s;
}
#hq-document-btns button:hover { background: rgba(0,229,255,0.07); border-color: var(--cyan); }
#hq-scan-panel {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(2,12,2,0.84);
  z-index: 54;
}
#hq-scan-inner {
  background: var(--bg2);
  border: 1px solid var(--red);
  box-shadow: 0 0 40px rgba(255,34,68,0.22), 0 0 120px rgba(0,0,0,0.9);
  padding: 24px 32px 20px;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  min-width: 300px;
}
#hq-scan-title {
  font-size: 10px; letter-spacing: 4px; color: var(--red);
  text-transform: uppercase;
}
#hq-scan-meta { font-size: 11px; color: var(--text-dim); text-align: center; line-height: 1.7; }
#hq-scan-btns { display: flex; flex-direction: column; gap: 8px; width: 100%; }
#hq-scan-btns button {
  background: none; border: 1px solid var(--border); color: var(--green);
  font-family: inherit; font-size: 11px; letter-spacing: 1px;
  padding: 8px 14px; cursor: pointer; text-align: left;
  transition: background 0.15s, border-color 0.15s;
}
#hq-scan-btns button:hover { background: rgba(255,34,68,0.07); border-color: var(--red); }

/* ── NPC picker (multi-NPC selection) ── */
#npc-pick-panel {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(2,12,2,0.82);
  z-index: 55;
}
#npc-pick-inner {
  background: var(--bg2);
  border: 1px solid var(--border-hi);
  box-shadow: 0 0 40px rgba(0,255,65,0.08), 0 0 120px rgba(0,0,0,0.9);
  padding: 24px 32px 20px;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  min-width: 260px;
}
#npc-pick-title {
  font-size: 9px; letter-spacing: 4px; color: var(--text-dim);
  text-transform: uppercase;
}
#npc-pick-btns { display: flex; flex-direction: column; gap: 8px; width: 100%; }
#npc-pick-btns button {
  background: none; border: 1px solid var(--border); color: var(--green);
  font-family: inherit; font-size: 11px; letter-spacing: 1px;
  padding: 8px 14px; cursor: pointer; text-align: left;
  transition: background 0.15s, border-color 0.15s;
}
#npc-pick-btns button:hover { background: rgba(0,255,65,0.07); border-color: var(--green); }

/* ── HQ decoy node picker ── */
#hq-decoy-picker {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(2,12,2,0.78);
  z-index: 56;
}
#hq-decoy-picker-inner {
  background: var(--bg2);
  border: 1px solid var(--amber);
  box-shadow: 0 0 40px rgba(226,154,63,0.12), 0 0 120px rgba(0,0,0,0.9);
  padding: 24px 32px 20px;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  min-width: 260px; max-height: 70vh;
}
#hq-decoy-picker-title {
  font-size: 11px; letter-spacing: 4px; color: var(--amber);
  text-transform: uppercase;
}
#hq-decoy-picker-hint {
  font-size: 11px; letter-spacing: 1px; color: var(--text-dim);
}
#hq-decoy-nodes {
  display: flex; flex-direction: column; gap: 6px; width: 100%;
  overflow-y: auto; max-height: 42vh;
}
#hq-decoy-nodes button {
  background: none; border: 1px solid var(--border); color: var(--amber);
  font-family: inherit; font-size: 11px; letter-spacing: 1px;
  padding: 7px 14px; cursor: pointer; text-align: left;
  transition: background 0.12s, border-color 0.12s;
}
#hq-decoy-nodes button:hover { background: rgba(226,154,63,0.08); border-color: var(--amber); }
#hq-decoy-cancel {
  background: none; border: 1px solid var(--border); color: var(--text-dim);
  font-family: inherit; font-size: 11px; letter-spacing: 2px;
  padding: 6px 18px; cursor: pointer; margin-top: 4px;
  transition: color 0.12s, border-color 0.12s;
}
#hq-decoy-cancel:hover { color: var(--red); border-color: var(--red); }

/* ── HQ safenode bank / exit / UPS popups ── */
#hq-bank-popup, #hq-exit-popup, #hq-ups-popup {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(2,12,2,0.82);
  z-index: 51;
}
#hq-bank-inner, #hq-exit-inner, #hq-ups-inner {
  background: var(--bg2);
  padding: 24px 32px 20px;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  min-width: 300px;
}
#hq-bank-inner { border: 1px solid var(--amber); box-shadow: 0 0 40px rgba(255,176,0,0.12), 0 0 120px rgba(0,0,0,0.9); }
#hq-exit-inner { border: 1px solid var(--green);  box-shadow: 0 0 40px rgba(0,255,65,0.12),  0 0 120px rgba(0,0,0,0.9); }
#hq-ups-inner  { border: 1px solid var(--cyan);   box-shadow: 0 0 40px rgba(0,220,255,0.12), 0 0 120px rgba(0,0,0,0.9); }
#hq-bank-title { font-size: 10px; letter-spacing: 4px; color: var(--amber); text-transform: uppercase; }
#hq-exit-title { font-size: 10px; letter-spacing: 4px; color: var(--green); text-transform: uppercase; }
#hq-ups-title  { font-size: 10px; letter-spacing: 4px; color: var(--cyan);  text-transform: uppercase; }
#hq-bank-meta, #hq-exit-meta, #hq-ups-meta { font-size: 11px; color: var(--text-dim); text-align: center; line-height: 1.7; }
#hq-bank-btns, #hq-exit-btns, #hq-ups-btns { display: flex; flex-direction: column; gap: 8px; width: 100%; }
#hq-bank-btns button, #hq-exit-btns button, #hq-ups-btns button {
  background: none; border: 1px solid var(--border); color: var(--green);
  font-family: inherit; font-size: 11px; letter-spacing: 1px;
  padding: 8px 14px; cursor: pointer; text-align: left;
  transition: background 0.15s, border-color 0.15s;
}
#hq-bank-btns button:hover, #hq-exit-btns button:hover { background: rgba(0,255,65,0.07); border-color: var(--green); }
#hq-ups-btns button:hover { background: rgba(0,220,255,0.07); border-color: var(--cyan); }
#hq-ups-tap-btn:disabled { opacity: 0.45; pointer-events: none; }

/* ── Right sidebar: character profile ── */
#profile {
  grid-column: 3; grid-row: 2;
  display: flex; flex-direction: column;
  --text-dim: #b29d82;
  background:
    linear-gradient(180deg, rgba(24,18,13,0.98), rgba(10,8,6,0.99));
  border-left: 1px solid var(--border-hi);
  overflow: hidden;
}
.char-stats { padding: 4px 10px; font-size: 12px; line-height: 1.9; color: #cec0ad; }
.runner-file-meta {
  padding-top: 10px;
  padding-bottom: 6px;
}
.stat-row { display: flex; justify-content: space-between; align-items: center; }
.stat-label { color: #c1ac8e; font-size: 11px; letter-spacing: 1px; text-transform: uppercase; }
.stat-val { color: var(--sand); font-size: 13px; }
.stat-bar { height: 3px; background: var(--border); border-radius: 2px; margin: 1px 0 5px; overflow: hidden; }
.stat-fill { height: 100%; background: var(--sand); box-shadow: 0 0 5px var(--sand); transition: width .4s; }
.stat-fill.amber { background: var(--amber); box-shadow: 0 0 5px var(--amber); }
.stat-fill.red   { background: var(--red);   box-shadow: 0 0 5px var(--red); }
.stat-fill.fac-kensei  { background: #e29a3f; box-shadow: 0 0 6px rgba(226,154,63,0.45); }
.stat-fill.fac-vault   { background: #89b1bb; box-shadow: 0 0 6px rgba(137,177,187,0.4); }
.stat-fill.fac-assembly    { background: #cf5538; box-shadow: 0 0 6px rgba(207,85,56,0.42); }
.stat-fill.fac-civic   { background: #8e87c9; box-shadow: 0 0 6px rgba(142,135,201,0.38); }
.stat-fill.fac-kessler { background: #d8eaff; box-shadow: 0 0 6px rgba(216,234,255,0.35); }
.exposure-risk-row {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-top: 3px;
}
.exposure-note { color: var(--text-dim); font-size: 10px; line-height: 1.4; }
.risk-word { font-size: 9px; letter-spacing: 2px; color: var(--text-dim); text-transform: uppercase; }
.risk-word[data-level="warm"]     { color: var(--text-dim); opacity: 0.85; }
.risk-word[data-level="elevated"] { color: var(--amber); }
.risk-word[data-level="hot"]      { color: var(--orange); }
.risk-word[data-level="critical"] { color: var(--red); text-shadow: 0 0 6px rgba(207,85,56,0.4); }
.faction-pressure-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pressure-row {
  display: flex;
  flex-direction: column;
}
.pressure-row.hot .pressure-head {
  text-shadow: 0 0 6px rgba(226,154,63,0.12);
}
.pressure-row.flashpoint .pressure-head {
  text-shadow: 0 0 8px rgba(207,85,56,0.18);
}
.pressure-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 1px;
}
.pressure-state {
  color: #c1ac8e;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.pressure-note {
  color: #ad987f;
  font-size: 10px;
  line-height: 1.45;
  letter-spacing: 0.3px;
  margin-top: 2px;
}
.stat-label.fac-kensei  { color: #d5a35b; }
.stat-label.fac-vault   { color: #8eb7c2; }
.stat-label.fac-assembly    { color: #cb705b; }
.stat-label.fac-civic   { color: #a29ad2; }
.stat-label.fac-kessler { color: #b0caeb; }
.city-intel-panel {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.intel-block {
  padding: 7px 8px 6px;
  border: 1px solid rgba(92,63,38,0.68);
  border-left: 2px solid rgba(126,79,29,0.58);
  background: linear-gradient(180deg, rgba(30,22,16,0.88), rgba(13,10,8,0.94));
}
.intel-label {
  color: #c1ac8e;
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 3px;
}
.intel-value {
  color: #d2c4b2;
  font-size: 11px;
  line-height: 1.45;
}
.intel-value strong {
  color: var(--amber);
  font-weight: normal;
}
.hdivider { border: none; border-top: 1px solid var(--border); margin: 4px 10px; }

/* ── Status bar ── */
#statusbar {
  grid-column: 1 / -1; grid-row: 3;
  display: flex; align-items: center; gap: 12px; padding: 0 12px;
  background: linear-gradient(180deg, rgba(18,14,11,0.96), rgba(11,9,7,0.98));
  border-top: 1px solid var(--border-hi);
  font-size: 9px; letter-spacing: 1px; color: var(--text-dim);
}
#statusbar .spacer { flex: 1; }


/* ── Connect overlay ── */
#overlay {
  position: fixed; inset: 0; background: rgba(8,6,5,.95);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  z-index: 1000; font-family: 'VT323', monospace;
  background-image: repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(226,154,63,.018) 2px,rgba(226,154,63,.018) 4px);
}
.ov-head {
  width: 360px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 10px;
  color: var(--text-dim);
  font-size: 10px;
  letter-spacing: 3px;
  text-transform: uppercase;
}
.ov-head-id { color: var(--amber); }
.ov-logo {
  position: relative;
  display: inline-block;
  padding: 7px 22px 5px;
  border: 1px solid rgba(226,154,63,0.34);
  border-left-width: 4px;
  border-right-width: 4px;
  background: linear-gradient(180deg, rgba(43,31,22,0.94), rgba(15,11,8,0.99));
  box-shadow: inset 0 1px 0 rgba(255,220,176,0.08), inset 0 -1px 0 rgba(0,0,0,0.42), 0 0 18px rgba(226,154,63,0.12);
  font-size: 52px;
  color: var(--green);
  letter-spacing: 5px;
  text-shadow: 0 0 10px rgba(120,216,114,0.26), 0 0 2px rgba(195,255,206,0.22);
  animation: glow-pulse 2.4s ease-in-out infinite;
  margin-bottom: 2px;
}
.ov-logo-glitch::before,
.ov-logo-glitch::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
  opacity: 0;
}
.ov-logo-glitch::before {
  color: rgba(137,177,187,0.75);
  clip-path: polygon(0 0, 100% 0, 100% 42%, 0 42%);
  animation: ov-glitch-top 6.4s infinite;
}
.ov-logo-glitch::after {
  color: rgba(207,85,56,0.72);
  clip-path: polygon(0 58%, 100% 58%, 100% 100%, 0 100%);
  animation: ov-glitch-bot 6.4s infinite;
}
.ov-sub  { font-size: 13px; color: var(--text-dim); letter-spacing: 5px; margin-bottom: 18px; }
.ov-rule { width: 360px; border: none; border-top: 1px solid var(--border); margin-bottom: 20px; }
.ov-prompt-block {
  width: 360px;
  margin-bottom: 22px;
  padding: 14px 16px 12px;
  border: 1px solid rgba(226,154,63,0.22);
  background: rgba(10,9,7,0.52);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.24);
}
.ov-prompt-row {
  display: grid;
  grid-template-columns: 14px 86px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}
.ov-prompt-row + .ov-prompt-row { margin-top: 10px; }
.ov-prompt-glyph {
  color: var(--amber);
  font-size: 14px;
  line-height: 1;
}
.ov-prompt-label {
  color: var(--text-dim);
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.ov-field  { display: flex; align-items: center; min-width: 0; }
.ov-field input {
  flex: 1; background: #090706; border: 1px solid var(--border-hi); color: var(--text);
  font-family: var(--font); font-size: 13px; padding: 7px 10px;
  outline: none; letter-spacing: 1px;
}
.ov-field input:focus { border-color: var(--amber); box-shadow: 0 0 8px rgba(226,154,63,.22); }
.ov-field input::placeholder { color: var(--text-dim); }
.ov-field-server { margin-top: 4px; opacity: 0.55; }
.ov-field-server .ov-prompt-label { font-size: 11px; }
.ov-field-server input { font-size: 11px; color: var(--text-dim); border-color: var(--border); }
#connect-btn {
  background: transparent; border: 1px solid var(--amber); color: var(--amber);
  font-family: 'VT323', monospace; font-size: 18px; letter-spacing: 4px;
  padding: 10px 36px; cursor: pointer; text-transform: uppercase; transition: all .2s;
  margin-bottom: 12px;
}
#connect-btn:hover { background: var(--amber); color: #0d0b08; box-shadow: 0 0 14px rgba(226,154,63,0.28), 0 0 28px rgba(226,154,63,0.18); }
#connect-btn:disabled { opacity: 0.4; cursor: default; }
.ov-status { font-size: 14px; color: var(--amber); letter-spacing: 2px; height: 20px; margin-bottom: 16px; }
.ov-hint { font-size: 11px; color: var(--text-dim); letter-spacing: 1px; opacity: 0.6; }
/* ── NPC panel — native character interaction card ── */
#npc-panel {
  position: absolute; inset: 0; z-index: 60;
  pointer-events: auto;
  background: rgba(9,8,7,0.98);
  display: none; flex-direction: column;
  font-family: 'Share Tech Mono', monospace;
  overflow: hidden;
}
#npc-panel.active { display: flex; }
#npc-panel .npc-header {
  border-bottom: 1px solid var(--border); padding: 8px 14px;
  color: var(--amber); font-size: 11px; letter-spacing: 3px;
  display: flex; justify-content: space-between; align-items: center;
}
#npc-panel .npc-header .npc-title { color: var(--text); font-size: 13px; letter-spacing: 2px; }
#npc-panel .npc-body {
  display: grid; grid-template-columns: 180px minmax(0, 1fr);
  flex: 1; min-height: 0; overflow: hidden;
}
#npc-face {
  min-width: 0; overflow: hidden; padding: 18px 14px 14px;
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
}
#npc-face pre {
  font-size: 11px; line-height: 1.35; color: var(--text-dim);
  margin: 0; font-family: 'Share Tech Mono', monospace;
  white-space: pre; overflow: hidden; max-width: 152px;
}
#npc-face .npc-id-tag {
  font-size: 11px; letter-spacing: 3px; color: var(--text-dim);
  border: 1px solid var(--border); padding: 2px 6px;
  text-transform: uppercase;
}
#npc-info {
  min-width: 0; padding: 18px 16px 14px; overflow-y: auto;
  display: flex; flex-direction: column; gap: 14px;
}
.npc-handle { color: var(--amber); font-size: 16px; letter-spacing: 3px; }
.npc-reliability-warn { font-size: 11px; letter-spacing: 3px; color: var(--amber); opacity: 0.6; margin-bottom: 6px; }
.npc-section-label { font-size: 11px; letter-spacing: 3px; color: var(--text-dim); margin-bottom: 4px; }
.npc-text { font-size: 12px; color: var(--text-dim); line-height: 1.6; }
.npc-rumor-text { font-size: 12px; color: rgba(0,229,255,0.75); line-height: 1.6; }
/* Ask topic pane — shown automatically when NPC has topics */
#npc-ask {
  display: none; flex-direction: column; gap: 0;
  border-top: 1px solid var(--border); margin-top: 8px; padding-top: 10px;
}
#npc-ask.active { display: flex; }
#npc-ask > .npc-section-label { margin-bottom: 6px; }
.npc-topic-item {
  padding: 6px 8px; cursor: pointer; font-size: 12px; color: var(--text-dim);
  border-left: 2px solid transparent; transition: all .1s; letter-spacing: 1px;
}
.npc-topic-item:hover { color: var(--amber); border-left-color: var(--amber); background: rgba(226,154,63,0.05); }
.npc-topic-item.selected { color: var(--amber); border-left-color: var(--amber); background: rgba(226,154,63,0.08); }
.npc-topic-num { color: var(--amber); margin-right: 8px; }
#npc-response {
  display: none; margin-top: 8px; padding: 12px; border: 1px solid var(--border);
  font-size: 12px; color: var(--text-dim); line-height: 1.7;
  background: rgba(0,0,0,0.4);
}
#npc-response.active { display: block; }
#npc-response .resp-title {
  color: var(--amber); font-size: 10px; letter-spacing: 3px; margin-bottom: 8px;
}
#npc-response .resp-back {
  display: inline-block; margin-top: 12px; font-size: 10px; letter-spacing: 2px;
  color: var(--text-dim); cursor: pointer;
}
#npc-response .resp-back:hover { color: var(--amber); }
.npc-footer {
  border-top: 1px solid var(--border); padding: 7px 14px;
  display: flex; gap: 8px; flex-shrink: 0; flex-wrap: wrap;
}


#overlay.hidden { display: none; }

/* ── Shared native panel base — sits above NPC panel ── */
.native-panel {
  position: absolute; inset: 0; z-index: 65;
  pointer-events: auto;
  background: rgba(2,6,2,0.98);
  display: none; flex-direction: column;
  font-family: 'Share Tech Mono', monospace;
  overflow: hidden;
  background-image: repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,255,65,.010) 3px,rgba(0,255,65,.010) 4px);
}
.native-panel.active { display: flex; }

/* ── Loadout panel — popup modal ── */
#loadout-panel {
  background: rgba(3,7,9,0.80);
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(1px);
}
#loadout-inner {
  width: 520px;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  background: #070d0f;
  border: 1px solid #2a4858;
  box-shadow: 0 0 60px rgba(0,0,0,0.85), 0 0 0 1px rgba(58,216,180,0.06);
  overflow: hidden;
}
.loadout-slot-dot {
  width: 16px; height: 16px; border-radius: 50%;
  border: 1px solid #2a4858;
  background: transparent;
  transition: all 0.12s;
  flex-shrink: 0;
  position: relative;
}
.loadout-slot-dot.used {
  background: var(--cyan);
  border-color: var(--cyan);
  box-shadow: 0 0 7px rgba(58,216,180,0.45);
}
.loadout-slot-dot.used::after {
  content: ''; position: absolute; inset: 3px; border-radius: 50%;
  background: rgba(255,255,255,0.18);
}
/* Die cards */
#loadout-dice-grid {
  display: flex; flex-wrap: wrap; gap: 5px;
  padding: 5px 12px 10px;
}
.loadout-die-card {
  flex: 1 1 calc(50% - 3px);
  max-width: calc(50% - 3px);
  min-width: 148px;
  height: 108px;
  border: 1px solid #1a2e38;
  background: #0b1215;
  padding: 8px 11px;
  cursor: pointer;
  transition: border-color 0.1s, background 0.1s, box-shadow 0.1s;
  position: relative;
  user-select: none;
  display: flex; flex-direction: column; justify-content: space-between;
}
.loadout-die-card:hover:not(.unavail):not(.selected) {
  border-color: #2a4858;
  background: rgba(58,216,180,0.03);
}
.loadout-die-card.selected {
  border-color: var(--cyan);
  background: rgba(58,216,180,0.07);
  box-shadow: 0 0 0 1px rgba(58,216,180,0.10);
}
.loadout-die-card.unavail { opacity: 0.25; cursor: default; }
.ldc-topline { display: flex; align-items: center; gap: 6px; }
.ldc-glyph { font-size: 14px; color: #253840; flex-shrink: 0; transition: color 0.1s; }
.loadout-die-card.selected .ldc-glyph { color: var(--cyan); }
.ldc-name { font-size: 11px; letter-spacing: 0.8px; color: #b8d0d8; flex: 1; line-height: 1.2; }
.loadout-die-card.selected .ldc-name { color: var(--cyan); }
.ldc-faces { display: flex; gap: 3px; flex-wrap: wrap; }
.ldc-face {
  width: 22px; height: 22px;
  border: 1px solid #1a2e38;
  display: flex; align-items: center; justify-content: center;
  font-size: 9px; font-weight: bold; letter-spacing: 0; flex-shrink: 0;
}
.ldc-face.ghost { color: #4db8a8; border-color: rgba(77,184,168,0.35); background: rgba(77,184,168,0.07); }
.ldc-face.mask  { color: #6fa870; border-color: rgba(111,168,112,0.30); background: rgba(111,168,112,0.06); }
.ldc-face.crack { color: #c8a870; border-color: rgba(200,168,112,0.32); background: rgba(200,168,112,0.06); }
.ldc-face.burn  { color: #cf5538; border-color: rgba(207,85,56,0.30); background: rgba(207,85,56,0.06); }
.ldc-face.mute  { color: rgba(212,136,42,0.6); border-color: rgba(212,136,42,0.20); }
.ldc-face.leak  { color: #253840; border-color: rgba(37,56,64,0.6); }
.ldc-face.spike  { color: var(--amber); border-color: rgba(255,153,0,0.6); background: rgba(255,153,0,0.06); }
.ldc-face.shield { color: var(--cyan);  border-color: rgba(0,229,255,0.6); background: rgba(0,229,255,0.06); }
.ldc-face.pulse  { color: var(--green-dim); border-color: rgba(0,255,65,0.3); background: rgba(0,255,65,0.04); }
.ldc-bottom { display: flex; align-items: flex-end; justify-content: space-between; }
.ldc-cost { font-size: 9px; letter-spacing: 0.3px; color: #4a7080; line-height: 1.3; }
.ldc-cost strong { color: #b8d0d8; font-weight: normal; }
.loadout-die-card.selected .ldc-cost strong { color: var(--cyan); }
.ldc-specialty { font-size: 8px; letter-spacing: 1.5px; color: #253840; }
.loadout-die-card.selected .ldc-specialty { color: rgba(58,216,180,0.5); }
.ldc-breach-tag {
  font-size: 8px; letter-spacing: 1px;
  border: 1px solid rgba(212,136,42,0.45);
  color: rgba(212,136,42,0.8);
  padding: 1px 4px; line-height: 12px; flex-shrink: 0;
}
.ldc-sel-mark {
  position: absolute; top: 7px; right: 9px;
  font-size: 9px; letter-spacing: 1px; color: var(--cyan);
  opacity: 0; transition: opacity 0.1s;
}
.loadout-die-card.selected .ldc-sel-mark { opacity: 1; }
/* Breach warning */
#loadout-breach-warn {
  display: none;
  margin: 0 12px 6px;
  padding: 5px 10px 4px;
  font-size: 9px; letter-spacing: 1px; color: rgba(207,85,56,0.85);
  background: rgba(207,85,56,0.05);
  border: 1px solid rgba(207,85,56,0.18);
}
#loadout-breach-warn.visible { display: block; }
/* Section headers inside loadout body */
.loadout-sec-hdr {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 12px 6px;
  font-size: 9px; letter-spacing: 2.5px; color: #253840;
  background: #070d0f; position: sticky; top: 0; z-index: 4;
}
.loadout-sec-hdr::after { content: ''; flex: 1; height: 1px; background: #1a2e38; }
/* Enhancement rows */
.loadout-enh-row {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid rgba(26,46,56,0.5);
}
.loadout-enh-row.active { background: rgba(22,16,10,0.4); }
.loadout-enh-chips { display: flex; flex-shrink: 0; }
.loadout-enh-chip {
  padding: 3px 9px;
  border: 1px solid #2a4858;
  margin-left: -1px;
  font-size: 9px; letter-spacing: 1px;
  color: #4a7080;
  background: transparent;
  font-family: var(--font);
  cursor: pointer;
  transition: all 0.08s;
  position: relative;
}
.loadout-enh-chip:first-child { margin-left: 0; }
.loadout-enh-chip.active {
  border-color: var(--amber);
  color: var(--amber);
  background: rgba(212,136,42,0.08);
  z-index: 1;
}
.loadout-enh-chip:hover:not(.active):not(.locked) {
  border-color: #2a4858;
  color: #b8d0d8;
  background: rgba(255,255,255,0.03);
  z-index: 1;
}
.loadout-enh-chip.locked { opacity: 0.25; cursor: default; }

.np-header {
  border-bottom: 1px solid var(--border); padding: 8px 14px;
  display: flex; justify-content: space-between; align-items: center;
  font-size: 9px; letter-spacing: 3px; color: var(--text-dim);
  text-transform: uppercase; flex-shrink: 0;
}
.np-header .np-title { color: var(--cyan); font-size: 12px; letter-spacing: 2px; }
.np-body { display: flex; flex: 1; overflow: hidden; }
.np-footer {
  border-top: 1px solid var(--border); padding: 7px 14px;
  font-size: 10px; color: var(--text-dim); letter-spacing: 1px;
  display: flex; gap: 18px; flex-shrink: 0;
}
.np-footer span { color: var(--text-dim); }
.np-section { padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; overflow-y: auto; }
.np-section + .np-section { border-left: 1px solid var(--border); }
.np-label { font-size: 9px; letter-spacing: 3px; color: var(--text-dim); text-transform: uppercase; margin-bottom: 2px; }
.np-value { font-size: 13px; color: var(--text); letter-spacing: 1px; }
.np-value.amber { color: var(--amber); }
.np-value.red   { color: var(--red); }
.np-value.cyan  { color: var(--cyan); }
.np-divider { border: none; border-top: 1px solid var(--border); margin: 4px 0; }
.np-btn {
  background: linear-gradient(180deg, rgba(35,25,18,0.94), rgba(14,10,8,0.98));
  border: 1px solid var(--border-hi);
  box-shadow: inset 0 1px 0 rgba(255,220,176,0.05), inset 0 -1px 0 rgba(0,0,0,0.42);
  color: var(--text-dim); font-family: 'Share Tech Mono', monospace;
  font-size: 11px; letter-spacing: 2px; padding: 6px 14px; cursor: pointer;
  text-transform: uppercase; transition: background .12s, color .12s, border-color .12s, box-shadow .12s, transform .12s; text-align: left;
}
.np-btn:hover {
  background: linear-gradient(180deg, rgba(43,33,22,0.98), rgba(18,13,9,0.98));
  color: var(--amber);
  border-color: var(--border-hi);
  box-shadow: inset 0 1px 0 rgba(255,220,176,0.08), inset 0 -1px 0 rgba(0,0,0,0.46), 0 0 0 1px rgba(226,154,63,0.08);
}
.np-btn:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 0 rgba(0,0,0,0.28), inset 0 -1px 0 rgba(255,220,176,0.04);
}
.np-btn.muted { color: var(--text-dim); border-color: var(--border); }
.np-btn.muted:hover { background: linear-gradient(180deg, rgba(48,40,27,0.94), rgba(19,15,11,0.98)); color: var(--text); border-color: var(--text-dim); }
.np-btn.danger { color: var(--red); border-color: #4a1a1a; }
.np-btn.danger:hover { background: rgba(255,34,68,0.12); border-color: var(--red); color: var(--red); }
.np-btn .np-btn-cost { color: var(--amber); margin-left: 8px; font-size: 10px; }
.np-btn:hover .np-btn-cost { color: var(--amber); }
.np-stat-bar { height: 3px; background: var(--border); border-radius: 2px; margin: 2px 0 6px; }
.np-stat-fill { height: 100%; border-radius: 2px; transition: width .4s; box-shadow: 0 0 4px currentColor; }

/* ── Black Sprawl Signal Desk ── */
#sprawl-panel.active {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(6,5,4,0.99);
  background-image: repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(255,74,107,.010) 3px,rgba(255,74,107,.010) 4px);
}
#sp-header {
  height: 28px; display: flex; align-items: center; gap: 10px; padding: 0 14px;
  background: linear-gradient(180deg,rgba(35,24,18,0.96),rgba(16,12,10,0.96));
  border-bottom: 1px solid rgba(255,74,107,0.28); flex-shrink: 0;
  font-size: 10px; letter-spacing: 2px; color: var(--text-dim);
}
.sp-logo { font-size: 12px; letter-spacing: 2px; color: var(--green); }
.sp-hub-name { color: var(--sprawl); font-size: 11px; letter-spacing: 3px; }
.sp-tag { border: 1px solid currentColor; padding: 1px 5px; font-size: 11px; letter-spacing: 1px; }
#sp-clock { margin-left: auto; font-size: 11px; }
#sp-body {
  flex: 1; display: grid; grid-template-columns: 250px 1fr;
  min-height: 0; overflow: hidden;
}
.sp-col {
  min-height: 0; overflow: hidden; border-right: 1px solid var(--border);
  display: flex; flex-direction: column;
}
.sp-col:last-child { border-right: none; }
.sp-sechdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 6px 12px 5px; border-bottom: 1px solid var(--border);
  font-size: 8px; letter-spacing: 3px; color: var(--text-dim); text-transform: uppercase;
  flex-shrink: 0;
}
.sp-sechdr-sm { padding: 0 0 7px; border-bottom: none; }
.sp-subdim { font-size: 8px; letter-spacing: 1px; color: rgba(141,119,95,0.55); }
.sp-count { color: var(--amber); }

/* Left column */
#sp-heat-watch { border-bottom: 1px solid var(--border); flex-shrink: 0; }
.sp-watch-row {
  display: grid; grid-template-columns: 1fr auto auto;
  gap: 10px; align-items: center; padding: 5px 12px;
  border-bottom: 1px solid rgba(55,38,26,0.18); font-size: 9px;
}
.sp-watch-row:last-child { border-bottom: none; }
.sp-watch-handle { color: var(--text); }
.sp-watch-state { font-size: 7px; letter-spacing: 2px; padding: 2px 5px; border: 1px solid currentColor; }
.sp-watch-score { font-size: 8px; }
.sp-intel-row {
  display: flex; align-items: center; gap: 8px;
  padding: 4px 12px; font-size: 0.8rem;
  border-bottom: 1px solid rgba(55,38,26,0.18);
}
.sp-intel-row:last-child { border-bottom: none; }
.sp-intel-faction { min-width: 80px; letter-spacing: 1px; }
.sp-intel-tag { font-size: 0.8rem; letter-spacing: 1px; }
.sp-intel-tag--disruption { color: var(--amber); }
.sp-intel-tag--hunter { color: var(--red); }
#sp-signal-band {
  background: linear-gradient(180deg,rgba(255,74,107,0.13),rgba(255,74,107,0.04));
  border-top: 1px solid rgba(255,74,107,0.12); border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  padding-bottom: 10px;
}
.sp-signal-card {
  padding: 8px 12px; margin-bottom: 4px;
  background: rgba(74,14,24,0.54); border-left: 4px solid var(--sprawl);
}
.sp-signal-card:last-child { margin-bottom: 0; }
.sp-signal-card.empty {
  color: var(--text-dim);
  background: rgba(30,15,18,0.46);
  border-left-color: rgba(255,74,107,0.40);
}
.sp-signal-meta { font-size: 7px; letter-spacing: 1.6px; color: rgba(255,74,107,0.7); margin-bottom: 4px; }
.sp-signal-body { font-size: 9px; line-height: 1.5; color: var(--text); }
#sp-district {
  flex: 1; min-height: 0; overflow: hidden;
  padding-top: 10px;
  border-top: 1px solid rgba(55,38,26,0.28);
}
.sp-district-line {
  padding: 5px 12px; border-bottom: 1px solid rgba(55,38,26,0.15);
  font-size: 8px; line-height: 1.45; color: var(--text-dim);
}
.sp-district-line:last-child { border-bottom: none; }

/* Center column */
#sp-lead {
  padding: 14px 16px 13px; border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg,rgba(255,74,107,0.05),transparent); flex-shrink: 0;
}
#sp-lead-label { font-size: 8px; letter-spacing: 3px; color: var(--text-dim); margin-bottom: 8px; }
#sp-lead-title { font-size: 18px; letter-spacing: 2px; color: var(--sprawl); margin-bottom: 6px; }
#sp-lead-copy { max-width: 60ch; font-size: 9px; line-height: 1.55; color: var(--text-dim); }
#sp-intercepts { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: none; }
#sp-intercepts::-webkit-scrollbar { display: none; }
.sp-intercept {
  padding: 8px 16px 9px; border-bottom: 1px solid rgba(55,38,26,0.20);
  cursor: pointer; transition: background .12s;
}
.sp-intercept:hover { background: rgba(55,38,26,0.18); }
.sp-intercept.selected {
  background: rgba(255,74,107,0.07);
  border-left: 2px solid var(--sprawl); padding-left: 14px;
}
.sp-i-meta {
  display: flex; gap: 7px; align-items: center; margin-bottom: 5px;
  font-size: 7px; letter-spacing: 1.4px; color: rgba(141,119,95,0.68);
}
.sp-i-kind { color: var(--sprawl); }
.sp-i-time { margin-left: auto; color: rgba(141,119,95,0.45); }
.sp-i-body { font-size: 9px; line-height: 1.5; color: var(--text); }
.sp-i-note { font-size: 8px; line-height: 1.45; color: var(--text-dim); margin-top: 4px; }
.sp-intercept.noise .sp-i-kind { color: var(--text-dim); }

/* Action bar */
#sp-actionbar {
  height: 54px; flex-shrink: 0;
  display: grid; grid-template-columns: 1fr 300px 160px;
  background: rgba(11,9,8,0.98); border-top: 1px solid rgba(255,74,107,0.28);
}
#sp-action-info {
  padding: 0 14px; display: flex; flex-direction: column; justify-content: center; gap: 3px;
  min-width: 0;
}
#sp-action-title {
  font-size: 9px; letter-spacing: 2px; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#sp-action-sub {
  font-size: 8px; letter-spacing: 1px; color: var(--text-dim);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#sp-action-status {
  border-left: 1px solid rgba(55,38,26,0.40);
  display: flex; align-items: center; justify-content: space-evenly;
  padding: 0 10px;
}
.sp-action-stat { display: flex; flex-direction: column; gap: 4px; }
.sp-action-lbl { font-size: 7px; letter-spacing: 2px; color: var(--text-dim); }
.sp-action-val { font-size: 9px; color: var(--text); }
.sp-action-btn {
  border: none; border-left: 1px solid rgba(55,38,26,0.40);
  background: transparent; color: rgba(141,119,95,0.45);
  font-family: var(--font); font-size: 9px; letter-spacing: 3px; cursor: default;
}
.sp-action-btn.sp-return { color: var(--text-dim); cursor: pointer; }
.sp-action-btn.sp-return:hover { background: rgba(55,38,26,0.18); }

/* Hide overworld SVG layers while sprawl is active (precaution; panel is now fixed) */
#main-area.ow-focus.sprawl-active #ow-svg,
#main-area.ow-focus.sprawl-active #ow-faction-zones,
#main-area.ow-focus.sprawl-active #ow-watermarks,
#main-area.ow-focus.sprawl-active #ow-map-legend { display: none; }

/* ── Help panel — deck-terminal variant ── */
#help-panel {
  background:
    linear-gradient(180deg, rgba(3,15,3,0.98), rgba(2,10,2,0.985)),
    repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(0,255,65,0.012) 3px, rgba(0,255,65,0.012) 4px);
}
#help-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 20%, rgba(255,153,0,0.05), transparent 32%),
    radial-gradient(circle at 82% 14%, rgba(255,34,68,0.04), transparent 28%),
    linear-gradient(90deg, rgba(0,0,0,0.14), transparent 12%, transparent 88%, rgba(0,0,0,0.14));
  opacity: 0.9;
}
.help-panel-header {
  background: linear-gradient(90deg, rgba(255,153,0,0.06), rgba(0,0,0,0.15) 24%, rgba(0,229,255,0.05));
}
.help-content {
  flex: 1;
  padding: 18px 20px 16px;
  overflow-y: auto;
  font-size: 12px;
  line-height: 1.8;
  gap: 14px;
  position: relative;
}
.help-content::-webkit-scrollbar { width: 4px; }
.help-content::-webkit-scrollbar-thumb { background: var(--border-hi); }
.help-deck {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 100%;
}
.help-intro {
  border: 1px solid rgba(255,153,0,0.18);
  background: linear-gradient(180deg, rgba(255,153,0,0.05), rgba(0,0,0,0.22));
  padding: 12px 14px;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.28);
}
.help-intro-tag {
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--amber);
  margin-bottom: 6px;
}
.help-intro-copy {
  color: var(--green-dim);
}
.help-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.help-block {
  border: 1px solid rgba(42,106,42,0.65);
  background: linear-gradient(180deg, rgba(0,255,65,0.03), rgba(0,0,0,0.18));
  padding: 12px 14px 10px;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.2);
}
.help-block.wide {
  grid-column: 1 / -1;
}
.help-block.warn {
  border-color: rgba(255,34,68,0.26);
  background: linear-gradient(180deg, rgba(255,34,68,0.05), rgba(0,0,0,0.2));
}
.help-block-title {
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--text-dim);
  margin-bottom: 10px;
}
.help-table {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 6px 12px;
}
.help-key {
  color: var(--amber);
}
.help-key.cyan { color: var(--cyan); }
.help-key.red { color: var(--red); }
.help-desc {
  color: var(--green-dim);
}
.help-locations {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 16px;
}
.help-location {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.help-location-name {
  color: var(--amber);
  letter-spacing: 1px;
}
.help-location-desc {
  color: var(--text-dim);
  font-size: 11px;
  line-height: 1.6;
}
.help-panel-footer {
  justify-content: space-between;
}
@media (max-width: 940px) {
  .help-grid,
  .help-locations {
    grid-template-columns: 1fr;
  }
}
/* Die face chips */
.np-die-row { display: flex; gap: 5px; flex-wrap: wrap; }
.np-face-chip {
  padding: 3px 8px; border-radius: 3px; font-size: 10px; letter-spacing: 1px;
  border: 1px solid;
}
.np-face-chip.spike  { border-color: rgba(255,153,0,0.6); color: var(--amber); background: rgba(255,153,0,0.06); }
.np-face-chip.shield { border-color: rgba(0,229,255,0.6); color: var(--cyan);  background: rgba(0,229,255,0.06); }
.np-face-chip.ghost  { border-color: rgba(204,68,255,0.6); color: #cc44ff;     background: rgba(204,68,255,0.06); }
.np-face-chip.blank  { border-color: var(--border); color: var(--text-dim);    background: transparent; }
.np-face-chip.pulse  { border-color: rgba(0,255,65,0.3); color: var(--green-dim); background: rgba(0,255,65,0.04); }
.np-die-card { display: flex; flex-direction: column; gap: 6px; }
.np-die-card-header { display: flex; align-items: center; gap: 10px; }
.np-die-icon {
  width: 44px; height: 44px; border: 1px solid var(--green-dim); border-radius: 5px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-size: 15px; color: var(--green); background: rgba(0,255,65,0.05); flex-shrink: 0;
}
.np-die-icon .np-die-label { font-size: 9px; color: var(--text-dim); letter-spacing: 1px; margin-top: 1px; }
.np-die-summary { font-size: 10px; color: var(--text-dim); line-height: 1.8; }
.np-die-summary .f-spike  { color: var(--amber); }
.np-die-summary .f-shield { color: var(--cyan); }
.np-die-summary .f-ghost  { color: #cc44ff; }
.np-die-summary .f-blank  { color: var(--text-dim); }
.np-die-summary .f-pulse  { color: var(--green-dim); }
/* Run history list */
.np-run-list { display: flex; flex-direction: column; gap: 3px; }
.np-run-row { display: flex; gap: 10px; font-size: 11px; align-items: baseline; padding: 3px 0; border-bottom: 1px solid rgba(26,58,26,0.4); }
.np-run-faction { color: var(--green-dim); width: 80px; flex-shrink: 0; }
.np-run-data { color: var(--text-dim); width: 60px; flex-shrink: 0; font-size: 10px; }
.np-run-nodes { color: var(--text-dim); width: 58px; flex-shrink: 0; font-size: 10px; }
.np-run-status.clean      { color: var(--green); }
.np-run-status.abandon    { color: var(--text-dim); }
.np-run-status.lockdown   { color: var(--red); }
.np-run-status.disconnect { color: var(--red); }
.hub-feed-row { display: flex; gap: 8px; align-items: baseline; padding: 2px 0; border-bottom: 1px solid rgba(26,58,26,0.3); }
.hub-feed-handle { color: var(--amber); min-width: 58px; flex-shrink: 0; }
.hub-feed-faction { color: var(--text-dim); min-width: 72px; flex-shrink: 0; font-size: 9px; letter-spacing: 0.5px; }
.hub-feed-outcome { flex: 1; font-size: 9px; letter-spacing: 0.5px; }

.hub-target-hint {
  margin: -6px 0 14px;
  color: var(--text-dim);
  font-size: 11px;
  letter-spacing: 0.6px;
}
.hub-target-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 6px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.hub-target-meta {
  display: flex;
  align-items: baseline;
  gap: 14px;
  min-width: 0;
  flex: 1;
}
.hub-target-key {
  color: var(--amber);
  min-width: 28px;
  font-weight: bold;
  font-size: 13px;
}
.hub-target-name {
  min-width: 190px;
  font-weight: bold;
  letter-spacing: 0.5px;
}
.hub-target-contract {
  color: var(--cyan);
  font-size: 10px;
  letter-spacing: 1px;
  margin-left: 6px;
}
.hub-target-daily {
  color: var(--amber);
  font-size: 10px;
  letter-spacing: 1px;
  margin-left: 6px;
}
.hub-target-difficulty {
  min-width: 48px;
  font-weight: bold;
  font-size: 11px;
}
.hub-target-notes {
  color: var(--text-dim);
  font-size: 11px;
  min-width: 0;
  flex: 1;
}
.hub-target-btn {
  flex-shrink: 0;
  padding: 6px 10px;
}
@media (max-width: 940px) {
  .hub-target-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }
  .hub-target-meta {
    width: 100%;
    flex-wrap: wrap;
    gap: 8px 14px;
  }
  .hub-target-name,
  .hub-target-difficulty {
    min-width: 0;
  }
}

@keyframes blink      { 0%,100%{opacity:1} 50%{opacity:0} }
@keyframes glow-pulse { 0%,100%{opacity:.7} 50%{opacity:1} }
@keyframes ov-glitch-top {
  0%, 91%, 100% { transform: translate(0); opacity: 0; }
  92% { transform: translate(-1px, -1px); opacity: 0.32; }
  94% { transform: translate(1px, 0); opacity: 0.26; }
  96% { transform: translate(0); opacity: 0; }
}
@keyframes ov-glitch-bot {
  0%, 93%, 100% { transform: translate(0); opacity: 0; }
  94% { transform: translate(1px, 1px); opacity: 0.28; }
  96% { transform: translate(-1px, 0); opacity: 0.22; }
  98% { transform: translate(0); opacity: 0; }
}

/* ── The Wire mail panels ── */
#inbox-list {
  padding: 12px 14px;
  overflow-y: auto;
  flex: 1;
  background: linear-gradient(180deg, rgba(8,11,8,0.98), rgba(3,5,4,0.99));
  box-shadow: inset 0 0 0 1px rgba(79,153,80,0.08);
}
/* When a message is selected: cap the list to a scrollable band, give the rest to the message */
#inbox-panel.has-message #inbox-list {
  flex: 0 0 auto;
  max-height: 220px;
  min-height: 0;
}
#inbox-panel.has-message .bbs-msg-inline {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}
.gl-empty {
  margin: 0;
  padding: 16px 18px;
  border: 1px solid rgba(42,106,42,0.68);
  background: linear-gradient(180deg, rgba(0,255,65,0.04), rgba(0,0,0,0.18));
  color: var(--green);
  font-size: 13px;
  letter-spacing: 3px;
  line-height: 1.7;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 0 12px rgba(0,255,65,0.26);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.22), 0 0 18px rgba(0,255,65,0.04);
}

.gl-row {
  display: flex; align-items: stretch; cursor: pointer;
  margin-bottom: 8px;
  border: 1px solid rgba(79,153,80,0.16);
  background: linear-gradient(180deg, rgba(18,22,18,0.92), rgba(6,8,7,0.96));
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.34);
  transition: background .1s, border-color .1s, box-shadow .1s;
  min-height: 56px;
}
.gl-row:last-child { margin-bottom: 0; }
.gl-row:hover {
  background: linear-gradient(180deg, rgba(22,29,22,0.96), rgba(8,10,8,0.98));
  border-color: rgba(120,216,114,0.32);
}
.gl-row.gl-unread {
  border-color: rgba(120,216,114,0.24);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.34), 0 0 0 1px rgba(120,216,114,0.05);
}
.gl-row.gl-unread:hover {
  background: linear-gradient(180deg, rgba(24,34,22,0.98), rgba(9,13,9,0.98));
  border-color: rgba(120,216,114,0.42);
}

.gl-row-accent {
  width: 4px; flex-shrink: 0;
  background: rgba(79,153,80,0.18);
}
.gl-row.gl-unread .gl-row-accent {
  background: var(--green);
  box-shadow: 0 0 10px rgba(120,216,114,.45);
}

.gl-row-content {
  flex: 1; padding: 11px 18px 10px;
  display: flex; flex-direction: column; gap: 5px;
  min-width: 0;
}

.gl-row-top { display: flex; align-items: baseline; gap: 12px; }

.gl-row-badge {
  font-size: 8px; flex-shrink: 0; width: 12px;
  color: var(--border-hi); line-height: 1;
}
.gl-row.gl-unread .gl-row-badge {
  color: var(--green);
  text-shadow: 0 0 8px var(--green);
  font-size: 10px;
}

.gl-row-from {
  font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
  color: #d8ccb8; flex-shrink: 0;
  min-width: 90px; max-width: 160px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gl-row.gl-unread .gl-row-from {
  color: var(--cyan);
  text-shadow: 0 0 10px rgba(0,229,255,.35);
  letter-spacing: 2px;
}

.gl-row-date {
  margin-left: auto; flex-shrink: 0;
  font-size: 10px; color: var(--text-dim); opacity: .7;
}

.gl-row-subj {
  font-size: 13px; color: #aa9f8e;
  padding-left: 24px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gl-row.gl-unread .gl-row-subj { color: var(--green); }

/* Mail read view */
.gl-msg-header { padding: 8px 0 20px; display: flex; flex-direction: column; gap: 8px; }
.gl-msg-field  { display: flex; align-items: baseline; gap: 20px; }
.gl-msg-label  {
  font-size: 11px; letter-spacing: 3px; text-transform: uppercase;
  color: var(--text-dim); min-width: 40px; flex-shrink: 0; opacity: .7;
}
.gl-msg-value  { font-size: 12px; color: var(--green-dim); letter-spacing: 1px; }
.gl-msg-from   { color: var(--cyan); text-shadow: 0 0 10px rgba(0,229,255,.3); }
.gl-msg-subj   { color: var(--green); font-size: 14px; letter-spacing: 1px; }
.gl-msg-date   { font-size: 11px; opacity: .6; }
.gl-msg-rule   { border: none; border-top: 1px solid var(--border); margin: 4px 0 24px; }
#mail-read-body {
  font-size: 13px; color: var(--green-dim);
  line-height: 2; white-space: pre-wrap; letter-spacing: .5px;
}

#mail-compose-panel .np-body { min-height: 0; }
.gl-compose-field { display:flex; flex-direction:column; gap:6px; min-height:0; }
.gl-compose-input,
.gl-compose-body {
  width: 100%;
  background: rgba(0,0,0,0.28);
  border: 1px solid var(--border-hi);
  color: var(--green);
  font-family: var(--font);
  font-size: 12px;
  letter-spacing: 1px;
  padding: 10px 12px;
  outline: none;
  resize: none;
}
.gl-compose-input:focus,
.gl-compose-body:focus {
  border-color: var(--green);
  box-shadow: 0 0 10px rgba(0,255,65,0.12);
}
.gl-compose-body {
  flex: 1;
  min-height: 220px;
  line-height: 1.7;
  white-space: pre-wrap;
}
.gl-compose-status {
  min-height: 18px;
  font-size: 11px;
  color: var(--text-dim);
  letter-spacing: 1px;
}
.gl-compose-status.error { color: var(--red); }
.gl-compose-status.ok { color: var(--green); }
.gl-compose-suggestions {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--bg2);
  border: 1px solid var(--border-hi);
  border-top: none;
  z-index: 20;
  max-height: 160px;
  overflow-y: auto;
}
.gl-compose-suggestions.active { display: block; }
.gl-compose-suggestion {
  padding: 7px 12px;
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--green);
  cursor: pointer;
  font-family: var(--font);
}
.gl-compose-suggestion:hover,
.gl-compose-suggestion.focused { background: rgba(0,255,65,0.1); }

/* ── HQ run layout: tactical + right rail ── */
#main-area.hq-focus #graph-canvas-wrap {
  display: flex;
  flex-direction: row;
  background:
    radial-gradient(circle at 50% 48%, rgba(0,255,65,0.03), transparent 34%),
    linear-gradient(180deg, rgba(3,15,3,0.98), rgba(2,8,2,0.98));
}
#main-area.hq-focus #graph-canvas {
  flex: 1;
  min-width: 0;
}
#hq-right-rail {
  display: none;
  width: 252px;
  flex-shrink: 0;
  flex-direction: column;
  border-left: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(3,15,3,0.98), rgba(2,8,2,0.98));
  overflow: hidden;
}
#main-area.hq-focus #hq-right-rail { display: flex; }

#hq-minimap-wrap {
  flex: 1 1 0;
  min-height: 0;
  padding: 8px 10px 6px;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
}
#hq-minimap { display: block; width: 100%; flex: 1; min-height: 0; }
#hq-tier-strip {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.hq-tier-chip {
  border: 1px solid #163016;
  background: rgba(3,18,3,0.9);
  padding: 2px 6px;
  font-size: 8px;
  letter-spacing: 1.4px;
}
.hq-tier-active { color: #7dffa0; border-color: rgba(0,255,65,0.36); }
.hq-tier-adjacent { color: #6bd594; border-color: rgba(0,255,65,0.2); }
.hq-tier-context { color: #446644; border-color: rgba(80,120,80,0.18); }

.hq-panel-label {
  font-size: 11px; letter-spacing: 2px; color: #2a5a2a;
  margin-bottom: 5px; display: flex; gap: 8px; align-items: center; justify-content: space-between;
}
.hq-panel-label em { color: #4a8a4a; font-style: normal; }
.hq-hunter-q {
  color: #ff6a7f;
  font-size: 11px;
  font-weight: bold;
  letter-spacing: 1px;
  text-shadow: 0 0 7px rgba(255,34,68,0.35);
}

#hq-pressure-wrap {
  flex: 0 0 auto;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
}
.hq-pressure-row {
  display: flex; align-items: center; gap: 8px;
  font-size: 10px; letter-spacing: 1px; padding: 4px 0;
  border-bottom: 1px solid #0d1d0d;
}
.hq-pressure-row:last-child { border-bottom: none; }
.hq-p-icon  { font-size: 11px; width: 14px; text-align: center; flex-shrink: 0; }
.hq-p-label { color: #73b873; flex: 1; }
.hq-p-count { font-size: 11px; font-weight: bold; text-align: right; }
.hq-p-count.hq-p-red   { color: #ff2244; text-shadow: 0 0 7px rgba(255,34,68,0.7); }
.hq-p-count.hq-p-amber { color: #ff9900; text-shadow: 0 0 7px rgba(255,153,0,0.6); }
.hq-p-count.hq-p-cyan  { color: #00e5ff; text-shadow: 0 0 6px rgba(0,229,255,0.35); }
@keyframes hq-lure-pulse  { 0%,100%{opacity:1} 50%{opacity:0.42} }
@keyframes hq-hunter-flash { 0%,100%{opacity:1} 50%{opacity:0.38} }
#hq-p-lure-row { animation: hq-lure-pulse 1.04s ease-in-out infinite; }
.hq-p-icon-hunter { color: #ff2244; }
#hq-p-hunter-row.hq-hunter-close { animation: hq-hunter-flash 0.58s ease-in-out infinite; }
#hq-p-hunter-row.hq-hunter-close .hq-p-icon-hunter { text-shadow: 0 0 8px rgba(255,34,68,0.9); }
#hq-p-hunter-row.hq-hunter-close .hq-p-label { color: #ff7a92; }
@keyframes hq-daemon-flash { 0%,100%{opacity:1} 50%{opacity:0.32} }
#hq-p-daemon-row.hq-daemon-contact { animation: hq-daemon-flash 0.48s ease-in-out infinite; }
#hq-p-daemon-row.hq-daemon-contact .hq-p-label { color: #e070e0; }
.hq-p-val--red  { color: #cf5538 !important; text-shadow: 0 0 7px rgba(207,85,56,0.7); }
.hq-p-val--warn { color: #d4882a !important; }

/* ── Network stats (#758) ─────────────────────────────── */
#hq-net-stats {
  flex: 0 0 auto;
  padding: 4px 10px 6px;
  border-bottom: 1px solid var(--border);
}
.hq-ns-row {
  display: flex; align-items: center; gap: 8px;
  font-size: 10px; letter-spacing: 1px; padding: 3px 0;
  border-bottom: 1px solid #0d1d0d;
}
.hq-ns-row:last-child { border-bottom: none; }
.hq-ns-label { color: #73b873; flex: 1; }
#hq-ns-explored, #hq-ns-exits, #hq-ns-banked {
  font-size: 11px; font-weight: bold; text-align: right; color: var(--text);
}

/* ── Post-encounter animation overlay (#781) ────────── */
#hq-anim-overlay {
  display: none;
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  pointer-events: none; overflow: visible;
}
#main-area.hq-focus #hq-anim-overlay { display: block; }

/* ── Rail meters (#781) ──────────────────────────────── */
#hq-rail-meters { flex: 0 0 auto; padding: 6px 10px; }
.hq-rail-row { margin-bottom: 6px; }
.hq-rail-row:last-child { margin-bottom: 0; }
.hq-rail-lbl {
  display: flex; justify-content: space-between;
  font-size: 0.8rem; letter-spacing: 1px; color: #73b873;
  margin-bottom: 3px; text-transform: uppercase;
}
.hq-rail-lbl span { color: var(--text); font-weight: bold; }
.hq-rail-track {
  height: 4px; background: rgba(255,255,255,0.07); border-radius: 2px; overflow: hidden;
}
.hq-rail-fill {
  height: 100%; width: 0%; border-radius: 2px;
  transition: width 0.4s ease;
}
.hq-rail-noise { background: var(--amber); }
.hq-rail-trace { background: var(--red); }

/* ── Objective section (#758) ────────────────────────── */
#hq-objective-wrap {
  flex: 0 0 auto;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
}
.hq-obj-row {
  font-size: 10px; letter-spacing: 1px; padding: 2px 0; color: #73b873;
}

/* ── Active Threats section (#758) ──────────────────── */
#hq-threats-wrap {
  flex: 0 0 auto;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
}
.hq-threat-row {
  display: flex; align-items: center;
  font-size: 10px; letter-spacing: 1px; padding: 3px 0;
  border-bottom: 1px solid #0d1d0d;
}
.hq-threat-row:last-child { border-bottom: none; }
.hq-threat-red   { color: #ff2244; text-shadow: 0 0 7px rgba(255,34,68,0.7); }
.hq-threat-amber { color: #ff9900; text-shadow: 0 0 7px rgba(255,153,0,0.6); }

/* ── Noise in header bar (#758) ─────────────────────── */
#hq-ib-noise-wrap { align-items: center; }
#hq-ib-noise { font-size: 12px; font-weight: bold; }

@keyframes hq-ev-enter {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes hq-ev-alert-pulse {
  0%   { box-shadow: none; }
  30%  { box-shadow: -3px 0 12px rgba(207,85,56,0.4), 0 0 18px rgba(207,85,56,0.1); }
  100% { box-shadow: none; }
}
@keyframes hq-sym-contact {
  0%, 100% { opacity: 0.4; }
  50%       { opacity: 1; }
}
#hq-event-wrap {
  flex: 1 1 150px;
  padding: 6px 10px 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
#hq-event-list {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding-right: 2px;
}
#hq-event-list::-webkit-scrollbar { width: 3px; }
#hq-event-list::-webkit-scrollbar-thumb { background: var(--border-hi); }
.hq-event-line {
  padding: 6px 8px 7px 10px;
  border: 1px solid rgba(42,106,42,0.25);
  border-left: 2px solid rgba(42,106,42,0.5);
  background: linear-gradient(180deg, rgba(6,12,6,0.96), rgba(2,5,2,0.98));
  line-height: 1.4;
  color: #86d695;
}
.hq-event-line.is-new {
  animation: hq-ev-enter 180ms ease-out;
}
.hq-event-line.warn {
  color: rgba(226,154,63,0.95);
  border-left-color: rgba(226,154,63,0.6);
  background: linear-gradient(180deg, rgba(14,10,2,0.97), rgba(6,4,1,0.98));
}
.hq-event-line.alert {
  color: rgba(240,138,112,0.96);
  border-left: 3px solid var(--red);
  background: linear-gradient(180deg, rgba(18,5,3,0.97), rgba(8,2,1,0.98));
}
.hq-event-line.is-new.alert {
  animation: hq-ev-enter 180ms ease-out, hq-ev-alert-pulse 1.6s ease-out 160ms;
}
.hq-event-line.info {
  color: var(--text-dim);
  border-left-color: rgba(42,106,42,0.18);
  border-color: rgba(42,106,42,0.12);
}
.hq-event-head {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 3px;
}
.hq-ev-sym {
  font-size: 9px;
  color: inherit;
  opacity: 0.65;
  flex-shrink: 0;
  width: 10px;
  text-align: center;
}
.hq-ev-sym.is-contact {
  animation: hq-sym-contact 1.1s ease-in-out infinite;
  opacity: 1;
}
.hq-ev-tag {
  flex: 1;
  color: var(--text-dim);
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.hq-ev-time {
  flex-shrink: 0;
  color: #28432e;
  font-size: 8px;
  letter-spacing: 1px;
  margin-left: auto;
}
.hq-ev-body {
  font-size: 10px;
  line-height: 1.45;
  color: inherit;
  text-transform: uppercase;
}
.hq-ev-meta {
  font-size: 0.8rem;
  color: var(--text-dim);
  letter-spacing: 1px;
  margin-top: 3px;
  opacity: 0.5;
}
/* cls: severity tag/sym tints */
.hq-event-line.warn  .hq-ev-tag { color: rgba(226,154,63,0.75); }
.hq-event-line.warn  .hq-ev-sym { color: var(--amber); opacity: 0.9; }
.hq-event-line.alert .hq-ev-tag { color: rgba(207,85,56,0.8); }
.hq-event-line.alert .hq-ev-sym { color: var(--red); opacity: 1; }
.hq-event-line.info  .hq-ev-tag { opacity: 0.5; }
.hq-event-line.info  .hq-ev-sym { opacity: 0.4; }
/* kind: ICE — cyan accent */
.hq-event-line[data-kind="ice_cleared"],
.hq-event-line[data-kind="ice_bypassed"] {
  border-left-color: rgba(40,160,180,0.55);
}
.hq-event-line[data-kind="ice_triggered"] {
  border-left-color: rgba(207,85,56,0.65);
}
.hq-event-line[data-kind="ice_cleared"]  .hq-ev-sym,
.hq-event-line[data-kind="ice_bypassed"] .hq-ev-sym { color: rgba(50,190,210,0.85); opacity: 1; }
.hq-event-line[data-kind="ice_cleared"]  .hq-ev-tag,
.hq-event-line[data-kind="ice_bypassed"] .hq-ev-tag { color: rgba(50,190,210,0.65); }
/* kind: contact / hunter — deepest urgency */
.hq-event-line[data-kind="daemon_contact"],
.hq-event-line[data-kind="hunter_deployed"] {
  border-left: 3px solid rgba(240,60,60,0.9);
  background: linear-gradient(180deg, rgba(22,4,4,0.98), rgba(10,2,2,0.99));
  color: rgba(255,130,130,0.95);
}
.hq-event-line[data-kind="daemon_contact"]  .hq-ev-tag,
.hq-event-line[data-kind="hunter_deployed"] .hq-ev-tag { color: rgba(240,80,80,0.8); }
/* kind: tool use — amber */
.hq-event-line[data-kind="ghostify_cleared"],
.hq-event-line[data-kind="ghostify_detected"],
.hq-event-line[data-kind="dampener_cleared"],
.hq-event-line[data-kind="dampener_detected"],
.hq-event-line[data-kind="lure_deployed"],
.hq-event-line[data-kind="trace_wipe"],
.hq-event-line[data-kind="token_forge"] {
  border-left-color: rgba(200,140,30,0.5);
  color: rgba(226,154,63,0.9);
}
.hq-event-line[data-kind="ghostify_cleared"]  .hq-ev-sym,
.hq-event-line[data-kind="dampener_cleared"]  .hq-ev-sym,
.hq-event-line[data-kind="lure_deployed"]     .hq-ev-sym,
.hq-event-line[data-kind="trace_wipe"]        .hq-ev-sym,
.hq-event-line[data-kind="token_forge"]       .hq-ev-sym { color: var(--amber); opacity: 0.9; }
/* kind: objective complete — bright green */
.hq-event-line[data-kind="objective_complete"] {
  border-left: 3px solid var(--green);
  color: #a0e4a6;
}
.hq-event-line[data-kind="objective_complete"] .hq-ev-sym { color: var(--green); opacity: 1; }
.hq-event-line[data-kind="objective_complete"] .hq-ev-tag { color: var(--green-dim); }
/* kind: charge depleted — urgent warning */
.hq-event-line[data-kind="charge_depleted"] {
  border-left-color: rgba(226,154,63,0.7);
  color: rgba(226,154,63,0.95);
}
/* kind: disruption — orange-amber */
.hq-event-line[data-kind="disruption_active"],
.hq-event-line[data-kind="disruption_incoming"] {
  border-left-color: rgba(224,112,72,0.65);
  color: rgba(224,112,72,0.9);
}

/* Status bar HQ-specific emphasis */
#gs-data { color: var(--text); font-size: 12px; }
#gs-node { color: var(--text); font-size: 12px; }
.hq-alliance-badge {
  border: 1px solid #00e5ff; color: #00e5ff; font-size: 9px;
  padding: 1px 7px; background: #001a22; letter-spacing: 1px;
}

/* ══════════════════════════════════════════════════════════════════
   TOUCH INTERFACE
   All touch-specific rules isolated here for easy auditing/revert.
   ══════════════════════════════════════════════════════════════════ */

/* 1. Remove default blue tap highlight on all elements */
* { -webkit-tap-highlight-color: transparent; }

/* 2. Prevent text selection on shell surfaces; restore in readable/input areas */
#shell,
#overlay { -webkit-user-select: none; user-select: none; }
input, textarea,
#profile,
#term-content,
#mail-read-body,
#log-entries,
#world-events-list { -webkit-user-select: text; user-select: text; }

/* 3. Eliminate 300ms double-tap delay on interactive elements */
button, .np-btn, .gl-row, .npc-topic-item,
.gtab, .hub-target-btn,
#npc-response .resp-back { touch-action: manipulation; }

/* 4. Minimum 44px touch targets on buttons */
/* 4. Safe area insets for notched iPhones/iPads */
#titlebar {
  padding-left:  max(12px, env(safe-area-inset-left));
  padding-right: max(12px, env(safe-area-inset-right));
}
#statusbar {
  padding-left:   max(12px, env(safe-area-inset-left));
  padding-right:  max(12px, env(safe-area-inset-right));
  padding-bottom: env(safe-area-inset-bottom);
}

/* 5. :active feedback for hover-only interactive elements */
.gl-row:active {
  background: linear-gradient(180deg, rgba(22,29,22,0.96), rgba(8,10,8,0.98));
  border-color: rgba(120,216,114,0.32);
}
.gl-row.gl-unread:active {
  background: linear-gradient(180deg, rgba(24,34,22,0.98), rgba(9,13,9,0.98));
  border-color: rgba(120,216,114,0.42);
}
.npc-topic-item:active {
  color: var(--amber);
  border-left-color: var(--amber);
  background: rgba(226,154,63,0.05);
}
.gtab:active { color: var(--amber); }
#npc-response .resp-back:active { color: var(--amber); }

/* 6. Contain scroll momentum inside panels; prevent bleed into shell */
#log-entries,
#world-events-list,
#inbox-list,
.np-body,
.help-content { overscroll-behavior: contain; }

/* 7. Coarse-pointer sizing/typing adjustments */
@media (pointer: coarse), (hover: none) {
  .np-btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
  #hq-actionbar .np-btn { min-height: 44px; }
  #hq-actionbar .np-btn  { padding: 0 16px; }
  .hub-target-btn { min-height: 44px; }
  .npc-topic-item { min-height: 44px; display: flex; align-items: center; }
  .gtab { min-height: 36px; display: flex; align-items: center; }

  /* Prevent iOS viewport zoom on input focus — must be ≥ 16px */
  .ov-field input,
  .ov-field-server input,
  .gl-compose-input,
  .gl-compose-body { font-size: 16px; }
}

/* ── Boot sequence overlay ── */
#boot-overlay {
  position: fixed; inset: 0; z-index: 800;
  background: #000; display: flex; flex-direction: column;
  font-family: 'Courier New', 'Lucida Console', Monaco, Menlo, monospace;
  font-size: 14px; line-height: 1.6; font-kerning: none;
  color: var(--green);
}
#boot-overlay.hidden { display: none; }
#boot-term {
  flex: 1; overflow: hidden; padding: 24px 28px;
  display: flex; flex-direction: column; justify-content: flex-end;
}
#boot-term .bl { display: block; white-space: pre; }
#boot-term .bl.dim  { color: var(--text-dim); }
#boot-term .bl.box  { color: #c8c8c8; }
#boot-term .bl.cyan { color: var(--cyan); }
#boot-term .bl.amber { color: var(--amber); }
#boot-term .bl.bright { color: #fff; }
#boot-term .bl.hr { color: #6888cc; }
#boot-actionbar {
  padding: 8px 24px 16px; display: flex;
  justify-content: flex-end; min-height: 44px; align-items: center;
}
#boot-skip-btn {
  background: none; border: 1px solid var(--green);
  color: var(--green); font-family: 'Courier New', 'Lucida Console', Monaco, Menlo, monospace;
  font-size: 13px; padding: 4px 14px; cursor: pointer; letter-spacing: 2px;
}
#boot-skip-btn:hover { background: rgba(0,255,65,0.08); }
#boot-skip-btn.hidden { display: none; }

/* ── BBS panel palette system ────────────────────────────────────────────── */
/* Full Duplex — P1 green phosphor */
.fd {
  --bbs-bg:          #000900;
  --bbs-head:        #010D01;
  --bbs-sec:         #010B01;
  --bbs-row-a:       #000800;
  --bbs-row-b:       #000A00;
  --bbs-foot:        #010D01;
  --bbs-col:         #47C039;
  --bbs-bright:      #78E06A;
  --bbs-dim:         #2B7322;
  --bbs-mid:         #245E1C;
  --bbs-faint:       #183E11;
  --bbs-accent:      #78E06A;
  --bbs-border:      #0D2609;
  --bbs-border-mid:  #1C4E16;
  --bbs-border-hot:  #2C7622;
  --bbs-glow:        0 0 8px rgba(71,192,57,0.70), 0 0 2px rgba(71,192,57,0.40);
  --bbs-glow-bright: 0 0 14px rgba(120,224,106,0.85), 0 0 4px rgba(120,224,106,0.50);
  --bbs-glow-faint:  0 0 5px rgba(71,192,57,0.30);
}
/* The Wire — amber phosphor */
.wr {
  --bbs-bg:          #090700;
  --bbs-head:        #0C0900;
  --bbs-sec:         #0A0700;
  --bbs-row-a:       #070500;
  --bbs-row-b:       #090700;
  --bbs-foot:        #040300;
  --bbs-col:         #FFB000;
  --bbs-bright:      #FFD700;
  --bbs-dim:         #996800;
  --bbs-mid:         #7A5200;
  --bbs-faint:       #3D2800;
  --bbs-accent:      #CC8800;
  --bbs-border:      #2E1E00;
  --bbs-border-mid:  #5C3C00;
  --bbs-border-hot:  #8A5C00;
  --bbs-glow:        0 0 8px rgba(255,176,0,0.70), 0 0 2px rgba(255,176,0,0.40);
  --bbs-glow-bright: 0 0 14px rgba(255,215,0,0.85), 0 0 4px rgba(255,215,0,0.50);
  --bbs-glow-faint:  0 0 5px rgba(255,176,0,0.30);
  --bbs-msg:         #060400;
}

/* BBS panel chrome — uses --bbs-* vars set by .fd / .wr parent */
.native-panel.fd,
.native-panel.wr {
  background: var(--bbs-bg);
  color: var(--bbs-col);
  font-family: 'VT323', monospace;
  font-size: 16px;
  line-height: 1.4;
  border: none;
}
.native-panel.fd {
  background-image: repeating-linear-gradient(
    0deg, transparent, transparent 3px,
    rgba(71,192,57,0.025) 3px, rgba(71,192,57,0.025) 4px
  );
}
.native-panel.wr {
  background-image: repeating-linear-gradient(
    0deg, transparent, transparent 3px,
    rgba(255,176,0,0.025) 3px, rgba(255,176,0,0.025) 4px
  );
}
/* Wire panels become centered cards, matching the mockup compact layout */
.native-panel.wr.active {
  inset: unset;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(660px, calc(100vw - 32px));
  height: min(86vh, 840px);
  border: 1px solid var(--bbs-border-hot);
  box-shadow:
    0 0 0 100vmax rgba(4, 3, 0, 0.90),
    0 0 40px rgba(255, 176, 0, 0.10),
    0 0 80px rgba(0, 0, 0, 0.85);
}
/* phosphor top bleed — z-index: -1 keeps it behind all non-positioned panel children */
.native-panel.fd::before,
.native-panel.wr::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: -1;
}
.native-panel.fd::before {
  background: radial-gradient(ellipse 80% 20% at 50% 0%, rgba(71,192,57,0.04) 0%, transparent 100%);
}
.native-panel.wr::before {
  background: radial-gradient(ellipse 80% 20% at 50% 0%, rgba(255,176,0,0.04) 0%, transparent 100%);
}

.bbs-header {
  background: var(--bbs-head);
  border-bottom: 1px solid var(--bbs-border-hot);
  padding: 7px 14px 5px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.bbs-title {
  font-size: 26px;
  color: var(--bbs-accent);
  text-shadow: var(--bbs-glow-bright);
  letter-spacing: 0.06em;
}
.bbs-subtitle {
  font-size: 13px;
  color: var(--bbs-dim);
  letter-spacing: 0.12em;
}
.bbs-status-strip {
  background: var(--bbs-sec);
  border-bottom: 1px solid var(--bbs-border);
  padding: 3px 14px;
  font-size: 13px;
  color: var(--bbs-dim);
  letter-spacing: 0.10em;
  display: flex;
  justify-content: space-between;
}
.bbs-status-strip .hot { color: var(--bbs-col); text-shadow: var(--bbs-glow-faint); }

.bbs-section-label {
  background: var(--bbs-sec);
  border-bottom: 1px solid var(--bbs-border);
  border-top: 1px solid var(--bbs-border);
  padding: 3px 14px 2px;
  font-size: 13px;
  color: var(--bbs-dim);
  letter-spacing: 0.20em;
  text-transform: uppercase;
}

.bbs-body {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.bbs-footer {
  border-top: 1px solid var(--bbs-border-hot);
  padding: 5px 14px;
  display: flex;
  gap: 6px;
  align-items: center;
  background: var(--bbs-foot);
}

/* leaderboard */
.bbs-leaderboard { width: 100%; border-collapse: collapse; }
.bbs-leaderboard tr { border-bottom: 1px solid var(--bbs-border); }
.bbs-leaderboard tr:nth-child(odd)  { background: var(--bbs-row-a); }
.bbs-leaderboard tr:nth-child(even) { background: var(--bbs-row-b); }
.bbs-leaderboard td { padding: 3px 10px; font-size: 18px; white-space: nowrap; }
.bbs-lb-rank   { color: var(--bbs-dim); width: 3ch; padding-left: 14px; }
.bbs-lb-handle { color: var(--bbs-col); flex: 1; }
.bbs-lb-score  { color: var(--bbs-bright); text-align: right; }
.bbs-lb-fac    { color: var(--bbs-dim); font-size: 13px; text-align: right; padding-right: 14px; min-width: 7ch; }
.bbs-lb-top .bbs-lb-handle { color: var(--bbs-bright); text-shadow: var(--bbs-glow-bright); }
.bbs-lb-top .bbs-lb-score  { text-shadow: var(--bbs-glow-faint); }
.bbs-lb-self .bbs-lb-handle { color: var(--bbs-accent); }

.bbs-lb-foot {
  background: var(--bbs-row-a);
  border-top: 1px solid var(--bbs-border-mid);
  border-bottom: 1px solid var(--bbs-border);
  padding: 3px 14px;
  font-size: 13px;
  color: var(--bbs-dim);
  letter-spacing: 0.08em;
  display: flex;
  justify-content: space-between;
}
.bbs-lb-foot .hot { color: var(--bbs-col); }

/* wire traffic feed */
.bbs-wire-item {
  display: flex;
  gap: 10px;
  padding: 4px 14px;
  border-bottom: 1px solid var(--bbs-border);
  font-size: 16px;
}
.bbs-wire-item:nth-child(odd)  { background: var(--bbs-row-a); }
.bbs-wire-item:nth-child(even) { background: var(--bbs-row-b); }
.bbs-wire-tag {
  font-size: 13px;
  color: var(--bbs-bright);
  text-shadow: var(--bbs-glow-faint);
  white-space: nowrap;
  min-width: 12ch;
  letter-spacing: 0.04em;
}
.bbs-wire-body {
  color: var(--bbs-dim);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}

/* Full Duplex NPC ambient handles */
#duplex-npc-lines {
  border-top: 1px solid var(--bbs-border);
  padding: 6px 0 2px;
}
.duplex-npc-row {
  display: flex;
  gap: 0;
  padding: 3px 14px;
  font-size: 15px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
.duplex-npc-handle {
  color: var(--bbs-dim);
  min-width: 10ch;
  white-space: nowrap;
  letter-spacing: 0.06em;
}
.duplex-npc-sep {
  color: var(--bbs-border-mid);
  padding: 0 2px;
}
.duplex-npc-line {
  color: var(--bbs-col);
  flex: 1;
}

/* active contract strip */
.bbs-contract-strip {
  background: var(--bbs-head);
  border-top: 1px solid var(--bbs-border-mid);
  margin-top: auto;
  padding: 6px 14px 5px;
  font-size: 16px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.bbs-contract-label { color: var(--bbs-dim); font-size: 13px; letter-spacing: 0.12em; }
.bbs-contract-name  { color: var(--bbs-bright); text-shadow: var(--bbs-glow-faint); font-size: 20px; }
.bbs-contract-meta  { color: var(--bbs-dim); font-size: 14px; }

/* buttons */
.bbs-btn-hot {
  font-family: 'VT323', monospace;
  font-size: 15px;
  background: none;
  border: 1px solid var(--bbs-col);
  color: var(--bbs-bright);
  padding: 1px 12px 0;
  cursor: pointer;
  letter-spacing: 0.08em;
  text-shadow: var(--bbs-glow-faint);
}
.bbs-btn-hot:hover { background: rgba(128,128,128,0.07); text-shadow: var(--bbs-glow-bright); }
.fd .bbs-btn-hot { box-shadow: 0 0 8px rgba(71,192,57,0.18), inset 0 0 6px rgba(71,192,57,0.05); }
.wr .bbs-btn-hot { box-shadow: 0 0 8px rgba(255,176,0,0.18), inset 0 0 6px rgba(255,176,0,0.05); }
.bbs-btn-sec {
  font-family: 'VT323', monospace;
  font-size: 14px;
  background: none;
  border: 1px solid var(--bbs-border-mid);
  color: var(--bbs-dim);
  padding: 1px 8px 0;
  cursor: pointer;
  letter-spacing: 0.04em;
}
.bbs-btn-sec:hover { border-color: var(--bbs-border-hot); color: var(--bbs-col); }
.bbs-btn-ghost {
  font-family: 'VT323', monospace;
  font-size: 13px;
  background: none;
  border: none;
  color: var(--bbs-mid);
  padding: 1px 6px 0;
  cursor: pointer;
  letter-spacing: 0.06em;
}
.bbs-btn-ghost:hover { color: var(--bbs-dim); }
.bbs-footer .bbs-btn-ghost:last-child { margin-left: auto; }

/* mail list — used inside .wr inbox panel */
.bbs-mail-row {
  display: grid;
  grid-template-columns: 1.5ch 16ch 1fr auto;
  gap: 0 8px;
  padding: 3px 14px;
  border-bottom: 1px solid var(--bbs-border);
  font-size: 16px;
  cursor: pointer;
  align-items: baseline;
}
.bbs-mail-row:nth-child(odd)  { background: var(--bbs-row-a); }
.bbs-mail-row:nth-child(even) { background: var(--bbs-row-b); }
.bbs-mail-row:hover { background: rgba(128,128,128,0.05); }
.bbs-mail-row.unread .bbs-mail-from { color: var(--bbs-bright); text-shadow: var(--bbs-glow-faint); }
.bbs-mail-row.unread .bbs-mail-subj { color: var(--bbs-col); }
.bbs-mail-row.read   .bbs-mail-from { color: var(--bbs-dim); }
.bbs-mail-row.read   .bbs-mail-subj { color: var(--bbs-mid); }
#inbox-list .bbs-mail-row.selected { background: rgba(128,128,128,0.05); outline: 1px solid var(--bbs-border-hot); outline-offset: -1px; }
.bbs-mail-dot  { color: var(--bbs-bright); text-shadow: var(--bbs-glow-faint); }
.bbs-mail-from { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bbs-mail-subj { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bbs-mail-date { font-size: 13px; color: var(--bbs-faint); text-align: right; white-space: nowrap; }

/* inline message section — shown below inbox list when a row is selected */
.bbs-msg-inline {
  background: var(--bbs-msg, transparent);
  border-top: 1px solid var(--bbs-border-hot);
  padding: 10px 16px;
}

/* compose cmdline — quick-reply hint strip below inline message */
.bbs-compose-cmdline {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 3px;
}
.bbs-compose-prompt { color: var(--bbs-col); text-shadow: var(--bbs-glow-faint); font-size: 20px; flex-shrink: 0; }
.bbs-compose-xmit {
  font-family: 'VT323', monospace;
  font-size: 14px;
  background: none;
  border: none;
  color: var(--bbs-faint);
  padding: 0 4px;
  cursor: pointer;
  letter-spacing: 0.14em;
  margin-left: auto;
}
.bbs-compose-xmit:hover { color: var(--bbs-dim); }
.bbs-compose-xmit.active { color: var(--bbs-col); text-shadow: var(--bbs-glow-faint); cursor: pointer; }
.bbs-compose-xmit.active:hover { color: var(--bbs-bright); text-shadow: var(--bbs-glow); }
.bbs-reply-input {
  flex: 1;
  background: none;
  border: none;
  border-bottom: 1px solid var(--bbs-border-mid);
  color: var(--bbs-col);
  font-family: 'VT323', monospace;
  font-size: 15px;
  padding: 0 4px;
  outline: none;
}
.bbs-reply-input:focus { border-bottom-color: var(--bbs-border-hot); }
.bbs-reply-input::placeholder { color: var(--bbs-faint); font-style: italic; }

/* message pane inside .wr */
.bbs-msg-pane {
  flex: 1;
  overflow-y: auto;
  padding: 10px 16px;
  display: flex;
  flex-direction: column;
  background: var(--bbs-msg, transparent);
}
.bbs-msg-field { display: flex; align-items: baseline; gap: 10px; font-size: 14px; line-height: 1.7; }
.bbs-msg-lbl   { color: var(--bbs-dim); min-width: 9ch; flex-shrink: 0; letter-spacing: 0.08em; }
.bbs-msg-val   { color: var(--bbs-col); }
.bbs-msg-subj  { color: var(--bbs-col); }
.bbs-msg-rule  { border: none; border-top: 1px solid var(--bbs-border-mid); margin: 8px 0 12px; }
.bbs-msg-body  { font-size: 16px; color: var(--bbs-col); line-height: 1.6; flex: 1; white-space: pre-wrap; }

/* compose strip inside .wr */
.bbs-compose-strip {
  border-top: 1px solid var(--bbs-border-hot);
  background: var(--bbs-foot);
  padding: 5px 14px 3px;
}
.bbs-compose-label { font-size: 13px; color: var(--bbs-faint); letter-spacing: 0.14em; margin-bottom: 3px; }
.bbs-compose-fields { display: flex; flex-direction: column; gap: 4px; }
.bbs-compose-row    { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.bbs-compose-key    { color: var(--bbs-faint); min-width: 4ch; letter-spacing: 0.08em; }
.bbs-compose-input  {
  flex: 1;
  background: none;
  border: none;
  border-bottom: 1px solid var(--bbs-border-mid);
  color: var(--bbs-col);
  font-family: 'VT323', monospace;
  font-size: 16px;
  padding: 1px 4px;
  outline: none;
}
.bbs-compose-input:focus { border-bottom-color: var(--bbs-border-hot); }
.bbs-compose-textarea {
  flex: 1;
  background: none;
  border: 1px solid var(--bbs-border-mid);
  color: var(--bbs-col);
  font-family: 'VT323', monospace;
  font-size: 16px;
  padding: 4px;
  outline: none;
  resize: none;
  min-height: 60px;
}
.bbs-compose-textarea:focus { border-color: var(--bbs-border-hot); }
.bbs-compose-status { font-size: 13px; min-height: 16px; margin-top: 2px; color: var(--bbs-dim); }
.bbs-compose-status.error { color: var(--red); }
.bbs-compose-status.ok    { color: var(--bbs-col); }
.bbs-compose-suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--bbs-head);
  border: 1px solid var(--bbs-border-hot);
  z-index: 10;
  display: none;
  max-height: 120px;
  overflow-y: auto;
}
.bbs-compose-suggestions.active { display: block; }
.bbs-compose-suggestion {
  padding: 3px 8px;
  font-size: 15px;
  color: var(--bbs-dim);
  cursor: pointer;
}
.bbs-compose-suggestion:hover,
.bbs-compose-suggestion.focused { background: rgba(128,128,128,0.08); color: var(--bbs-col); }

/* Loadout hub-badge animations */
@keyframes loadout-badge-blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}
.loadout-blink-dot {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  margin-right: 5px;
  vertical-align: 2px;
  animation: loadout-badge-blink 1.1s step-end infinite;
}