/* A restrained distribution skin layered over the unchanged personal UI. */
:root {
  --distribution-violet: #9b87f5;
  --distribution-cyan: #61dafb;
}

body {
  background:
    radial-gradient(circle at 88% 3%, rgba(155, 135, 245, .12), transparent 27rem),
    radial-gradient(circle at 6% 28%, rgba(97, 218, 251, .07), transparent 24rem),
    var(--bg);
  font-family: Inter, "Segoe UI", Pretendard, system-ui, sans-serif;
}

.hdr-price,
.hdr-change,
.score-value,
.kv-value,
.qs-value,
.ladder-table,
.watchlist-table {
  font-family: "Cascadia Code", "JetBrains Mono", Consolas, monospace;
}

.header {
  border-top: 2px solid transparent;
  border-image: linear-gradient(90deg, var(--distribution-cyan), var(--distribution-violet), transparent 75%) 1;
  background: linear-gradient(120deg, rgba(8, 19, 31, .98), rgba(19, 17, 42, .96));
}

.distribution-mark {
  display: inline-flex;
  margin-left: .55rem;
  padding: .15rem .48rem;
  border: 1px solid rgba(155, 135, 245, .65);
  border-radius: 999px;
  color: #c8bcff;
  font-size: .58em;
  letter-spacing: .13em;
  vertical-align: .17em;
}

.edition-switch {
  display: inline-flex;
  margin-left: .45rem;
  padding: .18rem .5rem;
  border: 1px solid rgba(97, 218, 251, .45);
  border-radius: 999px;
  color: var(--distribution-cyan);
  font-size: .52em;
  letter-spacing: .08em;
  text-decoration: none;
  vertical-align: .2em;
}
.edition-switch:hover { background: rgba(97, 218, 251, .1); }

.panel {
  border-radius: 9px;
  border-color: color-mix(in srgb, var(--border) 82%, var(--distribution-violet));
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}

.panel:hover {
  border-color: color-mix(in srgb, var(--border) 55%, var(--distribution-cyan));
}

.panel-title {
  letter-spacing: .055em;
  font-weight: 650;
}

/* The JS layout layer moves whole panels only; panel internals remain unchanged. */
.grid {
  grid-template-columns: 1fr 1.05fr .95fr;
  grid-template-areas: "decision market context";
}
.col-left { grid-area: decision; }
.col-center { grid-area: market; }
.col-right { grid-area: context; }

.desk-intro {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.desk-intro > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 9px 12px;
  border: 1px solid rgba(97, 218, 251, .2);
  border-radius: 8px;
  background: linear-gradient(110deg, rgba(11, 18, 36, .94), rgba(25, 21, 52, .82));
}
.desk-intro b { color: var(--distribution-cyan); font-size: .76rem; letter-spacing: .08em; }
.desk-intro span { color: var(--text-dim); font-size: .7rem; }

.desk-lane-label {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 4px 2px 7px;
  color: var(--text-dim);
}
.desk-lane-label > span {
  color: var(--distribution-violet);
  font: 700 1.2rem/1 "Cascadia Code", Consolas, monospace;
}
.desk-lane-label b { display: block; color: var(--text); font-size: .74rem; letter-spacing: .12em; }
.desk-lane-label small { display: block; margin-top: 2px; font-size: .62rem; }

.symbol-input { order: 1; }
.scenario-select { order: 2; }
.analyze-btn { order: 3; }
#options-window-btn { order: 4; }
#alerts-mute-btn { order: 5; }
.input-error { order: 7; }

.analyze-btn {
  background: linear-gradient(110deg, var(--accent), var(--distribution-violet));
  border-color: transparent;
}

/* Distribution edition cannot mutate personal settings. */
.watchlist-manage-row,
.watchlist-table th:last-child,
.watchlist-table td:last-child {
  display: none !important;
}

.footer {
  color: color-mix(in srgb, var(--muted) 76%, var(--distribution-violet));
}

@media (max-width: 720px) {
  .distribution-mark { display: none; }
  .grid {
    grid-template-columns: 1fr;
    grid-template-areas: "decision" "market" "context";
  }
  .desk-intro { grid-template-columns: 1fr; }
}

@media (min-width: 721px) and (max-width: 1100px) {
  .grid {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "decision market" "context context";
  }
}

