:root{color-scheme:light;--bg:#fffaf0;--surface:#fff;--ink:#23304c;--muted:#6d7180;--line:#e7dcc7;--accent:#1d3157;--focus:#886312}html[data-theme=dark]{color-scheme:dark;--bg:#10182a;--surface:#1b2740;--ink:#f5ecd9;--muted:#b9bfd0;--line:#354461;--accent:#f4d38b;--focus:#f5bd5d}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,sans-serif}a{color:var(--accent)}.shell{max-width:1060px;margin:auto;padding:18px 22px}header{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding:4px 0 14px}.brand{font-weight:800;text-decoration:none;color:var(--ink)}header nav{display:flex;align-items:center;gap:12px}button,.button,select{font:600 .94rem/1.4 system-ui,sans-serif;min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);padding:9px 13px;cursor:pointer}.button{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}h1{font:700 clamp(2.1rem,5vw,3rem)/1.15 Georgia,serif;margin:8px 0 12px}h2{font-size:1.25rem;margin:0 0 10px}.eyebrow{margin:26px 0 7px;color:var(--accent);font-size:.78rem;font-weight:750;letter-spacing:.1em;text-transform:uppercase}.intro{max-width:720px;color:var(--muted)}.index-nav{display:flex;flex-wrap:wrap;gap:10px 18px;margin:14px 0}.index-nav a,#story-link{font-weight:700}.print{border:1px solid var(--line);border-radius:18px;padding:17px;background:var(--surface);margin:18px 0 22px}.print-kicker{margin:0 0 3px;text-transform:uppercase;font-size:.75rem;letter-spacing:.08em;font-weight:750;color:var(--accent)}.print h2{margin-bottom:7px}.print p:not(.print-kicker){margin:0 0 12px;color:var(--muted)}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px}.actions a,.actions button{min-width:112px}.editor{background:var(--surface);padding:18px;border:1px solid var(--line);border-radius:20px;margin:24px 0}.palette-strip{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:6px;align-items:center}.palette-strip>button{width:44px;height:44px;padding:0;font-size:1.7rem}.palette{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,44px);grid-auto-columns:44px;gap:10px;overflow-x:auto;overflow-y:hidden;padding:8px;scroll-snap-type:x proximity;touch-action:pan-x pan-y;min-width:0}.swatch{padding:0;width:44px;height:44px;min-height:44px;border:2px solid var(--line);border-radius:50%;background:var(--swatch);scroll-snap-align:start}.swatch[aria-pressed=true]{outline:3px solid var(--ink);outline-offset:2px}.palette-hint,.color-status{font-size:.85rem;margin:.35rem 0;color:var(--muted)}.tools{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:14px 0}.brush-sizes{display:flex;gap:6px;align-items:center}.brush-choice,.icon-button{width:46px;height:46px;padding:0;display:grid;place-items:center}.brush-choice[aria-pressed=true],.tools button[aria-pressed=true]{outline:3px solid var(--focus);outline-offset:1px}.brush-dot{display:block;border-radius:50%;background:var(--ink)}.brush-dot.small{width:8px;height:8px}.brush-dot.medium{width:16px;height:16px}.brush-dot.large{width:25px;height:25px}.icon-button svg{width:22px;height:22px}.drawing{position:relative;aspect-ratio:var(--drawing-ratio,3/2);width:100%;background:#fff;border:1px solid #bfc3cd;border-radius:10px;overflow:hidden;isolation:isolate}.drawing canvas,.drawing img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.drawing canvas{touch-action:none}.drawing img{pointer-events:none;mix-blend-mode:multiply;user-select:none}.status{font-size:.85rem;color:var(--muted);min-height:1.5em}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.advanced{margin:1rem 0;border:1px solid var(--line);border-radius:12px;padding:12px}.advanced summary{cursor:pointer;min-height:24px;font-weight:700}.advanced-controls{display:flex;flex-wrap:wrap;gap:20px;padding-top:16px}.advanced-controls label{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.advanced input[type=color]{width:52px;height:44px;padding:3px}.advanced input[type=range]{width:160px;max-width:100%}footer{border-top:1px solid var(--line);padding:18px 0;color:var(--muted);font-size:.86rem}footer p{margin:0}@media(max-width:560px){.shell{padding:12px}.editor{padding:12px}.tools{gap:7px}.brush-choice,.icon-button{width:44px;height:44px}.actions .button,.actions button{flex:1 1 130px}header nav{gap:9px}.swatch{width:42px;height:42px}.palette{grid-template-rows:repeat(2,42px);grid-auto-columns:42px}.palette-strip .swatch{width:42px;height:42px}.drawing{border-radius:6px}}

/* Accessible navigation and clear action icons. */
.index-nav button,.read-story,#back{font:600 .94rem/1.4 system-ui,sans-serif;min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);padding:9px 13px;cursor:pointer}.index-nav button{font-weight:700}.read-story{display:inline-flex;align-items:center;margin:2px 0 6px;font-weight:700}#back{display:inline-flex;align-items:center;margin:4px 0 18px}.icon-action{display:inline-flex!important;align-items:center;justify-content:center;gap:8px}.action-icon{display:inline-flex;align-items:center}.action-icon svg{width:19px;height:19px;flex:none}.index-nav button:hover,.read-story:hover,#back:hover{filter:brightness(1.08)}