/* ================================================================
   BANGBOWBING — ASCII SIGNAL BUILD
   The 3D bodega is ambient scenery. Navigation is a normal text index.
   Exact glyph density/color tuning is intentionally isolated here so the
   reference video can be matched without touching the site architecture.
   ================================================================ */

:root {
  --ascii-green: #71ff9a;
  --ascii-green-hot: #c5ffd6;
  --ascii-dim: #2eb861;
  --ascii-deep: #07110a;
  --ascii-black: #010302;
  --ascii-line: rgba(113,255,154,.22);
  --ascii-glass: rgba(2,10,5,.74);
}
html, body { background: var(--ascii-black) !important; }
body.ascii-site {
  margin: 0;
  overflow: hidden;
  color: var(--ascii-green);
  font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-shadow: 0 0 7px rgba(70,255,126,.12);
  letter-spacing: .01em;
}
body.ascii-site::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 998;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 45%, transparent 0 42%, rgba(0,0,0,.22) 78%, rgba(0,0,0,.56) 100%),
    repeating-linear-gradient(0deg, rgba(120,255,160,.018) 0 1px, transparent 1px 4px);
  mix-blend-mode: screen;
}
body.ascii-site::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 997;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 0 48%, rgba(153,255,186,.035) 50%, transparent 52% 100%);
  opacity: .65;
}

/* The scene is image, not interface. */
body.ascii-site #scene { pointer-events: none !important; background: #000 !important; }
body.ascii-site #scene-spots { display: none !important; }
body.ascii-site #hud { display: none !important; }
body.ascii-site #pause { display: none !important; }
body.ascii-site #crt {
  display: block !important;
  pointer-events: none;
  opacity: .24;
  mix-blend-mode: screen;
}

/* ASCII output from Three.js AsciiEffect. */
.scene3d-ascii {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  background: #000 !important;
  color: var(--ascii-green) !important;
  opacity: 0;
  filter: contrast(1.34) brightness(.78);
  transition: opacity 260ms linear;
  pointer-events: none !important;
  font-family: "IBM Plex Mono", ui-monospace, monospace !important;
  font-weight: 500 !important;
  line-height: .88 !important;
  text-shadow:
    0 0 2px rgba(113,255,154,.52),
    0 0 10px rgba(43,255,110,.14);
  transform: translateZ(0);
}
.scene3d-ascii.is-in { opacity: .94; }
.scene3d-ascii table {
  width: 100% !important;
  height: 100% !important;
  border-collapse: collapse !important;
  letter-spacing: -.02em !important;
  font-variant-ligatures: none !important;
}
.scene3d-ascii td { padding: 0 !important; }
.scene3d-ascii span { color: inherit !important; background: transparent !important; }
body.ascii-site.is-3d #scene-stage::after {
  opacity: .62 !important;
  background:
    linear-gradient(180deg, rgba(112,255,154,.018), rgba(0,0,0,.14)),
    repeating-linear-gradient(0deg, rgba(120,255,160,.032) 0 1px, transparent 1px 4px) !important;
  mix-blend-mode: screen;
}
body.ascii-site.is-3d #scene-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  box-shadow: inset 0 0 90px rgba(0,0,0,.56), inset 0 0 220px rgba(0,0,0,.32);
}

