/* NETWAR — world.html styles, part 3 of 9: Sound button, Operator Manual overlay.
   Moved out of world.html's <style> block unchanged (2026-10-03); the files load in this
   order, which is the old cascade order — a later file still overrides an earlier one. */
/* SOUND ON/OFF — always readable so operators know they can mute the ambient bed. */
.btn-sound {
  font: 10px var(--chrome-font); letter-spacing: 0.16em; text-transform: uppercase;
  padding: 6px 12px 6px 22px; cursor: pointer; flex-shrink: 0; position: relative;
  color: #37f5a3; border: none; background: transparent; box-shadow: none;
  transition: color 0.15s;
}
.btn-sound::before {
  content: ''; position: absolute; left: 9px; top: 50%; transform: translateY(-50%);
  width: 6px; height: 6px; border-radius: 50%;
  background: #37f5a3; box-shadow: 0 0 6px rgba(55,245,163,0.85);
  animation: z2-led-flicker 5s steps(1) infinite;
}
.btn-sound:hover { color: #d8ffe8; }
.btn-sound.off {
  color: var(--chrome-muted);
}
.btn-sound.off::before {
  background: #332a48; box-shadow: none; animation: none;
}
.btn-sound.off:hover { color: var(--chrome-text); }
@media (max-width: 767px) { .btn-sound { padding: 4px 8px 4px 18px; font-size: 9px; letter-spacing: 0.8px; } }
@keyframes z2-led-flicker {
  0%, 100% { opacity: 1; } 3% { opacity: 0.25; } 5% { opacity: 1; } 6% { opacity: 0.5; } 8% { opacity: 1; }
  47% { opacity: 1; } 49% { opacity: 0.3; } 51% { opacity: 1; }
}

.debug-reveal-badge {
  font: 10px var(--chrome-font); letter-spacing: 0.16em; text-transform: uppercase;
  padding: 5px 11px; flex-shrink: 0;
  color: #ffcc66; border: 1px solid rgba(255, 180, 60, 0.7);
  background: rgba(40, 22, 4, 0.95);
  box-shadow: 0 0 14px rgba(255, 180, 60, 0.28);
}
@media (max-width: 767px) { .debug-reveal-badge { padding: 4px 8px; font-size: 9px; letter-spacing: 0.8px; } }

/* ── MANUAL OVERLAY ── */
#manual-overlay {
  /* Above #safehouse (z-index: 100) so it's visible when opened via the Safehouse's own MANUAL button, not just from the map. */
  position: absolute; inset: 0; z-index: 105;
  background: #0d1520;
  display: flex; flex-direction: column;
  opacity: 0; pointer-events: none; visibility: hidden;
  transition: opacity 0.22s ease, visibility 0.22s ease;
  overflow: hidden;
}
#manual-overlay.open { opacity: 1; pointer-events: auto; visibility: visible; }
/* The manual describes the duel that is live: classic, or the mirror duel (NETWAR_MIRROR_DUEL). */
#manual-overlay:not(.mirror) [data-mode="mirror"], #manual-overlay.mirror [data-mode="classic"] { display: none !important; }
#manual-overlay .mo-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 11px 18px; flex-shrink: 0;
  border-bottom: 2px solid #1e3a5a;
  background: #0a1220;
}
#manual-overlay .mo-title {
  font: 700 11px var(--chrome-font); letter-spacing: 0.28em; text-transform: uppercase;
  color: #37d5f5;
  text-shadow: 0 0 14px rgba(55,213,245,0.5);
  display: flex; align-items: center; gap: 8px;
}
#manual-overlay .mo-title::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: #37d5f5; box-shadow: 0 0 8px #37d5f5;
  animation: nl-blink 2.4s ease-in-out infinite;
}
#manual-overlay .mo-close {
  font: 14px var(--chrome-font); cursor: pointer;
  color: #8aabcc; border: 1px solid #2a4060; background: #0f1c2e;
  width: 30px; height: 30px; padding: 0; flex-shrink: 0;
  transition: border-color 0.15s, color 0.15s;
}
#manual-overlay .mo-close:hover { color: #37d5f5; border-color: #37d5f5; }
#manual-overlay .mo-body {
  flex: 1; overflow-y: auto; overflow-x: hidden;
  display: grid; grid-template-columns: 175px 1fr; min-height: 0;
}
@media (max-width: 600px) {
  #manual-overlay .mo-body { grid-template-columns: 1fr; }
  #manual-overlay .mo-nav  { display: none; }
}
#manual-overlay .mo-nav {
  border-right: 1px solid #1e3a5a;
  padding: 18px 0; overflow-y: auto; flex-shrink: 0;
  background: #0a1220;
}
#manual-overlay .mo-nav-label {
  font: 700 9px var(--chrome-font); letter-spacing: 0.14em; text-transform: uppercase;
  color: #3a6080; padding: 0 14px 10px; display: block;
}
#manual-overlay .mo-nav a {
  display: block; font: 10px var(--chrome-font); letter-spacing: 0.06em;
  color: #7a9ab8; text-decoration: none;
  padding: 5px 14px; border-left: 2px solid transparent;
  transition: color 0.12s, border-color 0.12s, background 0.12s;
}
#manual-overlay .mo-nav a:hover { color: #a8d8f0; background: rgba(55,213,245,0.06); }
#manual-overlay .mo-nav a.mo-active {
  color: #37d5f5; border-left-color: #37d5f5; background: rgba(55,213,245,0.08);
}
#manual-overlay .mo-content {
  overflow-y: auto; overflow-x: hidden; padding: 28px 32px 60px; min-width: 0;
  background: #0d1520;
}
/* ── Typography ── */
#manual-overlay h1 {
  font: 900 20px var(--chrome-display); letter-spacing: 0.1em; text-transform: uppercase;
  color: #37d5f5; margin-bottom: 6px;
  text-shadow: 0 0 24px rgba(55,213,245,0.5);
}
#manual-overlay .mo-subtitle {
  font-size: 12px; color: #8aabcc; margin-bottom: 26px; max-width: 60ch; line-height: 1.65;
}
#manual-overlay .mo-section { margin-bottom: 38px; scroll-margin-top: 12px; }
#manual-overlay .mo-section-head {
  display: flex; align-items: baseline; gap: 10px;
  border-bottom: 1px solid #1e3a5a; padding-bottom: 8px; margin-bottom: 14px;
}
#manual-overlay .mo-num {
  font: 700 9px var(--chrome-font); letter-spacing: 0.08em; color: #37d5f5; flex-shrink: 0;
}
#manual-overlay h2 {
  font: 700 12px var(--chrome-font); letter-spacing: 0.18em; text-transform: uppercase;
  color: #d0e8ff;
}
#manual-overlay h3 {
  font: 700 9px var(--chrome-font); letter-spacing: 0.14em; text-transform: uppercase;
  color: #37d5f5; margin: 18px 0 8px;
  display: flex; align-items: center; gap: 7px;
}
#manual-overlay h3::after {
  content: ''; flex: 1; max-width: 40px; height: 1px;
  background: linear-gradient(90deg, rgba(55,213,245,0.5), transparent);
}
#manual-overlay p { font-size: 12px; color: #b0ccdf; line-height: 1.7; margin-bottom: 8px; max-width: 68ch; }
#manual-overlay strong { color: #e8f4ff; font-weight: 600; }

