:root{--bg:#1e1e22;--panel:#2a2a30;--panel-2:#33333b;--border:#3d3d46;--text:#e6e6ea;--muted:#9a9aa6;--accent:#5b9bff;--accent-bg:#5b9bff2e;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);overscroll-behavior:none;-webkit-user-select:none;user-select:none;margin:0;font:13px/1.4 system-ui,Hiragino Sans,Yu Gothic UI,Noto Sans JP,sans-serif;overflow:hidden}button,select,input{font:inherit;color:inherit}button{cursor:pointer}.hidden{display:none!important}.sr{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.spacer{flex:1}svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}#app{height:100dvh;padding-bottom:env(safe-area-inset-bottom);grid-template-rows:auto auto 1fr auto;display:grid}#topbar{background:var(--panel);border-bottom:1px solid var(--border);align-items:center;gap:4px;min-height:36px;padding:2px 8px;display:flex}.menus{display:flex}.menu{position:relative}.menu-btn{background:0 0;border:0;border-radius:4px;padding:7px 10px}.menu-btn:hover,.menu.open .menu-btn{background:var(--panel-2)}.dropdown{z-index:50;background:var(--panel-2);border:1px solid var(--border);border-radius:6px;min-width:220px;padding:4px;display:none;position:absolute;top:100%;left:0;box-shadow:0 8px 24px #00000073}.menu.open .dropdown{display:block}.dropdown button{text-align:left;background:0 0;border:0;border-radius:4px;justify-content:space-between;gap:24px;width:100%;padding:8px 10px;display:flex}.dropdown button:hover{background:var(--accent-bg)}kbd{color:var(--muted);font:inherit;font-size:11px}.lang select,select,input[type=number]{background:var(--bg);border:1px solid var(--border);border-radius:4px;padding:4px 6px}.icon-btn{width:32px;height:32px;color:var(--text);background:0 0;border:0;border-radius:4px;place-items:center;display:grid}.icon-btn:hover{background:var(--panel-2)}.icon-btn.small{width:26px;height:26px}.icon-btn.small svg{width:16px;height:16px}.only-mobile{display:none}#options{background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:4px 20px;min-height:34px;padding:4px 10px;display:flex}.opt{align-items:center;gap:8px;display:flex}.opt label{color:var(--muted);white-space:nowrap;gap:6px;display:flex}.opt output{min-width:38px;color:var(--text);text-align:right;display:inline-block}.opt input[type=range]{width:130px}input[type=range]{accent-color:var(--accent)}main{grid-template-columns:auto 1fr 250px;min-height:0;display:grid}#toolbar{background:var(--panel);border-right:1px solid var(--border);flex-direction:column;align-items:center;gap:8px;padding:6px;display:flex}#tools{flex-direction:column;gap:2px;display:flex}.tool-btn{width:38px;height:38px;color:var(--text);background:0 0;border:1px solid #0000;border-radius:6px;place-items:center;display:grid}.tool-btn:hover{background:var(--panel-2)}.tool-btn.active{background:var(--accent-bg);border-color:var(--accent);color:var(--accent)}.tool-btn svg{width:22px;height:22px}.tool-btn{position:relative}.tool-btn.has-flyout:after{content:"";opacity:.75;border:3.5px solid;border-color:#0000 currentColor currentColor #0000;position:absolute;bottom:3px;right:3px}.tool-flyout{z-index:60;background:var(--panel);border:1px solid var(--border);border-radius:8px;min-width:220px;padding:4px;position:fixed;box-shadow:0 8px 24px #00000073}.flyout-item{width:100%;color:var(--text);text-align:left;background:0 0;border:0;border-radius:6px;grid-template-columns:24px 1fr auto;align-items:center;gap:10px;padding:7px 10px;display:grid}.flyout-item:hover{background:var(--panel-2)}.flyout-item.active{background:var(--accent-bg);color:var(--accent)}.flyout-item svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.flyout-item kbd{color:var(--muted);font:inherit;font-size:12px}.colors{width:40px;height:56px;margin-top:auto;position:relative}.colors input[type=color]{border:2px solid var(--text);cursor:pointer;background:0 0;border-radius:4px;width:26px;height:26px;padding:0;position:absolute}.colors input[type=color]::-webkit-color-swatch-wrapper{padding:0}.colors input[type=color]::-webkit-color-swatch{border:0;border-radius:2px}#colorFg{z-index:2;top:0;left:0}#colorBg{top:12px;left:12px}#btnSwap{position:absolute;top:36px;left:6px}#stage{min-width:0;min-height:0;position:relative;overflow:hidden}#view{touch-action:none;position:absolute;inset:0}#panel{background:var(--panel);border-left:1px solid var(--border);flex-direction:column;min-height:0;display:flex}#panel h2{color:var(--muted);margin:0;padding:8px 10px;font-size:12px;font-weight:600}.layer-props{border-bottom:1px solid var(--border);gap:6px;padding:0 10px 8px;display:grid}.row{align-items:center;gap:8px;display:flex}.row>span{min-width:60px;color:var(--muted)}.row select,.row input[type=number],.row input[type=range]{flex:1;min-width:0}.row output{text-align:right;min-width:36px}#layers{flex:1;padding:4px;overflow-y:auto}.layer{cursor:pointer;border:1px solid #0000;border-radius:6px;align-items:center;gap:6px;padding:4px;display:flex}.layer:hover{background:var(--panel-2)}.layer.active{background:var(--accent-bg);border-color:var(--accent)}.layer.hidden-layer .layer-name,.layer.hidden-layer canvas{opacity:.4}.layer canvas{border-radius:3px;flex:none;width:36px;height:36px}.layer-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.layer-actions{border-top:1px solid var(--border);flex-wrap:wrap;justify-content:space-around;row-gap:2px;padding:4px;display:flex}.layer-actions .la-sep{flex-basis:100%;height:0}.fx-btn svg{width:24px;height:24px}.layer.picked{background:#5b9bff1a;border-color:#5b9bff8c}.layer .link-badge{width:22px;height:22px;color:var(--accent);background:0 0;border:0;border-radius:4px;flex:none;place-items:center;padding:0;display:grid}.layer .link-badge:hover{background:var(--panel-2)}.layer .link-badge svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:15px;height:15px}#status{background:var(--panel);border-top:1px solid var(--border);min-height:28px;color:var(--muted);align-items:center;gap:14px;padding:2px 10px;display:flex}#stSave.error{color:#ff7a7a}.zoom-label{min-width:52px;color:var(--text);text-align:center;background:0 0;border:0;border-radius:4px;padding:4px}.zoom-label:hover{background:var(--panel-2)}dialog{background:var(--panel);width:min(360px,100vw - 32px);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:16px;box-shadow:0 16px 48px #0009}dialog::backdrop{background:#0000008c}dialog h3{margin:0 0 12px;font-size:15px}dialog form{gap:10px;display:grid}.dlg-actions{justify-content:flex-end;gap:8px;margin-top:6px;display:flex}.dlg-actions button{background:var(--panel-2);border:1px solid var(--border);border-radius:6px;padding:7px 16px}.dlg-actions button.primary{background:var(--accent);border-color:var(--accent);color:#fff}@media (width<=800px){main{grid-template-rows:1fr auto;grid-template-columns:1fr;position:relative}#stage{grid-row:1}#toolbar{border-right:0;border-top:1px solid var(--border);flex-direction:row;grid-row:2;justify-content:space-between;padding:4px 8px}#tools{flex-direction:row;overflow-x:auto}.tool-btn{flex:none;width:44px;height:44px}.colors{flex:none;margin:0 8px 0 0}.only-mobile{display:grid}#panel{z-index:20;border:1px solid var(--border);border-radius:10px 0 0;width:min(300px,100%);max-height:60%;display:none;position:absolute;bottom:58px;right:0;box-shadow:0 -4px 24px #00000080}#panel.show{display:flex}.icon-btn{width:40px;height:40px}.opt input[type=range]{width:100px}#options{gap:2px 14px}#stPos{display:none}.menu-btn{padding:9px 8px}}.toggle{background:var(--bg);border:1px solid var(--border);border-radius:4px;width:30px;height:28px}.toggle.active{background:var(--accent-bg);border-color:var(--accent);color:var(--accent)}.text-editor{z-index:5;outline:1px dashed var(--accent);outline-offset:2px;resize:none;white-space:pre;-webkit-user-select:text;user-select:text;background:0 0;border:0;min-width:1ch;margin:0;padding:0;line-height:1.25;position:absolute;overflow:hidden}#dlgNew{width:min(820px,100vw - 24px)}.newdoc{grid-template-columns:1fr 230px;gap:16px;display:grid}.newdoc-main{flex-direction:column;gap:8px;min-width:0;display:flex}.tabs{flex-wrap:wrap;gap:4px;display:flex}.tab{background:var(--bg);border:1px solid var(--border);border-radius:16px;padding:6px 12px}.tab.active{background:var(--accent-bg);border-color:var(--accent);color:var(--accent)}.preset-grid{background:var(--bg);border:1px solid var(--border);border-radius:8px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));align-content:start;gap:8px;height:340px;padding:4px;display:grid;overflow-y:auto}.preset-card{text-align:center;background:0 0;border:1px solid #0000;border-radius:6px;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;display:flex}.preset-card:hover{background:var(--panel-2)}.preset-card.selected{background:var(--accent-bg);border-color:var(--accent)}.preset-shape{place-items:center;width:64px;height:64px;display:grid}.preset-shape>div{background:#fff;border:1px solid #888}.preset-name{font-size:12px;font-weight:600;line-height:1.3}.preset-size{color:var(--muted);font-size:11px}.newdoc-side{flex-direction:column;gap:10px;display:flex}.col{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.col>span{color:var(--muted);font-size:12px}.col input,.col select{background:var(--bg);border:1px solid var(--border);border-radius:4px;width:100%;padding:5px 6px}.size-row{align-items:flex-end;gap:4px;display:flex}.size-row .icon-btn{flex:none;width:30px;height:30px;margin-bottom:1px}.px-info{color:var(--muted);font-size:12px}.px-info.error{color:#ff9b6a}.dlg-actions button:disabled{opacity:.45;cursor:default}@media (width<=800px){.newdoc{grid-template-columns:1fr}.preset-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));height:200px}#dlgNew{max-height:calc(100dvh - 24px);overflow-y:auto}}.seg{border:1px solid var(--border);border-radius:6px;display:inline-flex;overflow:hidden}.seg button{background:var(--bg);border:0;border-right:1px solid var(--border);padding:4px 12px}.seg button:last-child{border-right:0}.seg button.active{background:var(--accent-bg);color:var(--accent)}.toggle.wide{white-space:nowrap;width:auto;padding:0 10px}.opt .num{background:var(--bg);border:1px solid var(--border);border-radius:4px;width:70px;padding:3px 5px}.opt select{background:var(--bg);border:1px solid var(--border);border-radius:4px;padding:3px 5px}.pill{background:var(--panel-2);border:1px solid var(--border);border-radius:16px;padding:5px 16px}.pill.primary{background:var(--accent);border-color:var(--accent);color:#fff}#dlgWarp{width:min(300px,100vw - 32px);margin:96px 0 0 16px}#dlgWarp::backdrop{background:0 0}#dlgWarp .col>span{justify-content:space-between;display:flex}@media (width<=800px){#dlgWarp{margin:auto auto 64px}}.dropdown .sep{background:var(--border);height:1px;margin:4px 6px}#dlgEffect{width:min(320px,100vw - 32px);margin:96px 0 0 16px}#dlgEffect::backdrop{background:0 0}#dlgEffect .col>span{justify-content:space-between;display:flex}.effect-params{gap:10px;display:grid}.row.check{gap:8px}@media (width<=800px){#dlgEffect{margin:auto auto 64px}}.layer canvas.editing{outline:2px solid var(--accent);outline-offset:-1px}.layer canvas.mask-thumb.disabled{opacity:.35}.dropdown{max-height:calc(100dvh - 90px);overflow-y:auto}.layer .arrow{flex:none;width:20px;height:24px}.layer.group .layer-name{font-weight:600}.folder-icon{width:36px;height:36px;color:var(--muted);flex:none;place-items:center;display:grid}.folder-icon svg{width:22px;height:22px}.layer .grip{width:26px;height:30px;color:var(--muted);cursor:grab;touch-action:none;flex:none;place-items:center;display:grid}.layer .grip svg{width:16px;height:16px}.layer.dragging{opacity:.5}.layer.drop-above{box-shadow:inset 0 2px 0 var(--accent)}.layer.drop-below{box-shadow:inset 0 -2px 0 var(--accent)}.layer.drop-inside{background:var(--accent-bg);border-color:var(--accent)}.opt .inline{color:var(--text);align-items:center;gap:4px;display:inline-flex}.opt input[type=color].swatch{border:1px solid var(--border);background:0 0;border-radius:4px;width:28px;height:24px;padding:0}.dropdown .hdr{color:var(--muted);padding:6px 10px 2px;font-size:11px}.pill.active{background:var(--accent-bg);border-color:var(--accent);color:var(--accent)}#toolbar{min-height:0;overflow-y:auto}.colors{flex:none}@media (width>=801px) and (height<=760px){.tool-btn{width:32px;height:32px}.tool-btn svg{width:19px;height:19px}#tools{gap:1px}}#rulerCorner,#rulerH,#rulerV{z-index:4;background:#2f2f35;display:none;position:absolute}#stage.rulers-on #rulerCorner,#stage.rulers-on #rulerH,#stage.rulers-on #rulerV{display:block}#rulerCorner{border-right:1px solid var(--border);border-bottom:1px solid var(--border);width:18px;height:18px;top:0;left:0}#rulerH{border-bottom:1px solid var(--border);cursor:row-resize;touch-action:none;width:calc(100% - 18px);height:18px;top:0;left:18px;right:0}#rulerV{border-right:1px solid var(--border);cursor:col-resize;touch-action:none;width:18px;height:calc(100% - 18px);top:18px;bottom:0;left:0}.dropdown button.checked>span:first-child:before{content:"✓ ";color:var(--accent)}.dropdown button.checked:not(:has(span)):before{content:"✓ ";color:var(--accent)}#app{grid-template-rows:auto auto auto 1fr auto}#tabs{background:var(--panel);border-bottom:1px solid var(--border);align-items:flex-end;gap:2px;min-height:32px;padding:4px 6px 0;display:flex;overflow-x:auto}.doc-tab{background:var(--bg);border:1px solid var(--border);max-width:200px;color:var(--muted);cursor:pointer;border-bottom:0;border-radius:6px 6px 0 0;flex:none;align-items:center;gap:4px;padding:5px 4px 5px 12px;display:flex}.doc-tab.active{background:var(--panel-2);color:var(--text)}.doc-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.doc-close,.doc-new{width:22px;height:22px;color:inherit;background:0 0;border:0;border-radius:4px;place-items:center;padding:0;display:grid}.doc-close:hover,.doc-new:hover{background:var(--border)}.doc-close svg,.doc-new svg{width:14px;height:14px}.doc-new{flex:none;margin-bottom:5px}#dlgStyle{width:min(360px,100vw - 32px);margin:70px 0 0 16px}#dlgStyle::backdrop{background:0 0}.style-body{gap:8px;max-height:min(60vh,520px);padding-right:4px;display:grid;overflow-y:auto}.style-sec{border:1px solid var(--border);border-radius:8px;margin:0;padding:6px 8px}.style-head{align-items:center;gap:8px;font-weight:600;display:flex}.style-fields{gap:6px;margin-top:8px;display:grid}.style-fields[hidden]{display:none}.style-row{grid-template-columns:78px 1fr 44px;align-items:center;gap:8px;display:grid}.style-row>span{color:var(--muted)}.style-row input[type=color]{border:1px solid var(--border);background:0 0;border-radius:4px;width:40px;height:24px;padding:0}.style-row output{text-align:right;color:var(--text)}.fx-badge{background:var(--accent-bg);color:var(--accent);border-radius:8px;flex:none;padding:0 5px;font-size:10px;font-style:italic;font-weight:700}@media (width<=800px){#dlgStyle{margin:auto auto 64px}}#dlgCurves{width:min(320px,100vw - 32px);margin:70px 0 0 16px}#dlgCurves::backdrop{background:0 0}#curveCanvas{touch-action:none;cursor:crosshair;border-radius:6px;justify-self:center;width:276px;max-width:100%;height:276px}#curveChannels{justify-self:start}.hint{color:var(--muted);margin:0;font-size:11px}@media (width<=800px){#dlgCurves{margin:auto auto 64px}}#dlgBrush{width:min(360px,100vw - 32px);margin:70px 0 0 16px}#dlgBrush::backdrop{background:0 0}#brushPreview{background:#fff;border-radius:6px;width:100%;height:84px;margin-bottom:8px}#brushBody .style-row select{grid-column:2/4}@media (width<=800px){#dlgBrush{margin:auto auto 64px}}