/* Plain website index. */
#site-nav {
  position: fixed;
  z-index: 300;
  left: clamp(20px, 3vw, 46px);
  top: 50%;
  width: min(320px, calc(100vw - 40px));
  transform: translateY(-50%);
  display: grid;
  gap: 18px;
  pointer-events: auto;
  color: var(--ascii-green);
  font-family: inherit;
  padding: 16px 18px 14px;
  background: linear-gradient(90deg, rgba(0,7,3,.86), rgba(0,5,2,.46) 70%, transparent);
  border-left: 1px solid rgba(113,255,154,.34);
  backdrop-filter: blur(7px) saturate(.7);
}
.site-nav-head { display: grid; gap: 5px; }
.site-nav-brand {
  font-size: clamp(21px, 2.05vw, 31px);
  line-height: .95;
  letter-spacing: .075em;
  font-weight: 500;
  color: var(--ascii-green-hot);
}
.site-nav-sub,
.site-nav-foot,
#site-signal {
  font-size: 9px;
  letter-spacing: .18em;
  color: rgba(113,255,154,.52);
  text-transform: uppercase;
}
.site-nav-list { display: grid; gap: 0; }
.site-nav-link {
  appearance: none;
  position: relative;
  display: grid;
  grid-template-columns: 30px 1fr 18px;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-height: 33px;
  padding: 0 2px;
  border: 0;
  border-bottom: 1px solid rgba(113,255,154,.11);
  background: transparent;
  color: rgba(189,255,207,.69);
  font: inherit;
  font-size: 12px;
  letter-spacing: .105em;
  text-align: left;
  cursor: pointer;
  transition: color 100ms ease, padding-left 100ms ease, background 100ms ease, border-color 100ms ease;
}
.site-nav-index { font-size: 8px; color: rgba(113,255,154,.32); }
.site-nav-arrow { opacity: 0; text-align: right; transition: opacity 100ms ease, transform 100ms ease; }
.site-nav-link:hover,
.site-nav-link:focus-visible,
.site-nav-link.is-active {
  color: #e3ffea;
  padding-left: 7px;
  outline: none;
  border-color: rgba(113,255,154,.24);
  background: linear-gradient(90deg, rgba(71,255,123,.09), rgba(71,255,123,.015) 58%, transparent);
}
.site-nav-link:hover .site-nav-index,
.site-nav-link.is-active .site-nav-index { color: rgba(151,255,180,.72); }
.site-nav-link:hover .site-nav-arrow,
.site-nav-link:focus-visible .site-nav-arrow,
.site-nav-link.is-active .site-nav-arrow { opacity: 1; transform: translateX(2px); }
.site-nav-link.is-active::after {
  content: "";
  position: absolute;
  left: -19px;
  top: 8px;
  bottom: 8px;
  width: 1px;
  background: var(--ascii-green-hot);
  box-shadow: 0 0 8px rgba(113,255,154,.65);
}
.site-nav-foot { display: flex; gap: 14px; flex-wrap: wrap; line-height: 1.5; }
.site-nav-classic { color: inherit; text-decoration: none; border-bottom: 1px solid currentColor; }

.site-nav-list { display: grid; gap: 2px; }
.site-nav-link {
  appearance: none;
  display: grid;
  grid-template-columns: 28px 1fr 18px;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 31px;
  padding: 2px 0;
  border: 0;
  border-bottom: 1px solid rgba(99,255,141,.15);
  background: transparent;
  color: rgba(174,255,197,.78);
  font: inherit;
  font-size: 13px;
  letter-spacing: .09em;
  text-align: left;
  cursor: pointer;
  transition: color 90ms linear, padding-left 90ms linear, background 90ms linear;
}
.site-nav-index { font-size: 9px; color: rgba(99,255,141,.38); }
.site-nav-arrow { opacity: 0; text-align: right; }
.site-nav-link:hover,
.site-nav-link:focus-visible,
.site-nav-link.is-active {
  color: #d7ffe2;
  padding-left: 8px;
  outline: none;
  background: linear-gradient(90deg, rgba(61,255,111,.10), transparent 75%);
}
.site-nav-link:hover .site-nav-arrow,
.site-nav-link:focus-visible .site-nav-arrow,
.site-nav-link.is-active .site-nav-arrow { opacity: 1; }
.site-nav-link.is-active::before {
  content: "";
  position: absolute;
}
.site-nav-foot { display: flex; gap: 14px; flex-wrap: wrap; line-height: 1.5; }
.site-nav-classic { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

#site-signal {
  position: fixed;
  z-index: 299;
  top: 16px;
  right: 20px;
  display: flex;
  gap: 18px;
  pointer-events: none;
  color: rgba(155,255,183,.42);
}