/* Notes */
#manual-overlay .mo-note {
  background: rgba(55,213,245,0.08); border: 1px solid rgba(55,213,245,0.28);
  border-left: 3px solid #37d5f5;
  padding: 10px 14px; margin: 12px 0; font-size: 12px; color: #c0ddf0; line-height: 1.65;
}
#manual-overlay .mo-note strong { color: #37d5f5; }
#manual-overlay .mo-note.warn {
  background: rgba(245,163,55,0.1); border-color: rgba(245,163,55,0.35);
  border-left-color: #f5a337; color: #f0d090;
}
#manual-overlay .mo-note.warn strong { color: #f5c060; }

/* Tables */
#manual-overlay .mo-tw { overflow-x: auto; margin: 12px 0; border-radius: 2px; }
#manual-overlay table { width: 100%; border-collapse: collapse; font-size: 12px; font-variant-numeric: tabular-nums; }
#manual-overlay thead tr { background: #0f2035; }
#manual-overlay thead th {
  font: 700 9px var(--chrome-font); letter-spacing: 0.1em; text-transform: uppercase;
  color: #37d5f5; padding: 8px 11px; text-align: left;
  border-bottom: 2px solid #1e3a5a; white-space: nowrap;
}
#manual-overlay tbody tr { border-bottom: 1px solid #152030; }
#manual-overlay tbody tr:last-child { border-bottom: none; }
#manual-overlay tbody tr:hover { background: rgba(55,213,245,0.05); }
#manual-overlay td { padding: 8px 11px; color: #b0ccdf; vertical-align: top; line-height: 1.5; }
#manual-overlay td:first-child { font: 700 11px var(--chrome-font); color: #d8eeff; white-space: nowrap; }

