/* =============================================================================
   theme.css  ·  charting 4 copper
   -----------------------------------------------------------------------------
   THIS SITE ONLY - its palette. Loads AFTER charting-network.css.
   Palette = the Digging 4 Copper theme, so the two copper desks match.
   --faint is lifted from digging's #6F6053 (3.1:1 on the panel) to #8B7B6D
   (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:#0C0805; --panel:#170F0A; --panel2:#1F150E;
  --border:rgba(193,112,63,.16); --border-soft:rgba(193,112,63,.09);
  --gold:#C1703F; --gold-hi:#EFA36F; --gold-deep:#8A4A26;
  --text:#EFE7DF; --mute:#A3917F; --faint:#8B7B6D;
  --bear:#E4572E; --neutral:#8F8172; --up:#57C97B;
  --gold-grad:linear-gradient(90deg,#8A4A26,#C1703F,#EFA36F);
  --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:193,112,63; --gold-hi-rgb:239,163,111;
  --text-rgb:239,231,223; --mute-rgb:163,145,127; --ink-rgb:12,8,5;
  /* dark ink drawn ON an accent-filled surface (buttons, badges, active tabs) */
  --on-accent:#1A0C05; --brand-ink:#241106;
  /* the quieter greys the mobile shell and promo cards use */
  --track:#2A1E15; --faint-deep:#5A4C40; --text-soft:#CBBBAA; --text-hi:#F5EFE8;
  --link-soft:#948577; --grab:#3C2F24;
  --m-nav:#14100C; --m-sheet:#1A120C; --m-hdr:#0F0A06;
  --sbar-bear-mid:#7C4F3B; --sbar-up-mid:#597553;
  /* accent-filled controls and the network promo card */
  --gold-btn:linear-gradient(180deg,#E59158,#B36236);
  --badge:#D08A55; --logo-grad:linear-gradient(180deg,#EFA36F,#8A4A26);
}

/* =============================================================================
   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)}
