:root{--paper:#FAF9F6;--surface:#fff;--sunk:#F2EFE9;--ink:#14120E;--ink-2:#5A5348;--ink-3:#8A8275;--line:#E3DED3;--line-2:#C8C0B2;--accent:#B87F17;--accent-bright:#E8AE3C;--radius:8px;--ease:cubic-bezier(.16,.84,.44,1)}*{box-sizing:border-box}body,html{margin:0;padding:0}body{background:var(--paper);color:var(--ink);font:15px/1.55 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}img{max-width:100%;display:block}.app{min-height:100vh;flex-direction:column}.app,.top{display:flex}.top{align-items:center;gap:1rem;padding:.7rem 1.1rem;border-bottom:1px solid var(--line);background:var(--surface);position:-webkit-sticky;position:sticky;top:0;z-index:20}.top h1{margin:0;font-size:.95rem;font-weight:700;letter-spacing:-.01em}.top .sub{font-size:.78rem;color:var(--ink-3);display:none}@media(min-width:760px){.top .sub{display:block}}.layout,.spacer{flex:1 1}.layout{display:grid;grid-template-columns:1fr}@media(min-width:1000px){.layout{grid-template-columns:320px minmax(0,1fr)}}.side{border-bottom:1px solid var(--line);background:var(--surface);padding:1.1rem;display:flex;flex-direction:column;gap:1.3rem}@media(min-width:1000px){.side{border-bottom:0;border-right:1px solid var(--line);height:calc(100vh - 53px);overflow-y:auto;position:-webkit-sticky;position:sticky;top:53px}}.stage{padding:1.1rem;background:var(--sunk);min-height:60vh}.field{display:flex;flex-direction:column;gap:.5rem}.field>label{font-size:.68rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}.row{display:flex;gap:.5rem}.btn,.row{align-items:center}.btn{display:inline-flex;justify-content:center;gap:.45rem;padding:.62rem 1rem;border:1px solid transparent;border-radius:6px;background:var(--ink);color:var(--paper);font-size:.85rem;font-weight:600;cursor:pointer;min-height:40px;transition:background .16s var(--ease)}.btn:hover{background:var(--accent)}.btn[disabled]{opacity:.5;cursor:progress}.btn--gold{background:var(--accent-bright);color:var(--ink)}.btn--gold:hover{background:var(--accent);color:#fff}.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}.btn--ghost:hover{background:transparent;border-color:var(--accent);color:var(--accent)}.btn--sm{padding:.4rem .7rem;min-height:32px;font-size:.78rem}.btn--block{width:100%}.drop{border:1.5px dashed var(--line-2);border-radius:var(--radius);padding:1.2rem;text-align:center;background:var(--sunk);cursor:pointer;transition:border-color .16s}.drop:hover,.drop[data-over=true]{border-color:var(--accent)}.drop strong{display:block;font-size:.88rem}.drop span{font-size:.76rem;color:var(--ink-3)}.drop img{max-height:120px;margin:.6rem auto 0;border-radius:4px;background:#fff}.chips{display:flex;flex-wrap:wrap;gap:.35rem}.chip{border:1px solid var(--line-2);background:var(--surface);border-radius:100px;padding:.35rem .7rem;font-size:.78rem;font-weight:600;cursor:pointer;transition:.16s}.chip[aria-pressed=true]{background:var(--accent-bright);border-color:var(--accent-bright);color:var(--ink)}.chip:hover:not([aria-pressed=true]){border-color:var(--accent)}.swatches{display:flex;flex-wrap:wrap;gap:.45rem}.sw{width:30px;height:30px;border-radius:50%;border:2px solid var(--line-2);cursor:pointer;padding:0}.sw[aria-pressed=true]{border-color:var(--accent);transform:scale(1.1)}.slider{display:flex;flex-direction:column;gap:.25rem}.slider .lab{display:flex;justify-content:space-between;font-size:.75rem;color:var(--ink-2)}.slider input{width:100%}.grid-out{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-gap:.8rem;gap:.8rem}@media(min-width:760px){.grid-out{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1rem}}.tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}.tile canvas,.tile img{width:100%;height:auto;display:block;background:var(--sunk)}.tile figcaption{padding:.5rem .65rem;font-size:.76rem;display:flex;justify-content:space-between;align-items:center;gap:.5rem;border-top:1px solid var(--line)}.tile figcaption b{font-weight:600}.empty{display:grid;place-items:center;min-height:50vh;text-align:center;color:var(--ink-3);padding:2rem}.empty p{max-width:42ch}.note{font-size:.76rem;color:var(--ink-3);line-height:1.5}.warn{background:#FBF1E3;border:1px solid #e7d2ab;color:#7A5410;padding:.7rem .85rem;border-radius:6px;font-size:.8rem}.bar{height:3px;background:var(--line);border-radius:3px;overflow:hidden}.bar i{display:block;height:100%;width:0;background:var(--accent-bright);transition:width .25s linear}.cal{position:relative;display:inline-block;touch-action:none}.cal,.cal img{max-width:100%}.cal img{border-radius:var(--radius);border:1px solid var(--line)}.cal .handle{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:var(--accent-bright);border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.35);cursor:-webkit-grab;cursor:grab;touch-action:none}.cal .handle:active{cursor:-webkit-grabbing;cursor:grabbing}.cal svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}