/* Code / pills */
#manual-overlay code {
  font: 11px var(--chrome-font); background: rgba(55,213,245,0.12);
  border: 1px solid rgba(55,213,245,0.3); padding: 1px 6px; color: #6ee7ff;
}
#manual-overlay ul { list-style: none; padding: 0; margin: 7px 0 12px; }
#manual-overlay ul li {
  font-size: 12px; color: #b0ccdf; padding: 4px 0 4px 16px;
  position: relative; line-height: 1.6;
}
#manual-overlay ul li::before { content: '›'; position: absolute; left: 0; color: #37d5f5; font-size: 14px; line-height: 1.3; }
#manual-overlay ul li strong { color: #e8f4ff; }
#manual-overlay .mo-pill {
  display: inline-block; font: 700 9px var(--chrome-font); padding: 2px 7px;
  border: 1px solid; border-radius: 2px; letter-spacing: 0.05em; vertical-align: middle;
}
#manual-overlay .mo-pill.ok     { color: #37f5a3; border-color: rgba(55,245,163,0.5); background: rgba(55,245,163,0.14); }
#manual-overlay .mo-pill.cyan   { color: #37d5f5; border-color: rgba(55,213,245,0.5); background: rgba(55,213,245,0.14); }
#manual-overlay .mo-pill.warn   { color: #f5c337; border-color: rgba(245,195,55,0.5); background: rgba(245,195,55,0.14); }
#manual-overlay .mo-pill.alert  { color: #f57070; border-color: rgba(245,112,112,0.5); background: rgba(245,112,112,0.14); }
#manual-overlay .mo-pill.violet { color: #d09afc; border-color: rgba(208,154,252,0.5); background: rgba(208,154,252,0.14); }

/* Card chips */
#manual-overlay .mo-cards {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(195px, 1fr)); gap: 8px; margin: 12px 0;
}
#manual-overlay .mo-card {
  background: #101e30; border: 1px solid #1e3a5a; padding: 11px 13px;
  transition: border-color 0.15s, background 0.15s;
}
#manual-overlay .mo-card:hover { background: #132540; border-color: #2a5080; }
#manual-overlay .mo-card-name { font: 700 11px var(--chrome-font); color: #d8eeff; margin-bottom: 4px; }
#manual-overlay .mo-card-cost { font: 9px var(--chrome-font); color: #5a9abf; margin-bottom: 6px; letter-spacing: 0.04em; }
#manual-overlay .mo-card-desc { font-size: 11px; color: #9abcd0; line-height: 1.55; }

