:root{--bg:#14110d;--panel:#1e1913;--panel-2:#2a231a;--line:#3d3326;--gold:#d9a943;--gold-soft:#8a6a2a;--fg:#efe4cc;--muted:#a89a80;--danger:#d0563f;--f-display:Cinzel, "Times New Roman", Georgia, serif;--f-body:"Alegreya Sans", "Trebuchet MS", system-ui, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%}body{background:var(--bg);color:var(--fg);font:16px/1.45 var(--f-body);background-image:radial-gradient(1200px 600px at 20% -10%,#2a1f12 0%,#0000 60%);margin:0}[hidden]{display:none!important}.app{max-width:1440px;padding-block:14px 32px;padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));flex-direction:column;gap:14px;margin:0 auto;display:flex}.top{border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:baseline;gap:14px;padding-bottom:10px;display:flex}.brand{font-family:var(--f-display);letter-spacing:.06em;background:linear-gradient(#fff1c2 0%,#e2b24c 55%,#9a6a1c 100%);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:1.65rem;font-weight:900}.tag{color:var(--muted);margin:0;font-size:.98rem}.support{color:#1d1305;font:800 .92rem var(--f-display);letter-spacing:.04em;background:linear-gradient(#e7bb57,#a8771f);border:1px solid #f1d18a;border-radius:999px;align-self:center;align-items:center;gap:7px;margin-left:auto;padding:5px 13px 5px 9px;text-decoration:none;display:inline-flex}.support:hover{filter:brightness(1.08)}.kofi-mark{vertical-align:middle;flex:none;width:auto;display:inline-block}.donate-line{align-items:center;gap:7px;display:inline-flex}.donate-line .kofi-mark{background:var(--fg);box-sizing:content-box;border-radius:999px;padding:3px 4px}.work{grid-template-columns:minmax(0,1fr) 360px;align-items:start;gap:18px;display:grid}.stage{flex-direction:column;align-items:center;gap:10px;min-width:0;display:flex;position:sticky;top:12px}.stage canvas{touch-action:none;border-radius:4px;max-width:100%;display:block;box-shadow:0 0 0 1px #000,0 20px 50px -20px #000000e6}.hint{color:var(--muted);text-align:center;max-width:62ch;margin:0;font-size:.9rem}.hint-mobile{display:none}.stagebar{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.stagebar button:disabled{opacity:.45;cursor:default}.hint kbd{font:600 .8rem var(--f-body);background:var(--panel-2);border:1px solid var(--line);color:var(--fg);border-radius:3px;padding:0 5px}.side{flex-direction:column;gap:12px;min-width:0;display:flex}.box{background:var(--panel);border:1px solid var(--line);border-radius:6px;flex-direction:column;gap:10px;padding:14px;display:flex;position:relative}.box:before{content:"";pointer-events:none;border:1px solid #d9a9431f;border-radius:4px;position:absolute;inset:3px}.box h2{font-family:var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:0;font-size:.82rem;font-weight:700}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.row>*{min-width:0}label.f{color:var(--muted);flex-direction:column;flex:140px;gap:4px;font-size:.85rem;display:flex}.box>label.f,.panel-ed>label.f,.bubble-ed>label.f{flex:none}input[type=text],textarea,select{background:var(--panel-2);border:1px solid var(--line);width:100%;color:var(--fg);font:500 .98rem var(--f-body);border-radius:4px;padding:7px 9px}textarea{resize:vertical;min-height:72px}input[type=range]{width:100%;accent-color:var(--gold)}input:focus-visible,textarea:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:1px}.chk{color:var(--fg);align-items:center;gap:7px;font-size:.9rem;display:flex}.chk input{accent-color:var(--gold);width:16px;height:16px}button{font:700 .92rem var(--f-body);color:var(--fg);background:var(--panel-2);border:1px solid var(--line);cursor:pointer;border-radius:4px;padding:7px 11px}button:hover{border-color:var(--gold-soft)}button.on{border-color:var(--gold);color:#fff3cf;background:#3a2c14}button.primary{color:#1d1305;font-family:var(--f-display);letter-spacing:.05em;background:linear-gradient(#e7bb57,#a8771f);border-color:#f1d18a;font-weight:800}button.primary:hover{filter:brightness(1.08)}button.danger{color:#ffb7a8;border-color:#5a2a20}.counts button{width:38px;font-family:var(--f-display);padding:6px 0}.layouts{flex-wrap:wrap;gap:8px;display:flex}.lay{width:58px;padding:4px}.lay .mini{background:#0e0b08;width:100%;position:relative}.lay .mini i{background:#6d5a3a;outline:1px solid #0e0b08;position:absolute}.lay.on .mini i{background:var(--gold)}.adds{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.adds button{padding:8px 4px}.panel-ed,.bubble-ed{flex-direction:column;gap:10px;display:flex}.cast{flex-direction:column;gap:8px;display:flex}.crow{grid-template-columns:34px minmax(0,1fr) minmax(0,1fr) 30px;align-items:center;gap:6px;display:grid}.crow input[type=color]{background:var(--panel-2);border:1px solid var(--line);cursor:pointer;border-radius:4px;width:34px;height:34px;padding:2px}.crow button{padding:6px 0}@media (max-width:420px){.crow{grid-template-columns:34px minmax(0,1fr) 30px}.crow .ctitle{grid-column:2/3}}.muted{color:var(--muted);margin:0;font-size:.88rem}.sample-note{border-left:3px solid var(--gold);color:var(--fg);background:#241d12;margin:0;padding:4px 10px;font-size:.9rem}.site-foot{border-top:1px solid var(--line);color:var(--muted);flex-direction:column;gap:4px;padding-top:12px;font-size:.85rem;display:flex}.site-foot p{margin:0}.site-foot a{color:var(--gold)}.toast{left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));border:1px solid var(--gold-soft);color:var(--fg);z-index:30;background:#2f2516;border-radius:5px;max-width:calc(100% - 32px);padding:9px 16px;font-weight:700;position:fixed;transform:translate(-50%)}.modal{z-index:40;padding:max(16px, env(safe-area-inset-top,0px)) max(16px, env(safe-area-inset-right,0px)) max(16px, env(safe-area-inset-bottom,0px)) max(16px, env(safe-area-inset-left,0px));background:#050402d1;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal .card{background:var(--panel);border:1px solid var(--gold-soft);border-radius:6px;flex-direction:column;gap:10px;max-width:min(560px,100%);max-height:100%;padding:14px;display:flex}.modal img{object-fit:contain;align-self:center;max-width:100%;max-height:65vh}.sheet{z-index:20;background:var(--panel);border-top:1px solid var(--line);max-height:46vh;padding-bottom:env(safe-area-inset-bottom,0px);flex-direction:column-reverse;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -12px 30px -12px #000c}.sheet-tabs{border-top:1px solid var(--line);display:flex}.sheet-tabs button{background:var(--panel);color:var(--muted);font:700 .8rem var(--f-display);letter-spacing:.04em;border:0;border-top:2px solid #0000;border-radius:0;flex:1 1 0;padding:10px 2px}.sheet-tabs button.on{color:#fff3cf;border-top-color:var(--gold);background:#2a2114}.sheet-body{padding:10px 12px 12px;overflow:auto}.sheet-body .box{border-left:0;border-right:0;border-radius:0;margin:-10px -12px 0;padding:14px 16px}.sheet-body .box:before{display:none}@media (max-width:899px){.work{grid-template-columns:minmax(0,1fr)}.stage{position:static}.app{padding-bottom:calc(32px + var(--sheet-h,0px))}.hint-desktop{display:none}.hint-mobile{font-size:.82rem;display:block}.app{gap:10px;padding-block:10px 24px}.top{gap:4px 10px;padding-bottom:6px}.brand{font-size:1.3rem}.tag{font-size:.85rem}.stagebar button{padding:6px 9px;font-size:.85rem}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}.modal .card-wide{max-width:min(640px,100%)}.tpls{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;display:grid}.tpl{text-align:left;align-items:center;gap:12px;padding:10px;display:flex}.tpl .mini{background:#0e0b08;flex:none;width:54px;display:block;position:relative}.tpl .mini i{background:#6d5a3a;outline:1px solid #0e0b08;position:absolute}.tpl:hover .mini i{background:var(--gold)}.tpl-text{flex-direction:column;gap:2px;min-width:0;display:flex}.tpl-text strong{font-family:var(--f-display);letter-spacing:.03em;font-size:.95rem}.tpl-text .muted{font-weight:500}.alt{flex-direction:column;gap:6px;display:flex}.alt summary{cursor:pointer;color:var(--muted);font-size:.9rem}.alt textarea{min-height:96px;font-size:.88rem}
