:root{--ink:#16282c;--sheet:#e9ece8;--panel:#f7f8f5;--line:#cdd3cc;--accent:#0e5e63;--sel:#f2c230;--bad:#b3261e}
*{box-sizing:border-box}html,body{height:100%;margin:0}
body{display:grid;grid-template-columns:1fr 340px;font:15px/1.4 Figtree,system-ui,sans-serif;color:var(--ink);background:var(--sheet);overflow:hidden}
#views{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);min-width:0;min-height:0}#views section{position:relative;min-width:0;min-height:0;background:var(--sheet);overflow:hidden}canvas{width:100%;height:100%;display:block;touch-action:none}
aside{background:var(--panel);border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0;padding-bottom:env(safe-area-inset-bottom)}
#tabs{display:flex;overflow-x:auto;border-bottom:1px solid var(--line)}
#tabs button{flex:1 0 auto;padding:12px 10px;border:0;background:none;font:600 13px inherit;color:#5b6b6a;cursor:pointer;border-bottom:3px solid transparent}
#tabs button.on{color:var(--accent);border-color:var(--accent)}
#panel{padding:14px;overflow:auto;flex:1}
h3{margin:16px 0 8px;font-size:14px}h3:first-child{margin-top:0}
.row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.row>label{display:flex;flex-direction:column;font-size:12px;color:#51625f;gap:3px}
input,select{font:inherit;padding:9px;border:1px solid var(--line);border-radius:6px;background:#fff;width:100%;min-height:40px}
button.b{font:600 14px inherit;padding:10px 12px;border:1px solid var(--accent);background:#fff;color:var(--accent);border-radius:6px;cursor:pointer;min-height:42px}
button.b.p{background:var(--accent);color:#fff}button.b.d{border-color:var(--bad);color:var(--bad)}button.b:disabled{opacity:.45}
.btns{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}.item{display:flex;justify-content:space-between;width:100%;text-align:left;padding:10px;border:1px solid var(--line);background:#fff;border-radius:6px;margin-bottom:6px;font:inherit;cursor:pointer}
.item.on{border-color:var(--sel);box-shadow:0 0 0 2px var(--sel)}.tag{font-size:12px;color:#51625f}small{color:#51625f}
:focus-visible{outline:3px solid var(--sel);outline-offset:2px}
#toast{position:absolute;left:50%;top:12px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:10px 14px;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .2s}#toast.on{opacity:1}
@media(max-width:760px){#views{grid-template-columns:1fr;grid-template-rows:1fr 1fr}body{grid-template-columns:1fr;grid-template-rows:1fr 40dvh}aside{border-left:0;border-top:1px solid var(--line)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.bar{position:absolute;top:8px;left:8px;right:8px;display:flex;gap:8px;justify-content:space-between;align-items:center;pointer-events:none}.bar>*{pointer-events:auto}
.bar b{background:rgba(247,248,245,.92);padding:6px 10px;border-radius:6px;font-size:13px;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar .b{min-height:36px;padding:6px 10px;font-size:13px}.bar .b[aria-pressed=true]{background:var(--accent);color:#fff}
.bar2{top:52px;justify-content:flex-start;flex-wrap:wrap}.bar2 label{background:rgba(247,248,245,.92);padding:4px 8px;border-radius:6px;font-size:12px;display:flex;gap:6px;align-items:center}.bar2 input[type=number]{width:74px;min-height:30px;padding:3px 6px}.bar2 .ck input{width:auto;min-height:0}
#stat{position:absolute;left:8px;bottom:70px;margin:0;font-size:13px;background:rgba(247,248,245,.92);padding:4px 8px;border-radius:6px}#stat:empty{display:none}
#sw{position:absolute;left:0;right:0;bottom:22px;display:flex;gap:6px;overflow-x:auto;padding:6px 8px;background:rgba(247,248,245,.85)}#sw:empty{display:none}
.chip{flex:0 0 auto;width:34px;height:34px;border-radius:6px;border:2px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:grab;touch-action:none;background-size:cover}
#credit{position:absolute;left:8px;bottom:3px;font-size:11px;color:#3b4a49;max-width:96%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#credit a{color:inherit}
#ghost{position:fixed;z-index:20;pointer-events:none;background:var(--ink);color:#fff;padding:6px 10px;border-radius:6px;font-size:13px;min-width:34px;min-height:34px;box-shadow:0 2px 8px rgba(0,0,0,.3)}
#pp{margin:10px 0}p{margin:6px 0}