/* The account's class supplies every shared material. Class emblems still identify heroes. */
body[data-theme] {
  --bg: var(--layer-deep);
  --sidebar: var(--layer-deep);
  --surface: var(--layer-panel);
  --surface-raised: var(--layer-panel);
  --input: var(--layer-deep);
  --gold: var(--layer-accent);
  --gold-soft: var(--layer-bright);
  --arcane: var(--layer-accent);
  --text: #f5efe5;
  --muted: #c4c0b7;
  --border: color-mix(in srgb, var(--layer-accent) 32%, var(--layer-deep));
  background: radial-gradient(ellipse at 90% 0%, color-mix(in srgb, var(--layer-accent) 12%, transparent), transparent 48%), var(--layer-deep);
}
body[data-theme] .app-sidebar {
  background: linear-gradient(#0002, #0005), var(--layer-texture) repeat;
  border-color: var(--border);
}
body[data-theme] .brand strong, body[data-theme] .brand-mark { color: var(--layer-bright); }
body[data-theme] .brand-mark { filter: drop-shadow(0 0 8px color-mix(in srgb, var(--layer-accent) 22%, transparent)); }
body[data-theme] :is(.brand small, .nav-caption, .sidebar-footer, .breadcrumb) { color: var(--muted); }
body[data-theme] .breadcrumb span:last-child { color: var(--layer-bright); }
body[data-theme] .nav-link { color: #d7d2c8; border-radius: 3px; }
body[data-theme] .nav-link:hover { background: var(--layer-panel); color: var(--layer-bright); }
body[data-theme] .nav-link.active {
  color: var(--layer-bright); border-color: var(--layer-accent);
  background: var(--layer-frame) center / 100% 100% no-repeat, var(--layer-deep);
  box-shadow: inset 3px 0 var(--layer-accent);
}
.party-identity { display: flex; align-items: center; gap: 10px; margin: 14px 9px 24px; }
.party-identity img { width: 39px; height: 44px; object-fit: contain; filter: drop-shadow(0 3px 2px #0005); }
.party-identity span { font-size: 6.5px; letter-spacing: .7px; color: var(--muted); }
.party-identity strong { display: block; font-size: 14px; letter-spacing: 0; color: var(--layer-bright); margin-top: 2px; }
body[data-theme] .dice-corner { background: var(--layer-deep); border-color: var(--border); border-radius: 3px; }
body[data-theme] .pocket-die { color: var(--layer-bright); }
body[data-theme] .dice-shape { filter: drop-shadow(0 0 11px color-mix(in srgb, var(--layer-accent) 22%, transparent)); }
body[data-theme] .dice-corner p { color: var(--muted); }
body[data-theme] .page-heading {
  border: 6px solid transparent; border-image: var(--layer-frame) 42 / 22px stretch; border-radius: 3px;
  background: linear-gradient(90deg, var(--layer-deep), color-mix(in srgb, var(--layer-deep) 88%, transparent) 36%, color-mix(in srgb, var(--layer-deep) 28%, transparent)), url('../assets/rpg-adventure.png') right 22% / cover;
}
body[data-theme] .page-heading .eyebrow { background: var(--layer-deep); border-color: var(--border); color: var(--layer-bright); }
body[data-theme] .page-heading .muted { color: #e0dcd4; }
body[data-theme] .page-heading::before { background: var(--layer-bright); }
body[data-theme] :is(.card, .character-library, .auth-card, .mesa-item-card) {
  background: var(--layer-texture) repeat; border: 6px solid transparent;
  border-image: var(--layer-frame) 42 / 22px stretch; border-radius: 3px;
}
body[data-theme] :is(.card h3, .section-heading h2, .library-heading h2, .skill strong, .readonly-card > strong) { color: var(--layer-bright); }
body[data-theme] :is(.card-header .muted, .campaign-intro .card p, .skill > div, .skill small, .combat-ficha .ficha-heading span) { color: var(--muted); }
body[data-theme] .section-index { border-color: var(--layer-accent); background: var(--layer-deep); color: var(--layer-bright); border-radius: 3px; }
body[data-theme] label { color: #ded8cc; }
body[data-theme] :is(input, select, textarea) { background: var(--layer-deep); border-color: var(--border); color: var(--text); border-radius: 3px; }
body[data-theme] :is(input, textarea)::placeholder { color: #b7b0a3; }
body[data-theme] :is(input, select, textarea):focus { border-color: var(--layer-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--layer-accent) 12%, transparent); }
body[data-theme] .btn { background: linear-gradient(var(--layer-bright), var(--layer-accent)); color: var(--layer-deep); border-color: var(--layer-bright); border-radius: 3px; box-shadow: 0 3px 0 #0005; }
body[data-theme] .btn:hover { background: var(--layer-bright); box-shadow: 0 5px 0 #0005; }
body[data-theme] .btn:active { box-shadow: 0 1px 0 #0005; }
body[data-theme] .btn-secondary { background: var(--layer-deep); color: var(--layer-bright); border-color: var(--layer-accent); }
body[data-theme] .btn-secondary:hover { background: var(--layer-panel); }
body[data-theme] .btn-ghost { background: transparent; color: var(--layer-bright); border-color: transparent; box-shadow: none; }
body[data-theme] .btn-ghost:hover { background: var(--layer-panel); box-shadow: none; }
body[data-theme] .btn-danger { background: transparent; color: #ffb3ab; border-color: #a86c64; box-shadow: none; }
body[data-theme] .btn-danger:hover { background: #532b2b; color: #ffe4dc; }
body[data-theme] .btn:disabled, body[data-theme] .btn:disabled:hover { box-shadow: none; }
body[data-theme] :is(.skill, .readonly-card, .empty-state, .notice) { background: var(--layer-deep); border-color: var(--border); border-radius: 3px; }
body[data-theme] :is(.catalog-class, .combat-ficha) { background: var(--layer-texture) repeat; }
body[data-theme] :is(.empty-state, .notice p, .field-hint) { color: var(--muted); }
body[data-theme] .editor-tabs { background: var(--layer-deep); border-color: var(--border); border-radius: 3px; }
body[data-theme] .editor-tabs button { color: #cec8be; border-radius: 2px; }
body[data-theme] .editor-tabs button:hover { background: var(--layer-panel); color: var(--layer-bright); }
body[data-theme] .editor-tabs button[aria-selected=true] { background: var(--layer-frame) center / 100% 100% no-repeat, var(--layer-panel); border-color: var(--layer-accent); color: var(--layer-bright); }
body[data-theme] .mesa-item-card::before { background: linear-gradient(0deg, var(--layer-panel), transparent 80%), url('../assets/rpg-adventure.png') right 24% / cover; }
body[data-theme] .mesa-item-card .campaign-symbol { background: var(--layer-deep); color: var(--layer-bright); border-color: var(--layer-accent); border-radius: 3px; }
body[data-theme] .mesa-item-card :is(.campaign-meta, .campaign-footer) { color: var(--muted); border-color: var(--border); }
body[data-theme] .role-badge { color: var(--layer-bright); background: var(--layer-deep); border-color: var(--border); }
body[data-theme] .turn-tag { color: var(--layer-deep); background: var(--layer-bright); border-color: var(--layer-accent); }
body[data-theme] .combat-ficha .ficha-stats span { background: var(--layer-deep); color: var(--layer-bright); border-color: var(--border); }
body[data-theme] .mobile-dice { color: var(--layer-bright); }
body[data-theme] .auth-story { background: linear-gradient(180deg, color-mix(in srgb, var(--layer-deep) 45%, transparent), color-mix(in srgb, var(--layer-deep) 78%, transparent)), url('../assets/rpg-adventure.png') 66% center / cover; border-color: var(--border); }
body[data-theme] .auth-story-content h1 em { color: var(--layer-bright); }
body[data-theme] :is(.auth-story-content > p, .auth-features span, .auth-caption) { color: #e8e0d2; }
body[data-theme] .auth-card { max-width: 420px; padding: 32px; }
body[data-theme] :is(.auth-card .eyebrow, .auth-story-content .eyebrow, .text-button) { color: var(--layer-bright); }
body[data-theme] .auth-rule { background: var(--border); }
body[data-theme] .auth-note { color: var(--muted); }
@media (max-width:800px) {
  .party-identity { display: none; }
  body[data-theme] .nav-link.active { border-color: transparent; border-bottom-color: var(--layer-accent); background: transparent; box-shadow: none; }
}
@media (max-width:580px) {
  body[data-theme] .auth-card { padding: 26px 20px; }
  body[data-theme] .page-heading { background-position: 65% 20%; }
}
