/* ============================================================
   SERVED SOCIAL — shared studio skin for the standalone pages
   (brand / admin / scenes). Each of those pages ships its own
   <style> with a NEON token family; this sheet links LAST, so it
   wins the cascade and re-skins them to the home-page "Studio"
   look — deep navy + gold + cream, Fraunces / Inter — WITHOUT
   touching their markup or JS.
   Strategy: flip every page's accent-token family to butler gold,
   drop the studio backdrop, warm text + panels, restyle the
   common furniture (headings, links, buttons, inputs).
   ============================================================ */

/* Palette handles */
:root{
  --ss-navy:#1c2740; --ss-navy2:#141c30; --ss-ink:#0c0f18;
  --ss-cream:#f5f2ec; --ss-dim:#b9c0d2;
  --ss-gold:#c9a24a; --ss-gold-bright:#d8b45f; --ss-gold-pale:#e7cd8f;
  --ss-line:rgba(201,162,74,.30);
}

/* ---- WIN THE TOKEN WAR: every page's neon accent family -> gold ----
   brand.html uses --accent/--accent2 ; admin.html uses --cy/--mg/--lm ;
   scenes.html uses --cyan/--magenta/--lime. Flip them all at once. ---- */
:root,:root[data-theme=dark],:root[data-theme=light],
:root[data-scheme],:root[data-scheme=violet],:root[data-scheme=emerald],
:root[data-scheme=royal],:root[data-scheme=rose]{
  --accent:#c9a24a !important;  --accent2:#d8b45f !important;
  --cyan:#c9a24a !important;     --magenta:#d8b45f !important;  --lime:#e7cd8f !important;
  --cy:#c9a24a !important;       --mg:#d8b45f !important;       --lm:#e7cd8f !important;
  --brand:#c9a24a !important;    --primary:#c9a24a !important;  --cta:#c9a24a !important;
  --gold:#c9a24a !important;
  --grad-text:linear-gradient(100deg,#e7cd8f,#f3e2b3,#c9a24a) !important;
  --accent-soft:rgba(201,162,74,.14) !important;
  --bg:#141c30 !important;
  --panel:rgba(245,242,236,.05) !important;
  --panel2:rgba(245,242,236,.08) !important;
  --border:rgba(201,162,74,.20) !important;
  --text:#f5f2ec !important;
  --muted:#b9c0d2 !important;
}

/* ---- THE STUDIO backdrop: navy set + art-deco sunburst + cursor spotlight
   (--sx/--sy set by the page's spotlight script; sensible static default). ---- */
html[data-theme=dark] body, body{
  background:#141c30 !important;
  background-image:
    radial-gradient(42% 40% at var(--sx,50%) var(--sy,7%), rgba(216,180,95,.16), transparent 62%),
    repeating-conic-gradient(from 0deg at 50% -8%, rgba(201,162,74,.055) 0deg 3deg, transparent 3deg 10.5deg),
    radial-gradient(130% 82% at 50% 122%, rgba(9,11,18,.92), transparent 58%),
    linear-gradient(180deg,#1c2740 0%, #141c30 56%, #0c0f18 100%) !important;
  background-attachment:fixed !important;
  color:#f5f2ec !important;
  font-family:"Inter",system-ui,-apple-system,sans-serif !important;
}
/* light theme keeps a warm cream set */
html[data-theme=light] body{
  background:#f6f4ef !important;
  background-image:
    radial-gradient(42% 40% at var(--sx,50%) var(--sy,7%), rgba(201,162,74,.14), transparent 62%),
    repeating-conic-gradient(from 0deg at 50% -8%, rgba(201,162,74,.05) 0deg 3deg, transparent 3deg 10.5deg),
    linear-gradient(180deg,#fbf9f4,#f2ede2) !important;
  color:#1a1824 !important;
}

/* ---- headings -> Fraunces display, cream ---- */
h1,h2,h3,.h1,.h2,.title,.section-title,.deck-title,.page-title{
  font-family:"Fraunces",Georgia,"Times New Roman",serif !important;
  letter-spacing:-.01em !important;
}
html[data-theme=dark] h1,html[data-theme=dark] h2,html[data-theme=dark] h3{color:#f5f2ec !important}

/* ---- kill decorative neon: blurred ambient orbs (cyan/magenta/lime) — the
   studio backdrop already carries the atmosphere ---- */
.ambient,.orb,.orb-cyan,.orb-magenta,.orb-lime{display:none !important}
/* logo marks (.mark / .mk): transparent (hold the butler wordmark), no box */
.mark,.mk{background:transparent !important;box-shadow:none !important}
.mark img,.mk img{object-fit:contain !important}

/* ---- floating glass headers + auth cards -> navy studio glass + gold hairline
   rim (kills the old purple glass + cyan/magenta neon edge) ---- */
header,.glass,.lux-head{background:linear-gradient(160deg,rgba(28,36,60,.72),rgba(17,23,42,.66)) !important}
header::before,.glass::before,.lux-head::before,.card::before{
  background:linear-gradient(135deg,rgba(201,162,74,.5),rgba(245,242,236,.08) 40%,rgba(216,180,95,.32)) !important}
/* header nav pills (admin USAGE / ← APP etc.) -> gold on glass */
.header-actions a,.hdr-actions a{
  color:var(--ss-gold-bright) !important;border-color:var(--ss-line) !important;
  background:rgba(201,162,74,.06) !important}
.header-actions a:hover,.hdr-actions a:hover{border-color:var(--ss-gold) !important}
/* the little "admin" tag by an email -> gold (status pills stay semantic) */
.pill.admin{background:rgba(201,162,74,.14) !important;border:1px solid var(--ss-line) !important;color:var(--ss-gold-bright) !important}

/* ---- links / inline accents -> gold ---- */
a{color:var(--ss-gold-bright) !important}
a:hover{color:var(--ss-gold-pale) !important}

/* ---- gradient-text headlines (they used a neon gradient) -> gold foil ---- */
.grad,.grad-text,.gradient-text{
  background:linear-gradient(100deg,#e7cd8f,#f3e2b3,#c9a24a) !important;
  -webkit-background-clip:text !important;background-clip:text !important;
  -webkit-text-fill-color:transparent !important;color:transparent !important;
}

/* ---- primary buttons / CTAs -> solid gold ---- */
.btn.primary,.btn-primary,.btn.cta,.cta,button.primary,
input[type=submit],button[type=submit]{
  background:linear-gradient(180deg,#e2c473,#c9a24a) !important;
  color:#20242e !important;
  border:1px solid rgba(201,162,74,.55) !important;
  box-shadow:0 12px 26px -14px rgba(201,162,74,.7) !important;
  text-shadow:none !important;
}
.btn.primary:hover,.btn-primary:hover,.cta:hover,
input[type=submit]:hover,button[type=submit]:hover{
  background:linear-gradient(180deg,#ecd589,#d8b45f) !important;
}
/* solid (non-ghost) buttons -> gold fill. Many pages hard-code a neon gradient
   on plain `.btn`, bypassing the tokens — catch them here. Ghost/danger kept. */
.btn:not(.ghost):not(.secondary):not(.outline):not(.danger):not(.del):not(.block){
  background:linear-gradient(180deg,#e2c473,#c9a24a) !important;
  color:#20242e !important;border:0 !important;
  box-shadow:0 12px 26px -14px rgba(201,162,74,.7) !important;text-shadow:none !important;
}
.btn:not(.ghost):not(.secondary):not(.outline):not(.danger):not(.del):not(.block):hover{
  background:linear-gradient(180deg,#ecd589,#d8b45f) !important;
}
/* ghost / outline buttons -> gold hairline on glass */
.btn.ghost,.btn.secondary,.btn.outline,.btn-ghost,.btn-secondary{
  background:transparent !important;border:1px solid var(--ss-line) !important;color:#f5f2ec !important;box-shadow:none !important;
}
.btn.ghost:hover,.btn.secondary:hover,.btn.outline:hover{border-color:var(--ss-gold) !important}
/* danger buttons stay red */
.btn.danger,.btn.del,.btn.block{background:#d33a3a !important;color:#fff !important;border:0 !important}

/* ---- inputs -> cream glass, gold hairline, gold focus ring ---- */
html[data-theme=dark] input[type=text],html[data-theme=dark] input[type=url],
html[data-theme=dark] input[type=email],html[data-theme=dark] input[type=password],
html[data-theme=dark] input[type=number],html[data-theme=dark] input[type=search],
html[data-theme=dark] input[type=date],html[data-theme=dark] input[type=time],
html[data-theme=dark] textarea,html[data-theme=dark] select{
  background:rgba(245,242,236,.05) !important;
  border-color:var(--ss-line) !important;
  color:#f5f2ec !important;
}
input:focus,textarea:focus,select:focus{
  outline:none !important;border-color:var(--ss-gold) !important;
  box-shadow:0 0 0 3px rgba(201,162,74,.18) !important;
}
/* native radios / checkboxes -> gold (kills the magenta dot on brand) */
input[type=radio],input[type=checkbox]{accent-color:#c9a24a !important}

/* "back to the app" pill -> gold on glass */
.back-pill,.backapp,#backapp{
  color:var(--ss-gold-bright) !important;border-color:var(--ss-line) !important;
  background:rgba(201,162,74,.06) !important}
.back-pill:hover,#backapp:hover{border-color:var(--ss-gold) !important}

/* ---- kill stray neon glows: any box/text-shadow tuned to cyan/magenta reads
   as a soft gold now that the tokens are gold; hard-coded neon is handled
   per-page in the page's own <style> where it survives. ---- */
