/* Sprite Tracker dual-theme layer. Loaded last so every public surface follows the selected palette. */
:root{
  color-scheme:dark;
  --st-bg:#080b14;
  --st-bg-soft:#0d1322;
  --st-surface:#111a2a;
  --st-surface-2:#172338;
  --st-surface-glass:rgba(14,22,38,.88);
  --st-text:#f7f8ff;
  --st-text-soft:#c5cfde;
  --st-muted:#94a2b6;
  --st-border:rgba(255,255,255,.11);
  --st-border-strong:rgba(255,255,255,.18);
  --st-cyan:#55dff1;
  --st-purple:#9e7cff;
  --st-gold:#e6bd68;
  --st-sage:#8fa897;
  --st-danger:#ff879c;
  --st-shadow:0 18px 50px rgba(0,0,0,.28);
  --st-panel:linear-gradient(155deg,rgba(25,35,57,.96),rgba(12,19,33,.96));
  --st-panel-soft:linear-gradient(155deg,rgba(29,42,66,.9),rgba(14,24,40,.9));
  --st-page:
    radial-gradient(circle at 12% 2%,rgba(85,223,241,.12),transparent 29%),
    radial-gradient(circle at 90% 7%,rgba(158,124,255,.13),transparent 31%),
    radial-gradient(circle at 72% 90%,rgba(230,189,104,.07),transparent 30%),
    linear-gradient(180deg,#0b0f1b 0%,#070a12 52%,#090d17 100%);
  --st-brand-ink:#f3efe6;
  --st-brand-leaf:#9bb09c;
  --st-brand-gold:#e6bd68;
}

html[data-theme="light"]{
  color-scheme:light;
  --st-bg:#eee9dc;
  --st-bg-soft:#f6f1e6;
  --st-surface:#fffaf0;
  --st-surface-2:#f2eadb;
  --st-surface-glass:rgba(255,250,240,.88);
  --st-text:#2d302d;
  --st-text-soft:#4d534f;
  --st-muted:#717871;
  --st-border:rgba(57,64,59,.15);
  --st-border-strong:rgba(57,64,59,.25);
  --st-cyan:#167e91;
  --st-purple:#7052ae;
  --st-gold:#9c772d;
  --st-sage:#718774;
  --st-danger:#b4485d;
  --st-shadow:0 16px 42px rgba(68,58,42,.13);
  --st-panel:linear-gradient(150deg,rgba(255,252,245,.97),rgba(243,237,225,.96));
  --st-panel-soft:linear-gradient(150deg,rgba(251,247,238,.94),rgba(236,229,215,.94));
  --st-page:
    radial-gradient(circle at 14% 4%,rgba(121,156,129,.18),transparent 27%),
    radial-gradient(circle at 90% 8%,rgba(201,158,74,.13),transparent 29%),
    radial-gradient(circle at 72% 88%,rgba(116,95,155,.09),transparent 28%),
    linear-gradient(180deg,#f3eee3 0%,#e9e3d6 52%,#f4efe6 100%);
  --st-brand-ink:#363936;
  --st-brand-leaf:#768b79;
  --st-brand-gold:#b78a32;
}

html,body{background:var(--st-bg);color:var(--st-text)}
body{background:var(--st-page)!important;transition:background .28s ease,color .2s ease}
body::before,body::after{opacity:.12!important}
html[data-theme="light"] body::before{background:#7c9d83!important;opacity:.13!important}
html[data-theme="light"] body::after{background:#c59a4e!important;opacity:.10!important}

.side{
  background:linear-gradient(180deg,color-mix(in srgb,var(--st-surface) 94%,transparent),color-mix(in srgb,var(--st-bg-soft) 95%,transparent))!important;
  border-right-color:var(--st-border)!important;
  box-shadow:12px 0 42px color-mix(in srgb,var(--st-text) 7%,transparent)!important;
}
.top{
  background:color-mix(in srgb,var(--st-bg) 80%,transparent)!important;
  border-bottom-color:var(--st-border)!important;
  color:var(--st-text)!important;
}
.top h1{color:var(--st-text)}
.mobile{
  background:color-mix(in srgb,var(--st-bg) 91%,transparent)!important;
  border-top-color:var(--st-border)!important;
  backdrop-filter:blur(18px);
}
.mobile button,.nav button{color:var(--st-muted)!important}
.mobile button.active,.nav button.active,.nav button:hover{color:var(--st-text)!important}
.nav button.active{background:linear-gradient(90deg,color-mix(in srgb,var(--st-cyan) 16%,transparent),color-mix(in srgb,var(--st-purple) 12%,transparent))!important}

/* Branding lockup */
.brand{padding:4px 6px 20px!important}
.brand-lockup{display:flex;align-items:center;gap:11px;min-width:0}
.brand-mark{width:48px;height:48px;flex:0 0 48px;filter:drop-shadow(0 7px 16px color-mix(in srgb,var(--st-brand-gold) 14%,transparent))}
.brand-copy{display:grid;gap:1px;min-width:0}
.brand-title{font-family:Baskerville,"Palatino Linotype",Palatino,"Book Antiqua",serif;font-size:1.12rem;font-weight:700;letter-spacing:.015em;color:var(--st-brand-ink);line-height:1.05}
.brand-tagline{font-family:Baskerville,"Palatino Linotype",Palatino,"Book Antiqua",serif;font-size:.59rem;color:var(--st-muted);line-height:1.25;white-space:normal}
.brand-mini-star{color:var(--st-brand-gold);font-size:.72rem;margin-left:2px}

.theme-toggle{display:inline-flex!important;align-items:center;justify-content:center;gap:7px;min-width:42px;white-space:nowrap}
.theme-toggle .theme-icon{font-size:1rem;line-height:1}
.theme-toggle .theme-label{font-size:.74rem}

.eyebrow{color:var(--st-cyan)!important}
.muted,.sub,.oauthnote{color:var(--st-muted)!important}
strong,b,h1,h2,h3,.familyname{color:var(--st-text)}

.stat,.panel,.family,.listitem,.dashboard-card,.party-card,.sprite-info-dialog,.dialog{
  color:var(--st-text)!important;
  border-color:var(--st-border)!important;
  background:var(--st-panel)!important;
  box-shadow:var(--st-shadow)!important;
}
.family{background:linear-gradient(160deg,color-mix(in srgb,var(--st-surface-2) 90%,var(--st-bg)),color-mix(in srgb,var(--st-surface) 92%,var(--st-bg)))!important}
.family:hover{border-color:color-mix(in srgb,var(--st-cyan) 35%,var(--st-border))!important}
.family.complete{border-color:color-mix(in srgb,var(--st-gold) 66%,var(--st-border))!important}

.btn,.pill,.input,.select,.chip,.seg button,.levels button,.quick-action,.text-action,.sprite-info-close{
  color:var(--st-text)!important;
  border-color:var(--st-border-strong)!important;
  background:color-mix(in srgb,var(--st-surface-2) 80%,transparent)!important;
}
.input::placeholder{color:color-mix(in srgb,var(--st-muted) 82%,transparent)}
.btn.primary{background:linear-gradient(135deg,var(--st-cyan),color-mix(in srgb,var(--st-cyan) 70%,white))!important;color:#07131e!important;border-color:color-mix(in srgb,var(--st-cyan) 74%,white)!important}
html[data-theme="light"] .btn.primary{color:#fff!important;background:linear-gradient(135deg,#177f91,#4a9ead)!important;border-color:#177f91!important}
.btn.google{background:#fff!important;color:#242424!important;border-color:#d7d7d7!important}
.btn.danger{color:var(--st-danger)!important}
.chip.active{background:var(--st-text)!important;color:var(--st-bg)!important;border-color:var(--st-text)!important}

.clock,.trustbox,.roleline,.importbox{
  color:var(--st-text)!important;
  border-color:var(--st-border)!important;
  background:var(--st-panel-soft)!important;
}
.clock small,.stat span,.trustbox p{color:var(--st-muted)!important}
.rolebadge.owner{border-color:var(--st-gold)!important;color:var(--st-gold)!important;background:color-mix(in srgb,var(--st-gold) 13%,var(--st-surface))!important}
.rolebadge.admin{border-color:var(--st-cyan)!important;color:var(--st-cyan)!important;background:color-mix(in srgb,var(--st-cyan) 11%,var(--st-surface))!important}
.rolebadge.user,.rolebadge.loading{color:var(--st-muted)!important;background:var(--st-surface-2)!important}

.modal,.sprite-info-overlay{background:color-mix(in srgb,var(--st-bg) 84%,transparent)!important}
.sprite-info-content,.sprite-info-copy,.sprite-info-level-card,.sprite-info-stat,.parity-editor-copy,.parity-info-grid>div,.parity-level-power,.parity-mastery-note{
  color:var(--st-text)!important;
}
.sprite-info-badge,.sprite-info-level-card,.sprite-info-stat,.parity-info-grid>div,.parity-level-power,.parity-mastery-note{
  border-color:var(--st-border)!important;
  background:color-mix(in srgb,var(--st-surface-2) 78%,transparent)!important;
}
.sprite-info-copy p,.sprite-info-meta,.sprite-info-level-card span,.parity-editor-copy p,.parity-info-grid span,.parity-level-power span,.parity-mastery-note small{color:var(--st-muted)!important}

/* Keep Sprite progression unmistakable in both themes. */
.variant{color:#fff!important}
html[data-theme="light"] .variant{box-shadow:0 8px 22px rgba(57,49,37,.16),inset 0 1px 0 rgba(255,255,255,.42)!important}
html[data-theme="light"] .variant.missing{background:linear-gradient(160deg,#657080,#424b59)!important}
html[data-theme="light"] .variant.sprite-level-2{background:linear-gradient(160deg,#3f7854,#254f37)!important}
html[data-theme="light"] .variant.sprite-level-3{background:linear-gradient(160deg,#326f99,#1f4d70)!important}
html[data-theme="light"] .variant.sprite-level-4{background:linear-gradient(160deg,#7355a0,#49336f)!important}
html[data-theme="light"] .variant.sprite-level-5{background:linear-gradient(160deg,#8c6a29,#584116)!important}
html[data-theme="light"] .variant.sprite-mastered{background:linear-gradient(160deg,#8b3140,#4d1721)!important}

/* Dashboard refinement */
.home-hero,.dashboard-card{border-color:var(--st-border)!important}
.home-hero{background:linear-gradient(135deg,color-mix(in srgb,var(--st-surface) 94%,transparent),color-mix(in srgb,var(--st-surface-2) 90%,transparent))!important;box-shadow:var(--st-shadow)!important}
.home-hero h2{color:var(--st-text)!important}
.dashboard-progress-orbit,.featured-sprite-ring{border-color:color-mix(in srgb,var(--st-cyan) 28%,var(--st-border))!important}
.dashboard-quote{margin-top:16px;padding:13px 15px;border:1px solid var(--st-border);border-radius:14px;background:linear-gradient(120deg,color-mix(in srgb,var(--st-sage) 10%,transparent),color-mix(in srgb,var(--st-gold) 7%,transparent));font-family:Baskerville,"Palatino Linotype",Palatino,serif;color:var(--st-text-soft);font-size:.98rem;line-height:1.45;position:relative}
.dashboard-quote::before{content:"✦";color:var(--st-gold);margin-right:8px}
.dashboard-goal{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;margin-top:14px;padding:12px;border:1px solid var(--st-border);border-radius:14px;background:color-mix(in srgb,var(--st-surface-2) 66%,transparent)}
.dashboard-goal strong{display:block}.dashboard-goal span{color:var(--st-muted);font-size:.74rem}.dashboard-goal-badge{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,color-mix(in srgb,var(--st-gold) 22%,transparent),color-mix(in srgb,var(--st-cyan) 16%,transparent));border:1px solid color-mix(in srgb,var(--st-gold) 42%,var(--st-border));color:var(--st-gold);font-size:1.15rem}

/* Parties, Events, Account and controls get explicit light-mode contrast rather than inversion. */
.party-message,.party-empty{color:var(--st-muted)!important}
.party-member,.party-summary,.party-invite,.event-time{color:var(--st-text)!important}
.event-dot{box-shadow:0 0 0 5px color-mix(in srgb,var(--st-cyan) 13%,transparent)!important}

/* Home/header hierarchy */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.brand-home{display:flex;align-items:center;border:0;background:transparent;padding:5px 8px 5px 2px;margin:0;color:inherit;border-radius:14px;cursor:pointer;transition:background .18s ease,transform .18s ease,box-shadow .18s ease}
.brand-home:hover{background:color-mix(in srgb,var(--st-surface-2) 58%,transparent);transform:translateY(-1px);box-shadow:0 7px 22px color-mix(in srgb,var(--st-text) 8%,transparent)}
.brand-home .brand-mark{width:42px;height:42px;flex-basis:42px}.brand-home .brand-title{font-size:1rem}.brand-home .brand-tagline{font-size:.54rem}
.home-brand-tagline{margin:0 0 14px;font-family:Baskerville,"Palatino Linotype",Palatino,"Book Antiqua",serif;font-size:clamp(1.22rem,2.2vw,1.75rem);line-height:1.2;color:var(--st-text-soft);letter-spacing:-.01em}
#home .home-hero h2{margin-bottom:8px}
.dashboard-profile-link{border-radius:22px;cursor:pointer;outline:none;transition:transform .2s ease,filter .2s ease,box-shadow .2s ease}
.dashboard-profile-link:hover{transform:translateY(-3px);filter:brightness(1.06);box-shadow:0 16px 40px color-mix(in srgb,var(--st-cyan) 12%,transparent)}
.dashboard-profile-link:focus-visible{outline:2px solid var(--st-cyan)!important;outline-offset:5px!important}
.dashboard-profile-link .dashboard-featured-meta{transition:border-color .18s ease,background .18s ease}
.dashboard-profile-link:hover .dashboard-featured-meta{border-color:color-mix(in srgb,var(--st-cyan) 48%,var(--st-border))!important;background:color-mix(in srgb,var(--st-surface-2) 88%,transparent)!important}

/* Make interactivity obvious everywhere. */
button,a,[role="button"],[data-go],[data-page],.variant,.party-card,.sprite-info-trigger,.overview-check{cursor:pointer}
button:disabled,input:disabled,select:disabled,[aria-disabled="true"]{cursor:not-allowed!important}

:focus-visible{outline:2px solid var(--st-cyan)!important;outline-offset:3px!important}

@media(max-width:900px){
  .brand-lockup{justify-content:center}.brand-tagline{display:none}
  .top{padding:0 12px!important}.top h1{font-size:.86rem!important}
  .brand-home .brand-copy{display:block}.brand-home .brand-title{display:block;font-size:.95rem}.brand-home .brand-mini-star{display:inline}
  .theme-toggle .theme-label{display:none}.theme-toggle{padding-inline:10px!important}
}

@media(max-width:520px){
  .brand-home{padding-left:0}.brand-home .brand-mark{width:36px;height:36px;flex-basis:36px}.brand-home .brand-title{font-size:.86rem}
  .home-brand-tagline{font-size:1.18rem}
}

@media(prefers-reduced-motion:reduce){
  body{transition:none}
  .brand-home,.dashboard-profile-link{transition:none}
}