:root,:root[data-theme=granat]{--bg: #0b1033;--panel: #0e1440;--panel2: #151c4d;--line: #20285a;--line2: #2c3570;--text: #ffffff;--dim: #8a91c4;--accent: #5ec8ff;--accent2: #f0b54a;--sel: #5868e6;--ok: #3fcf8e;--err: #ff5d4f;--input: #0b1033;color-scheme:dark}:root[data-theme=dark]{--bg: #03050f;--panel: #080c28;--panel2: #10163d;--line: #161d4d;--line2: #1d255c;--input: #060920;--dim: #858dc0}:root[data-theme=light]{--bg: #f3f4fa;--panel: #ffffff;--panel2: #eef0f8;--line: #dfe2f1;--line2: #c9cde3;--text: #0b1033;--dim: #5f6590;--accent: #0b6ea8;--accent2: #9a6400;--sel: #3b4cca;--ok: #14935a;--err: #d42a25;--input: #ffffff;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:12.5px/1.35 IBM Plex Sans,Segoe UI,system-ui,sans-serif;overflow:hidden}.mono,code,kbd{font-family:IBM Plex Mono,ui-monospace,Consolas,monospace}button,input,select{font:inherit;color:inherit}.c-app{display:grid;grid-template-rows:36px auto 1fr auto 26px;grid-template-columns:minmax(0,1fr);height:100%}.c-app>*{min-width:0}.c-head{display:flex;align-items:center;gap:10px;padding:0 8px;background:var(--panel);border-bottom:1px solid var(--line);min-width:0}.c-brand{display:flex;align-items:center;gap:7px;letter-spacing:.2em;font-size:12.5px}.c-brand b{font-weight:600}.c-menubar{display:flex}.c-menuwrap{position:relative}.c-menubar>div>button{background:none;border:0;padding:6px 9px;border-radius:4px;cursor:pointer}.c-menubar>div>button:hover,.c-menubar>div>button[aria-expanded=true]{background:var(--panel2)}.c-menu{position:absolute;top:100%;left:0;z-index:20;min-width:250px;background:var(--panel);border:1px solid var(--line2);border-radius:6px;padding:4px;box-shadow:0 10px 30px #00000059}.c-menu button{display:flex;justify-content:space-between;gap:18px;width:100%;text-align:left;background:none;border:0;padding:6px 8px;border-radius:4px;cursor:pointer}.c-menu button:hover{background:var(--panel2)}.c-menu kbd{color:var(--dim);font-size:11px}.c-title{flex:1;display:flex;gap:8px;align-items:center;justify-content:center;min-width:0}.c-title input{background:transparent;border:1px solid transparent;border-radius:4px;padding:3px 6px;text-align:center;width:min(260px,40vw);font-weight:500}.c-title input:hover,.c-title input:focus{border-color:var(--line2);background:var(--input);outline:none}.c-saved,.c-dirty{font-size:11px;color:var(--dim);white-space:nowrap}.c-saved{color:var(--ok)}.c-themes{display:flex;border:1px solid var(--line2);border-radius:5px;overflow:hidden}.c-themes button{border:0;background:none;width:26px;height:24px;cursor:pointer;color:var(--dim)}.c-themes button.on{background:var(--sel);color:#fff}.c-ribbon{display:flex;gap:2px;align-items:stretch;padding:4px 6px 2px;background:var(--panel);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:thin}.c-group{display:flex;flex-direction:column;align-items:center;padding:0 8px;border-right:1px solid var(--line);gap:2px;flex:none}.c-gbtns{display:flex;gap:1px}.c-glabel{font-size:10.5px;color:var(--dim);letter-spacing:.04em}.c-tool{width:32px;height:32px;display:grid;place-items:center;border:1px solid transparent;background:none;border-radius:5px;cursor:pointer;color:var(--text)}.c-tool:hover:not(:disabled){background:var(--panel2);border-color:var(--line)}.c-tool.on{color:var(--accent);background:var(--panel2);border-color:var(--line2)}.c-tool:disabled{opacity:.35;cursor:default}.c-layersel{justify-content:center}.c-layersel select{background:var(--input);border:1px solid var(--line2);border-radius:4px;height:26px;min-width:130px;padding:0 4px}.c-main{display:grid;grid-template-columns:1fr 290px;min-height:0}.c-app.nopanel .c-main{grid-template-columns:1fr}.c-canvas{position:relative;min-width:0;min-height:0;overflow:hidden}.c-canvas canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:none;touch-action:none}.c-empty{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px 16px;color:var(--dim);text-align:center;pointer-events:none;max-width:90%;line-height:1.7}.c-empty code{color:var(--text)}.c-side{background:var(--panel);border-left:1px solid var(--line);overflow:auto}.c-side section{padding:8px 10px 12px;border-bottom:1px solid var(--line)}.c-side h2{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim);margin:0 0 6px;display:flex;justify-content:space-between;align-items:center;font-weight:600}.c-mini{background:var(--panel2);border:1px solid var(--line2);border-radius:4px;padding:2px 8px;cursor:pointer;font-size:11.5px;text-transform:none;letter-spacing:0}.c-mini:hover{border-color:var(--sel)}.c-mini.danger{color:var(--err);margin-top:6px}.c-layers{width:100%;border-collapse:collapse}.c-layers td{padding:2px 3px}.c-layers tr.cur{background:var(--panel2)}.c-layers input[type=color]{width:22px;height:18px;padding:0;border:1px solid var(--line2);background:none;border-radius:3px;cursor:pointer}.c-lname{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.c-ico{background:none;border:0;cursor:pointer;width:24px;height:24px;border-radius:4px;color:var(--text)}.c-ico:hover:not(:disabled){background:var(--panel2)}.c-ico:disabled{opacity:.3;cursor:default}.c-ico{display:grid;place-items:center}.c-ico.off{color:var(--dim)}.c-ico.warn{color:var(--accent2)}.c-dimtxt{color:var(--dim)}.c-props{display:flex;flex-direction:column;gap:5px}.c-props>div{display:grid;grid-template-columns:96px 1fr;align-items:center;gap:6px}.c-props>div>span,.c-props label{color:var(--dim)}.c-props b{font-weight:500;word-break:break-word}.c-props input:not([type=color]),.c-props select{background:var(--input);border:1px solid var(--line2);border-radius:4px;height:26px;padding:0 6px;width:100%;min-width:0}.c-row{display:flex;gap:6px;align-items:center}.c-props input[type=color]{width:30px;height:24px;border:1px solid var(--line2);border-radius:4px;padding:0;background:none}.c-snaps{display:grid;grid-template-columns:1fr 1fr;gap:3px 8px}.c-snaps label{display:flex;gap:5px;align-items:center;cursor:pointer}.c-gridin{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:8px;color:var(--dim)}.c-gridin input{width:80px;background:var(--input);border:1px solid var(--line2);border-radius:4px;height:24px;padding:0 6px}.c-cmd{background:var(--panel);border-top:1px solid var(--line)}.c-log{height:72px;overflow-y:auto;padding:4px 10px;color:var(--dim);font-size:12px;line-height:16px}.c-log div:last-child{color:var(--text)}.c-prompt{display:flex;align-items:center;gap:8px;padding:4px 10px 6px;border-top:1px solid var(--line)}.c-prompt>span:first-child{white-space:nowrap;color:var(--accent);max-width:55%;overflow:hidden;text-overflow:ellipsis}.c-prompt input{flex:1;min-width:60px;background:var(--input);border:1px solid var(--line2);border-radius:4px;height:28px;padding:0 8px}.c-prompt input:focus{outline:none;border-color:var(--sel)}.c-opts{display:flex;gap:3px}.c-opts button{background:var(--panel2);border:1px solid var(--line2);border-radius:4px;padding:2px 7px;cursor:pointer;font-size:11.5px}.c-opts button:hover{border-color:var(--accent)}.c-status{display:flex;align-items:center;gap:4px;padding:0 8px;min-height:26px;background:var(--panel);border-top:1px solid var(--line);font-size:11.5px;white-space:nowrap;overflow:hidden}.c-coords{min-width:170px}.c-status button{background:none;border:1px solid transparent;border-radius:3px;padding:1px 7px;cursor:pointer;color:var(--dim);font-size:11px;letter-spacing:.04em}.c-status button.on{color:var(--accent);border-color:var(--line2);background:var(--panel2)}.c-status .c-dimtxt{margin-left:auto}.c-layerst{color:var(--dim);padding:0 6px}.c-layerst b{color:var(--text);font-weight:500}@media(max-width:760px){.c-main{grid-template-columns:1fr;grid-template-rows:1fr 40%}.c-side{border-left:0;border-top:1px solid var(--line)}.c-saved,.c-dirty,.c-title,.c-brand b{display:none}.c-head{justify-content:space-between}.c-log{height:40px}.c-coords{min-width:120px}.c-status .c-dimtxt{display:none}.c-app{grid-template-rows:36px auto 1fr auto auto}.c-tool{width:40px;height:40px}.c-prompt{flex-wrap:wrap;row-gap:4px}.c-prompt>span:first-child{max-width:100%;white-space:normal;flex-basis:100%}.c-status button,.c-mini,.c-opts button{min-height:28px;min-width:32px}.c-status{gap:2px}.c-layers input[type=color]{width:28px;height:26px}.c-ico{width:30px;height:30px}.c-status .c-layerst{display:none}}
