*{box-sizing:border-box}body{margin:0;background:#fff3d6;color:#493126;font:16px/1.6 system-ui,sans-serif}header{max-width:1180px;margin:auto;padding:22px;display:flex;gap:24px;flex-wrap:wrap}a{color:#493126;text-underline-offset:4px;font-weight:700}main{max-width:1180px;margin:auto;padding:0 22px 32px}.intro{text-align:center;margin:16px auto 28px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;margin:0}h1{font-size:clamp(28px,4vw,42px);line-height:1.15;margin:10px 0}h2{font-size:20px;margin:0 0 14px}.studio{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:start;padding:24px;background:#fff8e8;border:2px solid #ead6b8;border-radius:28px}.tools{position:sticky;top:16px}#palette{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.swatch{height:48px;min-width:44px;border:2px solid #71503a;border-radius:50%;cursor:pointer;color:#241b16;font-size:24px}.swatch[aria-pressed=true]{outline:3px solid #493126;outline-offset:3px}#selected{font-weight:700;font-size:14px}.actions{display:flex;flex-wrap:wrap;gap:10px}button{font:700 15px system-ui,sans-serif}.actions button{min-height:44px;padding:10px 17px;border:2px solid #d6b65c;border-radius:24px;background:#fff0b6;color:#493126;cursor:pointer}.actions button:hover{background:#ffe58c}button:disabled{opacity:.5;cursor:default}:focus-visible{outline:3px solid #25718b;outline-offset:4px}#status{font-size:14px;min-height:3.2em}.note,.footnote{font-size:14px}.paper{background:#fff;border:1px solid #e3d4bf;border-radius:12px;overflow:hidden}canvas{display:block;width:100%;height:auto;cursor:crosshair;touch-action:pan-y}.footnote{text-align:center}dialog{max-width:min(440px,90vw);border:2px solid #ead6b8;border-radius:24px;padding:24px;background:#fff8e8;color:#493126}dialog::backdrop{background:#49312680}@media(max-width:700px){header{gap:16px;padding:16px}main{padding:0 12px 24px}.studio{grid-template-columns:minmax(0,1fr);padding:16px;gap:18px}.tools{position:static}#palette{grid-template-columns:repeat(auto-fit,minmax(44px,1fr));max-width:400px}.swatch{height:44px;width:44px}.note{margin-bottom:8px}#status{min-height:1.6em}}@media print{@page{size:A4 portrait;margin:10mm}body{background:white}header,.intro,.tools,.footnote,dialog{display:none!important}main,.studio{display:block;margin:0;padding:0;border:0;background:white}.paper{border:0;border-radius:0;width:100%;max-width:190mm;margin:auto}canvas{width:100%;max-height:275mm;object-fit:contain}}

.tools,.paper{min-width:0}