:root{color-scheme:dark;--bg:#18181e;--panel:#222229;--line:#36343f;--muted:#b0acbb;--text:#efedf5;--accent:#bc9aef}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.45 Arial,sans-serif;overflow:hidden}button,input,select,textarea{font:inherit}button{color:inherit;background:#2c2b34;border:1px solid var(--line);border-radius:8px;padding:9px 12px;cursor:pointer;min-height:40px}button:hover{background:#3b3748}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.primary{background:var(--accent);color:#23162f;border-color:transparent}button:disabled{opacity:.4;cursor:default}input,select,textarea{background:#19191f;color:var(--text);border:1px solid var(--line);border-radius:7px;padding:8px;max-width:100%}input[type=range]{width:100%;padding:0;accent-color:var(--accent);margin:8px 0 16px}input[type=checkbox]{accent-color:var(--accent);width:18px;height:18px}header{height:64px;display:flex;align-items:center;gap:24px;padding:0 22px;border-bottom:1px solid var(--line)}.brand{font-family:Georgia,serif;font-size:26px;text-decoration:none;color:var(--text);white-space:nowrap}.brand span{color:var(--accent)}.brand small{font:10px Arial;letter-spacing:2px;color:var(--muted);margin-left:8px}#projectName{border:0;background:transparent;width:220px}#saveStatus{margin-left:auto;font-size:12px;color:var(--muted)}.topbar{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;gap:12px;border-bottom:1px solid var(--line)}.workspace-label{font-weight:bold}.workspace-label span{display:block;font-size:11px;color:var(--muted);font-weight:normal}.file-actions{display:flex;gap:8px}main{height:calc(100dvh - 126px);display:grid;grid-template-columns:76px minmax(0,1fr) 286px}.tools{padding:14px 7px;display:flex;flex-direction:column;gap:4px;border-right:1px solid var(--line);overflow:auto}.tools button{border:0;background:transparent;min-height:54px;padding:5px 2px}.tools b{display:block;font-size:23px;font-weight:normal;line-height:1.1}.tools span{font-size:10px;color:var(--muted)}.tools button.active{background:#443353;color:#dfc7ff}.tools button.active span{color:#e3d1fa}.tool-divider{border-top:1px solid var(--line);margin:8px}.stage{position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#33313d,#1e1e25);min-height:0}#surface{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.stage-caption{position:absolute;top:14px;left:18px;right:18px;z-index:2;display:flex;align-items:center;justify-content:space-between;pointer-events:none;gap:10px}.stage-caption span{font-size:10px;letter-spacing:2px;color:#aaa3b6}.stage-caption button{pointer-events:auto;font-size:11px;background:#24232dcc}.stage-bottom{position:absolute;bottom:16px;left:18px;right:18px;display:flex;gap:5px;align-items:center;pointer-events:none}.stage-bottom button{pointer-events:auto;min-height:36px;padding:6px 9px;background:#25232eea}#dimensions{font-size:11px;margin-left:10px;color:var(--muted)}#inputHint{margin-left:auto;font-size:10px;color:var(--muted)}.properties{background:var(--panel);border-left:1px solid var(--line);overflow:auto;padding:16px}.panel-heading{display:none}.properties section{padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--line)}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;font-weight:bold}.section-title span{font-size:11px;font-weight:normal;color:var(--muted)}.section-title button{min-height:28px;padding:2px 9px}.brushes{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:14px}.brushes button{font-size:12px}.selected{background:#463550!important;border-color:#a68abe!important}.range-label{display:flex;justify-content:space-between;font-size:12px}output{color:var(--muted)}.color-row{display:flex;gap:10px;align-items:center}.color-row input{width:40px;height:40px;padding:2px}.color-row span{font-size:11px}#swatches{display:flex;gap:8px;margin:12px 0;flex-wrap:wrap}#swatches button{width:25px;height:25px;min-height:25px;padding:0;border-radius:50%;border:2px solid #8b8494}.check{display:flex;gap:8px;align-items:center;font-size:12px;margin:8px 0}.note{color:var(--muted);font-size:11px;margin:10px 0 0}.properties textarea,.properties select{width:100%;margin-bottom:8px}.split{display:flex;align-items:center;gap:8px;font-size:11px}.split input{width:65px}.split button{font-size:11px}.layer{display:flex;align-items:center;gap:6px;padding:7px 5px;margin-bottom:5px;border:1px solid transparent;border-radius:8px}.layer.current{background:#3d314b;border-color:#7c6594}.layer button{padding:3px;min-height:32px;background:transparent;border:0}.layer .layer-name{flex:1;text-align:left;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer small{color:var(--muted)}.layer-actions{display:flex;gap:5px;margin:10px 0 14px}.layer-actions button{font-size:11px;padding:6px 8px}.panel-foot{font-size:11px;color:var(--muted);padding-bottom:15px}.mobile-bar{display:none}dialog{max-width:540px;width:calc(100% - 28px);max-height:85dvh;overflow:auto;background:#282630;color:var(--text);border:1px solid #71617f;border-radius:18px;padding:26px;box-shadow:0 24px 100px #0008}dialog::backdrop{background:#111a}dialog h2{font-family:Georgia,serif;font-weight:normal;font-size:28px;margin-top:0}dialog p,dialog li{color:#cbc4d4;font-size:13px}dialog li{margin:10px 0}dialog label{display:block;margin:12px 0}dialog label input{float:right;width:130px}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:25px}#toast{position:fixed;bottom:65px;left:50%;transform:translateX(-50%);background:#e6d4fb;color:#30213d;padding:12px 18px;border-radius:12px;box-shadow:0 8px 40px #0006;z-index:20;display:none;max-width:90vw;font-size:13px}
@media(max-width:1100px){main{grid-template-columns:66px minmax(0,1fr) 250px}.properties{padding:12px}.workspace-label span{display:none}#inputHint{display:none}.brand small{display:none}.file-actions button{font-size:12px;padding:8px}}
@media(max-width:820px){header{height:56px;padding:0 12px;gap:10px}.brand{font-size:23px}#projectName{width:160px;font-size:12px}#saveStatus{font-size:10px;max-width:100px}.topbar{height:56px;padding:6px 10px;overflow-x:auto}.workspace-label{display:none}.file-actions{width:100%;justify-content:space-between}.file-actions button{white-space:nowrap;min-height:40px}main{height:calc(100dvh - 166px);grid-template-columns:60px minmax(0,1fr)}.properties{display:none;position:fixed;right:0;top:56px;bottom:54px;width:min(340px,90vw);z-index:10;box-shadow:-20px 0 60px #0007}.properties.open{display:block}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.panel-heading button{font-size:22px}.mobile-bar{display:flex;height:54px;align-items:center;justify-content:space-between;padding:5px 10px;background:var(--panel);border-top:1px solid var(--line)}.mobile-bar button{font-size:12px}.stage-caption span{display:none}.stage-caption{justify-content:flex-end;top:10px;right:10px}.stage-bottom{left:8px;right:8px;bottom:8px}.tools{padding:6px 3px}.tools button{min-height:49px}.tools span{font-size:9px}#dimensions{font-size:10px;margin-left:4px}}
@media(max-width:460px){#saveStatus{display:none}#projectName{flex:1;width:80px}.file-actions button{font-size:10px;padding:6px}.stage-caption button{font-size:10px}#dimensions{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
:root{color-scheme:light;--bg:#f5f0fc;--panel:#fcfaff;--line:#ded2ed;--muted:#6e617e;--text:#392c49;--accent:#bb96ef}
body{background:var(--bg)}header,.topbar{background:#faf6ff}input,select,textarea{background:#fff;color:var(--text)}button{background:#f0e7fb}button:hover{background:#e7d8f8}.brand{display:flex;align-items:center;gap:0;font-family:Georgia,serif}.brand img{width:38px;height:38px;border-radius:9px;margin-right:2px}.stage{background:radial-gradient(ellipse at 50% 45%,#eee3fb,#dbc8f0)}.stage-caption span{color:#756184}.stage-caption button,.stage-bottom button{background:#fffaf2ed;color:#544163;border-color:#d8c5e9}.tools button.active{background:#dfcaf8;color:#5d358d}.tools button.active span{color:#5d358d}.selected{background:#e9d8fc!important;border-color:#b18bd6!important}.layer.current{background:#efe2fc;border-color:#c5a7e4}.properties{background:#fcfaff}dialog{background:#fcf8ff;color:#392c49;border-color:#d2b8eb}dialog p,dialog li{color:#655273}dialog::backdrop{background:#5c41745c}
.topbar{overflow:auto}.topbar>a{white-space:nowrap;font-size:12px;text-decoration:none;padding:8px;border-radius:7px;background:#eee2fc}.file-actions{flex-shrink:0}

.studio-nav{height:44px;display:flex;align-items:center;gap:6px;overflow:auto;padding:4px 15px;background:#efe2fc;border-bottom:1px solid #d5bee9}.studio-nav a{font-size:12px;color:#654280;white-space:nowrap;text-decoration:none;padding:7px 10px;border-radius:8px}.studio-nav a:hover{background:#dec8f5}main{height:calc(100dvh - 170px)}@media(max-width:820px){main{height:calc(100dvh - 210px)}.studio-nav{padding:4px 8px}}