:root { --ink:#17212b; --muted:#526170; --paper:#f8f4eb; --surface:#fffdf8; --line:#d7cfbe; --accent:#075985; --accent-dark:#073b58; --long:#7c2d12; --focus:#f59e0b; }
* { box-sizing:border-box; }
html { background:var(--paper); color:var(--ink); font-family:Georgia, 'Times New Roman', serif; }
body { margin:0; line-height:1.55; }
button { font:inherit; }
.page-shell { width:min(100% - 2rem, 58rem); margin-inline:auto; }
.site-header { color:#fff; background:linear-gradient(120deg,#073b58,#075985); border-bottom:5px solid #d6a43a; padding:3rem 0 2.5rem; }
.eyebrow { margin:0; font:700 .84rem/1.2 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.12em; opacity:.88; }
h1 { margin:.35rem 0 .5rem; font-size:clamp(2rem,6vw,3.5rem); line-height:1.05; }
.intro { max-width:48rem; margin:0; font-size:1.1rem; }
.controls { display:flex; gap:1.25rem; align-items:end; justify-content:space-between; padding:1.5rem 0; border-bottom:1px solid var(--line); }
h2 { margin:0; font-size:1.15rem; }
.status { margin:.25rem 0 0; color:var(--muted); font-family:system-ui,sans-serif; font-size:.92rem; }
.filter-group { display:flex; flex-wrap:wrap; gap:.45rem; justify-content:flex-end; margin:0; padding:0; border:0; }
.filter-group legend { padding:0; }
.filter-button,.answer-toggle { border:1px solid currentColor; border-radius:.25rem; cursor:pointer; font-weight:700; }
.filter-button { min-height:44px; padding:.38rem .6rem; color:var(--accent-dark); background:var(--surface); font-family:system-ui,sans-serif; font-size:.88rem; }
.filter-button:hover,.filter-button.is-active { background:var(--accent); color:#fff; }
.question-list { min-width:0; padding:1.5rem 0 2rem; display:grid; gap:1rem; }
.question-card { min-width:0; background:var(--surface); border:1px solid var(--line); border-left:5px solid var(--accent); box-shadow:0 2px 7px rgb(23 33 43 / .08); padding:clamp(1rem,3vw,1.5rem); }
.question-card--long { border-left-color:var(--long); }
.question-meta { display:flex; flex-wrap:wrap; gap:.4rem .8rem; margin:0 0 .9rem; color:var(--muted); font:700 .8rem/1.2 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.045em; }
.question-meta span { overflow-wrap:anywhere; }
.question-card h3 { margin:0 0 .45rem; font-size:1.25rem; line-height:1.25; }
.question-text { margin:.5rem 0 1rem; font-size:1.08rem; }
.citation { margin:1rem 0 0; color:var(--muted); font:italic .86rem/1.35 system-ui,sans-serif; overflow-wrap:anywhere; }
.answer-toggle { min-height:2.7rem; padding:.55rem .8rem; color:#fff; background:var(--accent-dark); }
.answer-toggle:hover { background:#052b40; }
.answer-panel { margin-top:1rem; padding:1rem; border-top:3px solid #d6a43a; background:#fff8df; }
.answer-panel[hidden] { display:none; }
.answer-panel h4 { margin:0 0 .4rem; font-size:1rem; }
.answer-panel p { margin:.35rem 0 0; }
.marking-guide { margin:1rem 0 0; padding:.8rem 0 0 1.25rem; border-top:1px solid #dbcfae; }
.marking-guide li + li { margin-top:.35rem; }
.site-footer { padding:1.5rem 0; color:var(--muted); border-top:1px solid var(--line); font:.85rem/1.4 system-ui,sans-serif; }
.skip-link { position:absolute; top:-4rem; left:1rem; z-index:2; padding:.5rem .75rem; color:#fff; background:var(--accent-dark); }
.skip-link:focus { top:1rem; }
button:focus-visible,.skip-link:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
@media (max-width:42rem) { .site-header { padding:2rem 0; } .controls { display:block; } .filter-group { justify-content:flex-start; margin-top:1rem; } .question-meta { gap:.4rem .6rem; } }