@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;900&display=swap');
/* ==========================================================================
   epistles — TACTICAL // Aegis Protocol
   Professional tactical futuristic hyper-realistic interface layer, in
   bloodline red and black. Machined metal, real carbon-fiber texture,
   engraved stencil type, HUD corner brackets, chamfered command keys.
   STATIC BY DESIGN: zero keyframe animation — the realism is in the
   materials and the light, not in motion.
   Additive only: every rule is gated behind html[data-tactical="on"].
   The classic theme underneath is never touched; HOLO v1 (#72) remains
   available on the mode dial. PROVOLTA's teal is hers alone — untouched.
   ========================================================================== */

html[data-tactical="on"] {
  --tx-black: #0a0a0c;
  --tx-panel-0: #1d1e23;
  --tx-panel-1: #141518;
  --tx-panel-2: #0e0f12;
  --tx-steel: #34373e;
  --tx-steel-hi: #4a4e57;
  --tx-red: #d21f26;
  --tx-red-deep: #7a0e14;
  --tx-red-dark: #4d080d;
  --tx-ember: #ff6a4d;
  --tx-ink: #f5f3f1;
  --tx-muted: #a3a3ab;
  --tx-faint: #6d6d75;
  --tx-radius: 10px;
  --tx-radius-sm: 6px;
}