/* App content is still the same functionality, but loses the RPG/game frame. */
body.ascii-site #panels {
  z-index: 240 !important;
  pointer-events: none;
}
body.ascii-site .panel {
  pointer-events: auto;
  border: 1px solid rgba(113,255,154,.24) !important;
  border-radius: 2px !important;
  background: rgba(0, 7, 3, .91) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.82),
    0 22px 90px rgba(0,0,0,.54),
    0 0 34px rgba(40,255,100,.035) !important;
  color: #d4ffdf !important;
  backdrop-filter: blur(10px) saturate(.65) !important;
}
body.ascii-site .panel-bar {
  min-height: 32px !important;
  background: rgba(2,14,6,.92) !important;
  border-bottom: 1px solid rgba(113,255,154,.18) !important;
  color: var(--ascii-green) !important;
  font-family: inherit !important;
  box-shadow: inset 0 1px 0 rgba(170,255,195,.025) !important;
}
body.ascii-site .panel-icon { display: none !important; }
body.ascii-site .win-title {
  font-family: inherit !important;
  letter-spacing: .11em !important;
  font-size: 11px !important;
  color: var(--ascii-green) !important;
}
body.ascii-site .pb {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--ascii-green) !important;
  box-shadow: none !important;
}
body.ascii-site .win-body,
body.ascii-site .win-body.sunk {
  background: rgba(0,5,1,.94) !important;
  color: #caffd7 !important;
  border: 0 !important;
  box-shadow: none !important;
}
body.ascii-site .win-status {
  background: #020b04 !important;
  color: rgba(99,255,141,.62) !important;
  border-top: 1px solid rgba(99,255,141,.18) !important;
}

/* Boot becomes a terse terminal handoff rather than a game splash. */
body.ascii-site #boot { background: #000 !important; color: var(--ascii-green) !important; }
body.ascii-site .splash-bg,
body.ascii-site .splash-sun,
body.ascii-site .splash-logo { display: none !important; }
body.ascii-site .splash-card {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ascii-green) !important;
  font-family: inherit !important;
}
body.ascii-site .splash-word { color: var(--ascii-green) !important; font-family: inherit !important; text-shadow: 0 0 10px rgba(80,255,120,.24) !important; }

@media (max-width: 759px) {
  #site-nav {
    left: 14px;
    right: 14px;
    top: auto;
    bottom: max(14px, env(safe-area-inset-bottom));
    width: auto;
    transform: none;
    gap: 10px;
    padding: 12px;
    background: rgba(0,7,2,.9);
    border: 1px solid rgba(99,255,141,.20);
    backdrop-filter: blur(10px);
  }
  .site-nav-brand { font-size: 18px; }
  .site-nav-sub, .site-nav-foot { display: none; }
  .site-nav-list { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0 10px; }
  .site-nav-link { min-height: 28px; font-size: 11px; grid-template-columns: 22px 1fr 10px; }
  #site-signal { top: 10px; right: 10px; font-size: 8px; }
  #site-signal span:first-child { display: none; }
  body.ascii-site .panel { inset: 10px !important; }
}


/* ======================================================================
   SITE PAGES — the old app machinery rendered as one ordinary website.
   This block intentionally overrides every glossy/game-era primitive.
   ====================================================================== */
body.ascii-site #panels {
  position: fixed !important;
  z-index: 240 !important;
  inset: 54px 38px 42px clamp(390px, 31vw, 470px) !important;
  pointer-events: none;
}
body.ascii-site .win.panel,
body.ascii-site .win.panel[data-slot="primary"],
body.ascii-site .win.panel[data-slot="side"] {
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  max-width: 980px;
  margin-left: auto;
  display: flex !important;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(113,255,154,.17) !important;
  border-radius: 2px !important;
  background:
    linear-gradient(145deg, rgba(3,13,6,.90), rgba(0,5,2,.84) 62%, rgba(0,0,0,.91)) !important;
  box-shadow: 0 24px 100px rgba(0,0,0,.48), inset 0 1px rgba(190,255,208,.025) !important;
  backdrop-filter: blur(10px) saturate(.55) !important;
  animation: sitePageIn 150ms ease-out !important;
  pointer-events: auto;
}
@keyframes sitePageIn {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: none; }
}
body.ascii-site .win.panel.is-focused { border-color: rgba(113,255,154,.24) !important; }

