/* === Studio dark ===
   Every owner screen (editor, demo, dashboard, the per-tag subpages) is a dark
   studio. Link this after dashboard.css: it only redefines tokens plus the few
   dashboard.css rules that hardcode light colours. The guest group pages load
   it too. The landing has its own dark bands (landing/base.css); scan and
   print pages never load it. The editor's phone preview is its
   own document, so the tag page renders in its real colours on top. */
:root {
  color-scheme: dark;
  --bg:     #1C1713;
  --card:   #27201B;
  --warm:   #3F3329;
  --soft:   #231C18;
  --muted:  #B3A08B;
  --copper: #D48A5E;
  --ink:    #F3EADF;
  --dark:   #120E0B;
  --danger:        #E0705F;
  --ok:            #6FB58A;
  --ok-bg:         #1E2D24;
  --ok-border:     #2F5A40;
  --ok-text:       #9AD3AE;
  --danger-bg:     #33201C;
  --danger-border: #5E3027;
  --danger-text:   #F0A193;
  --warn-bg:       #33291A;
  --warn-border:   #6B5225;
  --warn-text:     #F0C878;
  /* Aliases older editor rules reach for; without them modals fell back to white. */
  --surface: var(--card);  --lc-surface: var(--card);
  --border: var(--warm);   --lc-border: var(--warm);  --line: var(--warm);
  --text: var(--ink);      --lc-ink: var(--ink);
  --text-muted: var(--muted); --text-secondary: var(--muted); --lc-muted: var(--muted);
  --lc-copper: var(--copper);
  --bg-2: var(--soft);
  --warm-soft: rgba(212,138,94,0.10);
}
body { background: var(--bg); color: var(--ink); }
a.primary, button.primary { color: var(--bg); }
a.primary:hover, button.primary:hover { background: #fff; }
.nav-dd-item--danger { color: var(--danger); }
.nav-dd-item--danger:hover { background: var(--danger-bg); }
.link-pill.nfc { background: rgba(120, 165, 225, 0.14); color: #9CC0F0; }
.link-pill.qr { background: var(--ok-bg); color: var(--ok-text); }
.link-pill.both { background: rgba(212, 138, 94, 0.16); color: var(--copper); }
.tp-card-traits { border-top-color: var(--warm); }