/* --- Hull: blackened red carbon fiber ------------------------------------------------ */
html[data-tactical="on"] body {
  background:
    linear-gradient(180deg, rgba(8,8,10,.82), rgba(8,8,10,.9)),
    url(/img/wine-carbon.webp) center top / 520px auto,
    #0a0a0c;
  color: var(--tx-ink);
}
/* Machined floor sheen — a single static light fall, no motion. */
html[data-tactical="on"] body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(1100px 480px at 50% -6%, rgba(210,31,38,.10), transparent 62%),
    radial-gradient(900px 700px at 50% 115%, rgba(0,0,0,.5), transparent 60%);
}
html[data-tactical="on"] body > *:not(.logbook-side):not(.sable-side):not(.logbook-tab):not(.float-dock):not(.sable-pointer):not(#sable-summon):not(#cosmos) { position: relative; z-index: 1; }

html[data-tactical="on"] ::selection {
  background: rgba(210, 31, 38, 0.65);
  color: #ffffff;
}

html[data-tactical="on"] ::-webkit-scrollbar { width: 11px; height: 11px; }
html[data-tactical="on"] ::-webkit-scrollbar-track { background: #0c0c0e; }
html[data-tactical="on"] ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #4a4e57, #26282e);
  border-radius: 6px;
  border: 2px solid #0c0c0e;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}

/* --- Armor panels: machined dark metal, corner screws, HUD brackets ----------------- */
html[data-tactical="on"] .panel,
html[data-tactical="on"] .forum-block {
  background:
    radial-gradient(circle at 13px 13px, #54585f 0 2px, #17181c 2.6px, transparent 3.4px),
    radial-gradient(circle at calc(100% - 13px) 13px, #54585f 0 2px, #17181c 2.6px, transparent 3.4px),
    radial-gradient(circle at 13px calc(100% - 13px), #54585f 0 2px, #17181c 2.6px, transparent 3.4px),
    radial-gradient(circle at calc(100% - 13px) calc(100% - 13px), #54585f 0 2px, #17181c 2.6px, transparent 3.4px),
    repeating-linear-gradient(175deg, rgba(255,255,255,.024) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, var(--tx-panel-0) 0%, var(--tx-panel-1) 55%, var(--tx-panel-2) 100%);
  border: 1px solid var(--tx-steel);
  border-radius: var(--tx-radius);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    inset 0 -24px 36px rgba(0,0,0,.55),
    0 20px 44px rgba(0,0,0,.65);
  position: relative;
}
/* HUD corner brackets — blood red, top-left + bottom-right. */
html[data-tactical="on"] .panel::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 26px; height: 26px;
  border-top: 3px solid var(--tx-red);
  border-left: 3px solid var(--tx-red);
  border-top-left-radius: 9px;
  pointer-events: none;
  z-index: 2;
}
html[data-tactical="on"] .panel::after {
  content: "";
  position: absolute;
  bottom: 0; right: 0;
  width: 26px; height: 26px;
  border-bottom: 3px solid var(--tx-red);
  border-right: 3px solid var(--tx-red);
  border-bottom-right-radius: 9px;
  pointer-events: none;
  z-index: 2;
}
/* Chat panels sit near the viewport edge on mobile; keep brackets clipped. */
html[data-tactical="on"] .chat-panel {
  overflow: hidden;
  max-width: 100%;
}

/* --- Command blades: carbon-fiber category bars, engraved stencil -------------------- */
html[data-tactical="on"] .catbar {
  background:
    linear-gradient(180deg, rgba(8,8,10,.62), rgba(8,8,10,.82)),
    url(/img/wine-carbon.webp) center / cover,
    #101013;
  border: 1px solid var(--tx-steel);
  border-left: 5px solid var(--tx-red);
  border-radius: var(--tx-radius-sm);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.1),
    inset 0 -12px 22px rgba(0,0,0,.5),
    0 8px 22px rgba(0,0,0,.6);
  color: var(--tx-ink);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 700;
  text-shadow: 0 -1px 0 rgba(0,0,0,.8), 0 1px 0 rgba(255,255,255,.08);
  position: relative;
}
html[data-tactical="on"] .catbar::before {
  content: "";
  position: absolute;
  left: 0; top: 8px; bottom: 8px;
  width: 2px;
  background: linear-gradient(180deg, var(--tx-ember), var(--tx-red-deep));
  box-shadow: 0 0 8px rgba(210,31,38,.8);
  pointer-events: none;
}

/* --- Headings: engraved instrument type ---------------------------------------------- */
html[data-tactical="on"] .page-title,
html[data-tactical="on"] h1 {
  color: #ffffff;
  letter-spacing: .05em;
  text-transform: uppercase;
  text-shadow: 0 2px 3px rgba(0,0,0,.85), 0 -1px 0 rgba(0,0,0,.6);
  border-bottom: 1px solid var(--tx-steel);
  padding-bottom: .45em;
  position: relative;
}
html[data-tactical="on"] .page-title::after,
html[data-tactical="on"] h1::after {
  content: "";
  position: absolute;
  left: 0; bottom: -1px;
  width: 72px; height: 3px;
  background: linear-gradient(90deg, var(--tx-red), var(--tx-red-deep));
  box-shadow: 0 1px 6px rgba(210,31,38,.6);
}
html[data-tactical="on"] h2, html[data-tactical="on"] h3 {
  color: var(--tx-ink);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-shadow: 0 2px 3px rgba(0,0,0,.8);
}

/* --- Main nav: black steel deck -------------------------------------------------------- */
html[data-tactical="on"] .main-nav {
  background: linear-gradient(180deg, #1b1c21, #101114);
  border-bottom: 1px solid var(--tx-steel);
  box-shadow: 0 10px 28px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.07);
}
html[data-tactical="on"] .main-nav a {
  color: var(--tx-ink);
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: .92em;
}
html[data-tactical="on"] .main-nav a:hover,
html[data-tactical="on"] .main-nav a:focus-visible {
  background: linear-gradient(180deg, rgba(210,31,38,.28), rgba(122,14,20,.28));
  box-shadow: inset 0 0 0 1px rgba(210,31,38,.6), inset 0 -3px 0 var(--tx-red);
  color: #ffffff;
}
html[data-tactical="on"] .main-nav a.active,
html[data-tactical="on"] .main-nav a[aria-current="page"] {
  background: linear-gradient(180deg, rgba(210,31,38,.35), rgba(122,14,20,.35));
  box-shadow: inset 0 -3px 0 var(--tx-red);
  color: #ffffff;
}

/* --- Command keys: chamfered blood-red metal ------------------------------------------- */
html[data-tactical="on"] .btn {
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  background:
    repeating-linear-gradient(175deg, rgba(255,255,255,.05) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, #e53238 0%, #b0151d 42%, #7a0e14 100%);
  border: 0;
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  text-shadow: 0 -1px 0 rgba(0,0,0,.65), 0 1px 0 rgba(255,255,255,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -3px 6px rgba(0,0,0,.4);
  filter: drop-shadow(0 6px 12px rgba(0,0,0,.6));
  transition: filter .15s ease, transform .1s ease;
  border-radius: 0;
}
html[data-tactical="on"] .btn:hover {
  filter: drop-shadow(0 8px 16px rgba(0,0,0,.65)) brightness(1.12);
}
html[data-tactical="on"] .btn:active {
  transform: translateY(2px);
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.7)) brightness(.94);
  box-shadow: inset 0 3px 8px rgba(0,0,0,.5);
}

/* --- Mode dial: CLASSIC / HOLO / TACTICAL ---------------------------------------------- */
html[data-tactical="on"] .theme-cycle,
html[data-tactical="on"] .mode-dial {
  background: linear-gradient(180deg, #23242a, #121316);
  border: 1px solid var(--tx-steel);
  border-radius: 6px;
  color: var(--tx-ink);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 4px 12px rgba(0,0,0,.6);
  padding: 6px 14px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-size: .8em;
}
html[data-tactical="on"] .mode-dial[data-mode="tactical"] {
  border-color: var(--tx-red);
  color: #ffffff;
  text-shadow: 0 0 10px rgba(210,31,38,.8);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), inset 0 -3px 0 var(--tx-red-deep), 0 4px 14px rgba(0,0,0,.65);
}

/* --- Forum tables: dark tactical readout -------------------------------------------------- */
html[data-tactical="on"] .forumtable {
  background: rgba(12, 12, 15, 0.9);
  border: 1px solid var(--tx-steel);
  border-radius: var(--tx-radius);
  overflow: hidden;
}
html[data-tactical="on"] .forumtable th {
  background: linear-gradient(180deg, #26272e, #16171b);
  color: var(--tx-ember);
  letter-spacing: .1em;
  text-transform: uppercase;
  font-size: .82em;
  text-shadow: 0 1px 2px rgba(0,0,0,.8);
  border-bottom: 2px solid var(--tx-red-deep);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
html[data-tactical="on"] .forumtable tbody tr { transition: background .15s ease; }
html[data-tactical="on"] .forumtable tbody tr:hover {
  background: linear-gradient(100deg, rgba(210,31,38,.10), rgba(210,31,38,.03));
  box-shadow: inset 4px 0 0 var(--tx-red);
}
html[data-tactical="on"] .forumtable td {
  border-bottom: 1px solid rgba(52,55,62,.5);
}

/* --- Instrument readouts: stat cards -------------------------------------------------------- */
html[data-tactical="on"] .stat {
  background:
    repeating-linear-gradient(175deg, rgba(255,255,255,.02) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, #1a1b20, #101114);
  border: 1px solid var(--tx-steel);
  border-top: 3px solid var(--tx-red);
  border-radius: var(--tx-radius-sm);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 0 -14px 24px rgba(0,0,0,.5), 0 12px 28px rgba(0,0,0,.6);
}
html[data-tactical="on"] .stat .vval,
html[data-tactical="on"] .stat .tnum {
  color: #ffffff;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 2px 4px rgba(0,0,0,.85);
}

/* --- Forms: recessed wells ----------------------------------------------------------------------- */
html[data-tactical="on"] input[type="text"],
html[data-tactical="on"] input[type="password"],
html[data-tactical="on"] input[type="email"],
html[data-tactical="on"] input[type="search"],
html[data-tactical="on"] input[type="number"],
html[data-tactical="on"] textarea,
html[data-tactical="on"] select {
  background: #0b0b0d;
  border: 1px solid var(--tx-steel);
  border-radius: var(--tx-radius-sm);
  color: var(--tx-ink);
  box-shadow: inset 0 3px 8px rgba(0,0,0,.7), inset 0 0 0 1px rgba(0,0,0,.5);
}
html[data-tactical="on"] input:focus,
html[data-tactical="on"] textarea:focus,
html[data-tactical="on"] select:focus {
  outline: none;
  border-color: var(--tx-red);
  box-shadow: inset 0 3px 8px rgba(0,0,0,.7), 0 0 0 1px rgba(210,31,38,.7), 0 0 14px rgba(210,31,38,.35);
}

/* --- Chat: operations feed -------------------------------------------------------------------------- */
html[data-tactical="on"] .chat-main {
  background: rgba(10, 10, 13, 0.92);
  border: 1px solid var(--tx-steel);
  border-radius: var(--tx-radius);
  box-shadow: inset 0 0 60px rgba(0,0,0,.6), 0 18px 40px rgba(0,0,0,.65);
}
html[data-tactical="on"] .chat-messages .msg,
html[data-tactical="on"] .chat-messages > div {
  border-bottom: 1px solid rgba(52,55,62,.45);
}
html[data-tactical="on"] .chat-form {
  background: #101114;
  border-top: 2px solid var(--tx-red-deep);
}
/* PROVOLTA's teal hologram is hers alone — never overridden. */
html[data-tactical="on"] .provolta-msg,
html[data-tactical="on"] [data-speaker="provolta"] { filter: none; }

/* --- Micro-labels: stencil ------------------------------------------------------------------------------- */
html[data-tactical="on"] .meta,
html[data-tactical="on"] .hud-label,
html[data-tactical="on"] .mod-label {
  color: var(--tx-muted);
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .82em;
}
html[data-tactical="on"] .mark {
  color: var(--tx-ember);
}

/* --- Links: signal red ---------------------------------------------------------------------------------------- */
html[data-tactical="on"] a { color: #e8605f; }
html[data-tactical="on"] a:hover { color: #ff9a8a; }

/* --- Divider: steel rule with red core --------------------------------------------------------------------------- */
html[data-tactical="on"] hr {
  border: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--tx-steel) 20%, var(--tx-red) 50%, var(--tx-steel) 80%, transparent);
}

/* --- Tactical utilities ----------------------------------------------------------------------------------------------- */
html[data-tactical="on"] .tx-badge {
  display: inline-block;
  padding: 3px 12px;
  font-size: .76em;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #fff;
  background: linear-gradient(180deg, #c11a21, #7a0e14);
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
  text-shadow: 0 -1px 0 rgba(0,0,0,.6);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
}
html[data-tactical="on"] .tx-frame {
  position: relative;
  border: 1px solid var(--tx-steel);
  border-radius: var(--tx-radius-sm);
}
html[data-tactical="on"] .tx-frame::before,
html[data-tactical="on"] .tx-frame::after {
  content: "";
  position: absolute;
  width: 18px; height: 18px;
  pointer-events: none;
}
html[data-tactical="on"] .tx-frame::before {
  top: 0; left: 0;
  border-top: 3px solid var(--tx-red);
  border-left: 3px solid var(--tx-red);
}
html[data-tactical="on"] .tx-frame::after {
  bottom: 0; right: 0;
  border-bottom: 3px solid var(--tx-red);
  border-right: 3px solid var(--tx-red);
}

html[data-tactical="on"] img.avatar,
html[data-tactical="on"] .avatar img {
  border-radius: 6px;
  border: 2px solid var(--tx-steel);
  box-shadow: 0 4px 12px rgba(0,0,0,.6), inset 0 0 0 1px rgba(0,0,0,.6);
}

html[data-tactical="on"] pre, html[data-tactical="on"] code {
  background: #08080a;
  border: 1px solid var(--tx-steel);
  border-left: 3px solid var(--tx-red-deep);
  border-radius: 4px;
  color: #ffb3a6;
}
html[data-tactical="on"] blockquote {
  border-left: 4px solid var(--tx-red);
  background: rgba(210,31,38,.06);
  border-radius: 0 var(--tx-radius-sm) var(--tx-radius-sm) 0;
  color: var(--tx-ink);
}

html[data-tactical="on"] input[type="range"] { accent-color: var(--tx-red); }
html[data-tactical="on"] input[type="checkbox"],
html[data-tactical="on"] input[type="radio"] { accent-color: var(--tx-red-deep); }

html[data-tactical="on"] footer, html[data-tactical="on"] .site-footer {
  border-top: 2px solid var(--tx-red-deep);
  background: linear-gradient(180deg, transparent, rgba(10,10,12,.94));
}

/* --- Responsive: lighter metal on small screens --------------------------------------------------- */
@media (max-width: 720px) {
  html[data-tactical="on"] body { background-size: 380px auto; }
  html[data-tactical="on"] .panel::before,
  html[data-tactical="on"] .panel::after { width: 18px; height: 18px; }
  /* Narrow lobby/chat: HUD brackets read as orphan edge stubs — hide on chat panels. */
  html[data-tactical="on"] .chat-panel::before,
  html[data-tactical="on"] .chat-panel::after { display: none; }
}

/* --- Print: flat steel ---------------------------------------------------------------------- */
@media print {
  html[data-tactical="on"] body::before { display: none; }
  html[data-tactical="on"] .panel,
  html[data-tactical="on"] .forum-block,
  html[data-tactical="on"] .stat { box-shadow: none; }
}
/* No keyframes in this file — TACTICAL is static by design. */

/* hover-corner-fix: panel HUD brackets inset to 0; chat-panel overflow clipped; mobile chat brackets hidden. */

/* --- ARMOR-PLATE category bars: a slice of the case, not a copy of it --------------
   Machined black plate, four corner bolts, a blood-red lid-gasket seam along
   the bottom edge, a machined chamfer highlight across the top. The collapse
   toggle is dressed as the case latch with a red indicator glow. Titles in
   Orbitron cold-steel chrome, engraved.
   STATIC BY DESIGN: zero keyframe animation — the classic hover sheen and the
   9s red pulse are both killed under TACTICAL. */
html[data-tactical="on"] .catbar {
  background:
    radial-gradient(circle at 12px 12px, #e6eaef 0 1.2px, #83888f 1.2px 2.2px, #232529 2.2px 3px, transparent 3px 4px),
    radial-gradient(circle at calc(100% - 12px) 12px, #e6eaef 0 1.2px, #83888f 1.2px 2.2px, #232529 2.2px 3px, transparent 3px 4px),
    radial-gradient(circle at 12px calc(100% - 12px), #e6eaef 0 1.2px, #83888f 1.2px 2.2px, #232529 2.2px 3px, transparent 3px 4px),
    radial-gradient(circle at calc(100% - 12px) calc(100% - 12px), #e6eaef 0 1.2px, #83888f 1.2px 2.2px, #232529 2.2px 3px, transparent 3px 4px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, #2c2e34 0%, #17181c 38%, #0d0e11 62%, #1b1c21 100%),
    #101114;
  border: 1px solid #000;
  border-radius: 6px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(0,0,0,.9),
    inset 1px 0 0 rgba(255,255,255,.05),
    inset -1px 0 0 rgba(0,0,0,.6),
    0 10px 24px rgba(0,0,0,.65);
  color: #cfd4db;
  font-family: 'Orbitron', 'Arial Black', 'Segoe UI', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .22em;
  text-shadow: 0 -1px 1px rgba(0,0,0,.9), 0 1px 0 rgba(255,255,255,.1);
  position: relative;
}
/* Cold-steel chrome titles: gradient clipped to the glyphs, engraved edge. */
html[data-tactical="on"] .catbar > span {
  background: linear-gradient(180deg, #f4f6f9 0%, #c3c9d2 38%, #767c86 50%, #a9b0ba 62%, #eef1f5 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.85)) drop-shadow(0 -1px 0 rgba(255,255,255,.12));
}
/* Machined chamfer highlight across the top edge (replaces the hover sheen). */
html[data-tactical="on"] .catbar::before {
  content: "";
  position: absolute;
  left: 8px; right: 8px; top: 2px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
  pointer-events: none;
}
html[data-tactical="on"] .catbar:hover::before { animation: none; }
/* Blood-red lid-gasket seam along the bottom (replaces the 9s pulse). */
html[data-tactical="on"] .catbar::after {
  content: "";
  position: absolute;
  left: 10px; right: 10px; bottom: 4px; height: 2px;
  background: linear-gradient(90deg, transparent, var(--tx-red) 18%, var(--tx-ember) 50%, var(--tx-red) 82%, transparent);
  box-shadow: 0 0 8px rgba(210,31,38,.75);
  opacity: 1;
  animation: none;
  pointer-events: none;
}
/* The collapse toggle, dressed as the case latch. */
html[data-tactical="on"] .catbar .cat-toggle {
  background: linear-gradient(180deg, #3a3d44, #141518);
  border: 1px solid #000;
  border-radius: 4px;
  color: var(--tx-ember);
  font-family: inherit;
  font-size: 12px;
  line-height: 1;
  padding: 4px 10px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 2px 4px rgba(0,0,0,.6);
  text-shadow: 0 0 6px rgba(255,90,60,.85);
  cursor: pointer;
}


/* Tell-the-King alarm: big frightful red, rides in the header --------------------
   One loud button up top where eyes land - TELL THE KING something right now. */
html[data-tactical="on"] .tell-king-nav {
  display: inline-block;
  border: 0;
  border-radius: 0;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  background:
    repeating-linear-gradient(175deg, rgba(255,255,255,.06) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, #ff3d45 0%, #d21f26 42%, #7a0e14 100%);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .14em;
  text-decoration: none;
  text-shadow: 0 -1px 0 rgba(0,0,0,.65), 0 1px 0 rgba(255,255,255,.14);
  padding: 9px 20px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.35),
    inset 0 -3px 6px rgba(0,0,0,.4),
    0 0 18px rgba(255,40,50,.5),
    0 6px 14px rgba(0,0,0,.55);
}
html[data-tactical="on"] .tell-king-nav:hover {
  color: #fff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.4),
    inset 0 -3px 6px rgba(0,0,0,.35),
    0 0 28px rgba(255,40,50,.7),
    0 6px 14px rgba(0,0,0,.55);
}
html[data-tactical="on"] .tell-king-nav:active {
  transform: translateY(2px);
}
/* === AEGIS PLATE button system (2026-09-26) =====================================
   Machined dark-metal plates, corner screws, red energy seam, engraved text.
   Professional rectangles - no weird shapes. Overrides the old chamfer-red .btn. */

/* --- Standard plate: gunmetal, silver engraved text, red seam --- */
html[data-tactical='on'] .btn,
html[data-tactical='on'] .theme-cycle,
html[data-tactical='on'] .mode-dial {
  position: relative;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  border: 0;
  border-radius: 0;
  background:
    radial-gradient(circle 3px at 11px 11px, #a8adb6 0 1px, #54585f 1.7px, #0e0f12 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 11px) 11px, #a8adb6 0 1px, #54585f 1.7px, #0e0f12 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at 11px calc(100% - 11px), #a8adb6 0 1px, #54585f 1.7px, #0e0f12 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 11px) calc(100% - 11px), #a8adb6 0 1px, #54585f 1.7px, #0e0f12 2.5px, rgba(0,0,0,0) 3px),
    linear-gradient(115deg, rgba(255,255,255,.09) 0%, rgba(255,255,255,0) 32%),
    repeating-linear-gradient(175deg, rgba(255,255,255,.045) 0 1px, rgba(0,0,0,0) 1px 3px),
    linear-gradient(180deg, #34373e 0%, #1e2025 48%, #111217 52%, #1b1d22 100%);
  color: #d9dde4;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  text-shadow: 0 1px 0 rgba(255,255,255,.25), 0 -1px 1px rgba(0,0,0,.85);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.12), inset 0 -2px 5px rgba(0,0,0,.55);
  filter: drop-shadow(0 5px 10px rgba(0,0,0,.55));
  transition: filter .15s ease, transform .1s ease;
  cursor: pointer;
  text-decoration: none;
}

/* --- Energy seam: the red line every plate carries --- */
html[data-tactical='on'] .btn::after,
html[data-tactical='on'] .theme-cycle::after,
html[data-tactical='on'] .mode-dial::after,
html[data-tactical='on'] .slot-engage::after,
html[data-tactical='on'] .tell-king-nav::after {
  content: '';
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 5px;
  height: 2px;
  background: linear-gradient(90deg, rgba(255,43,52,0), #ff2b34 22%, #ff7a81 50%, #ff2b34 78%, rgba(255,43,52,0));
  box-shadow: 0 0 10px 2px rgba(255,43,52,.5);
  pointer-events: none;
}

/* --- Red alert plate: blood-red metal, for primary / danger / TELL THE KING --- */
html[data-tactical='on'] .btn-primary,
html[data-tactical='on'] .btn-danger,
html[data-tactical='on'] .tell-king-nav {
  position: relative;
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  border: 0;
  border-radius: 0;
  background:
    radial-gradient(circle 3px at 12px 12px, #c9a0a2 0 1px, #6e2f33 1.7px, #160607 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 12px) 12px, #c9a0a2 0 1px, #6e2f33 1.7px, #160607 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at 12px calc(100% - 12px), #c9a0a2 0 1px, #6e2f33 1.7px, #160607 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 12px) calc(100% - 12px), #c9a0a2 0 1px, #6e2f33 1.7px, #160607 2.5px, rgba(0,0,0,0) 3px),
    linear-gradient(115deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 32%),
    repeating-linear-gradient(175deg, rgba(255,255,255,.05) 0 1px, rgba(0,0,0,0) 1px 3px),
    linear-gradient(180deg, #6b161a 0%, #3a0d10 48%, #1f0608 52%, #2c0a0c 100%);
  color: #fff;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .14em;
  text-decoration: none;
  text-shadow: 0 -1px 0 rgba(0,0,0,.7), 0 0 16px rgba(255,70,80,.75);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.22), inset 0 -2px 5px rgba(0,0,0,.5), 0 0 22px rgba(255,43,52,.35);
  filter: drop-shadow(0 5px 10px rgba(0,0,0,.55));
  cursor: pointer;
  transition: filter .15s ease, transform .1s ease, box-shadow .15s ease;
}
html[data-tactical='on'] .tell-king-nav {
  display: inline-block;
  font-size: 13px;
  padding: 12px 28px;
}

/* --- Gold plate: ENGAGE keeps its gold, machined --- */
html[data-tactical='on'] .slot-engage {
  position: relative;
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  border: 0;
  border-radius: 0;
  background:
    radial-gradient(circle 3px at 12px 12px, #e8cf9a 0 1px, #7a5f28 1.7px, #171106 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 12px) 12px, #e8cf9a 0 1px, #7a5f28 1.7px, #171106 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at 12px calc(100% - 12px), #e8cf9a 0 1px, #7a5f28 1.7px, #171106 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 12px) calc(100% - 12px), #e8cf9a 0 1px, #7a5f28 1.7px, #171106 2.5px, rgba(0,0,0,0) 3px),
    linear-gradient(115deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 32%),
    repeating-linear-gradient(175deg, rgba(255,255,255,.05) 0 1px, rgba(0,0,0,0) 1px 3px),
    linear-gradient(180deg, #5c451a 0%, #33270e 48%, #1c1506 52%, #2a1f0b 100%);
  color: #ffedb8;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .18em;
  text-shadow: 0 -1px 0 rgba(0,0,0,.7), 0 0 12px rgba(255,198,63,.55);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.2), inset 0 -2px 5px rgba(0,0,0,.5);
  filter: drop-shadow(0 5px 10px rgba(0,0,0,.55));
  cursor: pointer;
  transition: filter .15s ease, transform .1s ease;
}
html[data-tactical='on'] .slot-engage::after {
  background: linear-gradient(90deg, rgba(255,198,63,0), #ffc63f 22%, #ffe9a8 50%, #ffc63f 78%, rgba(255,198,63,0));
  box-shadow: 0 0 10px 2px rgba(255,198,63,.45);
}

/* --- Ghost plate: quiet dark metal for secondary actions --- */
html[data-tactical='on'] .btn-ghost {
  position: relative;
  clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(52,55,62,.55) 0%, rgba(18,19,23,.55) 100%);
  border: 1px solid rgba(120,126,136,.35);
  color: #b9bec7;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .1em;
  text-decoration: none;
  text-shadow: 0 -1px 1px rgba(0,0,0,.8);
  cursor: pointer;
  transition: filter .15s ease, transform .1s ease;
}
html[data-tactical='on'] .btn-ghost::after {
  opacity: .25;
  box-shadow: none;
}

/* --- Small plates for the header Admin / Code Vault links --- */
html[data-tactical='on'] .slot-utils > a[href='/admin'],
html[data-tactical='on'] .slot-utils > a[href='/codex'] {
  position: relative;
  display: inline-block;
  clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
  background:
    radial-gradient(circle 2px at 8px 8px, #a8adb6 0 1px, #0e0f12 1.6px, rgba(0,0,0,0) 2px),
    radial-gradient(circle 2px at calc(100% - 8px) 8px, #a8adb6 0 1px, #0e0f12 1.6px, rgba(0,0,0,0) 2px),
    radial-gradient(circle 2px at 8px calc(100% - 8px), #a8adb6 0 1px, #0e0f12 1.6px, rgba(0,0,0,0) 2px),
    radial-gradient(circle 2px at calc(100% - 8px) calc(100% - 8px), #a8adb6 0 1px, #0e0f12 1.6px, rgba(0,0,0,0) 2px),
    linear-gradient(180deg, #2b2e34 0%, #141518 100%);
  color: #cfd4dc;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  text-decoration: none;
  padding: 8px 14px;
  text-shadow: 0 -1px 1px rgba(0,0,0,.8);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.1);
  filter: drop-shadow(0 4px 8px rgba(0,0,0,.5));
}

/* --- Plate motion: hover lift, press down --- */
html[data-tactical='on'] .btn:hover,
html[data-tactical='on'] .theme-cycle:hover,
html[data-tactical='on'] .mode-dial:hover,
html[data-tactical='on'] .slot-engage:hover,
html[data-tactical='on'] .tell-king-nav:hover,
html[data-tactical='on'] .btn-primary:hover,
html[data-tactical='on'] .btn-danger:hover,
html[data-tactical='on'] .btn-ghost:hover {
  filter: drop-shadow(0 7px 14px rgba(0,0,0,.6)) brightness(1.16);
  color: #fff;
}
html[data-tactical='on'] .btn:active,
html[data-tactical='on'] .theme-cycle:active,
html[data-tactical='on'] .mode-dial:active,
html[data-tactical='on'] .slot-engage:active,
html[data-tactical='on'] .tell-king-nav:active,
html[data-tactical='on'] .btn-primary:active,
html[data-tactical='on'] .btn-danger:active,
html[data-tactical='on'] .btn-ghost:active {
  transform: translateY(2px);
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.6)) brightness(.94);
}

/* --- Matched sizes: one height across the header command row --- */
html[data-tactical='on'] .slot-utils > .tell-king-nav,
html[data-tactical='on'] .slot-utils > .theme-cycle,
html[data-tactical='on'] .slot-utils > .mode-dial,
html[data-tactical='on'] .slot-utils > a[href='/admin'],
html[data-tactical='on'] .slot-utils > a[href='/codex'] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 40px;
  margin: 0;
  font-size: 12px;
  padding: 10px 18px;
}
html[data-tactical='on'] .tagline-row > .notif-wrap { align-self: center; }
html[data-tactical='on'] .notif-bell {
  width: 40px;
  height: 40px;
  padding: 0;
  font-size: 16px;
  line-height: 1;
}

/* --- Bell dropdown folds OVER the banner: the header outranks it --- */
html[data-tactical='on'] .site-header { z-index: 2; }

/* --- Tight-suit mesh: fine chainmail weave over every plate, futuristic and still --- */
html[data-tactical='on'] {
  --aegis-mesh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M6 0L12 6L6 12L0 6Z' fill='none' stroke='white' stroke-opacity='0.09'/%3E%3Cpath d='M6 1.5L10.5 6L6 10.5L1.5 6Z' fill='none' stroke='black' stroke-opacity='0.30'/%3E%3C/svg%3E");
}
html[data-tactical='on'] .theme-cycle,
html[data-tactical='on'] .mode-dial,
html[data-tactical='on'] .slot-utils > a[href='/admin'],
html[data-tactical='on'] .slot-utils > a[href='/codex'] {
  background: var(--aegis-mesh), linear-gradient(180deg,#3d4148 0%,#23262c 45%,#14161a 55%,#1e2126 100%);
}
html[data-tactical='on'] .tell-king-nav,
html[data-tactical='on'] .btn-primary,
html[data-tactical='on'] .btn-danger {
  background: var(--aegis-mesh), linear-gradient(180deg,#8f1020 0%,#5c0a14 45%,#3d060d 55%,#6b0d17 100%);
}
html[data-tactical='on'] .slot-engage {
  background: var(--aegis-mesh), linear-gradient(180deg,#8a6a25 0%,#5c4517 45%,#3d2e0e 55%,#6e5420 100%);
}
html[data-tactical='on'] .btn-ghost {
  background: var(--aegis-mesh), linear-gradient(180deg,#26292f 0%,#17191d 60%,#101215 100%);
}

/* --- PRESTIGE: red and black. Bright engraving, top sheen, no stray colors --- */
html[data-tactical='on'] .theme-cycle,
html[data-tactical='on'] .mode-dial,
html[data-tactical='on'] .slot-utils > a[href='/admin'],
html[data-tactical='on'] .slot-utils > a[href='/codex'],
html[data-tactical='on'] .btn-ghost {
  background: var(--aegis-mesh), linear-gradient(180deg,#26282e 0%,#101114 45%,#060708 55%,#141518 100%);
  border: 0;
  outline: 0;
  color: #f2f3f5;
  text-shadow: 0 1px 2px rgba(0,0,0,.85), 0 0 12px rgba(210,31,38,.35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), inset 0 -1px 0 rgba(0,0,0,.65), 0 4px 10px rgba(0,0,0,.55);
}
html[data-tactical='on'] .tell-king-nav,
html[data-tactical='on'] .btn-primary,
html[data-tactical='on'] .btn-danger,
html[data-tactical='on'] .slot-engage {
  background: var(--aegis-mesh), linear-gradient(180deg,#a01220 0%,#6b0d17 45%,#45060d 55%,#7a0e18 100%);
  border: 0;
  outline: 0;
  color: #f5f6f8;
  text-shadow: 0 1px 2px rgba(0,0,0,.85), 0 0 14px rgba(255,60,70,.45);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.6), 0 4px 12px rgba(0,0,0,.55), 0 0 18px rgba(160,18,32,.35);
}

/* --- Tactical protection perimeter: a crisp outline ring around every plate --- */
html[data-tactical='on'] .theme-cycle,
html[data-tactical='on'] .mode-dial,
html[data-tactical='on'] .slot-utils > a[href='/admin'],
html[data-tactical='on'] .slot-utils > a[href='/codex'],
html[data-tactical='on'] .btn-ghost,
html[data-tactical='on'] .notif-bell {
  outline: 1px solid rgba(210,31,38,.5);
  outline-offset: 3px;
}
html[data-tactical='on'] .tell-king-nav,
html[data-tactical='on'] .btn-primary,
html[data-tactical='on'] .btn-danger,
html[data-tactical='on'] .slot-engage {
  outline: 1px solid rgba(255,84,94,.7);
  outline-offset: 3px;
}

/* --- Casino dressed in plate: machine frame, window, steppers --- */
html[data-tactical='on'] .slot-machine {
  position: relative;
  background:
    radial-gradient(circle 3px at 10px 10px, #a8adb6 0 1px, #43464d 1.7px, #0b0c0e 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 10px) 10px, #a8adb6 0 1px, #43464d 1.7px, #0b0c0e 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at 10px calc(100% - 10px), #a8adb6 0 1px, #43464d 1.7px, #0b0c0e 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 10px) calc(100% - 10px), #a8adb6 0 1px, #43464d 1.7px, #0b0c0e 2.5px, rgba(0,0,0,0) 3px),
    var(--aegis-mesh),
    linear-gradient(180deg,#22242a 0%,#0e0f12 55%,#060708 100%);
  border: 0;
  border-radius: 14px;
  outline: 1px solid rgba(210,31,38,.5);
  outline-offset: 3px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 18px rgba(0,0,0,.7), 0 6px 16px rgba(0,0,0,.6);
  padding: 12px 14px 14px;
}
html[data-tactical='on'] .slot-machine::after {
  content: "";
  position: absolute; left: 18px; right: 18px; bottom: 6px; height: 2px;
  background: linear-gradient(90deg, rgba(210,31,38,0), #e53238 22%, #ff6b74 50%, #e53238 78%, rgba(210,31,38,0));
  box-shadow: 0 0 10px 2px rgba(210,31,38,.5);
  pointer-events: none;
}
html[data-tactical='on'] .slot-window {
  background: var(--aegis-mesh), linear-gradient(180deg,#000000 0%,#0a0a0c 50%,#000000 100%);
  border: 1px solid rgba(210,31,38,.4);
  box-shadow: inset 0 0 18px rgba(0,0,0,.9), inset 0 2px 6px rgba(0,0,0,.8);
}
html[data-tactical='on'] .slot-lockline {
  border-top: 1px solid #e53238;
  border-bottom: 1px solid #e53238;
  box-shadow: inset 0 0 14px rgba(210,31,38,.3);
  background: linear-gradient(180deg, rgba(210,31,38,.12), transparent 40%, transparent 60%, rgba(210,31,38,.12));
}
html[data-tactical='on'] .slot-lockline::before,
html[data-tactical='on'] .slot-lockline::after {
  color: #ff6b74;
  text-shadow: 0 0 6px rgba(229,50,56,.9);
}
html[data-tactical='on'] .slot-item.slot-locked {
  color: #ffe2e4;
  text-shadow: 0 0 10px rgba(229,50,56,.9);
}
html[data-tactical='on'] .slot-step {
  background: var(--aegis-mesh), linear-gradient(180deg,#2b2e34 0%,#101114 60%,#060708 100%);
  border: 0;
  color: #ff6b74;
  text-shadow: 0 0 8px rgba(229,50,56,.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), inset 0 -1px 0 rgba(0,0,0,.6), 0 3px 8px rgba(0,0,0,.55);
  outline: 1px solid rgba(210,31,38,.45);
  outline-offset: 2px;
}

/* --- ENGAGE keeps its gold, prestige grade --- */
html[data-tactical='on'] .slot-engage {
  background:
    radial-gradient(circle 3px at 12px 12px, #e8cf9a 0 1px, #7a5f28 1.7px, #171106 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 12px) 12px, #e8cf9a 0 1px, #7a5f28 1.7px, #171106 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at 12px calc(100% - 12px), #e8cf9a 0 1px, #7a5f28 1.7px, #171106 2.5px, rgba(0,0,0,0) 3px),
    radial-gradient(circle 3px at calc(100% - 12px) calc(100% - 12px), #e8cf9a 0 1px, #7a5f28 1.7px, #171106 2.5px, rgba(0,0,0,0) 3px),
    var(--aegis-mesh),
    linear-gradient(180deg,#8a6a25 0%,#5c4517 45%,#3d2e0e 55%,#6e5420 100%);
  border: 0;
  outline: 1px solid rgba(255,205,110,.6);
  outline-offset: 3px;
  color: #fff3d0;
  text-shadow: 0 1px 2px rgba(0,0,0,.85), 0 0 14px rgba(255,198,63,.55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.6), 0 4px 12px rgba(0,0,0,.55), 0 0 18px rgba(200,150,50,.35);
}

/* --- WARP plate, back in the header --- */
html[data-tactical='on'] .slot-utils > .warp-nav {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 40px;
  margin: 0;
  font-size: 12px;
  padding: 10px 18px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .18em;
  text-decoration: none;
  color: #f2f3f5;
  text-shadow: 0 1px 2px rgba(0,0,0,.85), 0 0 12px rgba(210,31,38,.35);
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  border: 0;
  background:
    radial-gradient(circle 2px at 8px 8px, #a8adb6 0 1px, #0e0f12 1.6px, rgba(0,0,0,0) 2px),
    radial-gradient(circle 2px at calc(100% - 8px) 8px, #a8adb6 0 1px, #0e0f12 1.6px, rgba(0,0,0,0) 2px),
    radial-gradient(circle 2px at 8px calc(100% - 8px), #a8adb6 0 1px, #0e0f12 1.6px, rgba(0,0,0,0) 2px),
    radial-gradient(circle 2px at calc(100% - 8px) calc(100% - 8px), #a8adb6 0 1px, #0e0f12 1.6px, rgba(0,0,0,0) 2px),
    var(--aegis-mesh),
    linear-gradient(180deg,#26282e 0%,#101114 45%,#060708 55%,#141518 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), inset 0 -1px 0 rgba(0,0,0,.65), 0 4px 10px rgba(0,0,0,.55);
  outline: 1px solid rgba(210,31,38,.5);
  outline-offset: 3px;
  cursor: pointer;
}
html[data-tactical='on'] .slot-utils > .warp-nav::after {
  content: "";
  position: absolute; left: 10px; right: 10px; bottom: 5px; height: 2px;
  background: linear-gradient(90deg, rgba(210,31,38,0), #e53238 25%, #ff7a82 50%, #e53238 75%, rgba(210,31,38,0));
  box-shadow: 0 0 8px 1px rgba(210,31,38,.55);
  pointer-events: none;
}
html[data-tactical='on'] .slot-utils > .warp-nav:hover {
  filter: brightness(1.16);
  color: #fff;
}
html[data-tactical='on'] .slot-utils > .warp-nav:active {
  transform: translateY(2px);
}

/* --- Ship's Bell unfolds centered like a flag: glass red and black --- */
html[data-tactical='on'] .notif-drop {
  position: fixed;
  top: 12px;
  left: 50%;
  right: auto;
  transform: translateX(-50%);
  width: min(94vw, 420px);
  max-height: 72vh;
  overflow-y: auto;
  background: linear-gradient(180deg, rgba(74,10,14,.78) 0%, rgba(20,8,9,.86) 45%, rgba(8,6,7,.92) 100%);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(229,50,56,.55);
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(0,0,0,.75), 0 0 32px rgba(210,31,38,.35), inset 0 1px 0 rgba(255,255,255,.18);
  z-index: 200;
}
html[data-tactical='on'] .notif-drop::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 56px;
  background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,0));
  border-radius: 16px 16px 0 0;
  pointer-events: none;
}
html[data-tactical='on'] .notif-drop::after {
  content: "";
  position: absolute;
  top: -7px; left: 50%;
  width: 12px; height: 12px;
  transform: translateX(-50%) rotate(45deg);
  background: rgba(74,10,14,.92);
  border-left: 1px solid rgba(229,50,56,.55);
  border-top: 1px solid rgba(229,50,56,.55);
}

/* --- Bell folds out of the casino: the drop hangs from the machine --- */
html[data-tactical='on'] .slot-machine .notif-drop {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  right: auto;
  transform: translateX(-50%);
  width: min(94vw, 420px);
  max-height: 70vh;
}

/* --- Bell spans the phone screen --- */
html[data-tactical='on'] .slot-machine .notif-drop {
  width: calc(100vw - 20px);
  max-width: 560px;
}

/* --- Casino and bell centered on the board --- */
html[data-tactical='on'] nav.slot-nav {
  justify-content: center;
  margin-left: 0;
}
/* === The same flag-fold glass for Solid and SABLE, on everything === */
html[data-tactical='on'] .sable-side,
html[data-tactical='on'] .logbook-side,
html[data-tactical='on'] #solid-post.open,
html[data-tactical='on'] #solid-post.sp-fullscreen,
html[data-tactical='on'] #solid-compose-sheet {
  background: linear-gradient(180deg, rgba(74,10,14,.78) 0%, rgba(20,8,9,.86) 45%, rgba(8,6,7,.92) 100%);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(229,50,56,.55);
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(0,0,0,.75), 0 0 32px rgba(210,31,38,.35), inset 0 1px 0 rgba(255,255,255,.18);
}
/* gloss shine + diamond pin, the family signature */
html[data-tactical='on'] .sable-side::before,
html[data-tactical='on'] .logbook-side::before,
html[data-tactical='on'] #solid-post.open::before,
html[data-tactical='on'] #solid-compose-sheet::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 56px;
  background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,0));
  border-radius: 16px 16px 0 0;
  pointer-events: none;
}
html[data-tactical='on'] .sable-side::after,
html[data-tactical='on'] .logbook-side::after,
html[data-tactical='on'] #solid-post.open::after,
html[data-tactical='on'] #solid-compose-sheet::after {
  content: "";
  position: absolute;
  top: -7px; left: 50%;
  width: 12px; height: 12px;
  transform: translateX(-50%) rotate(45deg);
  background: rgba(74,10,14,.92);
  border-left: 1px solid rgba(229,50,56,.55);
  border-top: 1px solid rgba(229,50,56,.55);
  pointer-events: none;
}
/* SABLE's chat: centered flag-fold card, full phone width */
html[data-tactical='on'] .sable-side {
  top: 12px; left: 50%; right: auto;
  width: calc(100vw - 20px); max-width: 560px;
  height: calc(100vh - 24px); height: calc(100dvh - 24px);
  transform: translateX(-50%) translateY(-110%);
}
html[data-tactical='on'] .sable-side.open { transform: translateX(-50%) translateY(0); }
html[data-tactical='on'] .sable-side.open.slid { transform: translateX(calc(-50% + 100vw)) translateY(0); }
/* Ship's Log: same card */
html[data-tactical='on'] .logbook-side {
  top: 12px; left: 50%;
  width: calc(100vw - 20px); max-width: 560px;
  height: calc(100vh - 24px); height: calc(100dvh - 24px);
  transform: translateX(-50%) translateY(-110%);
}
html[data-tactical='on'] .logbook-side.open { transform: translateX(-50%) translateY(0); }
/* SABLE's hands drawer: glass, folds down inside the chat */
html[data-tactical='on'] .ai-drawer {
  background: linear-gradient(180deg, rgba(74,10,14,.82) 0%, rgba(20,8,9,.9) 45%, rgba(8,6,7,.94) 100%);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(229,50,56,.55);
  transform: translateY(-103%);
}
html[data-tactical='on'] .ai-drawer.open { transform: none; }
html[data-tactical='on'] .ai-chat { overflow: hidden; }
/* Solid's chat: opens as the same centered glass card */
html[data-tactical='on'] #solid-post.open {
  top: 12px; left: 50%; right: auto; bottom: auto;
  transform: translateX(-50%);
  width: calc(100vw - 20px); max-width: 560px;
  height: calc(100vh - 24px); height: calc(100dvh - 24px);
  display: flex; flex-direction: column;
}
html[data-tactical='on'] #solid-post.open .sp-body {
  display: flex; flex-direction: column; flex: 1; min-height: 0;
}
html[data-tactical='on'] #solid-post.open .sp-pane[data-pane="chat"] {
  display: flex; flex-direction: column; flex: 1; min-height: 0;
}
html[data-tactical='on'] #solid-post.open .sp-msgs { max-height: none; flex: 1; }
/* Solid fullscreen: the same card, not raw viewport */
html[data-tactical='on'] #solid-post.sp-fullscreen {
  top: 12px !important; left: 50% !important; right: auto !important; bottom: auto !important;
  transform: translateX(-50%) !important;
  width: calc(100vw - 20px) !important; max-width: 560px;
  height: calc(100vh - 24px) !important; height: calc(100dvh - 24px) !important;
  border-radius: 16px !important;
}
html[data-tactical='on'] #solid-post.sp-fullscreen .sp-body {
  height: calc(100vh - 110px) !important; height: calc(100dvh - 110px) !important;
}
/* Solid's compose sheet: the same centered glass card */
html[data-tactical='on'] #solid-compose-sheet {
  top: 12px; left: 50%; right: auto; bottom: auto;
  transform: translateX(-50%);
  width: calc(100vw - 20px); max-width: 560px;
  height: calc(100vh - 24px); height: calc(100dvh - 24px);
}

/* SABLE's full-page chat (/ai): the same flag-fold glass, full phone width */
html[data-tactical='on'] .ai-wrap {
  position: relative;
  width: calc(100vw - 20px);
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
  background:
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,0) 56px),
    linear-gradient(180deg, rgba(74,10,14,.78) 0%, rgba(20,8,9,.86) 45%, rgba(8,6,7,.92) 100%);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(229,50,56,.55);
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(0,0,0,.75), 0 0 32px rgba(210,31,38,.35), inset 0 1px 0 rgba(255,255,255,.18);
  overflow: hidden;
}

/* === FORUM LOOP: sectors ride a continuous vertical loop (2026-09-26) ====== */
.forum-loop{
  position:relative;height:min(66vh,640px);min-height:380px;
  overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c1121f #0a0a0c;
  border:1px solid #33383f;border-radius:12px;background:rgba(8,8,10,.55);
}
.forum-loop-inner{position:relative;}
.loop-hint{display:flex;align-items:center;gap:8px;justify-content:center;
  margin:2px 0 8px;color:#d09a9a;font-size:14px;letter-spacing:.08em;text-transform:uppercase;line-height:1.5;}
.loop-hint-spin{color:#ff3d45;font-size:14px;}
.loop-glaze{position:sticky;left:0;right:0;height:44px;z-index:5;pointer-events:none;
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);}
.loop-glaze-top{top:0;margin-bottom:-44px;border-radius:12px 12px 0 0;
  background:linear-gradient(to bottom,rgba(150,10,20,.55),rgba(150,10,20,.14) 55%,rgba(150,10,20,0));
  border-top:1px solid rgba(255,70,80,.4);
  box-shadow:inset 0 14px 26px -14px rgba(255,45,60,.55);}
.loop-glaze-bot{bottom:0;margin-top:-44px;border-radius:0 0 12px 12px;
  background:linear-gradient(to top,rgba(150,10,20,.55),rgba(150,10,20,.14) 55%,rgba(150,10,20,0));
  border-bottom:1px solid rgba(255,70,80,.4);
  box-shadow:inset 0 -14px 26px -14px rgba(255,45,60,.55);}
/* shrunken rows inside the loop */
.forum-loop .forum-block{margin:0 0 10px;}
.forum-loop .catbar{padding:8px 12px;font-size:15px;}
.forum-loop .forumtable td{padding:7px 10px;}
.forum-loop .board-icon{width:30px;height:30px;font-size:15px;}
.forum-loop .board-title{font-size:14px;}
.forum-loop .board-desc{font-size:11px;}
.forum-loop .cell-last{font-size:11px;}
.forum-loop .inst-rail{padding:6px 10px;}
/* tactical armor for the loop frame */
html[data-tactical='on'] .forum-loop{
  border-color:#4a4f57;
  background:
    repeating-linear-gradient(175deg, rgba(255,255,255,.04) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, rgba(12,7,9,.80) 0%, rgba(12,7,9,.62) 28%, rgba(12,7,9,.62) 72%, rgba(12,7,9,.84) 100%),
    url('/img/electric-crystal.webp') center center / cover no-repeat #0a0a0c;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7), inset 0 2px 10px rgba(0,0,0,.6), 0 0 24px rgba(255,30,45,.12);
}
html[data-tactical='on'] .loop-hint{color:#d08a8a;}

/* === FORUM LOOP RIVET RAILS (2026-09-26) =================================== */
.forum-loop-wrap{position:relative;display:flex;align-items:stretch;
  border:1px solid #33383f;border-radius:12px;background:rgba(8,8,10,.55);overflow:hidden;
  height:min(82vh,900px);min-height:420px;}
.forum-loop-wrap .forum-loop{flex:1 1 auto;min-width:0;border:0;border-radius:0;background:transparent;height:100%;}
.loop-rail{flex:0 0 auto;width:38px;display:flex;flex-direction:column;align-items:center;
  padding:8px 0 10px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 40%,rgba(0,0,0,.25));}
.loop-rail-left{border-right:1px solid rgba(255,60,70,.22);}
.loop-rail-right{border-left:1px solid rgba(255,60,70,.22);}
.loop-rail.off{width:16px;}
.loop-rail.off .rivets{display:none;}
.rail-toggle{background:none;border:0;color:#ff6b74;font-size:16px;line-height:1;cursor:pointer;padding:4px 2px;}
.rivets{flex:1;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;width:100%;overflow:hidden;}
.rivet{background:none;border:0;padding:7px 4px;margin:0;cursor:pointer;}
.rivet i{display:block;width:13px;height:13px;transform:rotate(45deg);
  background:linear-gradient(135deg,#f0f0f2 0%,#9aa0a8 38%,#33363b 72%,#d5d8dd 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.65), inset 0 1px 1px rgba(255,255,255,.5);
  position:relative;transition:box-shadow .2s;}
.rivet i::after{content:'';position:absolute;inset:3px;
  background:radial-gradient(circle,rgba(255,70,80,.95) 0%,rgba(255,70,80,0) 70%);opacity:.45;}
.rivet.on i{box-shadow:0 0 0 1px rgba(0,0,0,.65),0 0 12px rgba(255,45,60,.85), inset 0 1px 1px rgba(255,255,255,.5);}
.rivet.on i::after{opacity:1;}
html[data-tactical='on'] .forum-loop-wrap{
  border-color:#4a4f57;
  background:
    repeating-linear-gradient(175deg, rgba(255,255,255,.05) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, rgba(20,20,24,.88), rgba(10,10,12,.92));
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7), inset 0 2px 10px rgba(0,0,0,.6), 0 0 24px rgba(255,30,45,.12);}
html[data-tactical='on'] .forum-loop-wrap .forum-loop{background:transparent;box-shadow:none;}
html[data-tactical='on'] .rivet i{box-shadow:0 0 0 1px rgba(0,0,0,.65), inset 0 1px 1px rgba(255,255,255,.45), 0 2px 4px rgba(0,0,0,.5);}
html[data-tactical='on'] .rivet.on i{box-shadow:0 0 0 1px rgba(0,0,0,.65),0 0 12px rgba(255,45,60,.85), inset 0 1px 1px rgba(255,255,255,.45);}

/* === FORUM LOOP GUTTER ARROW + SIGHT LINE (2026-09-26) ===================== */
.forum-loop-assembly{position:relative;display:flex;align-items:stretch;gap:8px;}
.loop-gutter{flex:0 0 auto;width:42px;position:relative;border:1px solid #33383f;border-radius:12px;background:rgba(8,8,10,.55);}
.gutter-track{position:absolute;left:50%;top:8px;bottom:8px;width:2px;transform:translateX(-50%);
  background:linear-gradient(180deg,transparent,rgba(255,70,80,.35) 18%,rgba(255,70,80,.35) 82%,transparent);}
.scroll-arrow{position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:34px;min-height:40px;touch-action:none;cursor:grab;text-align:center;z-index:6;}
.scroll-arrow .sa-chev{display:block;font-size:9px;color:#ff6b74;line-height:1;opacity:.85;}

/* === RED RAIL DOCKED TO THE TABLE (2026-09-27) ============================= */
.loop-gutter::before,.loop-gutter::after{
  content:"";position:absolute;left:50%;width:30px;height:2px;transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(255,70,80,.15),rgba(255,70,80,.75),rgba(255,70,80,.15));
  box-shadow:0 0 8px rgba(255,45,60,.5);z-index:5;}
.loop-gutter::before{top:8px;}
.loop-gutter::after{bottom:8px;}
.forum-loop-wrap{
  box-shadow:inset 3px 0 0 -1px rgba(255,45,60,.55), inset 0 0 0 1px rgba(0,0,0,.7);}
.scroll-arrow::after{
  content:"";position:absolute;left:100%;top:50%;width:14px;height:2px;transform:translateY(-50%);
  background:linear-gradient(90deg,rgba(255,80,90,.9),rgba(255,80,90,.25));
  box-shadow:0 0 10px rgba(255,45,60,.7);pointer-events:none;}
.scroll-arrow i{display:block;width:17px;height:17px;margin:3px auto;transform:rotate(45deg);
  background:linear-gradient(135deg,#ff7a7a 0%,#d21f26 45%,#6e0d13 100%);
  box-shadow:0 0 12px rgba(255,45,60,.65),0 0 0 1px rgba(0,0,0,.6), inset 0 1px 1px rgba(255,255,255,.4);}
.scroll-arrow.dragging{cursor:grabbing;}
.scroll-arrow.dragging i{box-shadow:0 0 20px rgba(255,45,60,.95),0 0 0 1px rgba(0,0,0,.6), inset 0 1px 1px rgba(255,255,255,.5);}
.scroll-arrow:focus-visible{outline:1px solid rgba(255,80,90,.7);outline-offset:2px;}
.sight-line{position:sticky;top:92px;height:0;margin:0 10px;z-index:4;pointer-events:none;
  border-top:1px dashed rgba(255,70,80,.42);}
.rivets-live{display:block;overflow:hidden;position:relative;}
.stud-stream{will-change:transform;}
.stud-stream .rivet{display:block;margin:0 auto;padding:9px 4px;}
html[data-tactical='on'] .gutter-track{background:linear-gradient(180deg,transparent,rgba(255,70,80,.5) 18%,rgba(255,70,80,.5) 82%,transparent);}

/* === FORUM LOOP ARMORED PLATE ROWS (2026-09-26) ============================ */
html[data-tactical='on'] .forum-loop .forumtable{
  border-collapse:separate;border-spacing:0 4px;background:transparent;border:0;margin:0;
}
html[data-tactical='on'] .forum-loop .forumtable thead{display:none;}
html[data-tactical='on'] .forum-loop .forum-block{margin:0 0 8px;}
html[data-tactical='on'] .forum-loop tr.board-row{cursor:pointer;}
html[data-tactical='on'] .forum-loop tr.board-row td{
  background:
    repeating-linear-gradient(175deg,rgba(255,255,255,.05) 0 1px,rgba(255,255,255,0) 1px 3px),
    linear-gradient(180deg,#212429 0%,#141518 55%,#1c1e24 100%);
  border-top:1px solid #3b3f47;border-bottom:1px solid rgba(255,70,80,.55);
  padding:3px 8px;vertical-align:middle;
  box-shadow:0 8px 14px -8px rgba(255,30,45,.55);
}
html[data-tactical='on'] .forum-loop tr.board-row td.cell-icon{padding-left:14px;}
html[data-tactical='on'] .forum-loop tr.board-row td:first-child{
  border-left:1px solid #3b3f47;border-radius:9px 0 0 9px;
  background-image:
    radial-gradient(circle,#eceef2 0 1.4px,#4a4e56 2.4px,rgba(0,0,0,0) 3px),
    radial-gradient(circle,#eceef2 0 1.4px,#4a4e56 2.4px,rgba(0,0,0,0) 3px),
    repeating-linear-gradient(175deg,rgba(255,255,255,.05) 0 1px,rgba(255,255,255,0) 1px 3px),
    linear-gradient(180deg,#212429 0%,#141518 55%,#1c1e24 100%);
  background-position:6px 5px,6px calc(100% - 5px),0 0,0 0;
  background-repeat:no-repeat;
}
html[data-tactical='on'] .forum-loop tr.board-row td:last-child{
  border-right:1px solid #3b3f47;border-radius:0 9px 9px 0;position:relative;padding-right:26px;
  background-image:
    radial-gradient(circle,#eceef2 0 1.4px,#4a4e56 2.4px,rgba(0,0,0,0) 3px),
    radial-gradient(circle,#eceef2 0 1.4px,#4a4e56 2.4px,rgba(0,0,0,0) 3px),
    repeating-linear-gradient(175deg,rgba(255,255,255,.05) 0 1px,rgba(255,255,255,0) 1px 3px),
    linear-gradient(180deg,#212429 0%,#141518 55%,#1c1e24 100%);
  background-position:calc(100% - 6px) 5px,calc(100% - 6px) calc(100% - 5px),0 0,0 0;
  background-repeat:no-repeat;
}
html[data-tactical='on'] .forum-loop tr.board-row td:last-child::after{
  content:'\203A';position:absolute;right:10px;top:50%;transform:translateY(-50%);
  color:#9aa0a8;font-size:19px;font-weight:700;line-height:1;pointer-events:none;
}
html[data-tactical='on'] .forum-loop tr.board-row .cell-num{display:none;}
html[data-tactical='on'] .forum-loop .board-icon{width:20px;height:20px;font-size:12px;}
html[data-tactical='on'] .forum-loop .board-title{font-size:15px;letter-spacing:.05em;text-transform:uppercase;}
html[data-tactical='on'] .forum-loop .board-desc{font-size:16px;line-height:1.6;}
html[data-tactical='on'] .forum-loop .cell-last{font-size:14px;line-height:1.5;}
html[data-tactical='on'] .forum-loop .catbar{
  background-image:
    radial-gradient(circle,#eceef2 0 1.4px,#4a4e56 2.4px,rgba(0,0,0,0) 3px),
    radial-gradient(circle,#eceef2 0 1.4px,#4a4e56 2.4px,rgba(0,0,0,0) 3px),
    repeating-linear-gradient(175deg,rgba(255,255,255,.05) 0 1px,rgba(255,255,255,0) 1px 3px),
    linear-gradient(180deg,#262a31 0%,#151619 60%,#1e2127 100%);
  background-position:7px 50%,calc(100% - 7px) 50%,0 0,0 0;
  background-repeat:no-repeat;
  border:1px solid #3b3f47;border-radius:9px;
  box-shadow:0 2px 0 rgba(255,45,60,.45),0 8px 16px -6px rgba(255,30,45,.4),inset 0 1px 0 rgba(255,255,255,.1);
  padding:6px 26px;font-size:13px;letter-spacing:.12em;margin:0;
}

/* === FORUM LOOP PHONE SIZE (2026-09-27) ==================================== */
@media (max-width:700px){
  .forum-loop{height:min(42vh,400px);min-height:280px;}
  .forum-loop-wrap{height:min(42vh,400px);min-height:280px;}
}

/* === READABILITY (2026-09-27): the King reads on his phone ================= */
html[data-tactical='on'] .board-desc,
html[data-tactical='on'] .thread-preview,
html[data-tactical='on'] .inst-sub,
html[data-tactical='on'] .sector-sub{
  font-size:16px !important;line-height:1.6 !important;letter-spacing:0 !important;}
html[data-tactical='on'] .cell-last,
html[data-tactical='on'] .board-meta{
  font-size:14px !important;line-height:1.5 !important;}

/* === KEYBOARD-READABLE SITE-WIDE (2026-09-27) ============================= */
html[data-tactical='on'] .postbit-body,
html[data-tactical='on'] .msg,
html[data-tactical='on'] .chat-msg,
html[data-tactical='on'] .thread-preview p,
html[data-tactical='on'] .board-desc{
  font-size:16.5px !important;line-height:1.65 !important;letter-spacing:0 !important;}
  text-transform:none !important;}
html[data-tactical='on'] input[type=text],
html[data-tactical='on'] input[type=password],
html[data-tactical='on'] input[type=email],
html[data-tactical='on'] input:not([type]),
html[data-tactical='on'] textarea,
html[data-tactical='on'] select{
  font-size:16px !important;line-height:1.5 !important;}
html[data-tactical='on'] .chat-msg .when,
html[data-tactical='on'] .cell-last{
  font-size:14px !important;letter-spacing:.02em !important;}

/* === UNIFORM 18 (2026-09-27): the King's size, everything ================= */
html[data-tactical='on'] .forum-loop .board-title,
html[data-tactical='on'] .forum-loop .board-desc,
html[data-tactical='on'] .forum-loop .cell-last,
html[data-tactical='on'] .forum-loop .catbar,
html[data-tactical='on'] .loop-hint,
html[data-tactical='on'] .inst-rail label,
html[data-tactical='on'] .postbit-body,
html[data-tactical='on'] .msg,
html[data-tactical='on'] .chat-msg,
html[data-tactical='on'] .thread-preview,
html[data-tactical='on'] .board-desc,
html[data-tactical='on'] .board-meta{
  font-size:var(--user-font-size,18px) !important;line-height:1.6 !important;}