:root {
  --sq-font-heading: "Trebuchet MS", system-ui, sans-serif;
  --sq-font-body: "Segoe UI", system-ui, sans-serif;
  --sq-h1: clamp(1.8rem, 4vw, 2.5rem);
  --sq-h2: clamp(1.4rem, 3vw, 1.8rem);
  --sq-h3: 1.2rem;
  --sq-body: 1rem;
  --sq-caption: .875rem;
  --sq-space-1: .5rem;
  --sq-space-2: 1rem;
  --sq-space-3: 1.5rem;
  --sq-radius: .75rem;
  --sq-shadow: 0 8px 24px #0003;
  --sq-surface: #182536;
  --sq-ink: #f4f7fb;
  --sq-muted: #c5d0df;
  --sq-border: #63768e;
  --sq-accent: #bfe4ff;
  --sq-new: #d7eaff;
  --sq-progress: #ffe0a3;
  --sq-done: #bcebcf;
  --sq-header-height: 88px;
  --sq-nav-height: 88px;
}
body, button, input, select, textarea { font-family: var(--sq-font-body); font-size: var(--sq-body); }
body { line-height: 1.6; color: var(--sq-ink); background-color: #0d1725; }
h1, h2, h3, h4, .quest-modal-title, .quest-hub-tile-title, .collection-item-copy strong { font-family: var(--sq-font-heading); line-height: 1.25; }
h1 { font-size: var(--sq-h1); } h2 { font-size: var(--sq-h2); } h3, h4 { font-size: var(--sq-h3); }
small, .quest-hub-tile-copy, .quest-booklet-kicker { font-size: var(--sq-caption); }
:focus-visible { outline: 3px solid #1976c9; outline-offset: 4px; }
button, .quest-inline-button, .quest-modal-button { min-height: 44px; border-radius: var(--sq-radius); }
.sq-icon { width: 1.25em; height: 1.25em; display: inline-block; vertical-align: -.2em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.quest-reading-card-body { min-width: 0; max-width: 72ch; }
.quest-reading-source-body { max-height: none; overflow: visible; line-height: 1.7; }
.quest-reading-check { width: 44px; height: 44px; cursor: pointer; accent-color: #245c90; }
.quest-reading-card { grid-template-columns: 44px minmax(0,1fr); gap: var(--sq-space-2); }
.quest-reading-character-chip { min-height: 44px; }
.quest-booklet-page-rail { flex-wrap: wrap; }
.quest-booklet-page-tab { max-width: none; white-space: normal; text-overflow: clip; overflow: visible; }
.quest-modal-card.is-quest-booklet { padding-bottom: var(--sq-space-3); }
.quest-booklet-close-guidance { min-height: 1.6em; }
.sq-quiz-card.quest-card-container { height: auto; min-height: 240px; padding: var(--sq-space-3); background: var(--sq-surface); color: var(--sq-ink); border: 1px solid var(--sq-border); border-radius: var(--sq-radius); box-shadow: var(--sq-shadow); transform: none; display: flex; flex-direction: column; gap: var(--sq-space-2); }
.sq-quiz-card h4, .sq-quiz-card p, .sq-quiz-card summary { color: var(--sq-ink); margin: 0; }
.sq-quiz-card .quest-stats { color: var(--sq-muted); }
.sq-quiz-card .sq-card-status { align-self: flex-start; position: static; padding: .25rem .6rem; border-radius: var(--sq-radius); background: var(--sq-new); color: #142334; font-size: var(--sq-caption); font-weight: 700; }
.sq-quiz-card[data-status="done"] .sq-card-status { background: var(--sq-done); }
.sq-quiz-card[data-status="in-progress"] .sq-card-status { background: var(--sq-progress); }
.sq-quiz-card .quest-action-btn, .sq-button { margin-top: auto; min-height: 44px; padding: .75rem 1rem; border: 1px solid var(--sq-border); border-radius: var(--sq-radius); background: var(--sq-accent); color: #142334; font: 700 var(--sq-body)/1.4 var(--sq-font-body); cursor: pointer; }
.sq-quiz-card details { margin: 0; }
.sq-quiz-card summary { cursor: pointer; min-height: 44px; }
.quest-carousel-controls, .app-header-shell { border-radius: var(--sq-radius); box-shadow: var(--sq-shadow); gap: var(--sq-space-1); }
.quest-modal-button, .quest-inline-button, #quest-booklet-button, #quest-hub-options-toggle { padding: .65rem 1rem; border-radius: var(--sq-radius); font-family: var(--sq-font-body); }
.quest-modal-card .quest-modal-title, .quest-booklet-page-name { color: var(--sq-ink); }
.quest-modal-card .quest-modal-button, .quest-reading-quiz-btn { background: var(--sq-accent); color: #142334; border: 1px solid var(--sq-border); box-shadow: none; }
.quest-modal-card .quest-modal-button.is-secondary { background: var(--sq-surface); color: var(--sq-ink); }
#premium-command-deck.quest-hub-compact-nav #quest-carousel-home-button { display: inline-flex; min-height:44px; align-items:center; justify-content:center; font-family:var(--sq-font-body); }
#premium-command-deck.quest-hub-compact-nav #quest-hub-options-toggle-label { display: inline; }
#premium-command-deck.quest-hub-compact-nav .quest-primary-navigation .quest-hub-tile-title { font-family: var(--sq-font-body); word-break: normal; overflow-wrap: normal; }
#hero-quiz-card, .hero-quiz-card { background: var(--sq-surface); color: var(--sq-ink); border: 1px solid var(--sq-border); box-shadow: var(--sq-shadow); }
#quiz-hero { background: var(--sq-surface); color: var(--sq-ink); border: 1px solid var(--sq-border); box-shadow: var(--sq-shadow); }
#quiz-hero h2, #quiz-hero p { color: var(--sq-ink); }
#quiz-hero button { background: var(--sq-accent); color: #142334; border: 1px solid var(--sq-border); }
#hero-quiz-card h2, #hero-quiz-card p, .hero-quiz-card h2, .hero-quiz-card p { color: var(--sq-ink); }
body:has(#premium-command-deck) .dashboard-view.active { animation: none; }
#parchment-count[hidden], .quest-hub-stat-pill[hidden] { display: none !important; }
@media (max-width: 640px) {
  #premium-command-deck.quest-hub-compact-nav .quest-primary-navigation .quest-hub-tile-title,
  #premium-command-deck.quest-hub-compact-nav #quest-carousel-home-button span,
  #premium-command-deck.quest-hub-compact-nav #quest-hub-options-toggle-label { font-size: .65rem; white-space: normal; line-height: 1.25; }
}
@media (max-width: 640px) { .quest-reading-card { padding: var(--sq-space-2); gap: var(--sq-space-1); } }
html { scroll-padding-top: calc(var(--sq-header-height) + 16px); }
body { padding-bottom: calc(var(--sq-nav-height) + env(safe-area-inset-bottom)); }
.dashboard-view, .quest-reading-card, h1, h2, h3, [id$="-section"] {
  scroll-margin-top: calc(var(--sq-header-height) + 16px);
}
#quest-carousel-content-mount { padding-bottom: calc(var(--sq-nav-height) + env(safe-area-inset-bottom)); }
#quest-issue-toggle { position: static; margin: 16px; min-height: 44px; }
#quest-issue-panel { bottom: calc(var(--sq-nav-height) + env(safe-area-inset-bottom)); }
.quest-prose p { margin: 0 0 1em; }
.quest-prose ul, .quest-prose ol { padding-inline-start: 1.5em; margin: 0 0 1em; }
.quest-prose li + li { margin-top: .4em; }
