:root{--color-paper: #faf8f3;--color-ink: oklch(26% .015 55);--color-muted: oklch(47% .018 60);--color-rule: oklch(85% .015 70);--color-hover: oklch(94% .018 65);--color-accent: oklch(41% .13 22);--color-focus: oklch(42% .13 22);--color-success: oklch(39% .06 120);--font-display: "Palatino Linotype", "Book Antiqua", Palatino, serif;--font-body: "Segoe UI", Tahoma, sans-serif;font-family:var(--font-body);color:var(--color-ink);background:var(--color-paper);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body{margin:0;min-width:0;overflow-x:clip}body{min-height:100svh}.study{position:relative;max-width:1280px;min-height:100svh;margin:auto;padding:40px 56px 28px;display:flex;align-items:center;justify-content:center;flex-direction:column}.study-heading{position:absolute;top:52px;left:56px;z-index:1;pointer-events:none}.eyebrow{font-size:10px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--color-muted);margin:0 0 20px}h1{font-family:var(--font-display);font-size:clamp(26px,3vw,40px);font-weight:400;line-height:1.14;letter-spacing:-.03em;margin:0;overflow-wrap:anywhere;min-width:0}.artwork{width:min(680px,72svh);max-width:100%;margin:auto;isolation:isolate}.study-footer{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:16px;border-top:1px solid var(--color-rule)}.caption{font-size:12px;line-height:1.65}.caption-detail{display:block;font-size:11px;color:var(--color-muted)}button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:44px;padding:10px 14px;white-space:nowrap;border:1px solid var(--color-rule);border-radius:2px;background:var(--color-paper);color:var(--color-ink);font:500 12px var(--font-body);cursor:pointer;transition:background-color .16s,color .16s,transform .16s}button svg{width:17px;height:17px}button:focus-visible{outline:2px solid var(--color-focus);outline-offset:4px}button:active{transform:translateY(1px);background:var(--color-hover)}button:disabled{opacity:.48;cursor:default}button[data-state=complete] svg{color:var(--color-success)}button[data-state=static]{border-style:dashed}@media(hover:hover){button:hover:not(:disabled){background:var(--color-hover);color:var(--color-accent)}}@media(max-width:700px){.study{padding:24px 24px 20px}.study-heading{position:static;width:100%;align-self:flex-start}.eyebrow{margin-bottom:12px;font-size:9px}h1{font-size:29px}h1 br{display:none}.artwork{width:min(100%,59svh);margin:auto}.study-footer{margin-top:0;gap:12px}.caption{font-size:10px}.caption-detail{font-size:10px;max-width:145px}button{font-size:11px;padding:10px}}@media(max-width:360px){.study{padding:20px 16px 16px}h1{font-size:25px}.study-footer{gap:8px}.caption-detail{max-width:125px}button{gap:8px}}@media(prefers-reduced-motion:reduce){button{transition:none}}.qa-panel{border-top:1px solid var(--color-rule);padding:24px;max-width:1100px;margin:auto}.qa-panel h2{font:400 24px var(--font-display)}.qa-panel .qa-actions{display:flex;flex-wrap:wrap;gap:12px}.qa-panel pre{font-size:12px;white-space:pre-wrap;line-height:1.6}.qa-panel canvas{max-width:100%}
