/* Appearance controls stay beside the language switch at every screen size. */
.header-preferences{display:flex;flex-direction:column;align-items:flex-end;flex-shrink:0;gap:0}
.header-preferences .language-switch button{min-height:36px;padding-top:3px;padding-bottom:3px}
.theme-control{display:flex;align-items:center;gap:6px;color:#f0e9d9}
.theme-control svg{width:18px;height:18px;flex-shrink:0}
.theme-control select{min-height:44px;width:106px;padding:5px 7px;border:1px solid #566c61;border-radius:3px;background:#102a27;color:#f0e9d9;color-scheme:dark;font:13px/1.4 Arial,"Taiji Han","Taiji Rare","Microsoft YaHei",sans-serif;cursor:pointer}
.theme-control select:focus-visible{outline:2px solid #d0b57a;outline-offset:2px}
.theme-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
/* These identity images need their original pale backing in either theme. */
.header-edition,.intro-emblem .edition-logo{background:#ece7da}
@media(max-width:720px){
  .header-preferences{grid-column:2;grid-row:1 / 3;align-self:center}
  .header-preferences .language-switch{gap:2px}
  .theme-control select{width:100px}
}
@media(max-width:350px){.theme-control svg{display:none}.theme-control{gap:0}}
/* Use the existing compact navigation at tablet widths so controls never crowd links. */
@media(min-width:721px) and (max-width:1050px){
  .header{display:grid;grid-template-columns:auto minmax(0,1fr) auto 44px;gap:18px;padding:6px 4%;min-height:92px}
  .header .brand img{width:108px}
  .header-edition{justify-self:start}
  .header-preferences{grid-column:3;grid-row:1}
  .menu-toggle{grid-column:4;grid-row:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;padding:10px;border:1px solid #566c61;border-radius:3px;background:transparent;color:#f2ecdf}
  .menu-toggle span{display:block;width:20px;height:1.5px;background:currentColor}
  .header[data-menu-open="true"] .menu-toggle{gap:0;position:relative}
  .header[data-menu-open="true"] .menu-toggle span:nth-child(1){position:absolute;transform:rotate(45deg)}
  .header[data-menu-open="true"] .menu-toggle span:nth-child(2){opacity:0}
  .header[data-menu-open="true"] .menu-toggle span:nth-child(3){position:absolute;transform:rotate(-45deg)}
  .header nav{display:none;position:absolute;top:100%;left:0;right:0;width:100%;margin:0;padding:9px 4% 16px;background:#102a27;border-bottom:1px solid #566c61;box-shadow:0 12px 20px #102a271a;max-height:calc(100dvh - 95px);overflow:auto}
  .header[data-menu-open="true"] nav{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .header nav a{display:block;font-size:16px;line-height:1.4;padding:14px 12px;min-height:50px;border-bottom:1px solid #344b41;border-left:2px solid transparent}
  .header nav a[aria-current="page"]{border-bottom-color:#344b41;border-left-color:#d8b576;background:#1d3931;color:#fff0cb}
  .header nav a:last-child{border-bottom:0}
}

/* Gold is the readable text accent; vermilion remains the filled-button colour. */
:root[data-theme="dark"]{
  --paper:#101a17;--ink:#f0e9d9;--muted:#b2bfb4;--red:#d0b57a;
  --jade:#284337;--line:#3a5145;--gold:#d0b57a;
  --surface:#1b2b24;--surface-hover:#284337;--button-red:#a83c32;
  color-scheme:dark;background:var(--paper);color:var(--ink);
}
:root[data-theme="light"]{color-scheme:light}
[data-theme="dark"] body{background:var(--paper);color:var(--ink)}
[data-theme="dark"] ::selection{background:var(--gold);color:#101a17}
[data-theme="dark"] .skip{background:var(--surface);color:var(--ink)}
[data-theme="dark"] .primary{background:var(--button-red);color:var(--ink)}
[data-theme="dark"] .primary:hover{background:#96372e;color:#fff8eb}
[data-theme="dark"] .hero:after{background:linear-gradient(90deg,#101a17f5,#101a17cc 45%,#101a1733)}
[data-theme="dark"] .hero-seal{background:var(--button-red);color:var(--ink);outline-color:var(--button-red)}
[data-theme="dark"] .background-hero{color:var(--ink)}
[data-theme="dark"] .entry,[data-theme="dark"] details{border-color:var(--line)}
[data-theme="dark"] .category-nav a.selected{background:var(--surface);color:var(--gold)}
[data-theme="dark"] .balance-inline,[data-theme="dark"] .game-connection,
[data-theme="dark"] .reading .rulebook-panel,[data-theme="dark"] .artwork-commitment,
[data-theme="dark"] .campaign-signup .interest-panel,[data-theme="dark"] .footer{background:var(--surface);color:var(--ink)}
[data-theme="dark"] .polarity-controls button,[data-theme="dark"] #skip-profile{color:var(--ink)}
[data-theme="dark"] .polarity-controls [aria-pressed="true"]{background:var(--surface-hover);color:var(--ink);border-color:var(--gold)}
[data-theme="dark"] .reader-control,[data-theme="dark"] .reader-toolbar button,
[data-theme="dark"] .reader-toolbar select{background:var(--surface);color:var(--ink);border-color:var(--line)}
[data-theme="dark"] #pdf-viewport{background:var(--paper);scrollbar-color:var(--line) var(--paper)}
[data-theme="dark"] #pdf-page-text{background:var(--surface);color:var(--ink)}
[data-theme="dark"] #interest-email,[data-theme="dark"] #interest-profile input,
[data-theme="dark"] #interest-profile select,[data-theme="dark"] .contact-options label{background:var(--paper);color:var(--ink);border-color:#6c8375}
[data-theme="dark"] input::placeholder{color:var(--muted);opacity:1}
[data-theme="dark"] .contact-options label:has(input:checked){background:var(--surface-hover);color:var(--gold);border-color:var(--gold)}
[data-theme="dark"] .signup-deck-names span:first-child{color:#fac694}
[data-theme="dark"] .signup-deck-names span:last-child{color:#afe0dc}
[data-theme="dark"] .signup-deck-names small{color:var(--muted)}
[data-theme="dark"] .catalogue-view-switch button[aria-pressed="false"]:hover{background:var(--surface)}
[data-theme="dark"] .catalogue-view-switch button[aria-pressed="true"]{background:var(--surface-hover);color:var(--ink);outline:1px solid var(--gold)}
/* Change only the frames: card illustrations and the white QR/PDF canvases are untouched. */
[data-theme="dark"] .full-card,[data-theme="dark"] .gallery-image,
[data-theme="dark"] .card-viewer-viewport{background:var(--surface)}

/* Reader typography has explicit colours, including passages and every overlay. */
[data-theme="dark"] .shanhai-reader{--reader-rule:var(--line);--reader-red:var(--gold);--reader-soft:var(--surface);color:var(--ink)}
[data-theme="dark"] .reader-paragraph{color:var(--ink)}
[data-theme="dark"] .reader-kicker span,[data-theme="dark"] .reader-titlebar h1 small,
[data-theme="dark"] .reader-contents summary span,[data-theme="dark"] .reader-contents nav a>span:first-child,
[data-theme="dark"] .reader-contents nav a small,[data-theme="dark"] .reader-count,
[data-theme="dark"] .reader-chapter-heading>div>p[lang],[data-theme="dark"] .reader-jump,
[data-theme="dark"] .reader-edition-controls label,[data-theme="dark"] .reader-hint,
[data-theme="dark"] .reader-passage-number,[data-theme="dark"] .reader-notes summary,
[data-theme="dark"] .reader-notes p{color:var(--muted)}
[data-theme="dark"] .reader-quiet,[data-theme="dark"] .reader-chapter-arrows button,[data-theme="dark"] .reader-swap{color:var(--ink);border-color:var(--line)}
[data-theme="dark"] .reader-contents nav a:hover{background:var(--surface)}
[data-theme="dark"] .reader-contents nav a[aria-current]{background:var(--surface-hover);color:var(--gold);border-color:var(--gold)}
[data-theme="dark"] .reader-mode{background:var(--surface)}
[data-theme="dark"] .reader-mode button{color:var(--ink)}
[data-theme="dark"] .reader-mode button[aria-pressed="true"]{background:var(--surface-hover);color:var(--ink);outline:1px solid var(--gold)}
[data-theme="dark"] .shanhai-reader select{background:var(--surface);color:var(--ink);border-color:#6c8375}
[data-theme="dark"] .reader-passages,[data-theme="dark"] .reader-bottom-nav{border-color:var(--line)}
[data-theme="dark"] .reader-cell+.reader-cell:before,[data-theme="dark"] .reader-notes{border-color:var(--line)}
[data-theme="dark"] .reader-subheadings{background:linear-gradient(90deg,#28433799,transparent);color:var(--ink)}
[data-theme="dark"] .reader-heading{color:var(--ink)}
[data-theme="dark"] .reader-card-link{color:var(--gold);text-decoration-color:var(--gold)}
[data-theme="dark"] .reader-card-link:hover{color:#f0d9a8;text-decoration-color:currentColor}
[data-theme="dark"] .hanzi:hover,[data-theme="dark"] .hanzi-active{background:var(--surface-hover);color:var(--ink)}
[data-theme="dark"] .pinyin-unknown{border-color:var(--gold)}
[data-theme="dark"] #reader-pronunciation{background:var(--surface);color:var(--ink);border-color:#6c8375}
[data-theme="dark"] .reader-card-picker,[data-theme="dark"] #reader-edition-dialog{background:var(--surface);color:var(--ink);border-color:#6c8375}
[data-theme="dark"] .reader-card-picker p,[data-theme="dark"] .reader-card-picker small{color:var(--muted)}
[data-theme="dark"] .reader-card-picker button{color:var(--gold)}
[data-theme="dark"] .reader-card-picker a{border-color:var(--line)}
[data-theme="dark"] #reader-edition-dialog button{color:var(--ink)}
[data-theme="dark"] .shanhai-reader :focus-visible,[data-theme="dark"] #reader-edition-dialog :focus-visible,
[data-theme="dark"] .reader-card-picker :focus-visible{outline-color:var(--gold)}
