/* ============================================================
   CLUB 49. EXPEDITION STANDARD skin (drop-in override)
   Load AFTER styles.css:
     <link rel="stylesheet" href="/c49-expedition.css?v=1">
   Zero markup or JS changes. Same selector contracts as styles.css;
   this sheet only re-themes. Light mode = Expedition Day (cream +
   gold). Dark toggle (body.c49dark) = the full Night Camp look.
   ============================================================ */
/* Archivo, self-hosted (one 35KB variable file, weights 100-900). The drop-in pulled this from
   Google Fonts, which hands every member's IP to Google on each visit - the club promise says we
   collect nothing, so the font ships from our own domain instead. Same face, zero third parties,
   and it keeps working offline. */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/fonts/archivo-var.woff2') format('woff2');
}

:root {
  /* Rarity inks. The bright set is for a dark card; on light paper gold reads 1.37
     against 4.5 needed, so each has a darker twin and the inline style stays put. */
  --x-rar-common:#4d6570; --x-rar-uncommon:#12657f; --x-rar-rare:#186b41;
  --x-rar-epic:#6a3aa0; --x-rar-legendary:#7a5600; --x-rar-mythic:#a8371a;

  --x-gold:#a67c1b; --x-gold-hi:#c49a2c; --x-gold-soft:rgba(166,124,27,.12);
  --x-paper:#eef3f6; --x-paper-2:#e2ebf0; --x-card:#f9fbfc;
  --x-ink:#15262f; --x-sub:#4e646f; --x-faint:#7b929d;
  --x-line:rgba(24,58,74,.24); --x-line-soft:rgba(24,58,74,.13);
  --x-green:#2f6b50; --x-green-hi:#27714a; --x-red:#b3402c; --x-blue:#2a6d8f;
  /* semantic text colours. Light values are exactly what the inline styles used to
     hardcode, so light mode is unchanged; the dark siblings keep the hue but clear
     4.5:1 on the near-black surfaces. */
  --x-err:#c62828; --x-warn:#9c5a00; --x-ok:#2e7d32; --x-info:#1565c0;
  --x-hdr-1:#122a36; --x-hdr-2:#0e222c; --x-hdr-ink:#eaf2f6; --x-hdr-sub:#9db4c0;
  --c49-gold:var(--x-gold); --c49-gold-hi:#d4af37; --c49-ink:#0e222c; --c49-brown:#24414e;
  --c49-shadow-1:0 1px 3px rgba(8,24,32,.20);
  --c49-shadow-2:0 6px 18px rgba(8,24,32,.24);
  --c49-shadow-3:0 18px 50px rgba(4,16,24,.45);
}
/* Dark is the default skin (2026-07-31). Pushed from the old warm browns toward near-black so the map
   is the brightest thing on screen and the gold actually reads as gold, the previous #0b1920 paper was
   close enough in value to the satellite imagery that everything sat in the same muddy midtone. */
body.c49dark {
  --x-rar-common:#9fb3bb; --x-rar-uncommon:#6bc1e0; --x-rar-rare:#7fd0a2;
  --x-rar-epic:#c9a7f5; --x-rar-legendary:#ffca28; --x-rar-mythic:#e2603f;

  --x-gold:#f5c542; --x-gold-hi:#ffd968; --x-gold-soft:rgba(245,197,66,.14);
  --x-paper:#0b1920; --x-paper-2:#071219; --x-card:#11242d;
  --x-ink:#eaf1f5; --x-sub:#9cb0bb; --x-faint:#75909c;
  --x-line:rgba(245,197,66,.22); --x-line-soft:rgba(160,200,220,.11);
  --x-green:#2f8f5b; --x-green-hi:#5fd699; --x-red:#e0603f; --x-blue:#6bc1e0;
  --x-err:#ff8a80; --x-warn:#ffb74d; --x-ok:#7bd88f; --x-info:#7fc7ea;
  --x-hdr-1:#102530; --x-hdr-2:#0a1922;
}