/* Software cards */
#manual-overlay .mo-sw { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 12px 0; }
@media (max-width: 480px) { #manual-overlay .mo-sw { grid-template-columns: 1fr; } }
#manual-overlay .mo-sw-card { border: 1px solid #1e3a5a; padding: 14px; background: #101e30; }
#manual-overlay .mo-sw-card.stl { border-top: 3px solid #37f5a3; }
#manual-overlay .mo-sw-card.brf { border-top: 3px solid #37d5f5; }
#manual-overlay .mo-sw-card.slg { border-top: 3px solid #f5a337; }
#manual-overlay .mo-sw-name { font: 700 11px var(--chrome-font); margin-bottom: 6px; }
#manual-overlay .mo-sw-card.stl .mo-sw-name { color: #37f5a3; }
#manual-overlay .mo-sw-card.brf .mo-sw-name { color: #37d5f5; }
#manual-overlay .mo-sw-card.slg .mo-sw-name { color: #f5a337; }
#manual-overlay .mo-sw-stat { font-size: 11px; color: #7a9ab8; margin-top: 4px; }
#manual-overlay .mo-sw-stat strong { color: #c0ddf0; }

/* Duel outcome chips */
#manual-overlay .mo-outcomes {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px,1fr)); gap: 8px; margin: 12px 0;
}
#manual-overlay .mo-oc { border: 1px solid #1e3a5a; padding: 10px 12px; background: #101e30; }
#manual-overlay .mo-oc-label { font: 700 11px var(--chrome-font); margin-bottom: 5px; }
#manual-overlay .mo-oc-desc { font-size: 11px; color: #8aabcc; line-height: 1.5; }

/* Tips */
#manual-overlay .mo-tips {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(210px,1fr)); gap: 9px; margin-top: 12px;
}
#manual-overlay .mo-tip {
  background: #101e30; border: 1px solid #1e3a5a;
  padding: 13px; font-size: 12px; color: #9abcd0; line-height: 1.6;
}
#manual-overlay .mo-tip strong {
  display: block; font: 700 9px var(--chrome-font); letter-spacing: 0.1em;
  text-transform: uppercase; color: #37d5f5; margin-bottom: 6px;
}

