:root{--bg: #14151a;--panel: #1c1e26;--panel2: #242631;--line: #33353f;--fg: #e6e7ea;--muted: #9a9db0;--accent: #ff6a3d;--accent2: #4da3ff;--ok: #5fd07a;--err: #ff5c6c}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--fg);font:13px/1.4 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}body{display:flex;flex-direction:column;height:100vh;overflow:hidden}#topbar{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--panel);border-bottom:1px solid var(--line);flex:0 0 auto}.brand{color:var(--accent);font-size:16px;letter-spacing:.5px}.sub{color:var(--muted)}.spacer{flex:1}.clock{font-variant-numeric:tabular-nums;color:var(--accent2);min-width:66px;text-align:center}.btn{background:var(--panel2);color:var(--fg);border:1px solid var(--line);border-radius:6px;padding:6px 10px;cursor:pointer;font-size:13px}.btn:hover:not(:disabled){border-color:var(--accent)}.btn:disabled{opacity:.4;cursor:default}.btn.wide{width:100%;margin-top:6px}.field.note{font-size:11px;color:var(--muted);background:var(--panel2);border-radius:4px;padding:5px 7px;line-height:1.35}.modal{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:50}.modal[hidden]{display:none}.modal-box{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px;width:min(860px,92vw);max-height:88vh;overflow-y:auto}.modal-head{display:flex;align-items:center;justify-content:space-between}.modal-head h2{margin:0;font-size:16px}.modal-sub{color:var(--muted);font-size:12px;margin:6px 0 14px}.tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.tpl-card{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:8px;cursor:pointer;color:var(--fg);text-align:center;transition:border-color .12s,transform .12s}.tpl-card:hover{border-color:var(--accent);transform:translateY(-2px)}.tpl-card img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:50%;background:#000}.tpl-name{font-weight:600;margin-top:6px;font-size:13px}.tpl-style{color:var(--muted);font-size:11px;line-height:1.3;margin-top:2px}.btn.file{display:inline-flex;align-items:center}.chk{color:var(--muted);display:inline-flex;align-items:center;gap:4px}.seg{display:inline-flex;border:1px solid var(--line);border-radius:7px;overflow:hidden}.seg-btn{background:var(--panel2);color:var(--muted);border:0;padding:6px 12px;cursor:pointer;font-size:13px;border-right:1px solid var(--line)}.seg-btn:last-child{border-right:0}.seg-btn:hover:not(:disabled){color:var(--fg)}.seg-btn:disabled{opacity:.35;cursor:default}.seg-btn.active{background:var(--accent2);color:#06121f;font-weight:600}#segAod.active{background:#8a7bd8;color:#0a0714}body.aod-mode #left{border-top:2px solid #8a7bd8}body.aod-mode #layersTitle{color:#b3a6f0}body.aod-mode #preview{box-shadow:0 0 0 6px #12101c,0 0 0 8px #8a7bd8,0 10px 40px #0009}.aod-badge{display:none}body.aod-mode .aod-badge{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:10px;background:#8a7bd8;color:#0a0714;font-size:11px;font-weight:600;vertical-align:middle}#layout{flex:1;display:grid;grid-template-columns:240px 1fr 340px;min-height:0}#left,#right{background:var(--panel);overflow-y:auto}#left{border-right:1px solid var(--line)}#right{border-left:1px solid var(--line);display:flex;flex-direction:column}h2{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:12px 12px 6px}.layers{list-style:none;margin:0;padding:0 6px 12px}.layers li{padding:7px 10px;border-radius:6px;cursor:pointer;display:flex;align-items:center;gap:8px;color:var(--fg)}.layers li:hover{background:var(--panel2)}.layers li.sel{background:#2d3444;outline:1px solid var(--accent2)}.layers li .kind{font-size:11px;color:var(--muted);margin-left:auto}.layers li.hidden-layer{opacity:.45}.layers li .reorder{display:none;gap:2px}.layers li:hover .reorder,.layers li.sel .reorder{display:inline-flex}.layers li .reorder button{background:var(--panel2);border:1px solid #3a4152;color:var(--fg);border-radius:4px;font-size:9px;line-height:1;padding:2px 4px;cursor:pointer}.layers li .reorder button:hover{border-color:var(--accent)}#center{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;padding:16px;gap:12px}#stage{position:relative}#preview{width:466px;height:466px;max-width:min(60vh,100%);max-height:60vh;border-radius:50%;background:#000;box-shadow:0 0 0 6px #0a0a0c,0 10px 40px #0009;cursor:grab;touch-action:none}#preview.dragging{cursor:grabbing}.hover{position:absolute;top:6px;left:6px;background:#0009;color:#fff;padding:2px 6px;border-radius:4px;font-variant-numeric:tabular-nums;font-size:11px;pointer-events:none;opacity:0}#stage:hover .hover{opacity:1}.assetbar{display:flex;flex-wrap:wrap;gap:6px;max-width:640px;justify-content:center}.simpanel{width:100%;max-width:466px;margin-top:8px}.simpanel h2{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0 0 4px}.simrow{display:flex;align-items:center;gap:8px;padding:2px 0}.simrow label{width:120px;color:var(--muted);font-size:12px}.simrow input[type=range]{flex:1}.simrow .simval{width:72px;text-align:right;font-variant-numeric:tabular-nums;color:var(--fg);font-size:12px}.assetbar .asset{width:48px;height:48px;border:1px solid var(--line);border-radius:6px;background:#000 center/contain no-repeat;background-image:linear-gradient(45deg,#222 25%,transparent 25%),linear-gradient(-45deg,#222 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#222 75%),linear-gradient(-45deg,transparent 75%,#222 75%);background-size:12px 12px;background-position:0 0,0 6px,6px -6px,-6px 0;cursor:pointer;position:relative;overflow:hidden}.assetbar .asset img{width:100%;height:100%;object-fit:contain}.assetbar .asset:hover{border-color:var(--accent)}.assetbar .asset .cf{position:absolute;bottom:0;right:0;font-size:9px;background:#000000b3;padding:0 2px;color:var(--muted)}#inspector{flex:0 0 auto}#jsonPane{flex:1;display:flex;flex-direction:column;min-height:0;padding:0 12px 12px}.insp-empty{color:var(--muted);padding:0 12px 12px}.field{display:flex;align-items:center;gap:8px;padding:3px 12px}.field label{width:64px;color:var(--muted)}.field input[type=number],.field select{flex:1;background:var(--panel2);color:var(--fg);border:1px solid var(--line);border-radius:5px;padding:4px 6px}.field.full{flex-direction:column;align-items:stretch}#jsonText{flex:1;width:100%;min-height:160px;background:#0f1013;color:#cfe3ff;border:1px solid var(--line);border-radius:6px;padding:8px;font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;resize:none;white-space:pre;overflow:auto}.json-error{background:#3a1f24;color:var(--err);border:1px solid var(--err);border-radius:6px;padding:6px 8px;margin-bottom:6px;font:12px/1.4 ui-monospace,monospace}.status{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 12px;background:var(--panel);border-top:1px solid var(--line);color:var(--muted)}.build{flex:0 0 auto;font-size:11px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);opacity:.6;text-decoration:none}.build:hover{opacity:1}.status.ok{color:var(--ok)}.status.err{color:var(--err)}.status code{color:var(--fg);background:var(--panel2);padding:1px 4px;border-radius:4px}.btn.danger{color:#ff7a6b;border-color:#5a2a2a}.btn.danger:hover{background:#3a1e1e;border-color:#ff5b5b}.validation{border-radius:8px;padding:8px 10px;margin-bottom:10px;font-size:12px;border:1px solid var(--line);background:var(--panel2)}.validation.ok{border-color:#2c5d3a;background:#16241b}.validation.warn{border-color:#6b5a2a;background:#241f14}.validation.err{border-color:#7a2c34;background:#241416}.validation .vhead{font-weight:600;display:block}.validation.ok .vhead{color:var(--ok)}.validation.warn .vhead{color:#e6c76a}.validation.err .vhead{color:var(--err)}.validation .vsub{color:var(--muted);font-size:11px}.validation .vlist{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}.validation .vlist li{padding:4px 6px;border-radius:4px;background:#00000040;line-height:1.3;cursor:pointer}.validation .vlist li.err{border-left:3px solid var(--err)}.validation .vlist li.warn{border-left:3px solid #e6c76a}.validation .vlist li:hover{background:#00000073}.lbadge{font-size:11px;margin:0 4px}.lbadge.err{color:var(--err)}.lbadge.warn{color:#e6c76a}.budget{display:flex;flex-direction:column;gap:4px;background:var(--panel2);border-radius:6px;padding:7px 9px}.budget-head{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.budget-num{font-variant-numeric:tabular-nums;color:var(--fg)}.budget-bar{height:6px;border-radius:3px;background:#0d0e12;overflow:hidden}.budget-fill{height:100%;background:var(--ok);transition:width .15s}.budget.over .budget-fill{background:var(--err)}.budget-sub{font-size:10.5px;color:var(--muted)}.budget.over .budget-sub{color:var(--err)}@media (max-width: 900px){body{height:auto;min-height:100vh;overflow-y:auto}#topbar{flex-wrap:wrap;gap:6px}#topbar .sub{flex-basis:100%}#layout{display:flex;flex-direction:column}#center{order:1;padding:12px 8px}#left{order:2;border-right:none;border-top:1px solid var(--line)}#right{order:3;border-left:none;border-top:1px solid var(--line)}#left,#right{width:100%;overflow:visible}#right{display:block}#preview{width:min(92vw,78vh);height:min(92vw,78vh);max-width:none;max-height:none}.simpanel,.assetbar{max-width:92vw}.layers{max-height:40vh;overflow-y:auto}#jsonText{min-height:140px}}