/* ---------- base type: Archivo everywhere, caps labels ---------- */
html, body { font-family:Archivo, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
body { background:var(--x-paper-2); }
::selection { background:var(--x-gold-hi); color:#1a1206; }
:focus-visible { outline-color:var(--x-gold); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible, [onclick]:focus-visible { outline-color:var(--x-gold) !important; }

/* retire the letterpress serif: one modern voice */
#hdr h1, .box h2, .box h3, #aboutView h2, #legendsModal h3, #expModal h3, #chalModal h3,
.lgCard h4, .expCard h4, .chalCard h4,
#btnPanel, #btnTable, #btnAbout, .nrBtn span, .c49FlatRow {
  font-family:Archivo, system-ui, sans-serif; font-variant:normal;
}

/* ---------- header: expedition bar (dark in both modes) ---------- */
#hdr {
  background:linear-gradient(180deg, var(--x-hdr-1), var(--x-hdr-2));
  border-bottom:1px solid rgba(212,175,55,.55);
  box-shadow:0 2px 14px rgba(5,8,9,.35);
}
body.c49dark #hdr { background:linear-gradient(180deg, var(--x-hdr-1), var(--x-hdr-2)); border-bottom-color:rgba(212,175,55,.45); }
#hdr h1 { font-weight:900; letter-spacing:2.6px; color:var(--x-hdr-ink); }
#hdr h1 .wm { color:var(--x-hdr-ink); }
#hdr h1 .sub { font-weight:700; letter-spacing:3px; font-size:10.5px; color:var(--x-hdr-sub); }
#brandLogo, #brandEmblem { border:2px solid rgba(212,175,55,.65); box-shadow:0 0 0 2px rgba(212,175,55,.18), 0 1px 6px rgba(0,0,0,.5); }
#betaChip { border-color:rgba(212,175,55,.6); color:#a0bbca; background:rgba(212,175,55,.1); border-radius:999px; padding:2px 8px; }
#regionSel {
  background:rgba(212,175,55,.12); color:#a0bbca; border:1px solid rgba(212,175,55,.5);
  border-radius:999px; padding:6px 10px; font-weight:800; letter-spacing:.5px;
}
#regionSel:hover { background:rgba(212,175,55,.2); }
#regionSel option { background:#14181a; color:#eaf2f6; }
#btnPanel, #btnTable, #btnAbout, #installBtn {
  background:rgba(255,255,255,.07); color:#dfe9ef; border:1px solid rgba(255,255,255,.14);
  border-radius:9px; font-weight:800; letter-spacing:1.4px; font-size:11px; text-transform:uppercase;
}
#btnPanel:hover, #btnTable:hover, #btnAbout:hover, #installBtn:hover { background:rgba(212,175,55,.16); color:#a0bbca; border-color:rgba(212,175,55,.45); }
#authBtn {
  background:linear-gradient(180deg,#e6c15c,#c49a2c); color:#1a1206; border:none;
  border-radius:9px; font-weight:900; letter-spacing:.4px;
  box-shadow:0 3px 10px rgba(212,175,55,.28), inset 0 1px 0 rgba(255,255,255,.35);
}
#authBtn:hover { background:linear-gradient(180deg,#a0bbca,#d4af37); }
#adminBtn { background:linear-gradient(180deg,#406174,#6d5115) !important; border-radius:9px; }
#hdr button.on { box-shadow:inset 0 -3px 0 #a0bbca, var(--c49-shadow-1); }

