*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--color-canvas);color:var(--color-ink);font-family:var(--font-body);font-size:var(--text-body);line-height:1.47}
a{color:inherit}
button,select{font:inherit}
.skip-link{position:fixed;z-index:20;top:var(--space-sm);left:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);background:var(--color-canvas);color:var(--color-primary);transform:translateY(-200%)}
.skip-link:focus{transform:none}
.site-header{position:sticky;z-index:10;top:0;background:var(--color-ink);color:var(--color-on-primary)}
.header-inner{display:flex;align-items:center;gap:var(--space-lg);width:min(100% - 2rem,72rem);min-height:64px;margin:auto}
.brand{display:flex;align-items:baseline;gap:var(--space-sm);font-weight:600;text-decoration:none}
.brand span{color:var(--color-dark-muted);font-size:var(--text-fine);font-weight:400}
.header-nav{display:flex;gap:var(--space-lg);margin-left:auto}
.header-nav a{display:inline-flex;align-items:center;min-height:44px;color:var(--color-on-primary);font-size:var(--text-caption);text-decoration:none}
.header-nav a[aria-current="page"]{color:var(--color-primary-on-dark)}
.hero,.summary-section,.browser-section{padding:var(--space-section) max(1rem,calc((100% - 72rem)/2))}
.eyebrow{margin:0 0 var(--space-sm);color:var(--color-primary);font-size:var(--text-fine);font-weight:600;letter-spacing:.08em}
.hero h1{max-width:58rem;margin:0;font-family:var(--font-display);font-size:var(--text-hero);line-height:1.07;letter-spacing:-.02em}
.hero>p:last-child{max-width:44rem;margin:var(--space-lg) 0 0;color:var(--color-ink-soft);font-size:var(--text-lead)}
.summary-section{background:var(--color-canvas-parchment)}
.section-heading,.browser-heading{display:flex;align-items:end;justify-content:space-between;gap:var(--space-lg);margin-bottom:var(--space-xl)}
.section-heading h2,.browser-heading h2{margin:0;font-family:var(--font-display);font-size:var(--text-display);line-height:1.1}
.section-heading>a{display:inline-flex;align-items:center;min-height:44px;color:var(--color-primary);font-weight:600;text-decoration:none}
.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md)}
.summary-card{display:flex;min-height:13rem;flex-direction:column;padding:var(--space-xl);border:1px solid var(--color-hairline);border-radius:var(--radius-lg);background:var(--color-canvas)}
.summary-card span{color:var(--color-ink-muted);font-size:var(--text-caption);font-weight:600}
.summary-card strong{margin-top:auto;font-family:var(--font-display);font-size:var(--text-display);line-height:1.05}
.summary-card p{margin:var(--space-sm) 0 0;color:var(--color-ink-soft)}
.bundle-notice{display:grid;grid-template-columns:minmax(12rem,18rem) 1fr;gap:var(--space-xl);margin-top:var(--space-lg);padding:var(--space-lg);border-radius:var(--radius-lg);background:var(--color-ink);color:var(--color-on-primary)}
.bundle-notice p{margin:0;color:var(--color-dark-muted)}
.browser-heading{align-items:center}
.browser-heading>strong{font-size:var(--text-lead)}
.controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-md);padding:var(--space-lg);border-radius:var(--radius-lg);background:var(--color-canvas-parchment)}
.controls label{display:grid;gap:var(--space-xs);min-width:0}
.controls label>span{font-size:var(--text-caption);font-weight:600}
.controls select{width:100%;min-height:48px;padding:0 2.5rem 0 var(--space-sm);border:1px solid var(--color-hairline);border-radius:var(--radius-sm);background:var(--color-canvas);color:var(--color-ink)}
.controls label[hidden]{display:none}
.view-note{margin:var(--space-md) 0 var(--space-xl);color:var(--color-ink-muted);font-size:var(--text-caption)}
.load-state,.error-panel{padding:var(--space-xl);border-radius:var(--radius-lg);background:var(--color-canvas-parchment);text-align:center}
.error-panel h2{margin-top:0}
.error-panel button{min-height:44px;padding:0 var(--space-lg);border:0;border-radius:var(--radius-pill);background:var(--color-primary);color:var(--color-on-primary);cursor:pointer}
.question-list{display:grid;gap:var(--space-lg)}
.question-card{min-width:0;padding:clamp(1.5rem,4vw,3rem);border:1px solid var(--color-hairline);border-radius:var(--radius-lg);background:var(--color-canvas)}
.question-meta{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-bottom:var(--space-lg);color:var(--color-ink-muted);font-size:var(--text-caption)}
.question-meta>div{display:flex;flex-wrap:wrap;gap:var(--space-xs)}
.meta-chip{display:inline-flex;align-items:center;min-height:30px;padding:0 var(--space-sm);border-radius:var(--radius-pill);background:var(--color-canvas-parchment);color:var(--color-ink-soft);font-weight:600}
.question-card h3{margin:0;font-family:var(--font-display);font-size:var(--text-section);line-height:1.2;overflow-wrap:anywhere}
.question-prompt{margin:var(--space-md) 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.material{margin:var(--space-lg) 0 0;padding:var(--space-lg);border-radius:var(--radius-md);background:var(--color-canvas-parchment)}
.material h4,.answer-block h4,.rubric h4{margin:0 0 var(--space-sm);font-size:var(--text-caption)}
.material p,.answer-block p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.options{display:grid;gap:var(--space-xs);margin:var(--space-lg) 0 0;padding:0;list-style:none}
.options li{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-hairline);border-radius:var(--radius-sm)}
.options li.is-answer{border-color:var(--color-primary);color:var(--color-primary);font-weight:600}
.answer-block{margin-top:var(--space-lg);padding:var(--space-lg);border-left:4px solid var(--color-primary);background:var(--color-canvas-parchment)}
.answer-block h4{color:var(--color-primary)}
.answer-block .explanation{margin-top:var(--space-sm);color:var(--color-ink-soft)}
.rubric{min-width:0;margin-top:var(--space-md);border-top:1px solid var(--color-hairline)}
.rubric summary{display:flex;align-items:center;justify-content:space-between;min-height:52px;cursor:pointer;font-weight:600;list-style:none}
.rubric summary::-webkit-details-marker{display:none}
.rubric summary::after{content:"−";color:var(--color-primary);font-size:var(--text-lead)}
.rubric:not([open]) summary::after{content:"+"}
.rubric ul{margin:0 0 var(--space-sm);padding-left:1.4rem}
.rubric li{overflow-wrap:anywhere}
.empty-state{padding:var(--space-xl);border-radius:var(--radius-lg);background:var(--color-canvas-parchment);text-align:center}
.site-footer{display:flex;justify-content:space-between;gap:var(--space-lg);width:min(100% - 2rem,72rem);margin:auto;padding:var(--space-xl) 0;color:var(--color-ink-muted);font-size:var(--text-caption)}
.site-footer a{color:var(--color-primary)}
button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--color-focus-halo);outline-offset:3px}
@media(max-width:780px){.header-inner{flex-wrap:wrap;padding:var(--space-xs) 0}.header-nav{width:100%;gap:var(--space-md)}.summary-grid{grid-template-columns:1fr}.summary-card{min-height:10rem}.bundle-notice{grid-template-columns:1fr}.controls{grid-template-columns:1fr}}
@media(max-width:520px){.hero,.summary-section,.browser-section{padding-top:var(--space-xxl);padding-bottom:var(--space-xxl)}.section-heading,.browser-heading{align-items:flex-start;flex-direction:column}.question-card{padding:var(--space-lg)}.question-meta{align-items:flex-start;flex-direction:column}.site-footer{flex-direction:column}}
@media(max-width:360px){.header-inner,.site-footer{width:min(100% - 1.5rem,72rem)}.hero,.summary-section,.browser-section{padding-left:.75rem;padding-right:.75rem}.question-card{padding:var(--space-md)}.brand span{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}