:root{color:#111;background:#fbf7ee;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input,select{font:inherit}button{border:1px solid #7f95a5;background:#eef3f5;color:#111;border-radius:6px;padding:6px 9px;cursor:pointer}button:hover,button.active{background:#8fa7b8;color:#fff}.shell{height:100vh;display:grid;grid-template-columns:286px 1fr 230px;grid-template-rows:auto 1fr auto;background:#fbf7ee}.topbar{grid-column:1 / 4;min-height:54px;display:flex;gap:10px;align-items:center;padding:8px 12px;background:#8fa7b8;color:#111;border-bottom:1px solid #6f8798}.topbar strong{white-space:nowrap}.tabs,.filebar{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.filebar button,.tabs button{padding:5px 8px}.drawer-toggle{display:none;margin-left:auto}.panel{background:#f4efe5;border-color:#d7d1c6;overflow:auto;padding:12px}.left{border-right:1px solid #d7d1c6}.right{border-left:1px solid #d7d1c6}label{display:grid;gap:5px;margin:0 0 10px;font-size:13px}input,select{width:100%;border:1px solid #c7c0b6;border-radius:6px;padding:7px 8px;background:#fffdf8;color:#111}.panel button{width:100%;margin:4px 0}.stage{min-width:0;min-height:0;position:relative;background:#fbf7ee;touch-action:none}canvas{display:block;width:100%;height:100%;cursor:crosshair}.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:12px}.swatch{aspect-ratio:1;background:var(--c);border:1px solid #777;min-height:34px}.swatch.active-swatch{outline:3px solid #d33f49;outline-offset:2px}.brush,.mark-nav{background:#fffdf8;border:1px solid #d7d1c6;border-radius:6px;padding:8px;margin:8px 0 10px;font-size:12px;line-height:1.45}.mark-nav button{margin-top:6px}.checks{margin:10px 0}.checks label{grid-template-columns:auto 1fr;align-items:center;gap:7px;margin-bottom:7px}.checks input{width:auto}.status{grid-column:1 / 4;display:flex;justify-content:space-between;gap:12px;padding:6px 12px;color:#333;background:#eee7dc;border-top:1px solid #d7d1c6;font-size:12px}@media(max-width:840px){body{overflow:hidden}.shell{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.topbar{grid-column:1;align-items:flex-start;flex-wrap:wrap}.filebar{max-height:72px;overflow:auto}.drawer-toggle{display:block}.panel{position:fixed;top:92px;bottom:28px;width:min(88vw,340px);z-index:4;transform:translate(-110%);transition:transform .2s ease;box-shadow:0 10px 30px #0002}.right{right:0;transform:translate(110%)}body.drawer-open .left,body.drawer-open .right{transform:translate(0)}.stage,.status{grid-column:1}}@media print{.topbar,.panel,.status{display:none}.shell{display:block}.stage{width:100vw;height:100vh}}