/* ======================= CYBERPUNK GAME HUD ======================= */
body[data-desk-skin="cyberpunk"] {
  --bg: #03010a;
  --panel-bg: rgba(8, 5, 24, .92);
  --panel-bg-alt: rgba(18, 7, 38, .9);
  --border: #00f6ff;
  --border-dim: #5c2a72;
  --text: #f1f7ff;
  --text-dim: #a8a3c7;
  --long: #39ff88;
  --short: #ff315f;
  --warn: #ffe75c;
  background:
    linear-gradient(rgba(0, 246, 255, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 43, 214, .045) 1px, transparent 1px),
    radial-gradient(circle at 78% 0%, rgba(255, 43, 214, .24), transparent 32rem),
    #03010a;
  background-size: 36px 36px, 36px 36px, auto, auto;
}
body[data-desk-skin="cyberpunk"]::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: .14;
  background: repeating-linear-gradient(0deg, transparent 0 3px, #00f6ff 4px);
  mix-blend-mode: screen;
}
body[data-desk-skin="cyberpunk"] .header {
  border: 1px solid #00f6ff;
  border-right: 5px solid #ff2bd6;
  border-radius: 0;
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
  box-shadow: 0 0 20px rgba(0, 246, 255, .25), inset 0 0 32px rgba(255, 43, 214, .08);
}
body[data-desk-skin="cyberpunk"] .brand {
  color: #00f6ff;
  text-shadow: 2px 0 #ff2bd6, 0 0 14px #00f6ff;
}
body[data-desk-skin="cyberpunk"] .distribution-mark {
  color: #ff72e3;
  border-color: #ff2bd6;
  box-shadow: 0 0 12px rgba(255, 43, 214, .55);
}
body[data-desk-skin="cyberpunk"] .panel {
  position: relative;
  border: 1px solid rgba(0, 246, 255, .62);
  border-radius: 0;
  clip-path: polygon(0 0, calc(100% - 13px) 0, 100% 13px, 100% 100%, 0 100%);
  background: linear-gradient(145deg, rgba(8, 5, 24, .96), rgba(20, 5, 35, .9));
  box-shadow: 4px 4px 0 rgba(255, 43, 214, .15), inset 0 0 24px rgba(0, 246, 255, .035);
}
body[data-desk-skin="cyberpunk"] .panel::after {
  content: "SYS//ONLINE";
  position: absolute;
  right: 8px;
  top: 5px;
  color: #ff2bd6;
  font: 8px/1 "Cascadia Code", monospace;
  letter-spacing: .12em;
}
body[data-desk-skin="cyberpunk"] .panel-title { color: #00f6ff; text-shadow: 0 0 8px rgba(0, 246, 255, .55); }
body[data-desk-skin="cyberpunk"] .analyze-btn {
  color: #05010c;
  background: linear-gradient(90deg, #00f6ff, #ff2bd6);
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
}
body[data-desk-skin="cyberpunk"] .desk-intro > div {
  border-color: #ff2bd6;
  border-radius: 0;
  box-shadow: inset 3px 0 #00f6ff, 0 0 14px rgba(255, 43, 214, .16);
}

/* ======================== RETRO PIXEL 2D ========================= */
body[data-desk-skin="pixel"] {
  --bg: #18152b;
  --panel-bg: #262143;
  --panel-bg-alt: #302952;
  --border: #ffe66d;
  --border-dim: #806fa8;
  --text: #fff8df;
  --text-dim: #c4b9df;
  --long: #78e08f;
  --short: #ff7675;
  --warn: #ffd32a;
  font-family: "Cascadia Mono", "Courier New", monospace;
  image-rendering: pixelated;
  background-color: #18152b;
  background-image:
    linear-gradient(45deg, #211c39 25%, transparent 25%),
    linear-gradient(-45deg, #211c39 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #211c39 75%),
    linear-gradient(-45deg, transparent 75%, #211c39 75%);
  background-size: 24px 24px;
  background-position: 0 0, 0 12px, 12px -12px, -12px 0;
}
body[data-desk-skin="pixel"] .header,
body[data-desk-skin="pixel"] .panel,
body[data-desk-skin="pixel"] .search-bar,
body[data-desk-skin="pixel"] .desk-intro > div {
  border: 4px solid #100d1f;
  border-radius: 0;
  outline: 3px solid #ffe66d;
  box-shadow: 7px 7px 0 #100d1f;
  background: #262143;
}
body[data-desk-skin="pixel"] .header { border-image: none; }
body[data-desk-skin="pixel"] .brand {
  color: #ffe66d;
  text-shadow: 3px 3px 0 #b339d3;
  letter-spacing: .04em;
}
body[data-desk-skin="pixel"] .distribution-mark {
  color: #18152b;
  background: #78e08f;
  border: 3px solid #100d1f;
  border-radius: 0;
}
body[data-desk-skin="pixel"] .panel-title {
  display: inline-block;
  margin-left: -2px;
  padding: 3px 7px;
  color: #18152b;
  background: #ffe66d;
  box-shadow: 3px 3px 0 #100d1f;
  letter-spacing: 0;
}
body[data-desk-skin="pixel"] .badge,
body[data-desk-skin="pixel"] button,
body[data-desk-skin="pixel"] input,
body[data-desk-skin="pixel"] select {
  border: 3px solid #100d1f;
  border-radius: 0;
  box-shadow: 3px 3px 0 #100d1f;
}
body[data-desk-skin="pixel"] .analyze-btn {
  color: #18152b;
  background: #78e08f;
}
body[data-desk-skin="pixel"] .desk-lane-label > span { color: #ffe66d; text-shadow: 2px 2px 0 #b339d3; }
body[data-desk-skin="pixel"] .score-bar-track { border: 2px solid #100d1f; border-radius: 0; }
body[data-desk-skin="pixel"] .score-bar-fill { border-radius: 0; }
body[data-desk-skin="pixel"] .edition-switch { border-radius: 0; color: #ffe66d; border-color: #ffe66d; }

/* Cyberpunk uses a tactical-game viewport: context console / main combat
   screen / telemetry console. Only whole panels move; their contents stay. */
body[data-desk-skin="cyberpunk"] .cyber-game-layout {
  grid-template-columns: minmax(230px, .78fr) minmax(420px, 1.5fr) minmax(260px, .9fr);
  grid-template-areas: "context decision market";
  gap: 14px;
  padding: 10px;
  border-left: 1px solid rgba(255, 43, 214, .5);
  border-right: 1px solid rgba(0, 246, 255, .5);
  background: rgba(2, 1, 12, .52);
  box-shadow: inset 0 0 50px rgba(0, 246, 255, .04);
}
body[data-desk-skin="cyberpunk"] .cyber-game-layout .col-left { grid-area: decision; }
body[data-desk-skin="cyberpunk"] .cyber-game-layout .col-center { grid-area: market; }
body[data-desk-skin="cyberpunk"] .cyber-game-layout .col-right { grid-area: context; }
body[data-desk-skin="cyberpunk"] .cyber-game-layout .col-left {
  padding: 8px;
  border: 1px solid rgba(0, 246, 255, .28);
  background: linear-gradient(180deg, rgba(0, 246, 255, .035), transparent);
}
.cyber-game-bar {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr auto;
  gap: 1px;
  border: 1px solid #00f6ff;
  background: #00f6ff;
  clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 15px 100%, 0 calc(100% - 15px));
}
.cyber-game-bar > span {
  padding: 8px 12px;
  background: #080518;
  color: #a8a3c7;
  font: 10px/1.2 "Cascadia Code", monospace;
  letter-spacing: .1em;
}
.cyber-game-bar b { color: #39ff88; text-shadow: 0 0 8px currentColor; }
.cyber-game-bar .cyber-target { color: #00f6ff; }
.cyber-game-bar .cyber-coords { color: #ff72e3; }
.cyber-viewport-frame { position: fixed; inset: 6px; z-index: 10000; pointer-events: none; }
.cyber-viewport-frame i { position: absolute; width: 34px; height: 34px; }
.cyber-viewport-frame i:nth-child(1) { left: 0; top: 0; border-left: 2px solid #00f6ff; border-top: 2px solid #00f6ff; }
.cyber-viewport-frame i:nth-child(2) { right: 0; top: 0; border-right: 2px solid #ff2bd6; border-top: 2px solid #ff2bd6; }
.cyber-viewport-frame i:nth-child(3) { left: 0; bottom: 0; border-left: 2px solid #ff2bd6; border-bottom: 2px solid #ff2bd6; }
.cyber-viewport-frame i:nth-child(4) { right: 0; bottom: 0; border-right: 2px solid #00f6ff; border-bottom: 2px solid #00f6ff; }

/* Pixel 2D uses an RPG screen: large play field on the left and stacked
   status/quest panes on the right. Existing panels act as game windows. */
body[data-desk-skin="pixel"] .pixel-game-layout {
  grid-template-columns: minmax(0, 1.7fr) minmax(310px, .85fr);
  grid-template-areas: "market decision" "market context";
  align-items: start;
  gap: 14px;
  padding: 12px;
  border: 4px solid #100d1f;
  outline: 4px solid #b339d3;
  box-shadow: 10px 10px 0 #100d1f;
  background: #1e1936;
}
body[data-desk-skin="pixel"] .pixel-game-layout .col-center { grid-area: market; }
body[data-desk-skin="pixel"] .pixel-game-layout .col-left { grid-area: decision; }
body[data-desk-skin="pixel"] .pixel-game-layout .col-right { grid-area: context; }
.pixel-game-bar {
  display: grid;
  grid-template-columns: 46px 1.3fr 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 9px 12px;
  border: 4px solid #100d1f;
  outline: 4px solid #78e08f;
  background: #302952;
  box-shadow: 7px 7px 0 #100d1f;
  font-family: "Cascadia Mono", "Courier New", monospace;
}
.pixel-avatar {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 4px solid #100d1f;
  color: #18152b;
  background: #ffe66d;
  box-shadow: 4px 4px 0 #b339d3;
  font-size: 22px;
  font-weight: 900;
}
.pixel-game-bar b { display: block; color: #ffe66d; font-size: 12px; }
.pixel-game-bar span { display: block; color: #c4b9df; font-size: 9px; margin-top: 3px; }
.pixel-meter i { display: block; width: 100%; height: 12px; margin-top: 4px; border: 3px solid #100d1f; background: #18152b; }
.pixel-meter em { display: block; width: 86%; height: 100%; background: #78e08f; }
.pixel-coins { color: #ffe66d; font-weight: 900; text-shadow: 2px 2px 0 #100d1f; }

@media (max-width: 900px) {
  body[data-desk-skin="cyberpunk"] .cyber-game-layout,
  body[data-desk-skin="pixel"] .pixel-game-layout {
    grid-template-columns: 1fr;
    grid-template-areas: "decision" "market" "context";
  }
  .cyber-game-bar, .pixel-game-bar { grid-template-columns: 1fr 1fr; }
}

/* ===================== MISSION CONTROL CONSOLE ===================== */
body[data-desk-skin="mission"] {
  --bg: #070b12;
  --panel-bg: #0c131d;
  --panel-bg-alt: #101a26;
  --border: #58d6b1;
  --border-dim: #254b4a;
  --text: #e7edf3;
  --text-dim: #8fa3b3;
  --long: #59d98e;
  --short: #ef6a78;
  --warn: #e7c65b;
  background: #070b12;
  font-family: Inter, "Segoe UI", Pretendard, system-ui, sans-serif;
}
body[data-desk-skin="mission"] .app { max-width: 1480px; gap: 10px; }
body[data-desk-skin="mission"] .header {
  padding: 12px 16px;
  border: 1px solid #233241;
  border-top: 3px solid #58d6b1;
  border-radius: 3px;
  background: linear-gradient(90deg, #0b121b, #101824);
  box-shadow: none;
}
body[data-desk-skin="mission"] .brand { color: #e7edf3; letter-spacing: .08em; }
body[data-desk-skin="mission"] .distribution-mark {
  color: #58d6b1;
  border-color: #315e59;
  border-radius: 3px;
  background: rgba(88, 214, 177, .06);
}
body[data-desk-skin="mission"] .header-info { border-left: 2px solid #315e59; padding-left: 10px; }
body[data-desk-skin="mission"] .search-bar {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) auto auto auto 1fr;
  align-items: center;
  border: 1px solid #233241;
  border-radius: 3px;
  background: #0a111a;
}
body[data-desk-skin="mission"] .search-bar::before {
  content: "COMMAND BAR";
  color: #58d6b1;
  font: 700 10px/1 "Cascadia Code", monospace;
  letter-spacing: .12em;
}
body[data-desk-skin="mission"] .symbol-input { order: 1; }
body[data-desk-skin="mission"] .scenario-select { order: 2; }
body[data-desk-skin="mission"] .analyze-btn { order: 3; }
body[data-desk-skin="mission"] #options-window-btn { order: 4; }
body[data-desk-skin="mission"] #alerts-mute-btn { order: 5; }

.mission-command-strip {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1px;
  border: 1px solid #233241;
  background: #233241;
}
.mission-command-strip > div { display: flex; justify-content: space-between; gap: 12px; padding: 8px 11px; background: #0a111a; }
.mission-command-strip span { color: #60798a; font: 9px/1.2 "Cascadia Code", monospace; letter-spacing: .1em; }
.mission-command-strip b { color: #b7c8d4; font: 10px/1.2 "Cascadia Code", monospace; letter-spacing: .05em; }

body[data-desk-skin="mission"] .mission-control-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: none;
  gap: 10px;
}
body[data-desk-skin="mission"] .mission-control-layout > .panel {
  margin: 0;
  border: 1px solid #233241;
  border-left: 2px solid #315e59;
  border-radius: 3px;
  background: #0c131d;
  box-shadow: none;
}
body[data-desk-skin="mission"] .mission-control-layout > .panel:hover { border-color: #315e59; border-left-color: #58d6b1; }
body[data-desk-skin="mission"] .panel-title {
  padding-bottom: 7px;
  border-bottom: 1px solid #1d2a36;
  color: #cbd8e1;
  font-size: .78rem;
  letter-spacing: .08em;
}
body[data-desk-skin="mission"] #panel-scores {
  grid-column: 1 / -1;
  min-height: 220px;
  padding: 22px 28px;
  border-top: 2px solid #58d6b1;
  background: linear-gradient(120deg, #0d1720, #0b121b 62%, #101922);
}
.mission-hero-kicker { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.mission-hero-kicker span { color: #58d6b1; font-weight: 750; letter-spacing: .08em; }
.mission-hero-kicker small { max-width: 520px; color: #8fa3b3; text-align: right; }
body[data-desk-skin="mission"] #panel-scores .panel-title { display: none; }
body[data-desk-skin="mission"] #panel-scores .score-row { grid-template-columns: 90px 1fr 110px 90px; min-height: 58px; }
body[data-desk-skin="mission"] #panel-scores .score-value { font-size: 1.45rem; color: #e7edf3; }

body[data-desk-skin="mission"] #panel-technicals::before { content: "PRICE STRUCTURE"; }
body[data-desk-skin="mission"] #panel-micro::before { content: "VOLUME & ACTIVITY"; }
body[data-desk-skin="mission"] #panel-ladder::before { content: "LEVEL MAP"; }
body[data-desk-skin="mission"] #panel-regime::before { content: "MARKET CONTEXT"; }
body[data-desk-skin="mission"] #panel-technicals::before,
body[data-desk-skin="mission"] #panel-micro::before,
body[data-desk-skin="mission"] #panel-ladder::before,
body[data-desk-skin="mission"] #panel-regime::before {
  display: block;
  margin-bottom: 8px;
  color: #58d6b1;
  font: 700 9px/1 "Cascadia Code", monospace;
  letter-spacing: .12em;
}
body[data-desk-skin="mission"] #panel-drivers,
body[data-desk-skin="mission"] #panel-gates { grid-column: 1 / -1; }
body[data-desk-skin="mission"] #panel-drivers .drivers-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 7px 18px;
}
body[data-desk-skin="mission"] #panel-gates .kv-table tbody { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
body[data-desk-skin="mission"] #panel-gates .kv-table tr { display: flex; justify-content: space-between; padding: 7px 9px; border: 1px solid #1d2a36; }
body[data-desk-skin="mission"] #panel-my-entry,
body[data-desk-skin="mission"] #panel-quote-strip,
body[data-desk-skin="mission"] #panel-relative-strength,
body[data-desk-skin="mission"] #panel-news,
body[data-desk-skin="mission"] #panel-event-risk { grid-column: span 1; }

.mission-system-rail {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 8px 12px;
  border: 1px solid #233241;
  border-left: 3px solid #58d6b1;
  background: #090f17;
}
.mission-system-rail > b { flex: 0 0 auto; color: #58d6b1; font: 700 9px/1 "Cascadia Code", monospace; letter-spacing: .12em; }
.mission-system-rail .header-row { margin: 0; font-size: .66rem; }
.mission-system-rail .header-timestamps { margin-left: auto; }

/* Mission Control v2: one connected cockpit, not another card dashboard. */
body[data-desk-skin="mission"] {
  background:
    radial-gradient(circle at 50% 34%, rgba(37, 137, 119, .16), transparent 31rem),
    linear-gradient(rgba(82, 214, 177, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(82, 214, 177, .025) 1px, transparent 1px), #050910;
  background-size: auto, 32px 32px, 32px 32px, auto;
}
body[data-desk-skin="mission"] .app { max-width: 1680px; }
body[data-desk-skin="mission"] .desk-intro,
body[data-desk-skin="mission"] .desk-intro[hidden] { display: none !important; }
body[data-desk-skin="mission"] .header {
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
  border: 0;
  border-top: 2px solid #58d6b1;
  border-bottom: 1px solid #244b49;
  background: linear-gradient(90deg, #071019 0 34%, #0e1b25 50%, #071019 66%);
}
.mission-command-strip {
  position: relative;
  gap: 0;
  border: 0;
  background: transparent;
}
.mission-command-strip::after {
  content: "";
  position: absolute;
  left: 8%; right: 8%; bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, #58d6b1, transparent);
}
.mission-command-strip > div {
  border-right: 1px solid #233b43;
  background: linear-gradient(180deg, #0b151e, #071019);
}
.mission-command-strip > div:first-child { clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 100%, 14px 100%); }
.mission-command-strip > div:last-child { border-right: 0; clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 100%, 14px 100%); }

body[data-desk-skin="mission"] .mission-control-layout {
  display: grid;
  grid-template-columns: minmax(280px, .82fr) minmax(480px, 1.45fr) minmax(280px, .82fr);
  gap: 0;
  align-items: stretch;
  padding: 12px 0 0;
  border-top: 1px solid #1c3538;
  background: linear-gradient(90deg, rgba(8,15,23,.88), rgba(14,27,34,.94) 50%, rgba(8,15,23,.88));
  box-shadow: inset 0 0 70px rgba(0,0,0,.7), 0 20px 70px rgba(0,0,0,.28);
}
.mission-wing, .mission-core { min-width: 0; }
.mission-wing {
  padding: 0 12px 14px;
  background: linear-gradient(180deg, rgba(15,31,39,.8), rgba(7,13,20,.96));
}
.mission-wing-left { border-right: 1px solid #2d5a55; clip-path: polygon(0 0, 100% 24px, 100% 100%, 0 100%); }
.mission-wing-right { border-left: 1px solid #2d5a55; clip-path: polygon(0 24px, 100% 0, 100% 100%, 0 100%); }
.mission-wing > header {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 3px 9px;
  align-items: center;
  min-height: 58px;
  padding: 10px 4px 5px;
  color: #58d6b1;
}
.mission-wing-right > header { grid-template-columns: 1fr auto; text-align: right; }
.mission-wing > header span { grid-row: 1 / 3; font-size: 1.4rem; color: #315e59; }
.mission-wing > header b { font: 750 .74rem/1.1 "Cascadia Code", monospace; letter-spacing: .1em; }
.mission-wing > header small { color: #617989; font: .55rem/1.2 "Cascadia Code", monospace; letter-spacing: .08em; }
.mission-wing-stack { display: grid; gap: 0; }

.mission-core {
  position: relative;
  z-index: 2;
  padding: 0 14px 16px;
  border-left: 1px solid #173b39;
  border-right: 1px solid #173b39;
  background: radial-gradient(circle at 50% 14%, rgba(88,214,177,.12), transparent 15rem), #081019;
  box-shadow: 0 0 35px rgba(0,0,0,.65);
}
.mission-core-orbit {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px;
  height: 58px;
  color: #74efd0;
  font: 800 .67rem/1 "Cascadia Code", monospace;
  letter-spacing: .18em;
}
.mission-core-orbit i { height: 1px; background: linear-gradient(90deg, transparent, #58d6b1); }
.mission-core-orbit i:last-child { background: linear-gradient(90deg, #58d6b1, transparent); }
.mission-core > [data-mission-zone="core"] { display: grid; gap: 0; }

body[data-desk-skin="mission"] .mission-control-layout .panel {
  margin: 0;
  padding: 13px 12px;
  border: 0;
  border-top: 1px solid #1e363d;
  border-radius: 0;
  background: rgba(8, 16, 24, .68);
  box-shadow: none;
}
body[data-desk-skin="mission"] .mission-control-layout .panel + .panel { border-top-color: #2a514e; }
body[data-desk-skin="mission"] .mission-control-layout .panel:hover { background: rgba(14, 29, 37, .8); }
body[data-desk-skin="mission"] .mission-control-layout .panel-title {
  margin: 0 0 9px;
  padding: 0 0 6px;
  border: 0;
  color: #9fb3bf;
  font-size: .68rem;
}
body[data-desk-skin="mission"] #panel-scores {
  min-height: 260px;
  padding: 22px 22px 18px;
  border: 1px solid #3c746b;
  background: radial-gradient(circle at 50% 50%, rgba(51,151,130,.18), transparent 62%), #09141d;
  clip-path: polygon(18px 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 18px 100%, 0 calc(100% - 18px), 0 18px);
}
body[data-desk-skin="mission"] #panel-scores .score-row {
  grid-template-columns: 84px 1fr 92px 74px;
  min-height: 76px;
}
body[data-desk-skin="mission"] #panel-scores .score-bar-track { height: 5px; background: #16242c; }
body[data-desk-skin="mission"] #panel-scores .score-value { font-size: 1.75rem; }
.mission-hero-kicker { flex-direction: column; align-items: center; text-align: center; margin-bottom: 8px; }
.mission-hero-kicker span { font-size: .9rem; }
.mission-hero-kicker small { max-width: none; text-align: center; }
body[data-desk-skin="mission"] #panel-drivers .drivers-list { grid-template-columns: 1fr; }
body[data-desk-skin="mission"] #panel-gates .kv-table tbody { grid-template-columns: repeat(2, 1fr); }

.mission-debrief {
  grid-column: 1 / -1;
  border-top: 2px solid #315e59;
  background: #070d14;
}
.mission-debrief-label {
  display: flex;
  justify-content: space-between;
  padding: 9px 14px;
  color: #58d6b1;
  background: linear-gradient(90deg, #102029, #081019);
  font: 700 .63rem/1 "Cascadia Code", monospace;
  letter-spacing: .12em;
}
.mission-debrief-label small { color: #607785; }
.mission-debrief-grid { display: grid; grid-template-columns: 1.25fr .85fr .85fr; }
.mission-debrief-grid > .panel { border-right: 1px solid #1e363d !important; }
.mission-debrief-grid > .panel:last-child { border-right: 0 !important; }

body[data-desk-skin="mission"] #panel-technicals::before,
body[data-desk-skin="mission"] #panel-micro::before,
body[data-desk-skin="mission"] #panel-ladder::before,
body[data-desk-skin="mission"] #panel-regime::before { display: none; }

.mission-system-rail {
  clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 10px 100%, 0 50%);
  border: 0;
  border-top: 1px solid #315e59;
  border-bottom: 1px solid #315e59;
  background: linear-gradient(90deg, #071019, #10232a 50%, #071019);
}

/* Mission Control v3: rail, deck, matrix, tabs, and folds. */
body[data-desk-skin="mission"] .mission-control-deck {
  position: relative;
  display: grid;
  grid-template-columns: 1.15fr .9fr 1.15fr 1fr auto;
  gap: 0;
  padding: 0 12px 0 92px;
  min-height: 64px;
  border: 1px solid #294a4b;
  border-left: 4px solid #58d6b1;
  background: linear-gradient(90deg, #0d1922, #071019);
}
body[data-desk-skin="mission"] .mission-control-deck::before {
  content: "ANALYSIS\A CONTROL";
  white-space: pre;
  position: absolute;
  left: 14px;
  top: 16px;
  color: #58d6b1;
  font: 800 .62rem/1.35 "Cascadia Code", monospace;
  letter-spacing: .1em;
}
.mission-deck-field {
  display: grid;
  align-content: center;
  gap: 4px;
  min-width: 0;
  padding: 8px 12px;
  border-left: 1px solid #1d353b;
}
.mission-deck-symbol { order: 1; }
.mission-deck-profile { order: 2; }
.mission-deck-source { order: 3; }
.mission-deck-run { order: 4; }
.mission-deck-actions { order: 5; }
.mission-deck-field > span {
  color: #607c88;
  font: 700 .52rem/1 "Cascadia Code", monospace;
  letter-spacing: .12em;
}
body[data-desk-skin="mission"] .mission-deck-field input,
body[data-desk-skin="mission"] .mission-deck-field select,
body[data-desk-skin="mission"] .mission-deck-field button {
  width: 100%;
  min-height: 28px;
  padding: 2px 4px;
  border: 0;
  border-bottom: 1px solid #315e59;
  border-radius: 0;
  background: transparent;
}
body[data-desk-skin="mission"] .mission-deck-run { background: rgba(56,139,122,.1); }
body[data-desk-skin="mission"] .mission-deck-run button { color: #73e8c9; font-weight: 800; }
.mission-deck-actions { display: flex; align-items: center; gap: 6px; padding-left: 10px; }
body[data-desk-skin="mission"] .mission-deck-actions button { border-radius: 2px; }
body[data-desk-skin="mission"] .mission-control-deck > .input-error { position: absolute; left: 92px; bottom: -17px; }

.mission-process-rail {
  display: grid;
  grid-template-columns: auto 1fr auto 1fr auto;
  align-items: center;
  padding: 6px max(16px, 6vw);
  border: 0;
  background: #060c13;
}
.mission-process-rail::after { display: none; }
.mission-process-rail > div,
.mission-process-rail > div:first-child,
.mission-process-rail > div:last-child {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0;
  border: 0;
  clip-path: none;
  background: transparent;
}
.mission-process-rail > div strong {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid #58d6b1;
  border-radius: 50%;
  color: #73e8c9;
  font: 700 .58rem/1 "Cascadia Code", monospace;
}
.mission-process-rail > div span { display: grid; gap: 2px; }
.mission-process-rail > div b { color: #b9cbd3; font: 700 .6rem/1 "Cascadia Code", monospace; letter-spacing: .09em; }
.mission-process-rail > div small { color: #526d78; font-size: .56rem; }
.mission-process-rail > i { height: 1px; margin: 0 16px; background: linear-gradient(90deg, #315e59, #58d6b1, #315e59); }

body[data-desk-skin="mission"] #panel-gates .kv-table { display: block; }
body[data-desk-skin="mission"] #panel-gates .kv-table tbody {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
}
body[data-desk-skin="mission"] #panel-gates .kv-table tr {
  display: grid;
  place-items: center;
  min-height: 72px;
  padding: 8px 4px;
  border: 1px solid #26434a;
  background: linear-gradient(145deg, rgba(27,52,59,.65), rgba(7,15,22,.8));
  text-align: center;
}
body[data-desk-skin="mission"] #panel-gates .kv-table td { display: block; padding: 2px; }
body[data-desk-skin="mission"] #panel-gates .kv-table td:first-child { font-size: .58rem; letter-spacing: .05em; color: #758d98; }
body[data-desk-skin="mission"] #panel-gates .kv-table .kv-value { font-size: .82rem; }

.mission-research-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid #315e59;
  background: #081119;
}
.mission-research-tabs button {
  min-width: 130px;
  padding: 10px 18px;
  border: 0;
  border-right: 1px solid #20383e;
  color: #6f8792;
  background: transparent;
  font: 700 .62rem/1 "Cascadia Code", monospace;
  letter-spacing: .08em;
  cursor: pointer;
}
.mission-research-tabs button.active { color: #73e8c9; background: #102128; box-shadow: inset 0 -2px #58d6b1; }
.mission-debrief-grid { display: block; }
.mission-debrief-grid > .panel { min-height: 0; border-right: 0 !important; }
.mission-debrief-grid > .panel[hidden] { display: none !important; }
body[data-desk-skin="mission"] .mission-debrief-grid #panel-my-entry { padding-block: 11px; }
body[data-desk-skin="mission"] .mission-debrief-grid #panel-my-entry .panel-title { margin-bottom: 7px; }
body[data-desk-skin="mission"] .mission-debrief-grid #panel-my-entry .my-entry-input-row { margin-bottom: 0; }

/* Quote strip is a compact telemetry submodule, visually attached to the
   flow stack instead of reading as another independent dashboard card. */
body[data-desk-skin="mission"] #panel-quote-strip {
  position: relative;
  padding: 8px 8px 10px;
  border-top: 1px dashed #315e59;
  background: rgba(5, 12, 18, .76);
}
body[data-desk-skin="mission"] #panel-quote-strip .panel-title {
  margin: 0 0 5px;
  padding: 0;
  color: #5f7b85;
  font-size: .54rem;
  letter-spacing: .14em;
}
body[data-desk-skin="mission"] #panel-quote-strip .quote-strip-row { gap: 2px; }
body[data-desk-skin="mission"] #panel-quote-strip .qs-item {
  padding: 5px 3px;
  border: 0;
  border-left: 1px solid #20383e;
  border-radius: 0;
  background: transparent;
}
body[data-desk-skin="mission"] #panel-quote-strip .qs-item:first-child { border-left: 0; }
body[data-desk-skin="mission"] #panel-quote-strip .qs-label { font-size: .5rem; }
body[data-desk-skin="mission"] #panel-quote-strip .qs-value { font-size: .76rem; }

/* Keep the center decisive but shorter after historical reference is folded. */
body[data-desk-skin="mission"] #panel-scores { min-height: 230px; padding-block: 17px 14px; }
body[data-desk-skin="mission"] #panel-scores .score-row { min-height: 64px; }
body[data-desk-skin="mission"] #panel-drivers,
body[data-desk-skin="mission"] #panel-gates { padding-block: 10px; }

body[data-desk-skin="mission"] .historical-reference-title,
body[data-desk-skin="mission"] #panel-watchlist .panel-title { display: flex; align-items: center; justify-content: space-between; }
.mission-fold-toggle, .mission-watchlist-toggle {
  margin-left: auto;
  padding: 4px 8px;
  border: 1px solid #315e59;
  color: #73e8c9;
  background: transparent;
  font: 700 .55rem/1 "Cascadia Code", monospace;
  cursor: pointer;
}
.historical-reference.mission-folded > :not(.historical-reference-title) { display: none !important; }
body[data-desk-skin="mission"] #panel-watchlist { border-radius: 0; border-color: #294a4b; background: #081119; }
body[data-desk-skin="mission"] #panel-watchlist.mission-watchlist-compact #watchlist-body tr:nth-child(n+6) { display: none; }
body[data-desk-skin="mission"] #panel-drivers .drivers-list li { padding: 8px 10px; border-left: 2px solid #315e59; background: rgba(15,31,39,.55); }

.mission-position-summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 9px;
  border-top: 1px solid #29464b;
  border-bottom: 1px solid #29464b;
  background: rgba(8, 19, 26, .72);
}
.mission-position-summary > div { display: grid; gap: 5px; padding: 9px 12px; border-left: 1px solid #20383e; }
.mission-position-summary > div:first-child { border-left: 0; }
.mission-position-summary span { color: #657d88; font-size: .6rem; }
.mission-position-summary b { color: #c7d7de; font: 750 .82rem/1.2 "Cascadia Code", monospace; }
.mission-position-summary.position-positive [data-position-difference],
.mission-position-summary.position-positive [data-position-state] { color: #59d98e; }
.mission-position-summary.position-negative [data-position-difference],
.mission-position-summary.position-negative [data-position-state] { color: #ef6a78; }
.mission-position-summary.position-flat [data-position-difference],
.mission-position-summary.position-flat [data-position-state] { color: #e7c65b; }

body[data-desk-skin="mission"] #panel-gates .final-decision {
  position: relative;
  margin-top: 10px;
  padding: 22px 12px 10px;
  border: 1px solid #8c7330;
  border-left: 4px solid #e7c65b;
  background: linear-gradient(90deg, rgba(94,76,28,.28), rgba(15,22,25,.7));
  color: #f1d871;
  font-size: 1rem;
  letter-spacing: .06em;
}
body[data-desk-skin="mission"] #panel-gates .final-decision::before {
  content: "FINAL DECISION";
  position: absolute;
  top: 7px;
  left: 12px;
  color: #8f8052;
  font: 700 .5rem/1 "Cascadia Code", monospace;
  letter-spacing: .14em;
}
body[data-desk-skin="mission"] #panel-gates .decision-reason { margin-top: 5px; padding-block: 7px; }

.mission-history-summary {
  margin-left: auto;
  color: #6f8792;
  font: 600 .54rem/1 "Cascadia Code", monospace;
  letter-spacing: .04em;
}
.mission-history-summary + .mission-fold-toggle { margin-left: 10px; }

/* Last-pass density reduction without changing the three-column skeleton. */
body[data-desk-skin="mission"] .mission-control-layout .panel { padding-top: 12px; padding-bottom: 12px; }
body[data-desk-skin="mission"] #panel-drivers .drivers-list { gap: 4px; }
body[data-desk-skin="mission"] #panel-drivers .drivers-list li { padding-block: 6px; }

@media (max-width: 850px) {
  body[data-desk-skin="mission"] .search-bar,
  .mission-command-strip,
  body[data-desk-skin="mission"] .mission-control-layout { grid-template-columns: 1fr; }
  body[data-desk-skin="mission"] .mission-control-layout > .panel { grid-column: 1; }
  .mission-system-rail { display: grid; grid-template-columns: 1fr 1fr; }
  .mission-system-rail .header-timestamps { margin-left: 0; }
  .mission-hero-kicker { display: block; }
  .mission-hero-kicker small { display: block; margin-top: 6px; text-align: left; }
  body[data-desk-skin="mission"] .mission-control-layout { display: block; padding-top: 0; }
  .mission-wing-left, .mission-wing-right { clip-path: none; border: 0; }
  .mission-core { padding-top: 4px; border: 0; }
  .mission-debrief-grid { grid-template-columns: 1fr; }
  .mission-debrief-grid > .panel { border-right: 0 !important; }
  body[data-desk-skin="mission"] .mission-control-deck { grid-template-columns: 1fr 1fr; padding: 48px 8px 8px; }
  .mission-deck-actions { justify-content: flex-end; }
  .mission-process-rail { grid-template-columns: 1fr; gap: 8px; }
  .mission-process-rail > i { display: none; }
  .mission-research-tabs button { min-width: 0; flex: 1; padding-inline: 6px; }
  body[data-desk-skin="mission"] #panel-gates .kv-table tbody { grid-template-columns: repeat(2, 1fr); }
  .mission-position-summary { grid-template-columns: 1fr; }
  .mission-position-summary > div { border-left: 0; border-top: 1px solid #20383e; }
  .mission-position-summary > div:first-child { border-top: 0; }
  .mission-history-summary { display: none; }
}

/* Broker-style realtime chart UI preview. No live provider is connected yet. */
#panel-live-chart { min-width: 0; overflow: hidden; }
.broker-chart-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; }
.broker-chart-head .panel-title { margin: 0 0 3px; }
.broker-chart-symbol { color: var(--text-dim); font: 600 .65rem/1 "Cascadia Code", monospace; }
.broker-chart-status { display: flex; align-items: center; gap: 6px; padding: 5px 8px; border: 1px solid #765d32; color: #d5aa61; background: rgba(91,67,28,.2); font: 700 .52rem/1 "Cascadia Code", monospace; letter-spacing: .06em; }
.broker-chart-status i { width: 6px; height: 6px; border-radius: 50%; background: #d5aa61; box-shadow: 0 0 8px #d5aa61; }
.broker-chart-toolbar { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-top: 1px solid rgba(120,140,150,.18); border-bottom: 1px solid rgba(120,140,150,.18); }
.broker-timeframes, .broker-indicators { display: flex; gap: 3px; }
.broker-chart-toolbar button { padding: 4px 8px; border: 1px solid transparent; color: var(--text-dim); background: transparent; font: 650 .58rem/1 "Cascadia Code", monospace; cursor: pointer; }
.broker-chart-toolbar button:hover { color: var(--text); border-color: var(--border-dim); }
.broker-chart-toolbar button.active { color: #e7c574; border-color: #8b6a32; background: rgba(108,80,30,.2); }
.broker-chart-legend { display: flex; flex-wrap: wrap; gap: 10px; padding: 7px 2px; color: #71818a; font: .55rem/1 "Cascadia Code", monospace; }
.broker-chart-legend b { color: #b9c5ca; }
.broker-chart-legend .legend-vwap { color: #53b9e8; }
.broker-chart-legend .legend-ema5 { color: #f0b85a; }
.broker-chart-legend .legend-ema20 { color: #a882e8; }
.broker-chart-stage { position: relative; width: 100%; height: 390px; min-height: 280px; background: #090d12; cursor: crosshair; }
#broker-chart-canvas { display: block; width: 100%; height: 100%; }
.broker-chart-watermark { position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); color: rgba(180,196,204,.055); font: 800 clamp(1.1rem,4vw,3rem)/1 "Cascadia Code", monospace; letter-spacing: .12em; pointer-events: none; white-space: nowrap; }
.broker-chart-crosshair { position: absolute; z-index: 3; pointer-events: none; }
.broker-chart-crosshair span, .broker-chart-crosshair time { position: absolute; padding: 3px 5px; color: #dbe4e8; background: #2a3338; font: .52rem/1 "Cascadia Code", monospace; white-space: nowrap; }
.broker-chart-crosshair span { left: 5px; top: -18px; }
.broker-chart-crosshair time { left: -24px; top: 8px; }
.broker-chart-foot { display: flex; justify-content: space-between; gap: 10px; padding-top: 7px; color: #63747c; font: .52rem/1 "Cascadia Code", monospace; }

.chart-window { margin: 0; padding: 10px; background: #080c11; color: #dbe4e8; overflow: hidden; }
.chart-window[data-popup-skin="timeline"] { --popup-accent:#e4b55f; background:#11100e; color:#eee8dc; }
.chart-window[data-popup-skin="mission"] { --popup-accent:#58d6b1; }
.chart-window[data-popup-skin="cyberpunk"] { --popup-accent:#00f0ff; background:#050712; color:#dffcff; font-family:"Cascadia Code",monospace; }
.chart-window[data-popup-skin="pixel"] { --popup-accent:#ffd34e; background:#191d2c; color:#fff7da; font-family:"Courier New",monospace; image-rendering:pixelated; }
.chart-window-shell { max-width: none; margin: 0; }
.chart-window-header { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:8px; padding:8px 10px; border-bottom:1px solid var(--popup-accent,#58d6b1); background:#0d151d; }
.chart-window-header > div { display: grid; gap: 3px; }
.chart-window-header b { color:var(--popup-accent,#70dfbd); font-size:.72rem; letter-spacing:.08em; }
.chart-window-header span { color: #687b84; font-size: .58rem; }
.chart-window-header form { display: flex; gap: 5px; }
.chart-window-header input { width:110px; padding:6px 8px; border:1px solid var(--popup-accent,#315e59); color:#eef5f7; background:#070d13; font-weight:750; text-transform:uppercase; }
.chart-window-header button { padding:6px 11px; border:1px solid var(--popup-accent,#4f9d89); color:#08110f; background:var(--popup-accent,#63d5b1); font-weight:750; cursor:pointer; }
.chart-window #panel-live-chart { margin: 0; padding: 10px; border: 1px solid #263a42; border-radius: 0; background: #0b1118; }
.broker-chart-price { display: flex; align-items: baseline; gap: 8px; }
.broker-chart-price b { color: #8fa3ad; font-size: .7rem; }
.broker-chart-price strong { color: #eef5f7; font: 750 1.1rem/1 "Cascadia Code", monospace; }
.broker-chart-price span { font: 700 .7rem/1 "Cascadia Code", monospace; }
.broker-chart-price .positive { color: #46c993; }
.broker-chart-price .negative { color: #e36b72; }
.chart-window .broker-chart-stage { height: calc(100vh - 205px); min-height: 300px; }
.chart-window[data-popup-skin="timeline"] .chart-window-header, .chart-window[data-popup-skin="timeline"] #panel-live-chart { background:#191712; border-color:#55432b; }
.chart-window[data-popup-skin="cyberpunk"] #panel-live-chart, .chart-window[data-popup-skin="cyberpunk"] .broker-chart-stage { border-color:#00f0ff; box-shadow:inset 0 0 24px rgba(0,240,255,.09),0 0 14px rgba(194,39,255,.16); }
.chart-window[data-popup-skin="cyberpunk"] .chart-window-header { clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%); }
.chart-window[data-popup-skin="pixel"] .chart-window-header, .chart-window[data-popup-skin="pixel"] #panel-live-chart, .chart-window[data-popup-skin="pixel"] .broker-chart-stage, .chart-window[data-popup-skin="pixel"] input, .chart-window[data-popup-skin="pixel"] button { border-width:3px; border-radius:0; box-shadow:4px 4px 0 #0c0f18; }

/* Options popup follows the active distribution desk skin. */
.options-popup-window { --popup-accent:#58d6b1; --popup-bg:#070b10; --popup-panel:#0d151d; --popup-border:#28423f; max-width:640px; background:var(--popup-bg); }
.options-popup-window[data-popup-skin="timeline"] { --popup-accent:#e4b55f; --popup-bg:#11100e; --popup-panel:#191712; --popup-border:#55432b; color:#eee8dc; }
.options-popup-window[data-popup-skin="cyberpunk"] { --popup-accent:#00f0ff; --popup-bg:#050712; --popup-panel:#0c1020; --popup-border:#c227ff; color:#dffcff; font-family:"Cascadia Code",monospace; }
.options-popup-window[data-popup-skin="pixel"] { --popup-accent:#ffd34e; --popup-bg:#191d2c; --popup-panel:#272d43; --popup-border:#f05d7b; color:#fff7da; font-family:"Courier New",monospace; image-rendering:pixelated; }
.options-popup-window .options-window-header { display:flex; flex-wrap:wrap; gap:5px 9px; border-color:var(--popup-border); border-left:3px solid var(--popup-accent); background:var(--popup-panel); }
.options-popup-window .options-popup-brand { width:100%; color:var(--popup-accent); letter-spacing:.08em; }
.options-popup-window .options-window-header > span { width:100%; color:var(--text-dim); font-size:.72rem; }
.options-popup-window .panel { border-color:var(--popup-border); background:var(--popup-panel); }
.options-popup-window .panel-title { color:var(--popup-accent); }
.options-popup-window[data-popup-skin="cyberpunk"] .panel { box-shadow:0 0 15px rgba(0,240,255,.1),inset 0 0 18px rgba(194,39,255,.05); clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%); }
.options-popup-window[data-popup-skin="pixel"] .panel,
.options-popup-window[data-popup-skin="pixel"] .options-window-header,
.options-popup-window[data-popup-skin="pixel"] input,
.options-popup-window[data-popup-skin="pixel"] button { border-width:3px; border-radius:0; box-shadow:4px 4px 0 #0c0f18; }

/* Long-form document windows follow the active distribution desk skin. */
.document-popup-window[data-popup-skin="mission"] { --popup-accent:#58d6b1; --popup-bg:#070b10; --popup-panel:#0d151d; --popup-border:#28423f; }
.document-popup-window[data-popup-skin="timeline"] { --popup-accent:#e4b55f; --popup-bg:#11100e; --popup-panel:#191712; --popup-border:#55432b; }
.document-popup-window[data-popup-skin="cyberpunk"] { --popup-accent:#00f0ff; --popup-bg:#050712; --popup-panel:#0c1020; --popup-border:#c227ff; font-family:"Cascadia Code",monospace; }
.document-popup-window[data-popup-skin="pixel"] { --popup-accent:#ffd34e; --popup-bg:#191d2c; --popup-panel:#272d43; --popup-border:#f05d7b; font-family:"Courier New",monospace; image-rendering:pixelated; }
.glossary-popup-window { background:var(--popup-bg); }
.glossary-popup-window .header,
.glossary-popup-window .panel,
.glossary-popup-window .glossary-rail { border-color:var(--popup-border); background:var(--popup-panel); }
.glossary-popup-window .brand,
.glossary-popup-window .panel-title,
.glossary-popup-window .glossary-rail a.active { color:var(--popup-accent); }
.glossary-popup-window[data-popup-skin="cyberpunk"] .panel { box-shadow:0 0 15px rgba(0,240,255,.1); }
.glossary-popup-window[data-popup-skin="pixel"] .header,
.glossary-popup-window[data-popup-skin="pixel"] .panel,
.glossary-popup-window[data-popup-skin="pixel"] .glossary-rail { border-width:3px; border-radius:0; box-shadow:5px 5px 0 #0c0f18; }

.distribution-owner { color:#dce8ee; border-color:#506272; }
.distribution-alpaca-off { color:#ff9ca5; border-color:#9b3d48; background:rgba(155,61,72,.12); }

@media (max-width: 850px) {
  .broker-chart-head, .broker-chart-toolbar, .broker-chart-foot { align-items: flex-start; flex-direction: column; }
  .broker-timeframes, .broker-indicators { flex-wrap: wrap; }
  .broker-chart-stage { height: 300px; }
  .chart-window { overflow: auto; }
  .chart-window-header { align-items: stretch; flex-direction: column; }
  .chart-window .broker-chart-stage { height: 340px; }
}

/* ================================================================
   DECISION TIMELINE — vertical evidence trail, intentionally unrelated
   to Mission Control's three-column cockpit.
   ================================================================ */
body[data-desk-skin="timeline"] {
  --bg: #11100e;
  --panel-bg: #171612;
  --panel-bg-alt: #1c1a15;
  --border: #bd8c3d;
  --border-dim: #4c4030;
  --text: #eee8dc;
  --text-dim: #a69b89;
  --long: #75b98b;
  --short: #d8756e;
  --warn: #e4b55f;
  background: #11100e;
  font-family: Inter, "Segoe UI", Pretendard, sans-serif;
}
body[data-desk-skin="timeline"] .app { max-width: 1360px; gap: 12px; }
body[data-desk-skin="timeline"] .desk-intro,
body[data-desk-skin="timeline"] .desk-intro[hidden] { display: none !important; }
body[data-desk-skin="timeline"] .header {
  padding: 13px 18px;
  border: 0;
  border-bottom: 2px solid #bd8c3d;
  border-radius: 0;
  background: #171612;
  box-shadow: none;
}
body[data-desk-skin="timeline"] .brand { color: #f1eadc; letter-spacing: .06em; }
body[data-desk-skin="timeline"] .distribution-mark { color: #e4b55f; border-color: #66502f; background: #211c14; }
body[data-desk-skin="timeline"] .search-bar {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) auto 1.4fr auto auto auto;
  gap: 0;
  padding: 0;
  border: 1px solid #4c4030;
  border-radius: 0;
  background: #171612;
}
body[data-desk-skin="timeline"] .search-bar > * { margin: 0; border-radius: 0; border-color: #40372a; }
body[data-desk-skin="timeline"] .search-bar::before {
  content: "ANALYSIS INPUT";
  display: grid;
  place-items: center;
  padding: 0 14px;
  color: #bd8c3d;
  font: 700 .57rem/1 "Cascadia Code", monospace;
  letter-spacing: .12em;
}
body[data-desk-skin="timeline"] .symbol-input { order: 1; }
body[data-desk-skin="timeline"] .scenario-select { order: 2; }
body[data-desk-skin="timeline"] .analyze-btn { order: 3; background: #8e6328; color: #fff8e9; }
body[data-desk-skin="timeline"] #options-window-btn { order: 5; }
body[data-desk-skin="timeline"] #chart-window-btn { order: 6; }
body[data-desk-skin="timeline"] #alerts-mute-btn { order: 8; }

body[data-desk-skin="timeline"] .decision-timeline-layout {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
.timeline-index {
  position: sticky;
  top: 12px;
  display: grid;
  border-top: 3px solid #bd8c3d;
  background: #171612;
}
.timeline-index > b { padding: 14px 13px; color: #e4b55f; font: 750 .64rem/1 "Cascadia Code", monospace; letter-spacing: .1em; }
.timeline-index a { display: flex; gap: 9px; padding: 10px 13px; border-top: 1px solid #322c23; color: #9c9282; font-size: .66rem; text-decoration: none; }
.timeline-index a:hover { color: #f0c778; background: #211d16; }
.timeline-index a span { color: #bd8c3d; font-family: "Cascadia Code", monospace; }
.timeline-flow { min-width: 0; }
.timeline-brief {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: baseline;
  gap: 18px;
  margin-bottom: 10px;
  padding: 13px 16px;
  border: 1px solid #4c4030;
  background: #171612;
}
.timeline-brief span { color: #bd8c3d; font: 700 .56rem/1 "Cascadia Code", monospace; letter-spacing: .12em; }
.timeline-brief b { color: #efe6d5; font-size: .86rem; letter-spacing: .08em; }
.timeline-brief small { color: #8e8578; }
.timeline-stage {
  position: relative;
  display: grid;
  grid-template-columns: 55px minmax(0, 1fr);
  padding-bottom: 18px;
}
.timeline-stage > header { grid-column: 2; display: flex; align-items: baseline; gap: 12px; padding: 9px 14px; border-bottom: 1px solid #55432b; background: #211d16; }
.timeline-stage > header b { color: #edc16e; font: 800 .75rem/1 "Cascadia Code", monospace; letter-spacing: .12em; }
.timeline-stage > header small { color: #8e8578; font-size: .66rem; }
.timeline-node { grid-row: 1 / 3; display: grid; grid-template-rows: 32px 1fr; justify-items: center; }
.timeline-node span { display: grid; place-items: center; width: 32px; height: 32px; border: 2px solid #bd8c3d; border-radius: 50%; color: #f0c778; background: #17130e; font: 750 .62rem/1 "Cascadia Code", monospace; }
.timeline-node i { width: 1px; min-height: 100%; background: linear-gradient(#bd8c3d, #403522); }
.timeline-stage:last-child .timeline-node i { background: linear-gradient(#bd8c3d, transparent); }
.timeline-stage-content { grid-column: 2; display: grid; grid-template-columns: 1fr 1fr; background: #171612; }
body[data-desk-skin="timeline"] .timeline-stage-content > .panel {
  margin: 0;
  padding: 13px 15px;
  border: 0;
  border-right: 1px solid #332d24;
  border-bottom: 1px solid #332d24;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body[data-desk-skin="timeline"] .timeline-stage-content > .panel:nth-child(even) { border-right: 0; }
body[data-desk-skin="timeline"] .panel-title { color: #c6bba9; font-size: .68rem; letter-spacing: .08em; }
body[data-desk-skin="timeline"] #timeline-score .timeline-stage-content,
body[data-desk-skin="timeline"] #timeline-compare .timeline-stage-content { grid-template-columns: 1fr 1fr; }
body[data-desk-skin="timeline"] #timeline-validate .timeline-stage-content { grid-template-columns: 1fr; }
body[data-desk-skin="timeline"] #panel-gates .kv-table tbody { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
body[data-desk-skin="timeline"] #panel-gates .kv-table tr { display: grid; gap: 5px; padding: 9px; border: 1px solid #443827; text-align: center; }
body[data-desk-skin="timeline"] #panel-gates .kv-table td { display: block; padding: 0; }
body[data-desk-skin="timeline"] #timeline-final .timeline-stage-content {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 20px;
  border: 2px solid #bd8c3d;
  background: radial-gradient(circle at 50% 20%, #342817, #171612 65%);
  text-align: center;
}
body[data-desk-skin="timeline"] #timeline-final .final-decision { padding: 10px; border: 0; color: #f0c778; background: transparent; font-size: 1.5rem; }
body[data-desk-skin="timeline"] #timeline-final .decision-reason { max-width: 720px; margin: auto; color: #b9ad9a; }
body[data-desk-skin="timeline"] #timeline-final .blocked-list { max-width: 720px; margin: auto; }
body[data-desk-skin="timeline"] #timeline-research .timeline-stage-content { grid-template-columns: 1fr 1fr; }
body[data-desk-skin="timeline"] #historical-reference { padding: 14px 15px; border-bottom: 1px solid #332d24; }
body[data-desk-skin="timeline"] #panel-watchlist { border-radius: 0; border-color: #4c4030; background: #171612; }
.timeline-system-line { display: flex; align-items: center; gap: 12px; padding: 8px 12px; border-top: 1px solid #66502f; border-bottom: 1px solid #66502f; background: #171612; }
.timeline-system-line > b { color: #bd8c3d; font: 700 .56rem/1 "Cascadia Code", monospace; letter-spacing: .1em; }
.timeline-system-line .header-row { margin: 0; font-size: .65rem; }
.timeline-system-line .header-timestamps { margin-left: auto; }

@media (max-width: 850px) {
  body[data-desk-skin="timeline"] .search-bar,
  body[data-desk-skin="timeline"] .decision-timeline-layout { grid-template-columns: 1fr; }
  .timeline-index { position: static; grid-template-columns: repeat(3, 1fr); }
  .timeline-index > b { grid-column: 1 / -1; }
  .timeline-brief { grid-template-columns: 1fr; gap: 5px; }
  .timeline-stage { grid-template-columns: 38px minmax(0, 1fr); }
  .timeline-node span { width: 27px; height: 27px; }
  .timeline-stage-content,
  body[data-desk-skin="timeline"] #timeline-score .timeline-stage-content,
  body[data-desk-skin="timeline"] #timeline-compare .timeline-stage-content,
  body[data-desk-skin="timeline"] #timeline-research .timeline-stage-content { grid-template-columns: 1fr; }
  body[data-desk-skin="timeline"] #panel-gates .kv-table tbody { grid-template-columns: repeat(2, 1fr); }
  .timeline-system-line { display: grid; grid-template-columns: 1fr; }
  .timeline-system-line .header-timestamps { margin-left: 0; }
}