/* Header becomes a page mast, not window chrome. */
body.ascii-site .panel-bar {
  display: flex !important;
  flex: 0 0 auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 18px 22px 14px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(113,255,154,.12) !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.ascii-site .panel-icon,
body.ascii-site .panel-grow,
body.ascii-site .panel-bar .pb { display: none !important; }
body.ascii-site .win.panel .win-title {
  font-family: inherit !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: .19em !important;
  text-transform: uppercase;
  color: rgba(155,255,183,.72) !important;
}
body.ascii-site .win.panel .win-title::before {
  content: "// ";
  color: rgba(113,255,154,.34);
}
body.ascii-site .win.panel .win-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #d4ffdf !important;
  box-shadow: none !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(113,255,154,.28) transparent;
}
body.ascii-site .win.panel .win-status { display: none !important; }

/* Shared content primitives. */
body.ascii-site .pad { padding: 22px !important; }
body.ascii-site .screen,
body.ascii-site .win-body.sunk {
  background: transparent !important;
  color: #d4ffdf !important;
  box-shadow: none !important;
}
body.ascii-site .app-col { gap: 18px !important; }
body.ascii-site .sect {
  padding: 0 0 20px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(113,255,154,.10) !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.ascii-site .kicker,
body.ascii-site .field-label,
body.ascii-site fieldset.group legend {
  font-family: inherit !important;
  font-size: 9px !important;
  font-weight: 500 !important;
  letter-spacing: .17em !important;
  color: rgba(113,255,154,.54) !important;
  text-transform: uppercase;
}
body.ascii-site .app-h,
body.ascii-site h1,
body.ascii-site h2,
body.ascii-site h3 {
  font-family: inherit !important;
  color: #e2ffe9 !important;
  text-shadow: none !important;
}
body.ascii-site .hint,
body.ascii-site .dim {
  color: rgba(190,255,207,.52) !important;
}
body.ascii-site .holo {
  background: none !important;
  color: var(--ascii-green-hot) !important;
  -webkit-text-fill-color: currentColor !important;
}

/* Controls: simple terminal-web controls, no gel/chrome. */
body.ascii-site .btn,
body.ascii-site .tab,
body.ascii-site button:not(.g-cell):not(.site-nav-link):not(.gal-tile):not(.prod-artbtn):not(.postrow):not(.pj-row) {
  border-radius: 1px !important;
  border: 1px solid rgba(113,255,154,.22) !important;
  background: rgba(9,28,14,.38) !important;
  box-shadow: none !important;
  color: rgba(207,255,220,.78) !important;
  font-family: inherit !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase;
  transition: background 90ms ease, color 90ms ease, border-color 90ms ease !important;
}
body.ascii-site .btn::before { display: none !important; }
body.ascii-site .btn:hover:not(:disabled),
body.ascii-site .tab:hover,
body.ascii-site button:not(.g-cell):hover:not(:disabled) {
  filter: none !important;
  transform: none !important;
  color: #effff3 !important;
  border-color: rgba(113,255,154,.46) !important;
  background: rgba(39,120,61,.20) !important;
}
body.ascii-site .btn.primary,
body.ascii-site .btn.on,
body.ascii-site .tab.on,
body.ascii-site button[aria-pressed="true"] {
  color: #031006 !important;
  background: var(--ascii-green) !important;
  border-color: var(--ascii-green) !important;
}
body.ascii-site .btn:disabled,
body.ascii-site button:not(.g-cell):disabled { opacity: .38 !important; }
body.ascii-site .tabs {
  gap: 0 !important;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(113,255,154,.10);
}
body.ascii-site .tab {
  flex: 0 0 auto !important;
  padding: 7px 11px !important;
  border-right: 0 !important;
}
body.ascii-site .tab:last-child { border-right: 1px solid rgba(113,255,154,.22) !important; }
body.ascii-site .input,
body.ascii-site .inp,
body.ascii-site input,
body.ascii-site select,
body.ascii-site textarea {
  border-radius: 1px !important;
  border: 1px solid rgba(113,255,154,.22) !important;
  background: rgba(0,8,3,.72) !important;
  box-shadow: none !important;
  color: #d8ffe2 !important;
  font-family: inherit !important;
  accent-color: var(--ascii-green);
}
body.ascii-site .input:focus,
body.ascii-site .inp:focus,
body.ascii-site input:focus,
body.ascii-site select:focus,
body.ascii-site textarea:focus {
  outline: 1px solid rgba(113,255,154,.62) !important;
  outline-offset: 1px;
  box-shadow: none !important;
}
body.ascii-site fieldset.group {
  margin: 0 0 22px !important;
  padding: 16px 0 18px !important;
  border: 0 !important;
  border-top: 1px solid rgba(113,255,154,.14) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.ascii-site fieldset.group legend { padding: 0 10px 0 0 !important; }
body.ascii-site .badge,
body.ascii-site .rtag {
  border-radius: 1px !important;
  border: 1px solid rgba(113,255,154,.22) !important;
  background: rgba(0,9,3,.62) !important;
  box-shadow: none !important;
  color: rgba(157,255,184,.72) !important;
  font-family: inherit !important;
  font-size: 9px !important;
}
body.ascii-site .badge.live { color: #dffff0 !important; border-color: rgba(113,255,154,.52) !important; }
body.ascii-site .notice,
body.ascii-site .flashline {
  border-radius: 1px !important;
  border: 1px solid rgba(113,255,154,.16) !important;
  background: rgba(20,65,31,.10) !important;
  color: rgba(205,255,219,.68) !important;
}

/* INDEX */
body.ascii-site .home-index {
  min-height: 100%;
  box-sizing: border-box;
  padding: clamp(26px, 5vw, 64px);
  display: grid;
  align-content: center;
  gap: 26px;
  max-width: 860px;
}
.home-index-hero { max-width: 700px; }
.home-index-eyebrow {
  margin-bottom: 18px;
  font-size: 9px;
  letter-spacing: .20em;
  color: rgba(113,255,154,.48);
}
.home-index-hero h1 {
  margin: 0;
  font-size: clamp(36px, 6vw, 78px) !important;
  line-height: .9;
  letter-spacing: -.035em;
  font-weight: 500;
}
.home-index-lead {
  max-width: 620px;
  margin: 20px 0 0;
  font-size: clamp(13px, 1.25vw, 16px);
  line-height: 1.75;
  color: rgba(207,255,220,.68);
}
.home-index-meta {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  font-size: 9px;
  letter-spacing: .15em;
  color: rgba(113,255,154,.42);
}
.home-index-signal.is-live { color: var(--ascii-green-hot); }
.home-index-directory {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid rgba(113,255,154,.14);
  max-width: 820px;
}
body.ascii-site .home-index-entry {
  display: grid !important;
  grid-template-columns: 26px 1fr 14px !important;
  gap: 10px !important;
  align-items: start !important;
  padding: 15px 10px 15px 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(113,255,154,.11) !important;
  background: transparent !important;
  text-align: left !important;
}
.home-index-entry:nth-child(odd) { margin-right: 20px; }
.home-index-num { font-size: 8px; color: rgba(113,255,154,.32); }
.home-index-copy { display: grid; gap: 5px; }
.home-index-copy strong { font-size: 11px; font-weight: 500; color: #dcffe5; letter-spacing: .08em; }
.home-index-copy span { font-size: 10px; line-height: 1.45; color: rgba(190,255,207,.45); text-transform: none; letter-spacing: 0; }
.home-index-go { opacity: .3; color: var(--ascii-green); }
.home-index-entry:hover .home-index-go { opacity: 1; }
.home-index-note { font-size: 9px; color: rgba(113,255,154,.32); letter-spacing: .08em; }

/* TV */
body.ascii-site .tv-app { min-height: 100%; padding: 22px; gap: 18px; }
body.ascii-site .tvstage {
  border-radius: 1px !important;
  border: 1px solid rgba(113,255,154,.16) !important;
  background: #000 !important;
  box-shadow: none !important;
}
body.ascii-site .tvhud,
body.ascii-site .tvbar,
body.ascii-site .votepanel { background: rgba(0,8,3,.72) !important; border-color: rgba(113,255,154,.15) !important; }
body.ascii-site .bars { filter: grayscale(1) contrast(1.5) sepia(.8) hue-rotate(70deg) saturate(2); opacity: .34; }

/* AUDIO */
body.ascii-site .radio { min-height: 100%; padding: 22px; box-sizing: border-box; }
body.ascii-site .radio-now {
  border: 0 !important;
  border-bottom: 1px solid rgba(113,255,154,.13) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.ascii-site .radio-cover { border-radius: 1px !important; filter: none !important; }
body.ascii-site .radio-title { color: #e2ffe9 !important; font-family: inherit !important; }
body.ascii-site .radio-eq i { background: var(--ascii-green) !important; border-radius: 0 !important; }
body.ascii-site .radio-list { padding: 6px 0 !important; }
body.ascii-site .radio-list li { border-bottom: 1px solid rgba(113,255,154,.08); }
body.ascii-site .radio-list button { border: 0 !important; background: transparent !important; text-transform: none !important; }
body.ascii-site .radio-list li.on button { background: rgba(45,140,69,.13) !important; }

/* CHAT */
body.ascii-site .chat-app { display: block !important; min-height: 100%; background: transparent !important; }
body.ascii-site .chat-main { width: 100% !important; min-width: 0 !important; border: 0 !important; }
body.ascii-site .games-rail { display: flex !important; }
body.ascii-site .msgs { background: transparent !important; }
body.ascii-site .msg {
  border: 0 !important;
  border-bottom: 1px solid rgba(113,255,154,.075) !important;
  background: transparent !important;
}
body.ascii-site .msg.mention { background: rgba(58,170,84,.08) !important; }
body.ascii-site .av { border-radius: 1px !important; filter: grayscale(.85) sepia(.2) hue-rotate(70deg); }
body.ascii-site .uname { color: #dffff0 !important; font-family: inherit !important; }
body.ascii-site .chat-input { border-top: 1px solid rgba(113,255,154,.12) !important; background: rgba(0,7,2,.70) !important; }
body.ascii-site .guestbar,
body.ascii-site .chat-banner { background: rgba(17,60,28,.12) !important; border-color: rgba(113,255,154,.14) !important; }

/* STORE */
body.ascii-site .store { background: transparent !important; }
body.ascii-site .prods { gap: 12px !important; }
body.ascii-site .prod {
  border-radius: 1px !important;
  border: 1px solid rgba(113,255,154,.13) !important;
  background: rgba(0,9,3,.42) !important;
  box-shadow: none !important;
}
body.ascii-site .prod:hover { border-color: rgba(113,255,154,.30) !important; transform: none !important; }
body.ascii-site .prod-art,
body.ascii-site .prod-artbtn { border-radius: 0 !important; }
body.ascii-site .prod-art { filter: none !important; }
body.ascii-site .prod-sticker {
  border-radius: 1px !important;
  background: rgba(0,10,3,.78) !important;
  border: 1px solid rgba(113,255,154,.22) !important;
  color: #d8ffe2 !important;
  transform: none !important;
  box-shadow: none !important;
}
body.ascii-site .prod-title { color: #e2ffe9 !important; }
body.ascii-site .prod-desc { color: rgba(190,255,207,.53) !important; }

/* WIRE */
body.ascii-site .posts { background: transparent !important; }
body.ascii-site .postrow {
  border-radius: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(113,255,154,.10) !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.ascii-site button.postrow:hover { background: rgba(42,130,65,.08) !important; }
body.ascii-site .post-date strong { color: #dffff0 !important; font-family: inherit !important; font-weight: 400 !important; }
body.ascii-site .post-date span { color: rgba(113,255,154,.48) !important; font-family: inherit !important; }
body.ascii-site .post-main h3 { font-weight: 500 !important; }
body.ascii-site .post-body p { color: rgba(207,255,220,.62) !important; }
body.ascii-site .post-thumb { border-radius: 1px !important; filter: grayscale(.65) contrast(1.05); }

/* GALLERY */
body.ascii-site .gal-grid { gap: 9px !important; }
body.ascii-site .gal-tile {
  border-radius: 1px !important;
  border: 1px solid rgba(113,255,154,.12) !important;
  background: rgba(0,7,2,.5) !important;
  box-shadow: none !important;
  color: #d8ffe2 !important;
}
body.ascii-site .gal-tile:hover { transform: none !important; border-color: rgba(113,255,154,.36) !important; }
body.ascii-site .gal-art { filter: none !important; }
body.ascii-site .gal-title { color: #ddffe6 !important; font-family: inherit !important; }
body.ascii-site .gal-when { color: rgba(113,255,154,.38) !important; }

/* PROJECTS */
body.ascii-site .pj { background: transparent !important; }
body.ascii-site .pj-list { padding: 12px 22px !important; }
body.ascii-site .pj-list li { border-bottom: 1px solid rgba(113,255,154,.10); }
body.ascii-site .pj-row {
  border: 0 !important;
  background: transparent !important;
  color: rgba(210,255,222,.72) !important;
  font-family: inherit !important;
  text-transform: none !important;
}
body.ascii-site .pj-list li.hot .pj-row { background: rgba(45,140,69,.08) !important; }
body.ascii-site .pj-num,
body.ascii-site .pj-meta { color: rgba(113,255,154,.42) !important; font-family: inherit !important; }
body.ascii-site .pj-title { color: #e3ffea !important; font-family: inherit !important; font-weight: 500 !important; }
body.ascii-site .pj-vid { filter: none !important; opacity: .72; }
body.ascii-site .pj-foot { color: rgba(113,255,154,.36) !important; }

/* ABOUT */
body.ascii-site .story-app { max-width: 760px !important; padding: clamp(28px,5vw,64px) !important; }
body.ascii-site .story-kicker { margin-bottom: 18px; font-size: 9px; letter-spacing: .2em; color: rgba(113,255,154,.46); }
body.ascii-site .story-h { margin: 0 !important; font-size: clamp(38px,6vw,72px) !important; line-height: .95; font-weight: 500 !important; letter-spacing: -.035em !important; }
body.ascii-site .story-lead { margin: 22px 0 !important; max-width: 650px; color: rgba(216,255,226,.75) !important; line-height: 1.7; }
body.ascii-site .story-body { max-width: 680px; }
body.ascii-site .story-body p { font-size: 13px !important; line-height: 1.85 !important; color: rgba(198,255,214,.58) !important; }
body.ascii-site .story-links { display: flex; gap: 8px; margin-top: 28px; }
body.ascii-site .story-door { padding: 9px 12px !important; }

/* SETTINGS */
body.ascii-site .settings-page { max-width: 760px; }
body.ascii-site .about-logo { max-width: 90px; filter: grayscale(1) brightness(1.8) sepia(.3) hue-rotate(70deg); opacity: .7; }
body.ascii-site .about-word { font-family: inherit !important; color: #dffff0 !important; letter-spacing: .08em; }

@media (max-width: 980px) {
  body.ascii-site #panels { inset-left: 330px !important; left: 330px !important; }
}
@media (max-width: 759px) {
  body.ascii-site #panels {
    inset: 42px 10px 198px 10px !important;
  }
  body.ascii-site .win.panel,
  body.ascii-site .win.panel[data-slot="primary"],
  body.ascii-site .win.panel[data-slot="side"] {
    inset: 0 !important;
    max-width: none;
  }
  body.ascii-site .panel-bar { padding: 12px 14px 10px !important; }
  body.ascii-site .pad { padding: 14px !important; }
  body.ascii-site .home-index { padding: 20px 16px; gap: 18px; align-content: start; }
  .home-index-directory { grid-template-columns: 1fr; }
  .home-index-entry:nth-child(odd) { margin-right: 0; }
  body.ascii-site .home-index-hero h1 { font-size: 34px !important; }
  body.ascii-site .story-app { padding: 22px 16px !important; }
  body.ascii-site .story-h { font-size: 38px !important; }
}

/* Restored game and account surfaces share the ASCII palette. */
#site-nav { max-height: calc(100dvh - 40px); overflow-y: auto; box-sizing: border-box; gap: 12px; }
.site-nav-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.site-menu-toggle { display: none; }
.site-session { display: grid; gap: 6px; }
body.ascii-site .site-session button { min-height: 30px; text-align: left; padding: 7px 9px; font-size: 10px !important; }
.site-session [hidden] { display: none !important; }
body.ascii-site .games-directory { padding: clamp(18px, 3vw, 32px); display: grid; gap: 18px; }
.games-directory h1 { margin: 0; letter-spacing: .08em; }
.games-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr)); gap: 12px; }
.games-card { min-width: 0; padding: 16px; border: 1px solid var(--ascii-line); background: rgba(8,30,15,.5); }
.games-card h3 { margin: 0 0 12px; font-size: 14px; letter-spacing: .08em; }
.games-card .btn { width: 100%; white-space: normal; }
body.ascii-site .chat-app { display: flex !important; flex-direction: column; min-height: 100%; }
body.ascii-site .chat-main { flex: 0 0 auto; min-height: 280px; height: 38vh; }
body.ascii-site .games-rail { flex: 1 0 auto; width: auto; min-width: 0; max-width: none; padding: 14px; border: 0; border-top: 1px solid var(--ascii-line); background: rgba(0,10,3,.6); }
body.ascii-site .rail-head, body.ascii-site .rail-feed-head { font-family: inherit; color: var(--ascii-green); }
body.ascii-site .rail-tabs { display: flex; flex-wrap: wrap; gap: 5px; }
body.ascii-site .rail-tab { flex: 1 0 auto; padding: 8px; }
body.ascii-site .rail-board { min-height: 190px; background: #020b04; border: 1px solid var(--ascii-line); }
body.ascii-site .rail-cta { flex-wrap: wrap; }
body.ascii-site .match-app { min-height: 100%; color: #d4ffdf; }
body.ascii-site .match-board { min-width: 0; }
body.ascii-site .home-screen { background: transparent; color: #d4ffdf; height: auto; min-height: 100%; padding: 16px; }
body.ascii-site .home-pane-box { border-color: var(--ascii-line); background: rgba(0,10,3,.7); box-shadow: none; }
body.ascii-site .home-game-btn { color: var(--ascii-green); }
body.ascii-site .home-screen-grid { min-height: 540px; }
body.ascii-site .panel-bar .pb-close { display: inline-flex !important; margin-left: auto; align-items: center; justify-content: center; min-width: 32px; min-height: 32px; }
body.ascii-site button:focus-visible, body.ascii-site a:focus-visible { outline: 1px solid var(--ascii-green-hot) !important; outline-offset: 3px; }
@media (max-width: 759px) {
  #site-nav { bottom: max(10px, env(safe-area-inset-bottom)); max-height: min(65dvh, 550px); padding: 10px 12px; }
  .site-menu-toggle { display: block; padding: 8px; font-size: 10px !important; }
  #site-nav.is-collapsed .site-nav-list, #site-nav.is-collapsed .site-session { display: none; }
  .site-nav-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-nav-link { min-height: 36px; }
  body.ascii-site #panels { inset: 12px 10px calc(78px + env(safe-area-inset-bottom)) 10px !important; }
  body.ascii-site .games-directory { padding: 16px; }
  body.ascii-site .chat-main { height: 32vh; min-height: 230px; }
  body.ascii-site .home-screen { padding: 10px; }
  body.ascii-site .home-screen-grid { min-height: 700px; }
}

body.ascii-site #scene-stage { background: #010302 !important; }
body.ascii-site .g-chess { width: min(100%, 320px); }
body.ascii-site .g-chess .g-grid { width: 100%; }
body.ascii-site .g-chess .g-cell { opacity: 1; font-size: clamp(20px, 4vw, 30px); color: #e0ffe8; }
body.ascii-site .g-cell.light { background: #244b31; }
body.ascii-site .g-cell.dark { background: #0a2012; }
body.ascii-site .match-wrap { width: 100%; padding: 18px; box-sizing: border-box; }
body.ascii-site .games-rail { max-height: none; overflow: visible; }
body.ascii-site .rail-board { flex-shrink: 0; }
body.ascii-site .guestbar { flex-wrap: wrap; }
body.ascii-site .guestbar .grow { flex-basis: 100%; }
body.ascii-site .guestbar button { flex: 1; white-space: normal; }

/* Distinct Matrix line icons for every menu destination. */
.site-nav-icon{display:inline-flex;width:19px;height:19px;color:#84c896;align-items:center;justify-content:center}.site-nav-icon svg{display:block;width:18px;height:18px}.site-nav-link:is(:hover,:focus-visible,.is-active) .site-nav-icon{color:#caffd7}