:root{color-scheme:light;--bg:#f1f5fa;--panel:#fff;--ink:#17263d;--muted:#4a5c73;--line:#b7c7da;--accent:#244e9c;--soft:#e8effa;--stage:#101c30}html[data-ui-theme=dark]{color-scheme:dark;--bg:#0b1424;--panel:#14233a;--ink:#f0f5fc;--muted:#b7c8df;--line:#45617f;--accent:#b0cfff;--soft:#203651;--stage:#09111f}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,sans-serif}header,main,footer{width:min(1120px,100% - 40px);margin:auto}header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 0;border-bottom:1px solid var(--line)}nav,.actions,.settings{display:flex;gap:14px;flex-wrap:wrap;align-items:center}a{color:var(--accent);text-underline-offset:4px}.brand{font-size:.9rem;letter-spacing:.06em;font-weight:800;text-decoration:none}.intro{padding:42px 0 28px;max-width:850px}.eyebrow{font-weight:800;letter-spacing:.13em;font-size:.76rem;color:var(--accent);margin:0 0 10px}h1{font-size:clamp(2.4rem,7vw,4.2rem);line-height:1.05;margin:0 0 20px;letter-spacing:-.04em}h2{font-size:1.5rem;line-height:1.2;margin:0 0 14px}h3{font-size:1.8rem;line-height:1.2;margin:0 0 15px}.lead{font-size:1.15rem;max-width:70ch}.settings{margin-top:24px;align-items:end}label{display:flex;flex-direction:column;gap:5px;font-weight:650}button,select{font:inherit;min-height:44px;padding:10px 15px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink);max-width:100%}button{cursor:pointer;font-weight:700}button:hover:not(:disabled){background:var(--soft)}button:disabled{opacity:.6;cursor:not-allowed}button.primary{background:var(--accent);color:var(--bg);border-color:var(--accent)}:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.lab,.status-panel{border:1px solid var(--line);border-radius:24px;padding:28px;background:var(--panel);margin:0 0 24px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.pill{display:inline-block;width:fit-content;border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:.82rem;font-weight:750}.frame-options{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}.frame-choice{display:flex;align-items:center;gap:12px;text-align:left;padding:16px}.frame-choice[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:1px;background:var(--soft)}.swatch{width:28px;height:28px;flex-shrink:0;border-radius:50%;border:4px double currentColor}.workbench{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:30px;align-items:center}.stage{background:var(--stage);border-radius:18px;overflow:hidden;color:#d1ddec;text-align:center}.stage svg{display:block;width:100%;height:auto}.stage p{font-size:.8rem;padding:0 15px 18px;margin:0}.selection p{max-width:42ch}.selection button{display:block;margin-top:22px}.muted{font-size:.9rem;color:var(--muted)}.status-panel .actions{margin-top:20px}.notice{min-height:1.6em;font-weight:650;overflow-wrap:anywhere}.notes{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:34px 0}.notes article{border-top:1px solid var(--line);padding-top:22px}.financial{border-left:3px solid var(--accent);background:var(--soft);padding:16px 20px}footer{padding:20px 0 40px}dialog{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:20px;max-width:min(540px,calc(100% - 24px));padding:28px}dialog::backdrop{background:#07111dcc}dialog p{max-width:55ch}#active-frame{font-weight:700}#artwork{min-height:160px} @media(max-width:760px){header,main,footer{width:calc(100% - 24px)}header{align-items:start;flex-direction:column;gap:12px}.intro{padding-top:28px}.lab,.status-panel{padding:18px;border-radius:18px}.workbench,.notes{grid-template-columns:1fr;gap:20px}.frame-options{gap:8px}.frame-choice{font-size:.83rem;padding:10px 6px;justify-content:center;flex-direction:column;gap:6px;overflow-wrap:anywhere}.section-heading{align-items:start}.section-heading h2{font-size:1.3rem}.actions>*{max-width:100%}.status-panel .actions{align-items:stretch;flex-direction:column}.settings label{flex:1}.selection h3{font-size:1.55rem}.notes{gap:12px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}