#btn-neural-link.on {
  color: #ffe0f7; border-color: #ff2bd6;
  box-shadow: 0 0 18px rgba(255,43,214,0.35);
  animation: nl-btn-live 2.8s ease-in-out infinite;
}
@keyframes nl-title-pulse {
  0%, 100% { opacity: 0.78; text-shadow: 0 0 8px rgba(255,43,214,0.3); letter-spacing: 0.28em; }
  50% { opacity: 1; text-shadow: 0 0 18px rgba(255,43,214,0.65), 0 0 28px rgba(255,43,214,0.22); letter-spacing: 0.3em; }
}
@keyframes nl-edge-glow {
  0%, 100% { box-shadow: -12px 0 40px rgba(0,0,0,0.45), -4px 0 22px rgba(255,43,214,0.1); border-left-color: rgba(255,43,214,0.5); }
  50% { box-shadow: -12px 0 44px rgba(0,0,0,0.48), -5px 0 30px rgba(255,43,214,0.22); border-left-color: rgba(255,43,214,0.85); }
}
@keyframes nl-border-pulse {
  0%, 100% { border-left-color: rgba(55,213,245,0.22); box-shadow: inset 3px 0 10px rgba(55,213,245,0.02); }
  50% { border-left-color: rgba(55,213,245,0.55); box-shadow: inset 3px 0 14px rgba(55,213,245,0.08); }
}
@keyframes nl-border-pulse-mag {
  0%, 100% { border-left-color: rgba(255,43,214,0.22); box-shadow: inset 3px 0 10px rgba(255,43,214,0.02); }
  50% { border-left-color: rgba(255,43,214,0.55); box-shadow: inset 3px 0 14px rgba(255,43,214,0.08); }
}
@keyframes nl-blink {
  0%, 100% { opacity: 0.35; transform: scale(0.9); }
  50% { opacity: 1; transform: scale(1.05); }
}
@keyframes nl-line-blink {
  0%, 100% { opacity: 0.25; }
  50% { opacity: 0.85; }
}
@keyframes nl-breathe {
  0%, 100% { transform: scale(1); filter: brightness(1); }
  50% { transform: scale(1.08); filter: brightness(1.15); }
}
@keyframes nl-stat-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes nl-btn-live {
  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,0.8), 0 0 14px rgba(215,123,255,0.45); }
  50% { box-shadow: inset 0 1px 0 rgba(255,255,255,0.8), 0 0 30px rgba(215,123,255,0.85); }
}
@keyframes nl-hdd-tick {
  0%, 48% {
    color: #37d5f5;
    text-shadow: none;
  }
  49% { color: #d8f8ff; text-shadow: 0 0 8px #37d5f5; }
  51% { color: #0a2830; text-shadow: none; }
  52% { color: #fff; text-shadow: 0 0 10px #37d5f5; }
  53% { color: #0a2830; text-shadow: none; }
  54% { color: #d8f8ff; text-shadow: 0 0 8px #37d5f5; }
  56% { color: #37d5f5; text-shadow: none; }
  57% { color: #fff; text-shadow: 0 0 10px #37d5f5; }
  58% { color: #0a2830; text-shadow: none; }
  59% { color: #d8f8ff; text-shadow: 0 0 8px #37d5f5; }
  60% { color: #0a2830; text-shadow: none; }
  61% { color: #fff; text-shadow: 0 0 10px #37d5f5; }
  63%, 78% {
    color: #37d5f5;
    text-shadow: none;
  }
  79% { color: #d8f8ff; text-shadow: 0 0 8px #37d5f5; }
  80% { color: #0a2830; text-shadow: none; }
  81% { color: #fff; text-shadow: 0 0 10px #37d5f5; }
  83%, 100% {
    color: #37d5f5;
    text-shadow: none;
  }
}
@keyframes nl-glitch {
  0%, 100% { transform: translate(0); text-shadow: none; }
  25% { transform: translate(1px, 0); text-shadow: -1px 0 #ff2bd6, 1px 0 #37d5f5; }
  50% { transform: translate(-1px, 1px); text-shadow: 1px 0 #37d5f5, -1px 0 #ff2bd6; }
  75% { transform: translate(1px, -1px); }
}
@keyframes nl-glitch-mag {
  0%, 100% { transform: translate(0); text-shadow: none; }
  30% { transform: translate(-1px, 0); text-shadow: 1px 0 #37d5f5, -1px 0 #ff2bd6; }
  60% { transform: translate(1px, 1px); text-shadow: -1px 0 #ff2bd6; }
}
@keyframes nl-glitch-text {
  0%, 100% { transform: translate(0); letter-spacing: 0.14em; }
  30% { transform: translate(-1px, 0); text-shadow: 1px 0 #ff2bd6, -1px 0 #37d5f5; letter-spacing: 0.16em; }
  60% { transform: translate(1px, 1px); text-shadow: -1px 0 #37d5f5; }
}
@media (prefers-reduced-motion: reduce) {
  #neural-link,
  #btn-neural-link,
  #btn-neural-link.on,
  #bar .live::before,
  #hud .event-card .ev-timer,
  #inf-ticker .inf-ticker-track,
  #map-crt .map-crt-vignette,
  #map-crt .map-crt-sweep {
    animation: none !important;
  }
  body.boot-chrome #bar,
  body.boot-chrome #hud,
  body.boot-chrome #toolbar,
  body.boot-chrome #feed-wrap,
  body.boot-chrome #demo-cta-banner.show,
  body.boot-chrome #deploy-banner.show {
    opacity: 1 !important;
    animation: none !important;
    pointer-events: auto !important;
  }
  body.boot-chrome #viewport {
    filter: none !important;
    animation: none !important;
    transform: none !important;
  }
  #boot-glitch { display: none !important; }
  #inf-ticker .inf-ticker-seq:last-child { display: none; }
  #neural-link .nl-pane { transition: none; }
}
@media (max-width: 1100px) {
  #viewport { --nl-w: min(440px, 48vw); }
  #inf-ticker .inf-ticker-tag { display: none; }
}
@media (max-width: 900px) {
  #viewport { --nl-w: min(420px, 74vw); }
}
@media (max-width: 767px) {
  #neural-link { width: min(100%, 100vw); border-left: none; border-top: 2px solid rgba(255,43,214,0.55); animation: none; }
  #neural-link .nx-btn { min-height: 44px; font-size: 11px; }
  #neural-link .nl-tab { min-height: 44px; }
  #btn-neural-link { padding: 4px 8px; font-size: 9px; letter-spacing: 0.8px; }
}
#inspect {
  position: relative; top: auto; right: auto;
  width: clamp(220px, 26vw, 300px); max-height: min(72vh, calc(100% - 20px - var(--ms-reserve, 0px)));
  overflow-y: auto; overflow-x: hidden; display: none;
  font-size: 11px; color: var(--chrome-text); background: rgba(8,5,17,0.94);
  border: 1px solid var(--chrome-cyan); border-top: 2px solid var(--chrome-cyan);
  padding: 0; line-height: 1.45;
  box-shadow: 0 0 16px rgba(55,213,245,0.1);
}
#inspect.show { display: block; }
#inspect .h { color: var(--chrome-cyan); font-weight: bold; letter-spacing: 1px; }
#inspect .k { color: var(--chrome-muted); font-size: 10px; letter-spacing: 0.6px; }
#inspect .win { color: var(--chrome-ok); } #inspect .lose { color: var(--chrome-alert); }
#inspect .formula { color: var(--chrome-cyan); font-weight: bold; text-shadow: 0 0 6px rgba(55,213,245,0.3); }
#inspect #btn-worm-purge { background: #2a1020; color: #f55858; border: 1px solid #5a2030;
  font: inherit; font-size: 9px; padding: 2px 6px; cursor: pointer; margin-left: 4px; }

/* ── The rewritten manual (world/manual2.js, preview behind ?manual2, 2026-10-17) ──
   An icon per section, "In short" first, steps and flows as boxes, the fine print folded. */
#manual-overlay .m2-head { align-items: center; }
#manual-overlay .m2-ico { display: grid; place-items: center; width: 30px; height: 30px; flex-shrink: 0; color: #37d5f5;
  background: rgba(55,213,245,0.1); border: 1px solid rgba(55,213,245,0.35); }
#manual-overlay .m2-ico svg { width: 20px; height: 20px; }
#manual-overlay .m2-short { font-size: 14px; line-height: 1.6; color: #e2f2ff; max-width: 62ch; margin: 2px 0 16px;
  padding: 10px 14px; background: linear-gradient(90deg, rgba(55,213,245,0.12), rgba(55,213,245,0.02)); border-left: 3px solid #37d5f5; }
#manual-overlay .m2 p { font-size: 13px; }
#manual-overlay .m2-steps { list-style: none; counter-reset: m2s; padding: 0; margin: 4px 0 16px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
#manual-overlay .m2-steps li { counter-increment: m2s; position: relative; padding: 30px 12px 12px; background: #101e30; border: 1px solid #1e3a5a;
  display: flex; flex-direction: column; gap: 5px; font-size: 12px; line-height: 1.5; color: #b0ccdf; }
#manual-overlay .m2-steps li::before { content: counter(m2s); position: absolute; left: 12px; top: 9px; font: 700 11px var(--chrome-font);
  color: #05080d; background: #37d5f5; width: 17px; height: 17px; display: grid; place-items: center; }
#manual-overlay .m2-steps li b { font: 700 11px var(--chrome-font); letter-spacing: 0.1em; text-transform: uppercase; color: #e8f4ff; }
#manual-overlay .m2-call { position: relative; margin: 10px 0; padding: 9px 14px 9px 40px; font-size: 13px; line-height: 1.55; color: #c0ddf0;
  background: rgba(55,213,245,0.07); border: 1px solid rgba(55,213,245,0.25); max-width: 70ch; }
#manual-overlay .m2-call::before { content: 'i'; position: absolute; left: 12px; top: 9px; width: 18px; height: 18px; display: grid; place-items: center;
  font: 700 11px var(--chrome-font); color: #05080d; background: #37d5f5; border-radius: 50%; }
#manual-overlay .m2-call > b:first-child { color: #37d5f5; margin-right: 6px; }
#manual-overlay .m2-call.tip { background: rgba(55,245,163,0.07); border-color: rgba(55,245,163,0.28); }
#manual-overlay .m2-call.tip::before { content: '★'; background: #37f5a3; }
#manual-overlay .m2-call.tip > b:first-child { color: #37f5a3; }
#manual-overlay .m2-call.warn { background: rgba(245,163,55,0.08); border-color: rgba(245,163,55,0.35); }
#manual-overlay .m2-call.warn::before { content: '!'; background: #f5a337; }
#manual-overlay .m2-call.warn > b:first-child { color: #f5c060; }
#manual-overlay .m2-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0 10px; }
#manual-overlay .m2-flow i { font-style: normal; color: #37d5f5; }
#manual-overlay .m2-chip { display: inline-flex; flex-direction: column; padding: 7px 11px; background: #101e30; border: 1px solid #1e3a5a;
  font: 700 11px var(--chrome-font); letter-spacing: 0.08em; text-transform: uppercase; color: #e8f4ff; }
#manual-overlay .m2-chip small { font: 400 10px var(--chrome-font); letter-spacing: 0.02em; text-transform: none; color: #8aabcc; margin-top: 2px; }
#manual-overlay .m2-chip.go { border-color: #37f5a3; color: #37f5a3; background: rgba(55,245,163,0.08); }
#manual-overlay .m2-lanes { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 8px; margin: 6px 0 12px; }
#manual-overlay .m2-lane { display: grid; grid-template-columns: 46px 1fr; grid-template-rows: auto 1fr; column-gap: 12px; row-gap: 3px; align-items: start;
  padding: 10px 12px; background: #101e30; border: 1px solid #1e3a5a; font-size: 12px; line-height: 1.5; color: #b0ccdf; }
#manual-overlay .m2-lane b { font: 700 11px var(--chrome-font); letter-spacing: 0.1em; text-transform: uppercase; color: #e8f4ff; }
#manual-overlay .m2-lane-pic { grid-row: 1 / 3; display: flex; flex-direction: column; gap: 4px; align-items: center; }
#manual-overlay .m2-lane-pic .u { width: 30px; height: 24px; display: grid; place-items: center; font-size: 12px; border: 1px solid; }
#manual-overlay .m2-lane-pic .u.foe { color: #f57070; border-color: rgba(245,112,112,0.6); background: rgba(245,112,112,0.12); }
#manual-overlay .m2-lane-pic .u.me { color: #37f5a3; border-color: rgba(55,245,163,0.6); background: rgba(55,245,163,0.12); }
#manual-overlay .m2-lane-pic .u.empty { border-style: dashed; background: transparent; opacity: 0.6; }
#manual-overlay td small { color: #7a9ab8; }
#manual-overlay details.m2-more { margin: 14px 0 0; border: 1px solid #1e3a5a; background: #0b1726; }
#manual-overlay details.m2-more > summary { cursor: pointer; list-style: none; padding: 8px 12px;
  font: 700 10px var(--chrome-font); letter-spacing: 0.14em; text-transform: uppercase; color: #7a9ab8; }
#manual-overlay details.m2-more > summary::-webkit-details-marker { display: none; }
#manual-overlay details.m2-more > summary::before { content: '▸ '; color: #37d5f5; }
#manual-overlay details.m2-more[open] > summary::before { content: '▾ '; }
#manual-overlay details.m2-more > summary:hover { color: #a8d8f0; }
#manual-overlay .m2-more-body { padding: 0 12px 6px; }
#manual-overlay .m2 .mo-tw { max-width: 680px; }