/* Theme structure. Crimson Court deliberately retains the existing layout. */
:root:not([data-theme=default]) {
  --theme-width:1240px;
  --theme-body:system-ui,"Segoe UI",sans-serif;
  --theme-heading:Georgia,serif;
  --theme-radius:10px;
  --theme-control:6px;
  --theme-panel-space:26px;
  --theme-shadow:none;
  --theme-canvas:none;
  --bs-border-radius:var(--theme-control);
  --bs-border-radius-lg:var(--theme-radius);
  --bs-border-radius-sm:var(--theme-control);
}
:root:not([data-theme=default]) body {
  font-family:var(--theme-body);background-image:var(--theme-canvas);background-attachment:fixed;
}
:root:not([data-theme=default]) .app-container {max-width:var(--theme-width)}
:root:not([data-theme=default]) :is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6) {font-family:var(--theme-heading)}
:root:not([data-theme=default]) :is(.panel,.card,.modal-content,.popover,.toast,.accordion,.list-group) {
  border-radius:var(--theme-radius);box-shadow:var(--theme-shadow);
}
:root:not([data-theme=default]) .panel {padding:var(--theme-panel-space)}
:root:not([data-theme=default]) :is(.btn,.button) {
  --bs-btn-border-radius:var(--theme-control);border-radius:var(--theme-control);
}
:root:not([data-theme=default]) :is(.form-control,.form-select,.input-group-text,.editor input:not([type=checkbox]):not([type=radio]),.editor select,.editor textarea) {
  border-radius:var(--theme-control);
}
:root:not([data-theme=default]) :is(.nav-tabs .nav-link,.nav-theme-toggle,.nav-links>a,.profile-link,.profile-toggle) {border-radius:var(--theme-control)}
:root:not([data-theme=default]) .dropdown-menu {border-radius:var(--theme-radius)}
:root:not([data-theme=default]) :is(.accordion,.modal) {
  --bs-accordion-border-radius:var(--theme-radius);
  --bs-accordion-inner-border-radius:var(--theme-radius);
  --bs-modal-border-radius:var(--theme-radius);
}
:root:not([data-theme=default]) .hero::before {display:none}
:root:not([data-theme=default]) .codex-step {border-radius:var(--theme-control)}
:root:not([data-theme=default]) :focus-visible {outline-color:var(--accent)}

