/* =============================================================================
   theme.css  ·  charting 4 oil
   -----------------------------------------------------------------------------
   THIS SITE ONLY - its palette. Loads AFTER charting-network.css.
   Palette = the Digging 4 Oil theme, so the two oil desks match.
   --faint is lifted from digging's #61706B (3.3:1 on the panel) to #75847F
   (4.6:1), the same readability floor charting 4 gold applies to its own
   --faint, and still a clear step below --mute.

   The shared sheet carries no colour of its own: every tint it mixes comes
   from the variables below. The second block exists because CSS cannot pull
   channels out of a hex colour - rgba(var(--gold-rgb),.10) needs the triplet.
   A new sister desk changes THIS file and nothing else.
   ============================================================================= */

:root{
  --ink:#070A0A; --panel:#101615; --panel2:#161D1C;
  --border:rgba(47,160,143,.16); --border-soft:rgba(47,160,143,.09);
  --gold:#2FA08F; --gold-hi:#62D9C4; --gold-deep:#1D5F56;
  --text:#E6EDEA; --mute:#93A29D; --faint:#75847F;
  --bear:#E4572E; --neutral:#86938F; --up:#57C97B;
  --gold-grad:linear-gradient(90deg,#1D5F56,#2FA08F,#62D9C4);
  --bear-grad:linear-gradient(90deg,#7A2E18,#E4572E);
  --up-grad:linear-gradient(90deg,#2F9159,#57C97B,#8AE6AF);

  /* channel triplets for the alpha tints (accent glows, borders, scrims) */
  --gold-rgb:47,160,143; --gold-hi-rgb:98,217,196;
  --text-rgb:230,237,234; --mute-rgb:147,162,157; --ink-rgb:7,10,10;
  /* dark ink drawn ON an accent-filled surface (buttons, badges, active tabs) */
  --on-accent:#0A1F1B; --brand-ink:#0B211D;
  /* the quieter greys the mobile shell and promo cards use */
  --track:#1E2A28; --faint-deep:#4B5955; --text-soft:#B9C6C2; --text-hi:#EEF4F2;
  --link-soft:#87958F; --grab:#2E3A37;
  --m-nav:#0D1312; --m-sheet:#121918; --m-hdr:#0A100F;
  --sbar-bear-mid:#71554C; --sbar-up-mid:#4F7D66;
  /* accent-filled controls and the network promo card */
  --gold-btn:linear-gradient(180deg,#4FC7B0,#26907F);
  --badge:#43B39F; --logo-grad:linear-gradient(180deg,#62D9C4,#1D5F56);
}

/* =============================================================================
   SITE WIDGET RULES - sessions panel (.ss-*) and session read (.amd-*)
   -----------------------------------------------------------------------------
   Carried over from charting 4 gold's theme.css (ported there from the retired
   style.css on 24 Aug 2026): the index loads only charting-network.css +
   theme.css, and these widgets' layout rules live at the site layer.
   ============================================================================= */
.ss-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.ss-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border-soft)}
.ss-row:last-child,.ss-row.ss-end{border-bottom:0;padding-bottom:0}
.ss-dot{width:8px;height:8px;border-radius:50%;background:var(--border-soft);flex-shrink:0}
.ss-on{background:var(--up,#5ec478);box-shadow:0 0 8px rgba(94,196,120,.5);animation:ssPulse 2s ease-in-out infinite}
.ss-main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.ss-main b{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.12em;color:var(--text)}
.ss-main span{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.03em;color:var(--faint)}
.ss-chg{font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:700;flex-shrink:0;display:inline-flex;align-items:baseline;gap:5px}
.ss-na{color:var(--faint);font-weight:400}
.ss-hl{display:block;margin-top:2px;font-family:'IBM Plex Mono',monospace;font-size:9.5px;color:var(--faint);letter-spacing:.03em}
.amd-step{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid var(--border-soft)}
.amd-step:last-of-type,.amd-step.amd-end{border-bottom:0}
.amd-rail{flex:0 0 10px;display:flex;flex-direction:column;align-items:center;padding-top:5px}
.amd-pip{width:9px;height:9px;border-radius:50%;border:1px solid var(--grab);flex:0 0 auto}
.amd-ln{flex:1;width:1px;background:var(--border-soft);margin-top:3px;min-height:14px}
.amd-body{flex:1;min-width:0}
.amd-t{font-size:13px;color:var(--text)}
.amd-sess{font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;color:var(--faint);margin-left:8px;white-space:nowrap}

/* the sister desks: a live one in the mobile switcher is a link and must keep looking like the tile it
   replaces; the desktop switcher shows the three unbuilt desks dimmed rather than as dead links */
a.m-sw{text-decoration:none;color:inherit}
.ms-opt.is-soon{opacity:.4;cursor:default}
.ms-opt.is-soon:hover{background:none;color:var(--mute)}