/* ---------- layers panel: the field kit ---------- */
#panel { background:var(--x-paper); box-shadow:6px 0 26px rgba(20,14,4,.22); }
body.c49dark #panel { background:var(--x-paper); }
#controls { border-bottom-color:var(--x-line-soft); }
#controls details { border-top-color:var(--x-line-soft); }
#controls summary { color:var(--x-ink); font-weight:800; letter-spacing:.3px; border-radius:9px; }
#controls summary:hover { color:var(--x-gold); background:var(--x-gold-soft); }
body.c49dark #controls summary { color:var(--x-ink); }
body.c49dark #controls summary:hover { color:var(--x-gold-hi); }
#controls summary .cnt { color:var(--x-faint); font-family:ui-monospace,Menlo,monospace; font-size:10.5px; }
.ckRow { color:var(--x-ink); }
body.c49dark .ckRow { color:var(--x-ink); }
.subWrap label { color:var(--x-sub); }
body.c49dark .subWrap label { color:var(--x-sub); }
.hint, .pn { color:var(--x-sub); }
body.c49dark .hint { color:var(--x-sub); }
/* switches: gold, knob-in-track */
.ckRow input[type=checkbox] { width:34px; height:20px; border-radius:10px; background:rgba(47,71,85,.3); border:none; }
.ckRow input[type=checkbox]::after { top:3px; left:3px; width:14px; height:14px; }
.ckRow input[type=checkbox]:checked { background:linear-gradient(180deg,#d4af37,#b8902f); }
.ckRow input[type=checkbox]:checked::after { left:17px; background:#111a1f; }
body.c49dark .ckRow input[type=checkbox] { background:rgba(255,255,255,.16); }
body.c49dark .ckRow input[type=checkbox]:checked { background:linear-gradient(180deg,#d4af37,#b8902f); }
body.c49dark .ckRow input[type=checkbox]:checked::after { background:#111a1f; }
.ckRow input[type=checkbox]:focus-visible { box-shadow:0 0 0 3px var(--x-gold-soft); }
/* presets as chips */
.presetGrp { color:var(--x-faint); letter-spacing:1.6px; font-size:10px; }
.preset { background:var(--x-gold-soft); color:var(--x-ink); border:1px solid var(--x-line); border-radius:999px; font-weight:800; }
.preset:hover { background:rgba(212,175,55,.28); color:var(--x-ink); }
body.c49dark .preset { color:var(--x-ink); }
#adjustBar { background:var(--x-card); border:1px solid var(--x-line-soft); border-radius:10px; }
body.c49dark .hint[style*="f3efe6"], body.c49dark #adjustBar { background:var(--x-card) !important; }
#adjustBar summary, .pgLabel { color:var(--x-sub); }
.sv { color:var(--x-gold); }
#begBtn { border-radius:10px; border-width:1px; font-weight:800; letter-spacing:.4px; }
.begTip { border-radius:10px; }
#listWrap { background:var(--x-paper-2); border-top:1px solid var(--x-line); }
body.c49dark #listWrap { background:var(--x-paper-2); border-top-color:var(--x-line); }
#listWrap > summary { color:var(--x-ink); letter-spacing:.4px; }
body.c49dark #listWrap > summary { color:var(--x-gold-hi); }
#listWrap > summary:hover { background:var(--x-gold-soft); }
.hh { border-bottom-color:var(--x-line-soft); }
.hh:hover { background:var(--x-gold-soft); }
body.c49dark .hh { border-bottom-color:var(--x-line-soft); }
body.c49dark .hh:hover { background:var(--x-gold-soft); }
.hh b { color:var(--x-ink); }
.hh .sub { color:var(--x-sub); }
.scoreChip, .credPill { background:linear-gradient(180deg,#d4af37,#a8801f); color:var(--x-ink); font-family:ui-monospace,Menlo,monospace; font-weight:800; border-radius:999px; }
#hhJumpWrap { background:var(--x-paper-2); border-top-color:var(--x-line); }
body.c49dark #hhJumpWrap { background:var(--x-paper-2); }
#hhJumpWrap label { color:var(--x-ink); letter-spacing:.4px; }
body.c49dark #hhJumpWrap label { color:var(--x-gold-hi); }
#hhJump, #presetSelect { border:1.5px solid var(--x-line); border-radius:10px; background:var(--x-card); color:var(--x-ink); }
.lockTag { color:var(--x-gold); }
#panelClose { background:var(--x-hdr-1); color:#dfe9ef; }

/* ---------- inputs ---------- */
.c49in, #homeAddr, #refLink, #tFilters input, #tFilters select {
  background:var(--x-card); color:var(--x-ink); border:1.5px solid var(--x-line); border-radius:10px;
}
.c49in:focus, #hhJump:focus, #presetSelect:focus { border-color:var(--x-gold); box-shadow:0 0 0 3px var(--x-gold-soft); }
body.c49dark .c49in, body.c49dark #hhJump, body.c49dark #homeAddr, body.c49dark #refLink,
body.c49dark #tFilters input, body.c49dark #tFilters select { background:var(--x-card); color:var(--x-ink); border-color:var(--x-line); }

/* ---------- buttons ---------- */
.abtn, .popBtn, .xbtn { border-radius:10px; font-weight:800; letter-spacing:.3px; }
.abtn { background:linear-gradient(180deg,#42515a,#364148); }
.abtn.app { background:linear-gradient(180deg,#3a7d5c,#2c6147); }
.abtn.rej { background:linear-gradient(180deg,#b3402c,#8f2f1e); }
.popBtn { background:#3a4a5c; }
.tjoin, #trialBar .tjoin { background:linear-gradient(180deg,#e6c15c,#c49a2c) !important; color:#1a1206 !important; border-radius:9px; }
.sh-cp { background:linear-gradient(180deg,#d4af37,#a8801f); color:var(--x-ink); }
.shareGrid a, .shareGrid button { border-radius:10px; }
.chipBtn { border-radius:999px; border-color:var(--x-line); background:var(--x-card); color:var(--x-sub); }
.chipBtn.on { background:var(--x-ink); color:var(--x-paper); border-color:var(--x-ink); }
body.c49dark .chipBtn { background:var(--x-card); color:var(--x-sub); border-color:var(--x-line); }
body.c49dark .chipBtn.on { background:var(--x-gold); color:var(--x-ink); border-color:var(--x-gold); }

/* ---------- map chrome ---------- */
#trialBar { background:linear-gradient(180deg,var(--x-hdr-1),var(--x-hdr-2)); border-bottom:1px solid rgba(212,175,55,.5); color:#d6e2e9; }
#viewChip { background:rgba(11,16,19,.93); border:1px solid rgba(212,175,55,.5); color:#d2dfe6; }
#mapLoading { background:rgba(11,16,19,.94); border-color:rgba(212,175,55,.55); color:#d2dfe6; border-radius:999px; }
.coordBox { background:rgba(11,16,19,.88); color:#dfe9ef; border:1px solid rgba(212,175,55,.3); border-radius:9px; }
.coordBox:hover { background:rgba(16,24,28,.94); }
.c49MapBtn { background:rgba(11,16,19,.88); color:#dfe9ef; border:1px solid rgba(212,175,55,.35); border-radius:9px; font-weight:800; letter-spacing:1px; font-size:11px; text-transform:uppercase; }
.c49MapBtn:hover { background:rgba(212,175,55,.2); color:#a0bbca; }
.c49MapBtn.on { background:linear-gradient(180deg,#e6c15c,#c49a2c); color:#1a1206; border-color:#a0bbca; }
/* When a marker popup is open, fade the on-map overlay buttons out of its way so the popup reads on a
   clean map. This is the only reliable fix: a Leaflet popup lives inside the transform-based
   .leaflet-map-pane (its own stacking context) and can never be z-indexed above these controls, and on a
   phone the popup is too wide to auto-pan into the gap between the left controls and the right dock. */
#dockClub, #aiFab, #dockTools, #dockRadio, .leaflet-top { transition:opacity .16s ease; }
body.c49popup #dockClub, body.c49popup #aiFab, body.c49popup #dockTools, body.c49popup #dockRadio,
body.c49popup .leaflet-top { opacity:0; pointer-events:none; }   /* .leaflet-top = the Labels/Clear/Legend/zoom + layers controls; the bottom stays so map attribution remains visible */
.legend details { background:rgba(11,16,19,.9); color:#dfe9ef; border:1px solid rgba(212,175,55,.35); border-radius:10px; font-weight:800; letter-spacing:.6px; }
.legend details[open] { background:var(--x-card); color:var(--x-ink); border-color:var(--x-line); }
.legend details[open] > summary { background:var(--x-hdr-1); color:#d2dfe6; border-radius:10px 10px 0 0; }
body.c49dark .legend details { background:var(--x-card); border-color:var(--x-line); }
body.c49dark .legend details[open] > summary { background:var(--x-hdr-2); }
.legend .lgItem:hover { background:var(--x-gold-soft); }
.locBtn { border-radius:12px; background:linear-gradient(180deg,#e6c15c,#c49a2c); color:#1a1206; box-shadow:0 6px 18px rgba(0,0,0,.35); }
body.c49dark .locBtn { background:linear-gradient(180deg,#e6c15c,#c49a2c); color:#1a1206; }
.leaflet-popup-content-wrapper { border-radius:14px; border:1px solid rgba(166,124,27,.4); background:var(--x-card); color:var(--x-ink); }
.leaflet-popup-tip { background:var(--x-card); }
.leaflet-bar a { color:var(--x-ink); }
.leaflet-control-scale-line { border-color:var(--x-ink); color:var(--x-ink); background:rgba(241,245,247,.92); border-radius:0 0 6px 6px; }
.pop td:first-child { color:var(--x-faint); font-weight:600; }
.pop a { color:var(--x-blue); }

/* docks (beat the inline styles) */
#dockClub { background:linear-gradient(180deg,#3a7d5c,#2c6147) !important; border:1px solid rgba(255,255,255,.5) !important; border-radius:12px !important; }
#aiFab { background:linear-gradient(180deg,#6a4fa3,#54397e) !important; border:1px solid rgba(255,255,255,.5) !important; border-radius:12px !important; }
#dockTools { background:linear-gradient(180deg,#364148,#283137) !important; border:1px solid rgba(255,255,255,.5) !important; border-radius:12px !important; }
#dockRadio { background:linear-gradient(180deg,#b3541e,#8f3f12) !important; border:1px solid rgba(255,255,255,.5) !important; border-radius:12px !important; }
#imgLabBtn { border-radius:12px; }
.dsBox { background:var(--x-card); border:1px solid var(--x-line); border-radius:14px; }
body.c49dark .dsBox { background:var(--x-card); border-color:var(--x-line); }
.dsRow { color:var(--x-ink); border-radius:10px; font-weight:700; }
body.c49dark .dsRow { color:var(--x-ink); }
.dsRow:hover { background:var(--x-gold-soft); }
.dsIco { border-radius:9px; }

/* nav rail (desktop) */
#navRail { background:linear-gradient(180deg,var(--x-hdr-1),var(--x-hdr-2)); border-right:1px solid rgba(212,175,55,.35); }
.nrBtn { color:#9db4c0; font-weight:800; letter-spacing:1.2px; font-size:9px; text-transform:uppercase; }
.nrBtn span { font-weight:800; letter-spacing:1.4px; font-size:9px; }
.nrBtn:hover { color:#a0bbca; background:rgba(212,175,55,.1); }
.nrBtn.on { color:#a0bbca; border-left-color:#d4af37; background:rgba(212,175,55,.16); }

/* ---------- modals: one card language ---------- */
#authModal .box, #adminModal .box, #shareModal .box, #commModal .box, #hubModal .box,
#analysisModal .box, #dmModal .box, #shareSpotModal .box, #annModal .box, #workModal .box,
#journalModal .box, #notifModal .box, #profileModal .box, #aiModal .box, #briefModal .box,
#planModal .box, #provenModal .box, #riversModal .box, #dlcModal .box, #expModal .box,
#whatsNewModal .box, #chalModal .box, #legendsModal .box, #promiseModal .box, #consentModal .box,
#rockModal .box, #marketModal .box, #speciesModal .box, #forageModal .box, #gemGuideModal .box,
#radioModal .box, #flightModal .box, #kitModal .box, #queryModal .box, #creatorModal .box,
#reviewModal .box, #todayModal .box, #profEditModal .box, #friendsModal .box,
#flatModal .fmBox {
  background:var(--x-card); border:1px solid var(--x-line); border-radius:18px;
  box-shadow:0 24px 70px rgba(12,8,2,.5);
}
body.c49dark #authModal .box, body.c49dark #adminModal .box, body.c49dark #shareModal .box,
body.c49dark #commModal .box, body.c49dark #hubModal .box, body.c49dark #analysisModal .box,
body.c49dark #dmModal .box, body.c49dark #legendsModal .box, body.c49dark #rockModal .box,
body.c49dark #marketModal .box, body.c49dark #speciesModal .box, body.c49dark #forageModal .box,
body.c49dark #gemGuideModal .box, body.c49dark #radioModal .box, body.c49dark #flightModal .box,
body.c49dark #kitModal .box, body.c49dark #queryModal .box, body.c49dark #creatorModal .box,
body.c49dark #dlcModal .box, body.c49dark #expModal .box, body.c49dark #whatsNewModal .box,
body.c49dark #chalModal .box, body.c49dark #planModal .box, body.c49dark #provenModal .box,
body.c49dark #riversModal .box, body.c49dark #promiseModal .box, body.c49dark #consentModal .box,
body.c49dark #briefModal .box, body.c49dark #aiModal .box, body.c49dark #profileModal .box,
body.c49dark #notifModal .box, body.c49dark #workModal .box, body.c49dark #journalModal .box,
body.c49dark #annModal .box, body.c49dark #shareSpotModal .box, body.c49dark #reviewModal .box,
body.c49dark #todayModal .box, body.c49dark #profEditModal .box,
body.c49dark #friendsModal .box, body.c49dark #flatModal .fmBox {
  background:var(--x-card); border-color:var(--x-line); color:var(--x-ink);
}
#authModal h3, #adminModal h3 { color:var(--x-ink); font-weight:900; letter-spacing:.3px; }
body.c49dark #authModal h3, body.c49dark #adminModal h3 { color:var(--x-gold-hi); }
#authModal p { color:var(--x-sub); }
#authModal .cx, #adminModal .cx { color:var(--x-faint); }
.arow { border-bottom-color:var(--x-line-soft); }
/* Your own leaderboard row is tinted gold, and that tint composites over the modal leaving every
   muted colour inside it at 4.18 against a 4.5 minimum: the XP beside your own name was the
   hardest thing on the screen to read. Keep the highlight, give the row ink that survives it. */
.arow.mine span:not(.credPill):not(.scoreChip), .arow.mine b { color:var(--x-ink) !important; }
/* The credit chip is gold in BOTH themes, so it carries dark ink in both. A surface with a fixed
   background needs text coloured for the surface, not for the theme. */
.credPill, .scoreChip, body.c49dark .credPill, body.c49dark .scoreChip,
body .arow .credPill, body .arow .scoreChip,
body.c49dark .arow.mine .credPill, body.c49dark .arow.mine .scoreChip,
body .arow.mine .credPill, body .arow.mine .scoreChip { color:#15262f !important; }
/* journal keeps its leather, retinted */
#journalModal .box {
  border:12px solid transparent; border-radius:16px;
  background:linear-gradient(180deg,var(--x-card),var(--x-paper)) padding-box,
             linear-gradient(160deg,#2b4657,#1d3a49 60%,#12242d) border-box;
  outline:2px dashed rgba(212,175,55,.4); outline-offset:-8px;
}
body.c49dark #journalModal .box { background:linear-gradient(180deg,#13191c,#0b1920) padding-box, linear-gradient(160deg,#2b4657,#1d3a49 60%,#12242d) border-box; }
.wtab { color:var(--x-sub); }
.wtab.on { color:var(--x-ink); border-bottom-color:var(--x-gold); }
/* The journal keeps its dark leather in BOTH themes, but .wtab takes theme colours, so in light mode
   its tabs were dark text on dark leather: "Log a find" measured 1.00, meaning exactly the same
   colour as its background. A surface with a fixed background needs text coloured for the SURFACE,
   not for the theme. */
#journalModal .wtab { color:#efe6d4; font-weight:500; }
#journalModal .wtab.on { color:#f5e6c8; border-bottom-color:var(--x-gold-hi); }
body.c49dark .wtab.on { color:var(--x-gold-hi); border-bottom-color:var(--x-gold); }
.workTabs { border-bottom-color:var(--x-line-soft); }
.dlcTab { color:var(--x-sub); }
.dlcTab.on { color:var(--x-gold); border-bottom-color:var(--x-gold); }
.gigCard, .post, .spCard, .lgCard, .expCard, .chalCard, .dlcCard {
  border:1px solid var(--x-line-soft); border-radius:13px; background:var(--x-paper);
}
body.c49dark .gigCard, body.c49dark .post, body.c49dark .spCard, body.c49dark .lgCard,
body.c49dark .expCard, body.c49dark .chalCard, body.c49dark .dlcCard { background:var(--x-paper); border-color:var(--x-line-soft); }
.post img { border-radius:10px; }
.spCard h4, .lgCard h4, .chalCard h4, .expCard h4, .dlcCard h4 { color:var(--x-ink); font-weight:800; }
body.c49dark .spCard h4, body.c49dark .lgCard h4, body.c49dark .chalCard h4,
body.c49dark .expCard h4, body.c49dark .dlcCard h4 { color:var(--x-gold-hi); }
.spFam { background:var(--x-card); color:var(--x-gold); border-bottom-color:var(--x-line-soft); letter-spacing:1px; text-transform:uppercase; font-size:11px; }
body.c49dark .spFam { background:var(--x-card); color:var(--x-gold-hi); }
.spTab { border-radius:999px; border-color:var(--x-line); background:var(--x-card); color:var(--x-sub); }
.spTab.on { background:var(--x-ink); color:var(--x-paper); border-color:var(--x-ink); }
body.c49dark .spTab.on { background:var(--x-gold); color:var(--x-ink); border-color:var(--x-gold); }
.chalProg, .expProg { background:rgba(47,71,85,.18); border-radius:4px; }
body.c49dark .chalProg, body.c49dark .expProg { background:rgba(255,255,255,.1); }
.chalProg > i, .expProg > i { background:linear-gradient(90deg,#8a651a,#d4af37); }
.chalBadge { background:var(--x-green); border-radius:999px; }
.expSeal { border-radius:999px; letter-spacing:1px; }
.rallyFlag { background:linear-gradient(135deg,#6d4a1c,#8a651a 55%,#b8902f); border-color:rgba(160,187,202,.6); border-radius:13px; }
.gtruth { border-radius:9px; }
.repBadge { border-radius:999px; background:var(--x-gold-soft); color:var(--x-gold); border-color:var(--x-line); }
body.c49dark .repBadge { background:var(--x-gold-soft); color:var(--x-gold-hi); border-color:var(--x-line); }
.gigKind { border-radius:999px; letter-spacing:.4px; }
.anBar { background:rgba(47,71,85,.16); border-radius:6px; }
.anBar > div { background:linear-gradient(90deg,#8a651a,#d4af37); }
.emptyState .esTitle { color:var(--x-ink); }
.emptyState .esSub { color:var(--x-sub); }
.hmBtn { background:var(--x-paper); border-color:var(--x-line); color:var(--x-ink); border-radius:8px; }
.hmBtn.on { background:var(--x-gold); color:var(--x-ink); border-color:var(--x-gold); }
body.c49dark .hmBtn { background:var(--x-card); color:var(--x-ink); border-color:var(--x-line); }
body.c49dark .hmBtn.on { background:var(--x-gold); color:var(--x-ink); }
.refBody { border-left-color:var(--x-gold); color:var(--x-sub); }
.refBlock > summary { color:var(--x-gold); }
#questLine { background:var(--x-gold-soft); border:1px solid var(--x-line); border-radius:9px; color:var(--x-gold); font-weight:700; }
body.c49dark #questLine { background:var(--x-gold-soft); border-color:var(--x-line); color:var(--x-gold-hi); }

/* today / near-me cards */
#todayModal .box, #nearCard, .dsBox { border-radius:16px; }
#nearCard { background:var(--x-card); border:1px solid var(--x-line); }
body.c49dark #nearCard { background:var(--x-card); border-color:var(--x-line); }
.nearRow { border-top-color:var(--x-line-soft); border-radius:8px; }
.nearRow:hover { background:var(--x-gold-soft); }
.tdRow { border-top-color:var(--x-line-soft); }
.tdIco { background:var(--x-gold-soft); color:var(--x-gold); border-radius:9px; }
body.c49dark .tdIco { color:var(--x-gold-hi); }
#todayBtn { background:rgba(212,175,55,.14); color:#a0bbca; border:1px solid rgba(212,175,55,.4); border-radius:9px; }

/* gold ticker: keep the exchange look, tighten the frame */
#goldPill { background:linear-gradient(180deg,#11181c,#0a0f12); border:1px solid rgba(212,175,55,.4); border-radius:10px; }

/* chat */
.chatDay span { background:var(--x-paper); border:1px solid var(--x-line-soft); color:var(--x-faint); border-radius:999px; letter-spacing:1px; font-weight:700; font-size:10px; text-transform:uppercase; }
body.c49dark .chatDay span { background:var(--x-card); border-color:var(--x-line-soft); color:var(--x-faint); }
.rxChip { background:var(--x-paper); border:1px solid var(--x-line); border-radius:999px; }
body.c49dark .rxChip { background:var(--x-card); border-color:var(--x-line); color:var(--x-ink); }
.rxChip.on { background:var(--x-green); border-color:var(--x-green); }

/* ---------- table view ---------- */
#tableView { background:var(--x-paper); }
body.c49dark #tableView { background:var(--x-paper); }
#tFilters { background:var(--x-paper-2); border-bottom:1px solid var(--x-line); }
body.c49dark #tFilters { background:var(--x-paper-2); border-bottom-color:var(--x-line); }
#tCount { color:var(--x-gold); font-family:ui-monospace,Menlo,monospace; }
#gtbl th { background:var(--x-hdr-1); color:#dfe9ef; font-weight:800; letter-spacing:1.2px; font-size:10px; text-transform:uppercase; }
#gtbl th:hover { background:#212b32; }
#gtbl td { border-bottom-color:var(--x-line-soft); color:var(--x-ink); }
#gtbl tr:nth-child(even) td { background:rgba(166,124,27,.045); }
body.c49dark #gtbl tr:nth-child(even) td { background:rgba(212,175,55,.05); }
#gtbl tbody tr:hover td { background:var(--x-gold-soft); }
.fav1 { color:var(--x-green); } .favNo { color:var(--x-red); }

/* ---------- guide ---------- */
#aboutView { background:var(--x-paper); }
body.c49dark #aboutView { background:var(--x-paper); }
#aboutInner { color:var(--x-ink); }
body.c49dark #aboutInner { color:var(--x-ink); }
#aboutInner h2 { color:var(--x-ink); border-bottom:2px solid var(--x-gold); font-weight:900; letter-spacing:.3px; }
body.c49dark #aboutInner h2 { color:var(--x-gold-hi); border-bottom-color:var(--x-gold); }
#aboutInner .law { background:var(--x-gold-soft); border-left:4px solid var(--x-gold); border-radius:8px; }
.gsec { background:var(--x-card); border:1px solid var(--x-line-soft); border-radius:13px; }
body.c49dark .gsec { background:var(--x-card); border-color:var(--x-line-soft); }
.gsec[open] > summary { border-bottom:1px dashed var(--x-line); }

/* ---------- Radio Room: the console ---------- */
.awCard {
  background:linear-gradient(180deg,#141c21,#0b1114); border:1px solid #263a46; border-radius:14px;
  box-shadow:inset 0 1px 0 rgba(255,220,150,.1), 0 6px 20px rgba(0,0,0,.35);
}
.awPlate {
  font-family:Archivo, system-ui, sans-serif; font-weight:900; letter-spacing:2.4px; font-size:10.5px;
  color:#a0bbca; border:1px solid rgba(212,175,55,.5); border-radius:999px;
  background:rgba(212,175,55,.1); text-shadow:none; text-transform:uppercase;
}
.awText { color:#a6bac6; }
.awLbl { font-family:Archivo, system-ui, sans-serif; color:#9db4c0; letter-spacing:1.8px; font-size:9.5px; font-weight:900; }
.awNum { color:#a0bbca; font-family:ui-monospace,Menlo,monospace; text-shadow:0 0 14px rgba(160,187,202,.35); }
.awDial {
  background:rgba(255,255,255,.06); color:#a0bbca; border:1px solid rgba(212,175,55,.45); border-radius:10px;
  box-shadow:0 1px 3px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
}
.awDial:hover { background:rgba(212,175,55,.16); }
.awMic {
  background:radial-gradient(circle at 50% 36%,#172229,#181206); border:2px solid #d4af37;
  outline:none; border-radius:16px; color:#a0bbca; letter-spacing:2.4px;
  box-shadow:0 0 26px rgba(212,175,55,.25), inset 0 1px 0 rgba(255,255,255,.08);
}
.awMic.tx { background:radial-gradient(circle at 50% 36%,#5a1f14,#38120a); border-color:#ff6a4a; color:#ffd9c8; box-shadow:0 0 30px rgba(217,91,67,.4); }
.awStatus { color:#9db4c0; }

/* ---------- car mode ---------- */
#carRail button { background:rgba(11,16,19,.95); border:2px solid rgba(212,175,55,.6); color:#d2dfe6; border-radius:18px; }
#carRail button:active { background:#d4af37; color:#1a1206; }
#carHud { color:#a0bbca; }
#carFollowBtn.on { background:#2c6147; border-color:#3f8f63; }

/* ---------- 3D + flat map ---------- */
#map3dBar { background:rgba(11,16,19,.92); border:1px solid rgba(212,175,55,.3); color:#dfe9ef; border-radius:12px; }
#jrSel, #d3overlay, #d3quick, #d3detect, #d3markers { background:#131d22; border-color:rgba(212,175,55,.4); color:#dfe9ef; border-radius:8px; }
#jrCard { background:linear-gradient(180deg,rgba(19,25,28,.97),rgba(10,13,15,.98)); border-color:rgba(212,175,55,.4); border-radius:16px; }
#jrName { color:#d4af37; } #jrTitle { color:#eaf2f6; font-weight:900; } #jrBlurb { color:#a6bac6; }
#jrCtrls button { background:rgba(255,255,255,.07); border-color:rgba(212,175,55,.35); color:#dfe9ef; border-radius:9px; }
#jrCtrls .jrPrimary { background:linear-gradient(180deg,#e6c15c,#c49a2c); color:var(--x-ink); border-color:transparent; }
#flatModal canvas { box-shadow:0 0 0 3px #d4af37, 0 0 0 8px #111a1f, 0 10px 34px rgba(0,0,0,.55); }
.fmBtn { background:rgba(11,16,19,.9); color:#dfe9ef; border:1px solid rgba(212,175,55,.4); border-radius:9px; }
.fmBtn.on { background:linear-gradient(180deg,#e6c15c,#c49a2c); color:var(--x-ink); }
.fmChip { border-radius:9px; font-family:Archivo, system-ui, sans-serif; font-weight:700; }
.fmChip.on { background:#d4af37; }
#flatModal .fmGrpH { font-family:Archivo, system-ui, sans-serif; letter-spacing:1.6px; }

/* ---------- review ---------- */
#revStars span.on { color:#d4af37; }

/* ---------- dark-mode inline-style rescues (retuned to the new palette) ---------- */
body.c49dark [style*="3a2a12"], body.c49dark [style*="3a2412"], body.c49dark [style*="3a2a10"] { color:var(--x-gold-hi) !important; }
body.c49dark [style*="1f1a12"], body.c49dark [style*="241d0c"] { color:var(--x-ink) !important; }
body.c49dark [style*="color:var(--x-warn)"] { color:#a6bfce !important; }
body.c49dark [style*="color:var(--x-sub)"], body.c49dark [style*="color:var(--x-gold)"] { color:var(--x-gold-hi) !important; }
body.c49dark [style*="c62828"] { color:#ff9a8a !important; }
body.c49dark [style*="background:#f1f5f7"] { background:var(--x-paper-2) !important; }
body.c49dark [style*="background:var(--x-paper-2)"] { background:#182329 !important; border-color:var(--x-line) !important; color:var(--x-gold-hi) !important; }
body.c49dark [style*="color:var(--x-info)"] { color:#8ab8e8 !important; }

/* dark map night filter: slightly warmer than stock */
body.c49dark .leaflet-tile-pane { filter:brightness(.6) saturate(.68) contrast(1.08); }
body.c49dark .leaflet-popup-content-wrapper, body.c49dark .leaflet-popup-tip { background:var(--x-card); color:var(--x-ink); }
body.c49dark .leaflet-control-layers, body.c49dark .leaflet-control-attribution,
body.c49dark .leaflet-control-scale-line { background:var(--x-card) !important; color:var(--x-ink) !important; border-color:var(--x-line) !important; }
body.c49dark .leaflet-bar a { background:var(--x-card); color:var(--x-ink); border-bottom-color:var(--x-line-soft); }
body.c49dark .leaflet-bar a:hover { background:#182025; }

/* ---------- scrollbars ---------- */
#controls, #hhList, .box, #adminBody, #chatBox, #legendsList { scrollbar-color:rgba(166,124,27,.5) transparent; }
body.c49dark #controls, body.c49dark #hhList, body.c49dark .box { scrollbar-color:rgba(212,175,55,.4) transparent; }

/* ---------- tour card ---------- */
#tourAccent { background:linear-gradient(90deg,#a0bbca,#d4af37,#8a651a); }
#tourIcon { background:linear-gradient(180deg,#c6d6e0,#d8b258); color:#4a3708; }
#tourProg > div { background:linear-gradient(90deg,#d4af37,#a8801f); }