/* MIDNIGHT CITY: a wide, angular control desk with luminous edges. */
:root[data-theme=midnight] {
  --theme-width:1380px;--theme-heading:"Arial Black","Segoe UI",sans-serif;
  --theme-radius:0px;--theme-control:2px;--theme-panel-space:28px;
  --theme-shadow:6px 6px 0 #251c2c;
  --theme-canvas:linear-gradient(#43e8ef06 1px,transparent 1px),linear-gradient(90deg,#43e8ef06 1px,transparent 1px);
}
:root[data-theme=midnight] body {background-size:48px 48px}
:root[data-theme=midnight] .site-header {border-bottom:2px solid #43e8ef;box-shadow:0 5px 22px #43e8ef10}
:root[data-theme=midnight] .brand {font-family:"Arial Black",sans-serif;letter-spacing:-.045em}
:root[data-theme=midnight] :is(h1,.eyebrow,.card-header,.nav-tabs) {text-transform:uppercase}
:root[data-theme=midnight] h1 {letter-spacing:-.055em;font-weight:900}
:root[data-theme=midnight] :is(.panel,.card) {border-top:2px solid #43e8ef;border-right-color:#bd3c99}
:root[data-theme=midnight] :is(.card-header,.accordion-button,.settings-group-title) {font-family:ui-monospace,Consolas,monospace}
:root[data-theme=midnight] .nav-tabs .nav-link.active {box-shadow:inset 0 -3px #f15dc8}
:root[data-theme=midnight] .codex-step {border-color:#43e8ef;box-shadow:3px 3px 0 #702555}
:root[data-theme=midnight] .home-page .hero {padding:65px 0 45px}
:root[data-theme=midnight] .home-page .hero h1 {font-size:clamp(2.8rem,4.6vw,4.5rem)}
@media(min-width:1100px) {
  :root[data-theme=midnight] .home-page #content {display:grid;grid-template-columns:1.25fr 1fr;gap:48px;align-items:start;padding-top:32px}
  :root[data-theme=midnight] .home-page #content>.panel {margin-top:80px}
}

/* OCCULT ARCHIVE: layered folios, broad reading margins, and ink rules. */
:root[data-theme=parchment] {
  --theme-width:1140px;--theme-body:Georgia,"Times New Roman",serif;
  --theme-heading:Georgia,"Times New Roman",serif;--theme-radius:2px;
  --theme-control:2px;--theme-panel-space:32px;
  --theme-shadow:3px 3px 0 #cbbb97,4px 4px 0 #8a7651,7px 7px 0 #cbbb97,8px 8px 0 #8a7651;
  --theme-canvas:repeating-linear-gradient(0deg,#30291f04 0,#30291f04 1px,transparent 1px,transparent 4px);
}
:root[data-theme=parchment] body {line-height:1.8}
:root[data-theme=parchment] :is(button,input,select,textarea,.nav-links,.badge) {font-family:system-ui,"Segoe UI",sans-serif}
:root[data-theme=parchment] .site-header {border-bottom:4px double var(--border)}
:root[data-theme=parchment] #content {border-inline:1px solid var(--border);padding-inline:40px}
:root[data-theme=parchment] .page-heading {padding-block:40px 30px;border-bottom:4px double var(--border);margin-bottom:28px}
:root[data-theme=parchment] .hero {padding:65px 0 55px;border-bottom:4px double var(--border);margin-bottom:36px}
:root[data-theme=parchment] .hero h1 {font-weight:400;font-style:italic;letter-spacing:-.03em}
:root[data-theme=parchment] .eyebrow {font-variant:small-caps;letter-spacing:.2em}
:root[data-theme=parchment] :is(.card-header,.accordion-button,.settings-group-title) {border-bottom-style:double;border-bottom-width:3px}
:root[data-theme=parchment] .codex-chapter-heading {border-bottom:3px double var(--border);padding-bottom:14px;margin-bottom:18px}
:root[data-theme=parchment] .codex-step {border:0;border-bottom:2px solid var(--accent);font-family:Georgia,serif;font-size:1.65rem}
:root[data-theme=parchment] .nav-tabs {border-bottom:3px double var(--border)}

/* EMERALD WILDS: spacious, organic framing without changing the green palette. */
:root[data-theme=forest] {
  --theme-width:1280px;--theme-heading:Palatino,"Palatino Linotype",Georgia,serif;
  --theme-radius:28px 8px 28px 8px;--theme-control:12px;--theme-panel-space:32px;
  --theme-shadow:0 14px 30px #0003;
  --theme-canvas:radial-gradient(ellipse at 0 0,#476b5920,transparent 48%),radial-gradient(ellipse at 100% 75%,#b1ce880b,transparent 50%);
}
:root[data-theme=forest] .site-header {border-bottom:3px solid #476b59}
:root[data-theme=forest] .brand {font-family:Palatino,"Palatino Linotype",Georgia,serif}
:root[data-theme=forest] :is(.panel,.card) {border-left:4px solid #476b59}
:root[data-theme=forest] .hero {padding:76px 40px 60px;border-left:1px solid #476b59;margin:34px 0;max-width:1060px}
:root[data-theme=forest] .hero h1 {font-weight:400;line-height:1.18}
:root[data-theme=forest] :is(.card-header,.accordion-button) {padding-block:1.15rem}
:root[data-theme=forest] .codex-step {border-radius:50% 50% 50% 8px;background:var(--hover)}
:root[data-theme=forest] .nav-pills .nav-link {border-radius:18px 4px}
:root[data-theme=forest] .list-group-item {padding-block:1rem}

/* OBSIDIAN ELYSIUM: black glass, restrained violet, and precise squared framing. */
:root[data-theme=obsidian] {
  --theme-width:1240px;--theme-heading:"Times New Roman",Georgia,serif;
  --theme-radius:0px;--theme-control:0px;--theme-panel-space:30px;
  --theme-shadow:inset 0 0 0 5px #101116,inset 0 0 0 6px #34353f;
  --theme-canvas:linear-gradient(135deg,#bbaed405,transparent 40%);
}
:root[data-theme=obsidian] .site-header {border-block:1px solid #535762}
:root[data-theme=obsidian] .brand {font-weight:400;font-variant:small-caps;letter-spacing:.025em}
:root[data-theme=obsidian] .hero {text-align:center;max-width:none;padding:64px 20px 50px}
:root[data-theme=obsidian] .hero .lede {margin-inline:auto;max-width:720px}
:root[data-theme=obsidian] .hero h1 {font-weight:400;letter-spacing:.01em;font-size:clamp(2.5rem,4.2vw,4.1rem)}
:root[data-theme=obsidian] .eyebrow {letter-spacing:.24em}
:root[data-theme=obsidian] .page-heading {border-bottom:1px solid #535762;margin-bottom:28px}
:root[data-theme=obsidian] .nav-tabs .nav-link.active {border-top:2px solid #bbaed4}
:root[data-theme=obsidian] .codex-step {background:transparent;border:1px solid #bbaed4}
:root[data-theme=obsidian] :is(.card-header,.accordion-button) {letter-spacing:.035em}

/* IVORY TOWER: an editorial spread with wide whitespace and burgundy rules. */
:root[data-theme=ivory] {
  --theme-width:1320px;--theme-heading:"Times New Roman",Georgia,serif;
  --theme-radius:0px;--theme-control:3px;--theme-panel-space:34px;
  --theme-shadow:0 10px 25px #2929360b;
}
:root[data-theme=ivory] .site-header {border-top:5px solid #78334e;border-bottom:1px solid var(--border)}
:root[data-theme=ivory] .brand {font-family:"Times New Roman",Georgia,serif;font-size:31px;font-weight:400}
:root[data-theme=ivory] :is(.panel,.card) {border:0;border-top:3px solid #78334e}
:root[data-theme=ivory] .hero {max-width:none;padding:66px 0 46px}
:root[data-theme=ivory] h1 {font-weight:400;font-size:clamp(2.8rem,4.7vw,4.6rem);letter-spacing:-.055em}
:root[data-theme=ivory] .codex-chapter-heading {padding-bottom:14px;border-bottom:2px solid #78334e}
:root[data-theme=ivory] .codex-step {border:0;background:transparent;font-family:Georgia,serif;font-size:2rem;color:var(--accent)}
:root[data-theme=ivory] .nav-tabs .nav-link {border:0}
:root[data-theme=ivory] .nav-tabs .nav-link.active {background:transparent;box-shadow:inset 0 -3px #78334e}
@media(min-width:1000px) {
  :root[data-theme=ivory] .hero {display:grid;grid-template-columns:1.25fr 1fr;column-gap:70px;align-items:center}
  :root[data-theme=ivory] .hero .eyebrow {grid-column:1/-1}
  :root[data-theme=ivory] .hero .lede {border-left:1px solid var(--border);padding-left:30px;margin:0}
}

/* BLOOD MOON: visible silver surfaces, pale blood red, and circular chapter marks. */
:root[data-theme=sanguine] {
  --theme-width:1220px;--theme-heading:Georgia,serif;
  --theme-radius:22px;--theme-control:11px;--theme-panel-space:30px;
  --theme-shadow:0 0 0 1px #c3ccd5,0 10px 24px #0004;
  --theme-canvas:radial-gradient(ellipse at 50% 0,#e87a6d0d,transparent 60%);
}
:root[data-theme=sanguine] .site-header {border-bottom:4px solid #bbc5ce}
:root[data-theme=sanguine] .hero {text-align:center;max-width:none;padding:75px 20px 55px}
:root[data-theme=sanguine] .hero .lede {margin-inline:auto}
:root[data-theme=sanguine] .hero .eyebrow::before {content:"";display:block;width:44px;height:44px;margin:0 auto 22px;border:2px solid #ccd3db;border-radius:50%;box-shadow:inset 9px -3px 0 #ccd3db;background:#e87a6d}
:root[data-theme=sanguine] :is(.card-header,.accordion-button:not(.collapsed)) {background:#bbc5ce;color:#171a20;border-color:#dce1e6}
:root[data-theme=sanguine] .card-header :is(h2,h3,h4,.h5,.h6) {color:inherit}
:root[data-theme=sanguine] .codex-chapter-heading {align-items:center}
:root[data-theme=sanguine] .codex-step {border-radius:50%;background:#bbc5ce;border-color:#e3e6eb;color:#19202a;box-shadow:inset -4px 0 0 #e87a6d}
:root[data-theme=sanguine] .nav-tabs {border-bottom:2px solid #bbc5ce}
:root[data-theme=sanguine] .nav-tabs .nav-link.active {background:#bbc5ce;color:#171a20}
:root[data-theme=sanguine] .panel>h2 {border-bottom:2px solid #bbc5ce;padding-bottom:14px}

/* VELVET RITUAL: arched presentation and soft upholstered frames. */
:root[data-theme=amethyst] {
  --theme-width:1200px;--theme-heading:Palatino,"Palatino Linotype",Georgia,serif;
  --theme-radius:24px;--theme-control:14px;--theme-panel-space:32px;
  --theme-shadow:inset 0 1px 0 #d5a8ee25,0 16px 35px #08040d60;
  --theme-canvas:repeating-linear-gradient(100deg,#d5a8ee03 0,transparent 80px,#0000000a 160px);
}
:root[data-theme=amethyst] .site-header {border-bottom:3px double #705583}
:root[data-theme=amethyst] .hero {text-align:center;max-width:1000px;margin:36px auto;padding:62px 28px 42px;border:1px solid #705583;border-bottom:0;border-radius:45% 45% 0 0}
:root[data-theme=amethyst] .hero .lede {margin-inline:auto}
:root[data-theme=amethyst] .hero h1 {font-style:italic;font-weight:400}
:root[data-theme=amethyst] :is(.card-header,.accordion-button) {padding-block:1.1rem}
:root[data-theme=amethyst] :is(.button,.btn,.nav-pills .nav-link) {border-radius:999px}
:root[data-theme=amethyst] .codex-step {border-radius:50% 50% 5px 5px;border-top:3px solid #d5a8ee}
:root[data-theme=amethyst] .page-heading {padding-bottom:26px;border-bottom:3px double #705583;margin-bottom:24px}
:root[data-theme=amethyst] .dropdown-menu {box-shadow:0 18px 40px #09051099}

/* INDUSTRIAL DARK: compact machinery panels and technical typography. */
:root[data-theme=steel] {
  --theme-width:1380px;--theme-heading:"Arial Narrow","Franklin Gothic Medium",Impact,sans-serif;
  --theme-radius:2px;--theme-control:2px;--theme-panel-space:20px;
  --theme-shadow:inset 3px 0 0 #52636a;
  --theme-canvas:repeating-linear-gradient(135deg,#a0ded504 0,#a0ded504 1px,transparent 1px,transparent 12px);
}
:root[data-theme=steel] .site-header {border-bottom:4px solid #52636a}
:root[data-theme=steel] .main-nav {min-height:74px}
:root[data-theme=steel] .brand {font-family:Consolas,ui-monospace,monospace;font-size:24px;letter-spacing:-.055em}
:root[data-theme=steel] :is(h1,h2,.eyebrow,.card-header) {text-transform:uppercase}
:root[data-theme=steel] .hero {padding:44px 0 38px;max-width:none}
:root[data-theme=steel] .hero h1 {font-size:clamp(2.7rem,4vw,4rem);letter-spacing:.015em;line-height:1.08}
:root[data-theme=steel] .page-heading {padding-block:28px 22px}
:root[data-theme=steel] .panel h2 {margin-bottom:14px}
:root[data-theme=steel] :is(.card-header,.accordion-button,.settings-group-title,.codex-step,.table th) {font-family:Consolas,ui-monospace,monospace;letter-spacing:.035em}
:root[data-theme=steel] :is(.card-header,.accordion-button) {padding-block:.65rem;border-bottom:2px solid var(--border)}
:root[data-theme=steel] .codex-step {border:2px solid #52636a}
:root[data-theme=steel] .codex-chapter-heading {border-left:5px solid #52636a;padding-left:16px}
:root[data-theme=steel] .nav-tabs {gap:3px}
:root[data-theme=steel] .nav-tabs .nav-link {border:1px solid var(--border);border-bottom:0}
:root[data-theme=steel] .list-link {padding-block:10px}

/* ASH AND EMBER: ash-grey slabs, stark red edges, and large compressed headings. */
:root[data-theme=ember] {
  --theme-width:1280px;--theme-heading:Impact,"Arial Narrow","Franklin Gothic Medium",sans-serif;
  --theme-radius:0px;--theme-control:0px;--theme-panel-space:28px;
  --theme-shadow:6px 6px 0 #a52b2b;
  --theme-canvas:radial-gradient(ellipse at 80% 0,#ffffff05,transparent 65%);
}
:root[data-theme=ember] .site-header {border-top:4px solid #ff574b;border-bottom:1px solid #767b83}
:root[data-theme=ember] .brand {font-family:Impact,"Arial Narrow",sans-serif;font-weight:400;letter-spacing:.04em}
:root[data-theme=ember] :is(h1,h2,h3,.eyebrow) {text-transform:uppercase}
:root[data-theme=ember] h1 {font-weight:400;letter-spacing:.015em}
:root[data-theme=ember] .hero {border-left:6px solid #ff574b;padding:32px 36px;margin:50px 0 38px;max-width:1080px}
:root[data-theme=ember] .hero h1 {font-size:clamp(3rem,5.1vw,5rem);line-height:1.08}
:root[data-theme=ember] .hero .eyebrow {letter-spacing:.22em}
:root[data-theme=ember] :is(.card-header,.accordion-button) {border-left:4px solid #ff574b}
:root[data-theme=ember] .codex-step {background:#ff574b;color:#111;border:0;box-shadow:3px 3px 0 #767b83;font-weight:800}
:root[data-theme=ember] .codex-chapter-heading {border-bottom:2px solid #767b83;padding-bottom:12px}
:root[data-theme=ember] .nav-tabs .nav-link.active {box-shadow:inset 0 -3px #ff574b}

/* Responsive layout and accessibility apply to every structural variant. */
@media(max-width:700px) {
  /* Keep the original Crimson Court glow inside a narrow viewport. */
  :root[data-theme=default] .hero:before {right:0}
  :root:not([data-theme=default]) {--theme-panel-space:20px}
  :root:not([data-theme=default]) .hero {padding:38px 12px;margin-block:24px}
  :root:not([data-theme=default]) .hero h1 {font-size:clamp(2.05rem,8vw,3.1rem)}
  :root[data-theme=parchment] #content {padding-inline:20px;border-inline:0}
  :root[data-theme=amethyst] .hero {border-radius:38% 38% 0 0;padding-top:50px}
  :root[data-theme=ember] .hero {padding-left:20px}
  :root[data-theme=forest] .hero {padding-left:20px}
}
@media(prefers-reduced-motion:reduce) {
  :root:not([data-theme=default]) * {scroll-behavior:auto!important;transition:none!important}
}
@media print {
  :root:not([data-theme=default]) body {background:#fff!important;background-image:none!important;color:#000!important}
  :root:not([data-theme=default]) :is(.card,.panel) {box-shadow:none!important;border-radius:0;border:1px solid #777}
  :root:not([data-theme=default]) .hero {border:0}
}
