:root{--table:#1c1d20;--raised:#25272b;--line:#383a40;--paper:#e0c79e;--ink:#26262b;--muted:#8e9097;--text:#e8e8e6;--accent:#7c95ff;--error:#f0a07a;color:var(--text);background:var(--table);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5}*{box-sizing:border-box}body{min-height:100vh;margin:0}#root{flex-direction:column;min-height:100vh;display:flex}button,input{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}header{border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:12px 20px;display:flex}.title{letter-spacing:.01em;cursor:pointer;background:0 0;border:0;margin-right:auto;padding:4px 0;font-size:15px;font-weight:600}.btn{background:var(--raised);border:1px solid var(--line);cursor:pointer;border-radius:8px;padding:6px 12px;font-size:14px}.btn:hover:not(:disabled){border-color:#50535b}.btn.primary{background:var(--text);color:var(--table);border-color:var(--text);font-weight:600}.btn:disabled{opacity:.4;cursor:default}.btn[aria-pressed=true]{border-color:var(--muted)}main{flex-direction:column;flex:1;align-items:center;padding:28px 20px 48px;display:flex}.hint{color:var(--muted);text-align:center;max-width:52ch;margin:0;font-size:14px}.error{color:var(--error);margin:0;font-size:14px}.stack,.tools{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.stack{flex-direction:column;align-items:center;gap:14px}.home{max-width:34rem;margin-top:8vh}.home h1{letter-spacing:-.01em;margin:0 0 14px;font-size:clamp(26px,4vw,36px);font-weight:600;line-height:1.15}.home p{color:var(--muted);margin:0 0 28px}.home form{grid-template-columns:1fr auto;gap:8px;display:grid}.home label{grid-column:1/-1;font-size:14px;font-weight:600}.home .error{color:var(--error);grid-column:1/-1;margin:0}input{background:var(--table);border:1px solid var(--line);border-radius:8px;padding:8px 11px}.kit{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 18px;display:flex}.seg{border:1px solid var(--line);border-radius:8px;display:inline-flex;overflow:hidden}.seg label,.swatches label{cursor:pointer;position:relative}.seg input,.swatches input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.seg span{padding:6px 11px;font-size:13px;display:block}.seg input:checked+span{background:var(--text);color:var(--table)}.seg input:focus-visible+span{outline:2px solid var(--accent);outline-offset:-2px}.swatches{gap:7px;display:flex}.swatches span{background:var(--c);border-radius:50%;width:26px;height:26px;transition:transform .12s;display:block;box-shadow:inset 0 0 0 1px #00000040}.swatches input:checked+span{box-shadow:0 0 0 2px var(--table), 0 0 0 4px var(--text);transform:scale(1.06)}.swatches input:focus-visible+span{outline:2px solid var(--accent);outline-offset:3px}@media (prefers-reduced-motion:reduce){.swatches span{transition:none}}.draw{flex-direction:column;align-items:center;gap:14px;display:flex}.stage{--pad:calc(100% * .2 / 1.4);aspect-ratio:1;touch-action:none;background:var(--paper);width:min(74vh,92vw,760px);position:relative}.stage canvas{width:100%;height:100%;position:absolute;inset:0}.live{cursor:crosshair}.veil{pointer-events:none;position:absolute}.veil.t,.veil.b{height:var(--pad);left:0;right:0}.veil.t{background:linear-gradient(#1c1d2038,#1c1d2008);top:0}.veil.b{background:linear-gradient(#1c1d2008,#1c1d2038);bottom:0}.veil.l,.veil.r{top:var(--pad);bottom:var(--pad);width:var(--pad)}.veil.l{background:linear-gradient(270deg,#1c1d2008,#1c1d2038);left:0}.veil.r{background:linear-gradient(90deg,#1c1d2008,#1c1d2038);right:0}.edge{inset:var(--pad);pointer-events:none;position:absolute;box-shadow:0 0 0 1px #26262b33}dialog{border:1px solid var(--line);background:var(--raised);color:var(--text);border-radius:12px;width:min(440px,92vw);padding:20px}dialog::backdrop{background:#0000008c}dialog form{flex-direction:column;gap:12px;display:flex}dialog label{font-weight:600}dialog .row{flex-direction:row-reverse;gap:8px;display:flex}.painting{justify-content:center;width:100%;display:flex}.sheet{position:relative}.tip{background:var(--raised);border:1px solid var(--line);pointer-events:none;z-index:1;border-radius:8px;flex-direction:column;gap:2px;max-width:260px;padding:8px 10px;font-size:13px;display:flex;position:absolute;transform:translate(12px,12px)}.tip span{color:var(--muted)}.reveal,.gallery{flex-direction:column;gap:20px;width:min(100%,1000px);display:flex}h2{margin:0;font-size:15px;font-weight:600}h2 span{color:var(--muted);margin-left:6px;font-weight:400}h3{margin:12px 0 6px;font-size:14px}.notes p{margin:0}.notes ul{gap:6px;margin:0;padding:0;font-size:14px;list-style:none;display:grid}.where{color:var(--muted);min-width:7.5em;display:inline-block}q{color:var(--text)}.reveal>h2,.notes{align-self:center;width:min(100%,640px)}.gallery article{flex-direction:column;gap:10px;display:flex}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
