:root{--bg-0: #0d0f14;--bg-1: #14171f;--bg-2: #1b1f29;--bg-3: #232834;--bg-hover: #2b3141;--bg-active: #343b4d;--line: #2a3040;--line-strong: #3a4253;--text-0: #f3f5f9;--text-1: #b3bccd;--text-2: #7e8798;--text-3: #5c6474;--accent: #6366f1;--accent-hover: #7c7ff3;--accent-soft: #6366f126;--danger: #ef4444;--success: #22c55e;--warning: #f59e0b;--stage-bg: #0a0c10;--guide: #f43f5e;--checker-base: #262a34;--checker-square: #1d212a;--r-sm: 6px;--r-md: 9px;--r-lg: 14px;--zoombar-bottom: 16px;--rail-w: 68px;--panel-w: 296px;--right-w: 312px;--topbar-h: 56px;--shadow-md: 0 6px 20px rgba(0, 0, 0, .45);--shadow-lg: 0 18px 48px rgba(0, 0, 0, .55);--font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;color-scheme:dark}:root[data-theme=onyx]{--bg-0: #000000;--bg-1: #0a0a0b;--bg-2: #121214;--bg-3: #1b1b1e;--bg-hover: #232327;--bg-active: #2e2e33;--line: #232326;--line-strong: #35353b;--text-0: #f7f7f8;--text-1: #b8b8bd;--text-2: #85858c;--text-3: #5f5f66;--stage-bg: #000000;--checker-base: #17171a;--checker-square: #0e0e10;--shadow-md: 0 4px 16px rgba(0, 0, 0, .8);--shadow-lg: 0 16px 44px rgba(0, 0, 0, .9);color-scheme:dark}:root[data-theme=onyx] .stage{background-image:radial-gradient(circle,#ffffff14 1px,transparent 1px)}:root[data-theme=onyx] .artboard{box-shadow:0 0 0 1px #ffffff1f}:root[data-theme=onyx] .rail,:root[data-theme=onyx] .panel,:root[data-theme=onyx] .inspector,:root[data-theme=onyx] .topbar,:root[data-theme=onyx] .tx-toolrail{border-color:var(--line)}:root[data-theme=onyx] ::-webkit-scrollbar-thumb{background:#303036;background-clip:content-box}:root[data-theme=light]{--bg-0: #eef0f4;--bg-1: #ffffff;--bg-2: #f4f5f8;--bg-3: #e8eaf0;--bg-hover: #e2e5ec;--bg-active: #d6dae4;--line: #e2e5ec;--line-strong: #cdd2dd;--text-0: #11151c;--text-1: #3d4657;--text-2: #6b7385;--text-3: #949cad;--stage-bg: #dfe2e9;--checker-base: #ffffff;--checker-square: #c9ccd4;--shadow-md: 0 6px 20px rgba(15, 23, 42, .1);--shadow-lg: 0 18px 48px rgba(15, 23, 42, .16);color-scheme:light}:root[data-theme=light] .stage{background-image:radial-gradient(circle,#00000014 1px,transparent 1px)}:root[data-theme=light] .artboard{box-shadow:0 0 0 1px #00000014,0 12px 40px #0f172a29}:root[data-theme=light] .brand-mark,:root[data-theme=light] .btn.primary{color:#fff}:root[data-theme=light] .handle,:root[data-theme=light] .rotate-handle:before{background:#fff}:root[data-theme=light] ::-webkit-scrollbar-thumb{background:#c3c9d6;background-clip:content-box}:root[data-texture-bg=light]{--checker-base: #ffffff;--checker-square: #c9ccd4}*{box-sizing:border-box}html,body,#root{height:100%;height:100dvh;margin:0}html{overflow:hidden;overscroll-behavior:none}body{background:var(--bg-0);color:var(--text-0);font-family:var(--font);font-size:13px;-webkit-font-smoothing:antialiased;overflow:hidden;overscroll-behavior:none}button{font:inherit;color:inherit;border:none;background:none;cursor:pointer}input,select,textarea{font:inherit;color:inherit}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:99px;border:3px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background:#4a5468;background-clip:content-box}.app{display:grid;grid-template-rows:var(--topbar-h) 1fr;height:100%}.app-body{display:flex;min-height:0;overflow:hidden}.topbar{display:flex;align-items:center;gap:10px;padding:0 12px;background:var(--bg-1);border-bottom:1px solid var(--line);z-index:80}.brand{display:flex;align-items:center;gap:9px;padding-right:8px;font-weight:700;letter-spacing:-.02em;font-size:15px;-webkit-user-select:none;user-select:none}.brand{border-radius:var(--r-sm);transition:opacity .12s ease}.brand:hover{opacity:.82}.brand-mark{width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#6366f1,#ec4899 55%,#f59e0b);display:grid;place-items:center;font-size:13px;color:#fff;font-weight:800}.doc-name{background:transparent;border:1px solid transparent;border-radius:var(--r-sm);padding:6px 9px;min-width:120px;max-width:260px;font-weight:500;outline:none}.doc-name:hover{background:var(--bg-2)}.doc-name:focus{background:var(--bg-2);border-color:var(--accent)}.topbar-spacer{flex:1}.topbar-group{display:flex;align-items:center;gap:3px;padding:0 6px;border-left:1px solid var(--line);height:30px}.topbar-group:first-of-type{border-left:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:32px;padding:0 12px;border-radius:var(--r-sm);background:var(--bg-2);color:var(--text-0);font-size:12.5px;font-weight:500;white-space:nowrap;transition:background .12s ease,opacity .12s ease}.btn:hover:not(:disabled){background:var(--bg-hover)}.btn:disabled{opacity:.38;cursor:not-allowed}.btn.primary{background:var(--accent);color:#fff}.btn.primary:hover:not(:disabled){background:var(--accent-hover)}.btn.ghost{background:transparent}.btn.ghost:hover:not(:disabled){background:var(--bg-2)}.btn.danger{color:#fca5a5}.btn.danger:hover:not(:disabled){background:#ef444422;color:#fecaca}.btn.block{width:100%}.btn.sm{height:27px;padding:0 9px;font-size:12px}.icon-img{display:inline-block;flex:none;object-fit:contain;vertical-align:middle}.icon-img-mask{background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}.icon-btn{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:var(--r-sm);color:var(--text-1);transition:background .12s ease,color .12s ease;flex:none}.icon-btn:hover:not(:disabled){background:var(--bg-hover);color:var(--text-0)}.icon-btn:disabled{opacity:.3;cursor:not-allowed}.icon-btn.active{background:var(--accent-soft);color:var(--accent-hover)}a.icon-btn{text-decoration:none;cursor:pointer}.rail{width:var(--rail-w);flex:none;background:var(--bg-1);border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:8px 0;gap:2px;z-index:30}.rail-btn{width:56px;padding:9px 4px 7px;border-radius:var(--r-md);display:grid;justify-items:center;gap:4px;color:var(--text-2);font-size:10px;font-weight:500;transition:background .12s ease,color .12s ease}.rail-btn:hover{background:var(--bg-2);color:var(--text-1)}.rail-btn.active{background:var(--accent-soft);color:var(--accent-hover)}.panel{width:var(--panel-w);flex:none;position:relative;background:var(--bg-1);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;z-index:20}.panel-resizer{position:absolute;top:0;bottom:0;width:9px;z-index:40;cursor:col-resize;touch-action:none}.panel-resizer.right{right:-5px}.panel-resizer.left{left:-5px}.panel-resizer:after{content:"";position:absolute;top:0;bottom:0;left:4px;width:1px;background:transparent;transition:background .12s ease}.panel-resizer:hover:after,.panel-resizer:focus-visible:after,.panel-resizer.dragging:after{background:var(--accent)}.panel-resizer:focus-visible{outline:none}body:has(.panel-resizer.dragging){cursor:col-resize;-webkit-user-select:none;user-select:none}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:14px 14px 10px;font-size:14px;font-weight:650;letter-spacing:-.01em}.panel-body{flex:1;overflow-y:auto;padding:0 14px 20px;min-height:0}.inspector{width:var(--right-w);flex:none;position:relative;background:var(--bg-1);border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0;z-index:20}.inspector-scroll{flex:1;overflow-y:auto;min-height:0}.empty-state{padding:40px 22px;text-align:center;color:var(--text-3);font-size:12.5px;line-height:1.65}.empty-state strong{display:block;color:var(--text-1);font-size:13px;margin-bottom:6px}.section{border-bottom:1px solid var(--line);padding:12px 14px 14px}.section:last-child{border-bottom:none}.section-title{display:flex;align-items:center;justify-content:space-between;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-3);margin-bottom:11px;-webkit-user-select:none;user-select:none}.section.collapsible.collapsed{padding-bottom:12px}.section.collapsible .section-title{margin-bottom:0}.section.collapsible:not(.collapsed) .section-title{margin-bottom:11px}.section-toggle{display:flex;align-items:center;gap:5px;flex:1;min-width:0;text-align:left;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;padding:0}.section-toggle:hover{color:var(--text-1)}.section-chevron{flex:none;transition:transform .14s ease;opacity:.75}.section.collapsed .section-chevron{transform:rotate(-90deg)}.inspector .section-title{font-size:12.5px;letter-spacing:.045em;color:var(--text-2)}.inspector .section-toggle{font-size:12.5px}.inspector .section-toggle:hover{color:var(--text-0)}.inspector .section-chevron{opacity:.9}.inspector .section-title button:not(.section-toggle){font-size:11px;letter-spacing:0}.section-title button{text-transform:none;letter-spacing:0;font-size:11px;font-weight:500;color:var(--text-2)}.section-title button:hover{color:var(--accent-hover)}.field{margin-bottom:11px}.field:last-child{margin-bottom:0}.field-label{display:flex;align-items:center;justify-content:space-between;font-size:11.5px;color:var(--text-2);margin-bottom:6px}.field-label .value{color:var(--text-1);font-variant-numeric:tabular-nums;font-size:11px}.row{display:flex;align-items:center;gap:8px}.row.two>*{flex:1;min-width:0}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.input{width:100%;height:30px;padding:0 9px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-sm);outline:none;font-size:12.5px;transition:border-color .12s ease}.input:hover{border-color:var(--line-strong)}.input:focus{border-color:var(--accent)}.input.num{font-variant-numeric:tabular-nums}textarea.input{height:auto;padding:8px 9px;line-height:1.5;resize:vertical;min-height:68px;font-family:inherit}.input-affix{position:relative;display:flex;align-items:center}.input-affix .affix{position:absolute;left:9px;color:var(--text-3);font-size:11px;pointer-events:none}.input-affix .input{padding-left:24px}select.input{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;padding-right:26px;background-image:linear-gradient(45deg,transparent 50%,var(--text-2) 50%),linear-gradient(135deg,var(--text-2) 50%,transparent 50%);background-position:calc(100% - 14px) 13px,calc(100% - 9px) 13px;background-size:5px 5px;background-repeat:no-repeat}select.input option{background:var(--bg-2)}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:18px;background:transparent;cursor:pointer;display:block}.slider::-webkit-slider-runnable-track{height:4px;border-radius:99px;background:var(--track, var(--bg-3))}.slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-5px;border-radius:50%;background:#fff;border:1px solid rgba(0,0,0,.35);box-shadow:0 1px 4px #00000080}.slider::-moz-range-track{height:4px;border-radius:99px;background:var(--bg-3)}.slider::-moz-range-progress{height:4px;border-radius:99px;background:var(--accent)}.slider::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:#fff;border:1px solid rgba(0,0,0,.35)}.segmented{display:flex;background:var(--bg-2);border-radius:var(--r-sm);padding:2px;gap:2px}.segmented button{flex:1;height:26px;border-radius:4px;display:grid;place-items:center;color:var(--text-2);font-size:12px;transition:background .12s ease,color .12s ease}.segmented button:hover{color:var(--text-0)}.segmented button.active{background:var(--bg-hover);color:var(--text-0)}.switch{display:flex;align-items:center;justify-content:space-between;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:12.5px;color:var(--text-1)}.switch-track{width:34px;height:19px;border-radius:99px;background:var(--bg-3);position:relative;transition:background .15s ease;flex:none}.switch-track:after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:#fff;transition:transform .15s ease}.switch input{display:none}.switch input:checked+.switch-track{background:var(--accent)}.switch input:checked+.switch-track:after{transform:translate(15px)}.color-control{position:relative}.color-trigger{display:flex;align-items:center;gap:8px;width:100%;height:30px;padding:0 9px 0 4px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-sm);font-size:12px;font-variant-numeric:tabular-nums}.color-trigger:hover{border-color:var(--line-strong)}.swatch-chip{width:22px;height:22px;border-radius:4px;flex:none;border:1px solid rgba(255,255,255,.16);background-image:linear-gradient(45deg,#333 25%,transparent 25%),linear-gradient(-45deg,#333 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#333 75%),linear-gradient(-45deg,transparent 75%,#333 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0}.swatch-chip span{display:block;width:100%;height:100%;border-radius:3px}.color-pop{position:absolute;z-index:60;top:calc(100% + 6px);right:0;width:232px;padding:12px;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--r-md);box-shadow:var(--shadow-lg)}.swatch-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;margin-bottom:10px}.swatch-grid button{aspect-ratio:1;border-radius:4px;border:1px solid rgba(255,255,255,.14);transition:transform .1s ease}.swatch-grid button:hover{transform:scale(1.14)}.swatch-grid button.active{outline:2px solid var(--accent);outline-offset:1px}.native-color{width:34px;height:30px;padding:2px;background:var(--bg-3);border:1px solid var(--line);border-radius:var(--r-sm);cursor:pointer;flex:none}.stage{flex:1;position:relative;min-width:0;background:var(--stage-bg);overflow:hidden;background-image:radial-gradient(circle,#ffffff0d 1px,transparent 1px);background-size:22px 22px;user-select:none;-webkit-user-select:none;touch-action:none}.stage img,.stage svg{-webkit-user-drag:none}.stage .text-editor{user-select:text;-webkit-user-select:text;touch-action:auto}.stage.panning{cursor:grab}.stage.panning-active{cursor:grabbing}.stage.tool-crosshair{cursor:crosshair}.stage-scroll{position:absolute;top:0;right:0;bottom:0;left:0}.artboard-wrap{position:absolute;transform-origin:0 0;will-change:transform}.artboard{position:relative;overflow:hidden;box-shadow:0 0 0 1px #ffffff14,0 12px 48px #0009}.artboard.show-overflow{overflow:visible}.artboard.show-overflow:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px dashed var(--accent);opacity:.85;pointer-events:none}.artboard.transparent{background-color:#fff;background-image:linear-gradient(45deg,#d4d7de 25%,transparent 25%),linear-gradient(-45deg,#d4d7de 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d4d7de 75%),linear-gradient(-45deg,transparent 75%,#d4d7de 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}.element{position:absolute;transform-origin:center center;-webkit-user-select:none;user-select:none}.element.hidden{display:none}.element.interactive{cursor:move}.element.locked{cursor:default}.element-inner{width:100%;height:100%;position:relative}.element img{width:100%;height:100%;display:block;pointer-events:none}.text-el{width:100%;height:100%;overflow:visible;white-space:pre}.text-line{display:block;white-space:pre}.text-editor{position:absolute;top:0;right:0;bottom:0;left:0;outline:none;border:none;background:transparent;resize:none;overflow:hidden;padding:0;margin:0;white-space:pre-wrap;word-break:break-word;caret-color:currentColor}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:10}.sel-outline{position:absolute;border:1.5px solid var(--accent);pointer-events:none;transform-origin:center center}.sel-outline.hover{border-color:#6366f199;border-width:1.5px}.sel-outline.multi{border-style:dashed;border-color:#6366f1aa}.handle{position:absolute;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;background:#fff;border:1.5px solid var(--accent);border-radius:3px;pointer-events:auto;box-shadow:0 1px 3px #0006}.handle.edge{border-radius:2px}.rotate-handle{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;display:grid;place-items:center;pointer-events:auto;cursor:grab;color:var(--accent)}.rotate-handle:before{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;background:#fff;border:1.5px solid var(--accent);border-radius:50%;box-shadow:0 1px 3px #0006}.rotate-handle svg{position:relative;z-index:1}.size-badge{position:absolute;padding:3px 7px;background:var(--accent);color:#fff;font-size:10.5px;font-weight:600;border-radius:4px;white-space:nowrap;transform:translate(-50%,8px);font-variant-numeric:tabular-nums;pointer-events:none;box-shadow:var(--shadow-md)}.guide-line{position:absolute;background:var(--guide);pointer-events:none}.guide-line.v{width:1px}.guide-line.h{height:1px}.marquee{position:absolute;border:1px solid var(--accent);background:var(--accent-soft);pointer-events:none}.crop-dim{position:absolute;background:#0000008c;pointer-events:none}.crop-shade{position:absolute;pointer-events:none;box-shadow:0 0 0 9999px #00000059}.crop-frame{position:absolute;outline:1.5px solid #fff;box-shadow:0 0 0 1px #00000073,inset 0 0 0 1px #00000073;pointer-events:none}.crop-grid{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.crop-grid:before,.crop-grid:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-style:solid;border-color:#fff6}.crop-grid:before{border-width:0 1px;left:33.333%;right:33.333%}.crop-grid:after{border-width:1px 0;top:33.333%;bottom:33.333%}.crop-handle{position:absolute;pointer-events:auto;filter:drop-shadow(0 0 2px rgba(0,0,0,.75))}.crop-handle.edge{border-radius:2px}.selection-anchor{position:absolute;width:0;height:0;transform-origin:0 0;z-index:30}.selection-toolbar-bar{position:absolute;left:0;bottom:10px;transform:translate(-50%);width:max-content;display:flex;align-items:center;gap:2px;padding:4px;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:10px;box-shadow:var(--shadow-lg);white-space:nowrap;pointer-events:auto}.selection-toolbar-bar button{display:flex;align-items:center;gap:5px;height:28px;padding:0 9px;border-radius:7px;font-size:12px;color:var(--text-1);transition:background .12s ease,color .12s ease}.selection-toolbar-bar button:hover{background:var(--bg-hover);color:var(--text-0)}.selection-toolbar-bar button.active{background:var(--accent-soft);color:var(--accent-hover)}.selection-toolbar-sep{width:1px;height:18px;background:var(--line);margin:0 3px;flex:none}.floating-panel{position:fixed;display:flex;flex-direction:column;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--r-md);box-shadow:var(--shadow-lg);z-index:300;pointer-events:auto;overflow:hidden}.floating-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none;height:32px;padding:0 6px 0 12px;background:var(--bg-3);border-bottom:1px solid var(--line);font-size:11.5px;color:var(--text-1);cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.floating-panel-head:active{cursor:grabbing}.floating-panel-body{flex:1;min-height:0;padding:12px 14px 16px;overflow-y:auto;overscroll-behavior:contain}.floating-panel-body>.section{margin-left:-14px;margin-right:-14px}.floating-panel-body>.section:first-child{margin-top:-12px}.floating-panel-body>.section:last-child{margin-bottom:-16px}.floating-panel-grip{position:absolute;right:0;bottom:0;width:16px;height:16px;cursor:nwse-resize;touch-action:none;background:linear-gradient(135deg,transparent 0 45%,var(--line-strong) 45% 55%,transparent 55% 70%,var(--line-strong) 70% 80%,transparent 80%)}.popover-head{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-3);margin-bottom:10px;padding-right:22px;-webkit-user-select:none;user-select:none}.popover-head button{text-transform:none;letter-spacing:0;font-size:11px;font-weight:500;color:var(--text-2)}.popover-head button:hover{color:var(--accent-hover)}.effects-popover{position:fixed;width:300px;max-height:min(70vh,640px);background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--r-md);box-shadow:var(--shadow-lg);z-index:300}.history-hint{position:fixed;left:16px;bottom:16px;z-index:320;display:flex;align-items:center;gap:8px;padding:8px 14px 8px 12px;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:99px;box-shadow:var(--shadow-lg);color:var(--text-0);font-size:12.5px;pointer-events:none;animation:history-hint-in .16s ease-out}.history-hint svg{color:var(--accent-hover)}.history-hint.empty{color:var(--text-2)}.history-hint.empty svg{color:var(--text-3)}@keyframes history-hint-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.table-cell{box-sizing:border-box}.table-cell-editor{position:absolute;margin:0;padding:0;border:none;outline:1.5px solid var(--accent);outline-offset:3px;background:transparent;resize:none;overflow:hidden;z-index:5}.mask-surface{position:absolute;pointer-events:auto;cursor:crosshair;touch-action:none;z-index:16}.mask-bar{position:fixed;bottom:78px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:6px;padding:5px 7px;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:99px;box-shadow:var(--shadow-lg);z-index:300;white-space:nowrap}.mask-slider{display:flex;align-items:center;gap:6px;color:var(--text-2);font-size:11px;font-variant-numeric:tabular-nums}.mask-slider .slider{width:88px}.mask-slider span{min-width:22px;text-align:right}.zoombar{position:absolute;bottom:var(--zoombar-bottom);left:50%;transform:translate(-50%);display:flex;align-items:center;gap:2px;padding:4px;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:99px;box-shadow:var(--shadow-lg);z-index:15}.crop-bar{bottom:calc(var(--zoombar-bottom) + 52px);z-index:16}.zoom-value{min-width:52px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums;color:var(--text-1);cursor:pointer;padding:0 4px}.zoom-value:hover{color:var(--text-0)}.layer-list{display:flex;flex-direction:column;gap:2px}.layer{display:flex;align-items:center;gap:8px;padding:5px 7px;border-radius:var(--r-sm);cursor:pointer;border:1px solid transparent;transition:background .1s ease}.layer:hover{background:var(--bg-2)}.layer.selected{background:var(--accent-soft);border-color:#6366f159}.layer.dragging{opacity:.4}.layer.drop-above{border-top-color:var(--accent)}.layer.drop-below{border-bottom-color:var(--accent)}.layer.drop-into{outline:1.5px solid var(--accent);outline-offset:-1px;background:var(--accent-soft)}.layer.is-hidden .layer-name,.layer.is-hidden .layer-thumb{opacity:.42}.layer-group{border-radius:var(--r-sm)}.layer.group-head{gap:4px;color:var(--text-1)}.layer.group-head .layer-name{font-weight:500}.layer-grip{display:grid;place-items:center;width:22px;height:26px;flex:none;margin-left:-3px;border-radius:4px;color:var(--text-3);cursor:grab;touch-action:none}.layer-grip:hover{color:var(--text-1);background:var(--bg-hover)}.layer-grip:active{cursor:grabbing}.layer-list.dragging{user-select:none;-webkit-user-select:none}.layer-list.dragging .layer{cursor:grabbing}.layer-fold{display:grid;place-items:center;width:20px;height:20px;flex:none;border-radius:4px;color:var(--text-2)}.layer-fold:hover{color:var(--text-0);background:var(--bg-hover)}.layer-fold .folded{transform:rotate(-90deg)}.layer-count{flex:none;font-size:10.5px;color:var(--text-3);font-variant-numeric:tabular-nums}.layer-rename{flex:1;min-width:0;height:22px;padding:0 6px;border:1px solid var(--accent);border-radius:4px;background:var(--bg-0);color:var(--text-0);font:inherit;font-size:12px}.layers-section{position:relative}.layer-edge{position:absolute;left:14px;right:14px;z-index:2;padding:6px 8px;border:1px dashed var(--line-strong);border-radius:var(--r-sm);background:var(--bg-1);font-size:10.5px;color:var(--text-3);text-align:center;pointer-events:none}.layer-edge.top{top:34px}.layer-edge.bottom{bottom:12px}.layer-edge.active{border-color:var(--accent);background:var(--accent-soft);color:var(--text-1)}.layer.in-group{margin-left:10px;padding-left:10px;border-left:1px solid var(--line);border-radius:0 var(--r-sm) var(--r-sm) 0}.layer-thumb{width:30px;height:30px;border-radius:5px;background:var(--bg-3);display:grid;place-items:center;flex:none;overflow:hidden;color:var(--text-2)}.layer-thumb img,.layer-thumb canvas{width:100%;height:100%;object-fit:cover}.layer-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--text-1)}.layer.selected .layer-name{color:var(--text-0)}.layer-actions{display:flex;gap:1px;opacity:0;transition:opacity .12s ease}.layer:hover .layer-actions,.layer.selected .layer-actions,.layer.is-hidden .layer-actions,.layer.is-locked .layer-actions{opacity:1}.layer-actions .icon-btn{width:24px;height:24px}.tile-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.asset-tile{position:relative;aspect-ratio:1;border-radius:var(--r-md);overflow:hidden;background:var(--bg-2);border:1px solid var(--line);cursor:pointer;transition:border-color .12s ease,transform .12s ease}.asset-tile:hover{border-color:var(--accent);transform:translateY(-1px)}.asset-tile img{width:100%;height:100%;object-fit:cover;display:block}.asset-tile .tile-remove{position:absolute;top:5px;right:5px;width:22px;height:22px;border-radius:50%;background:#000000a6;color:#fff;display:grid;place-items:center;opacity:0;transition:opacity .12s ease}.asset-tile:hover .tile-remove{opacity:1}.preset-row{display:flex;align-items:center;justify-content:space-between;width:100%;padding:9px 10px;border-radius:var(--r-sm);text-align:left;transition:background .1s ease}.preset-row:hover{background:var(--bg-2)}.preset-row.active{background:var(--accent-soft)}.preset-row .label{font-size:12.5px;color:var(--text-0)}.preset-row .hint{font-size:11px;color:var(--text-3);font-variant-numeric:tabular-nums}.group-label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-3);margin:14px 0 6px}.group-label-action{text-transform:none;letter-spacing:0;font-size:11px;font-weight:500;color:var(--text-2)}.group-label-action:hover{color:var(--accent-hover)}.group-label:first-child{margin-top:4px}.shape-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.shape-btn{aspect-ratio:1;border-radius:var(--r-md);background:var(--bg-2);border:1px solid var(--line);display:grid;place-items:center;color:var(--text-1);transition:border-color .12s ease,color .12s ease,background .12s ease}.shape-btn:hover{border-color:var(--accent);color:var(--text-0);background:var(--bg-3)}.filter-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.filter-strip.scroll{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding-bottom:4px;scrollbar-width:thin}.filter-strip.scroll .filter-tile{flex:none;width:68px}.filter-group{margin-top:10px}.filter-group .group-label{margin-top:0}.filter-tile{border-radius:var(--r-sm);overflow:hidden;border:1.5px solid transparent;background:var(--bg-2);cursor:pointer;padding:0}.filter-tile.active{border-color:var(--accent)}.filter-tile .thumb{aspect-ratio:1;width:100%;object-fit:cover;display:block;background:var(--bg-3)}.filter-tile .name{display:block;padding:4px 2px;font-size:10.5px;color:var(--text-2);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.filter-tile.active .name{color:var(--text-0)}.effect-add{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}.effect-add .btn.sm{justify-content:flex-start;gap:5px;white-space:nowrap;overflow:hidden}.effect-card{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-2);margin-bottom:8px;overflow:hidden}.effect-card.off{opacity:.55}.effect-head{display:flex;align-items:center;gap:2px;padding:4px 4px 4px 6px;background:var(--bg-3)}.effect-name{flex:1;min-width:0;font-size:11.5px;color:var(--text-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:2px}.effect-body{padding:10px}.effect-body .field:last-child{margin-bottom:0}.flip-y{transform:scaleY(-1)}.recolor-list{display:flex;flex-direction:column;gap:6px}.recolor-entry{display:flex;flex-direction:column;gap:4px}.recolor-strength{display:flex;align-items:center;gap:8px;padding:0 2px 2px 32px}.recolor-strength .slider{flex:1;min-width:0}.recolor-strength-value{font-size:10.5px;color:var(--text-2);font-variant-numeric:tabular-nums;width:30px;text-align:right;flex:none}.recolor-row{display:flex;align-items:center;gap:6px}.recolor-row>.swatch-chip{width:26px;height:26px;border-radius:var(--r-sm)}.recolor-arrow{color:var(--text-2);flex:none}.recolor-target{flex:1;min-width:0}.icon-btn.sm{width:24px;height:24px}.dropzone{border:1.5px dashed var(--line-strong);border-radius:var(--r-md);padding:22px 14px;text-align:center;color:var(--text-2);cursor:pointer;transition:border-color .15s ease,background .15s ease;margin-bottom:12px}.dropzone:hover,.dropzone.over{border-color:var(--accent);background:var(--accent-soft);color:var(--text-1)}.dropzone .big{display:block;color:var(--text-1);font-weight:550;margin:7px 0 3px;font-size:12.5px}.dropzone .sub{font-size:11px;color:var(--text-3)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000009e;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;z-index:200;padding:24px;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.modal{display:flex;flex-direction:column;width:100%;max-width:460px;max-height:100%;background:var(--bg-1);border:1px solid var(--line-strong);border-radius:var(--r-lg);box-shadow:var(--shadow-lg)}.modal-head{flex:none;display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);font-size:15px;font-weight:650}.modal-body{flex:1;min-height:0;overflow-y:auto;padding:16px 18px}.modal-foot{flex:none;display:flex;justify-content:flex-end;gap:8px;padding:14px 18px;border-top:1px solid var(--line)}.close-confirm-lead{margin:0;font-size:13px;line-height:1.5;color:var(--text-1)}.close-confirm-lead strong{color:var(--text-0)}p.close-confirm-warn{color:var(--warning)}.close-confirm-skip{margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}.close-confirm-skip .hint-text{margin-top:6px}.export-preview{border-radius:var(--r-md);overflow:hidden;background-color:#fff;background-image:linear-gradient(45deg,#d4d7de 25%,transparent 25%),linear-gradient(-45deg,#d4d7de 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d4d7de 75%),linear-gradient(-45deg,transparent 75%,#d4d7de 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;display:grid;place-items:center;min-height:168px;margin-bottom:14px;border:1px solid var(--line)}.export-project{display:flex;align-items:center;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.export-project>div{flex:1;min-width:0}.export-project strong{display:block;font-size:12.5px;font-weight:600}.export-project span{display:block;margin-top:3px;font-size:11.5px;line-height:1.5;color:var(--text-2)}.export-project .btn{flex:none}.export-preview img{max-width:100%;max-height:210px;display:block}.context-menu{position:fixed;z-index:300;min-width:196px;padding:5px;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--r-md);box-shadow:var(--shadow-lg)}.context-menu button{display:flex;align-items:center;gap:9px;width:100%;padding:7px 9px;border-radius:var(--r-sm);font-size:12.5px;color:var(--text-1);text-align:left}.context-menu button:hover:not(:disabled){background:var(--bg-hover);color:var(--text-0)}.context-menu button:disabled{opacity:.35;cursor:not-allowed}.context-menu button .shortcut{margin-left:auto;font-size:10.5px;color:var(--text-3)}.context-menu .sep{height:1px;background:var(--line);margin:4px 2px}.toast-stack{position:fixed;bottom:20px;right:20px;z-index:400;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{display:flex;align-items:center;gap:10px;padding:11px 15px;min-width:220px;max-width:380px;background:var(--bg-2);border:1px solid var(--line-strong);border-left:3px solid var(--accent);border-radius:var(--r-md);box-shadow:var(--shadow-lg);font-size:12.5px;color:var(--text-0);animation:toast-in .2s ease;pointer-events:auto}.toast.error{border-left-color:var(--danger)}.toast.success{border-left-color:var(--success)}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}.busy{position:absolute;top:0;right:0;bottom:0;left:0;background:#0a0c10a8;display:grid;place-items:center;z-index:100;gap:12px;color:var(--text-1);font-size:12.5px}.spinner{width:26px;height:26px;border:2.5px solid var(--line-strong);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;margin:0 auto 10px}@keyframes spin{to{transform:rotate(360deg)}}.hint-text{font-size:11px;color:var(--text-3);line-height:1.55;margin-top:8px}.kbd{display:inline-block;padding:1px 5px;border-radius:4px;background:var(--bg-3);border:1px solid var(--line-strong);font-size:10.5px;font-family:ui-monospace,monospace;color:var(--text-2)}.shortcut-table{width:100%;border-collapse:collapse;font-size:12.5px}.shortcut-table td{padding:6px 4px;border-bottom:1px solid var(--line);color:var(--text-1)}.shortcut-table td:last-child{text-align:right;white-space:nowrap}.shortcut-table tr:last-child td{border-bottom:none}.eyedropper-active,.eyedropper-active *{cursor:crosshair!important}.app{grid-template-rows:var(--topbar-h) 38px 1fr}.tabbar{display:flex;align-items:stretch;gap:2px;padding:0 8px;background:var(--bg-0);border-bottom:1px solid var(--line);overflow-x:auto;overflow-y:hidden;z-index:35;scrollbar-width:none}.tabbar::-webkit-scrollbar{height:0}.tab{display:flex;align-items:center;gap:7px;padding:0 8px 0 11px;min-width:118px;max-width:220px;border-radius:var(--r-sm) var(--r-sm) 0 0;color:var(--text-2);cursor:pointer;-webkit-user-select:none;user-select:none;border:1px solid transparent;border-bottom:none;margin-top:4px;transition:background .12s ease,color .12s ease}.tab:hover{background:var(--bg-2);color:var(--text-1)}.tab.active{background:var(--bg-1);border-color:var(--line);color:var(--text-0)}.tab.dragging{opacity:.4}.tab-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px}.tab-rename{flex:1;min-width:0;background:var(--bg-3);border:1px solid var(--accent);border-radius:4px;padding:2px 5px;font-size:12.5px;outline:none}.tab-close{display:grid;place-items:center;width:18px;height:18px;border-radius:4px;color:var(--text-3);flex:none;opacity:0;transition:opacity .12s ease,background .12s ease}.tab:hover .tab-close,.tab.active .tab-close{opacity:1}.tab-close:hover{background:var(--bg-hover);color:var(--text-0)}.tab-add{display:grid;place-items:center;width:30px;margin:4px 0 4px 4px;border-radius:var(--r-sm);color:var(--text-2);flex:none}.tab-add:hover{background:var(--bg-2);color:var(--text-0)}.tab-close-all{align-self:center;margin-left:6px;padding:3px 9px;border-radius:var(--r-sm);font-size:11.5px;color:var(--text-3);flex:none}.tab-close-all:hover{background:var(--bg-2);color:var(--text-0)}.ink-preview{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;opacity:.85}.settings-tabs{display:flex;gap:2px;padding:3px;background:var(--bg-2);border-radius:var(--r-sm);margin-bottom:4px}.settings-tabs button{flex:1;height:30px;border-radius:5px;font-size:12.5px;color:var(--text-2);transition:background .12s ease,color .12s ease}.settings-tabs button:hover{color:var(--text-0)}.settings-tabs button.active{background:var(--bg-hover);color:var(--text-0)}.settings-body .section{padding-left:0;padding-right:0}.settings-body .section:first-child{padding-top:6px}.accent-row{display:flex;gap:8px;flex-wrap:wrap}.accent-dot{width:26px;height:26px;border-radius:50%;border:2px solid transparent;transition:transform .12s ease}.accent-dot:hover{transform:scale(1.12)}.accent-dot.active{border-color:var(--text-0);box-shadow:inset 0 0 0 2px var(--bg-1)}.accent-dot.custom{display:grid;place-items:center;cursor:pointer;border:2px dashed var(--line-strong);color:var(--text-2);position:relative;overflow:hidden}.accent-dot.custom.active{border-style:solid}.accent-dot.custom input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.accent-custom-row{display:flex;gap:8px;margin-top:10px}.accent-custom-row .input{width:120px;font-family:ui-monospace,monospace}.zoombar-sep{width:1px;height:18px;background:var(--line-strong);margin:0 3px;flex:none}.font-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}.font-row{display:flex;align-items:center;gap:11px;padding:8px 10px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-sm)}.font-preview{width:40px;height:34px;display:grid;place-items:center;background:var(--bg-3);border-radius:5px;font-size:18px;flex:none}.font-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.font-meta strong{font-size:12.5px;font-weight:550}.font-meta span{font-size:11px;color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.storage-meter{margin-top:12px}.storage-bar{height:7px;border-radius:99px;background:var(--bg-3);overflow:hidden}.storage-bar span{display:block;height:100%;background:var(--accent);border-radius:99px}.storage-legend{display:flex;justify-content:space-between;margin-top:6px;font-size:11px;color:var(--text-3);font-variant-numeric:tabular-nums}.folder-row{display:flex;align-items:center;gap:9px;padding:10px 12px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-sm);margin-bottom:4px}code{font-family:ui-monospace,monospace;font-size:10.5px;background:var(--bg-3);padding:1px 4px;border-radius:3px;color:var(--text-1)}.preset-card{display:flex;flex-direction:column;gap:2px;padding:11px 8px;border-radius:var(--r-md);background:var(--bg-2);border:1.5px solid var(--line);text-align:left;transition:border-color .12s ease}.preset-card:hover{border-color:var(--line-strong)}.preset-card.active{border-color:var(--accent);background:var(--accent-soft)}.preset-card strong{font-size:13px;font-weight:600}.preset-card span{font-size:10.5px;color:var(--text-3)}.preset-scroll{max-height:190px;overflow-y:auto;border:1px solid var(--line);border-radius:var(--r-sm);padding:3px}.preset-row{cursor:pointer}:root{--tx-grid: rgba(255, 255, 255, .35);--tx-grid-major: rgba(255, 255, 255, .75)}.tx-toolrail{width:52px;flex:none;background:var(--bg-1);border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:8px 0;gap:3px;z-index:30}.tx-tool{width:38px;height:38px;display:grid;place-items:center;border-radius:var(--r-md);color:var(--text-2);transition:background .12s ease,color .12s ease}.tx-tool:hover:not(:disabled){background:var(--bg-2);color:var(--text-0)}.tx-tool.active{background:var(--accent-soft);color:var(--accent-hover)}.tx-toolrail-sep{width:26px;height:1px;background:var(--line);margin:6px 0}.tx-main{flex:1;position:relative;min-width:0;display:flex}.tx-main.drag-over:after{content:"Drop an image to import it";position:absolute;top:8px;right:8px;bottom:8px;left:8px;z-index:30;display:grid;place-items:center;border:2px dashed var(--accent);border-radius:var(--r-md);background:var(--accent-soft);color:var(--text-0);font-size:13px;pointer-events:none}.tx-stage{flex:1;position:relative;min-width:0;overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:none;background-color:var(--stage-bg);background-image:radial-gradient(circle,rgba(255,255,255,.05) 1px,transparent 1px);background-size:22px 22px}:root[data-theme=light] .tx-stage{background-image:radial-gradient(circle,rgba(0,0,0,.08) 1px,transparent 1px)}:root[data-theme=onyx] .tx-stage{background-image:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1px)}.tx-surface{position:absolute;left:0;top:0;transform-origin:0 0;touch-action:none;box-shadow:0 0 0 1px #ffffff26,0 12px 40px #0000008c;background-color:var(--checker-base);background-image:linear-gradient(45deg,var(--checker-square) 25%,transparent 25%),linear-gradient(-45deg,var(--checker-square) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--checker-square) 75%),linear-gradient(-45deg,transparent 75%,var(--checker-square) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.tx-stage canvas{-webkit-user-drag:none}.tx-canvas{display:block;position:relative;image-rendering:pixelated}.tx-grid,.tx-selection,.tx-cursor{position:absolute;pointer-events:none}.tx-grid{display:block;mix-blend-mode:difference}.tx-selection{outline:1.5px dashed var(--accent);outline-offset:-1px;background:var(--accent-soft);animation:marching .7s linear infinite}@keyframes marching{to{outline-offset:-4px}}.tx-cursor{outline:1.5px solid rgba(255,255,255,.9);box-shadow:0 0 0 1.5px #000000a6}.tx-statusbar{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:14px;padding:6px 12px;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:99px;font-size:11.5px;color:var(--text-2);font-variant-numeric:tabular-nums;box-shadow:var(--shadow-md);z-index:12;pointer-events:none}.tx-statusbar .tx-zoom{color:var(--text-1)}.tx-readout{display:inline-flex;align-items:center;gap:6px}.tx-readout i{width:11px;height:11px;border-radius:3px;border:1px solid rgba(255,255,255,.25)}.tx-tile-preview{position:absolute;right:14px;top:14px;padding:8px;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:var(--r-md);box-shadow:var(--shadow-lg);z-index:12}.tx-tile-label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--text-3);margin-bottom:6px;font-weight:700}.tx-tile-preview canvas{display:block;width:150px;height:150px;image-rendering:pixelated;border-radius:4px}.cw{--cw-x: 50%;--cw-y: 50%;--cw-shade: 0;--cw-bright: #ffffff;--cw-color: #ffffff}.cw-body{display:flex;align-items:stretch;gap:12px;max-width:232px;margin:0 auto}.cw-wheel{position:relative;flex:1;min-width:0;aspect-ratio:1;border-radius:50%;cursor:crosshair;touch-action:none;background:radial-gradient(circle closest-side,#fff,#fff0),conic-gradient(red,#ff0 60deg,#0f0,#0ff,#00f,#f0f,red 360deg);box-shadow:0 4px 18px -8px #000000b3,0 0 22px -10px var(--cw-color)}.cw-wheel:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.cw-ring{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;pointer-events:none;box-shadow:inset 0 0 0 1px #ffffff38,inset 0 0 14px #00000047,0 0 0 1px var(--line-strong)}.cw-shade{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;pointer-events:none;background:#000;opacity:var(--cw-shade)}.cw-marker{position:absolute;left:var(--cw-x);top:var(--cw-y);width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;pointer-events:none;background:var(--cw-color);border:2.5px solid #ffffff;box-shadow:0 0 0 1px #0000008c,0 2px 6px #00000073}.cw-bar{position:relative;flex:none;width:22px;border-radius:11px;cursor:ns-resize;touch-action:none;background:linear-gradient(to bottom,var(--cw-bright),#000000);box-shadow:inset 0 0 0 1px #ffffff2e,0 0 0 1px var(--line-strong)}.cw-bar:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.cw-bar-thumb{position:absolute;left:-3px;right:-3px;height:10px;transform:translateY(-50%);border-radius:5px;pointer-events:none;background:var(--cw-color);border:2px solid #ffffff;box-shadow:0 0 0 1px #0000008c,0 2px 6px #0006}.cw-foot{display:flex;align-items:center;gap:8px;margin-top:12px}.cw-preview{width:30px;height:30px;flex:none;border-radius:var(--r-sm);border:1px solid var(--line-strong);overflow:hidden}.cw-preview span{display:block;width:100%;height:100%}.cw-hex{flex:1;min-width:0;text-transform:uppercase;letter-spacing:.04em}.tx-swatches{display:grid;grid-template-columns:repeat(9,1fr);gap:4px}.tx-swatches button{aspect-ratio:1;border-radius:4px;border:1px solid rgba(255,255,255,.16);transition:transform .1s ease}.tx-swatches button:hover{transform:scale(1.15)}.tx-swatches button.active{outline:2px solid var(--accent);outline-offset:1px}.tx-swatches button.highlighted{outline:2px dashed var(--text-0);outline-offset:1px}.tx-swatches button.active.highlighted{outline-color:var(--accent);box-shadow:0 0 0 1px var(--bg-1),0 0 0 3px var(--text-0)}.noise-palette{margin-top:11px}.noise-palette-list{display:flex;flex-direction:column;gap:5px}.noise-palette-row{display:flex;align-items:center;gap:5px}.noise-palette-row>.color-control{flex:1;min-width:0}.tx-swatch-slot{position:relative;aspect-ratio:1}.tx-swatch-slot>button{width:100%;height:100%}.tx-swatch-remove{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;border-radius:4px;background:#0000008c;color:#fff;opacity:0;transition:opacity .12s ease}.tx-swatch-slot:hover .tx-swatch-remove,.tx-swatch-remove:focus-visible{opacity:1}.tx-highlight{position:absolute;pointer-events:none}.tx-layer-actions{display:flex;gap:2px;margin-bottom:8px}.layer-thumb.checker{background-color:var(--checker-base);background-image:linear-gradient(45deg,var(--checker-square) 25%,transparent 25%),linear-gradient(-45deg,var(--checker-square) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--checker-square) 75%),linear-gradient(-45deg,transparent 75%,var(--checker-square) 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0}.layer-name-input{flex:1;min-width:0;background:transparent;border:1px solid transparent;border-radius:4px;padding:2px 5px;font-size:12px;color:var(--text-1);outline:none}.layer-name-input:hover{border-color:var(--line)}.layer-name-input:focus{background:var(--bg-3);border-color:var(--accent);color:var(--text-0)}.start-screen{display:grid;place-items:center;padding:24px;overflow:auto;background:var(--bg-0)}.start-card{width:min(560px,100%);text-align:center}.start-mark{width:44px;height:44px;border-radius:12px;font-size:20px;margin:0 auto 16px}.start-card h1{font-size:21px;font-weight:650;letter-spacing:-.02em;color:var(--text-0)}.start-card>p{margin-top:7px;font-size:13px;color:var(--text-2)}.start-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:22px;text-align:left}.start-action{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-1);color:var(--text-2);text-align:left;transition:border-color .12s ease,background .12s ease,transform .12s ease}.start-action:hover{background:var(--bg-2);border-color:var(--accent);transform:translateY(-1px)}.start-action svg{grid-row:1 / span 2;color:var(--accent)}.start-action strong{font-size:13.5px;font-weight:600;color:var(--text-0)}.start-action span{font-size:11.5px;color:var(--text-3)}.start-hint{margin-top:18px;font-size:11.5px;color:var(--text-3)}@media(max-width:620px){.start-actions{grid-template-columns:minmax(0,1fr)}}.tx-import-preview{display:grid;place-items:center;min-height:180px;padding:14px;border-radius:var(--r-md);background-color:#fff;background-image:linear-gradient(45deg,#d4d7de 25%,transparent 25%),linear-gradient(-45deg,#d4d7de 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d4d7de 75%),linear-gradient(-45deg,transparent 75%,#d4d7de 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.tx-import-canvas{display:block;image-rendering:pixelated;box-shadow:0 0 0 1px #00000059}.tx-import-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:4px 0 14px}.keys-toolbar{display:flex;gap:8px;align-items:center;margin-bottom:12px}.keys-toolbar .input{flex:1}.keys-note{color:var(--accent)}.keys-list{display:flex;flex-direction:column}.keys-row{display:flex;align-items:center;gap:12px;padding:5px 0;border-bottom:1px solid var(--line)}.keys-row:last-child{border-bottom:none}.keys-label{flex:1;min-width:0;font-size:12.5px;color:var(--text-1)}.keys-label em{color:var(--text-3);font-style:normal;font-size:11px}.keys-chords{display:flex;align-items:center;gap:6px;flex:none}.keys-chip{display:inline-flex;align-items:center;gap:5px;cursor:pointer}.keys-chip:hover{border-color:var(--accent);color:var(--text-0)}.keys-chip.taken{border-style:dashed;opacity:.65}.keys-unbound{font-size:11px;color:var(--text-3);font-style:italic}.keys-chords .icon-btn{width:26px;height:26px}.update-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;font-size:12px;font-weight:550;color:#fff;background:linear-gradient(135deg,var(--accent),#ec4899);box-shadow:0 2px 10px #00000047}.update-badge:hover:not(:disabled){filter:brightness(1.08)}.update-badge:disabled{opacity:.6}.about-rows{display:flex;flex-direction:column}.about-rows>div{display:flex;justify-content:space-between;gap:16px;padding:6px 0;border-bottom:1px solid var(--line);font-size:12.5px}.about-rows>div:last-child{border-bottom:none}.about-rows span{color:var(--text-2)}.about-rows strong{color:var(--text-0);font-weight:550;font-variant-numeric:tabular-nums}.about-highlight{font-size:13px;color:var(--text-0);font-weight:550}.about-error{margin-top:8px;font-size:12px;color:var(--danger)}.about-actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.about-path{display:block;margin-top:8px;padding:8px 10px;border-radius:var(--r-sm);background:var(--bg-2);border:1px solid var(--line);font-family:ui-monospace,monospace;font-size:11px;color:var(--text-2);word-break:break-all}.tab-dirty{width:7px;height:7px;border-radius:50%;background:var(--text-1);flex:none;margin-left:-2px}.tab:hover .tab-dirty{display:none}.open-preview{display:grid;place-items:center;min-height:190px;padding:14px;border-radius:var(--r-md);background-color:#fff;background-image:linear-gradient(45deg,#d4d7de 25%,transparent 25%),linear-gradient(-45deg,#d4d7de 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d4d7de 75%),linear-gradient(-45deg,transparent 75%,#d4d7de 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.open-preview img{max-width:100%;max-height:220px;display:block;box-shadow:0 2px 14px #00000059}.open-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.open-choices .start-action:disabled{opacity:.5}@media(max-width:620px){.open-choices{grid-template-columns:minmax(0,1fr)}}.tx-transform{position:absolute;pointer-events:none;outline:1.5px solid var(--accent);outline-offset:-1px}.tx-handle{position:absolute;width:10px;height:10px;background:var(--bg-0);border:1.5px solid var(--accent);border-radius:2px;pointer-events:auto}.tx-handle.nw{left:-5px;top:-5px}.tx-handle.n{left:calc(50% - 5px);top:-5px}.tx-handle.ne{right:-5px;top:-5px}.tx-handle.e{right:-5px;top:calc(50% - 5px)}.tx-handle.se{right:-5px;bottom:-5px}.tx-handle.s{left:calc(50% - 5px);bottom:-5px}.tx-handle.sw{left:-5px;bottom:-5px}.tx-handle.w{left:-5px;top:calc(50% - 5px)}.tx-transform-size{position:absolute;left:50%;bottom:-26px;transform:translate(-50%);padding:2px 7px;border-radius:999px;background:var(--accent);color:#fff;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none}.project-menu{position:relative;flex:none}.project-button{display:flex;align-items:center;gap:7px;padding:6px 9px;border-radius:var(--r-sm);border:1px solid transparent;color:var(--text-2);font-size:12.5px;max-width:200px}.project-button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.project-button:hover,.project-button.open{background:var(--bg-2);color:var(--text-0);border-color:var(--line)}.project-dropdown{position:absolute;top:calc(100% + 6px);left:0;z-index:120;width:290px;padding:8px;border-radius:var(--r-md);background:var(--bg-1);border:1px solid var(--line);box-shadow:0 16px 40px #00000080}.project-dropdown-label{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);padding:4px 6px 8px}.project-row{display:flex;align-items:center;gap:8px;width:100%;padding:6px;border-radius:var(--r-sm);color:var(--text-1);font-size:12.5px;text-align:left}.project-row:hover{background:var(--bg-2)}.project-row.active{background:var(--accent-soft);color:var(--text-0)}.project-row .icon-btn{width:22px;height:22px;opacity:0;flex:none}.project-row:hover .icon-btn{opacity:1}.project-row .input{flex:1;min-width:0}.project-row-open{display:flex;align-items:center;gap:8px;flex:1;min-width:0;color:inherit;text-align:left}.project-row-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.project-row-hint{font-size:11px;color:var(--text-3)}.project-dropdown-foot{margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}.project-dropdown-foot .hint-text{margin-top:8px}.project-create{display:flex;gap:6px}.project-create .input{flex:1;min-width:0}.start-projects{margin:20px 0 4px;text-align:left}.start-project-row{display:flex;flex-wrap:wrap;gap:7px}.start-project{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;border:1px solid var(--line);background:var(--bg-1);color:var(--text-2);font-size:12px}.start-project:hover{color:var(--text-0);border-color:var(--accent)}.start-project.active{background:var(--accent-soft);border-color:var(--accent);color:var(--text-0)}.start-project.ghost{border-style:dashed}.start-project-input{width:150px;border-radius:999px;padding:5px 12px}.start-project-new{display:inline-flex;align-items:center;gap:7px;margin-top:18px;padding:6px 12px;border-radius:999px;border:1px dashed var(--line-strong);color:var(--text-3);font-size:12px}.start-project-new:hover{color:var(--text-1);border-color:var(--accent)}html,body,#root{max-width:100%;overflow-x:hidden}.sheet-close{display:none;place-items:center;position:absolute;top:8px;right:8px;width:30px;height:30px;border-radius:var(--r-sm);color:var(--text-1);background:var(--bg-2);z-index:2}.sheet-close:hover{background:var(--bg-hover);color:var(--text-0)}@media(max-width:900px){.app-body .panel,.app-body .inspector{position:absolute;top:0;bottom:0;z-index:60;width:min(340px,86vw)!important;box-shadow:var(--shadow-lg)}.app-body .panel{left:var(--rail-w);border-right:1px solid var(--line-strong)}.app-body .inspector{right:0;border-left:1px solid var(--line-strong)}.app-body .panel-resizer{display:none}.sheet-scrim{position:absolute;top:0;right:0;bottom:0;left:0;left:var(--rail-w);z-index:55;background:#00000073;animation:sheet-scrim-in .14s ease-out}@keyframes sheet-scrim-in{0%{opacity:0}}.sheet-close{display:grid}.app-body .inspector[hidden]{display:none}.floating-panel{left:8px!important;right:8px;width:auto!important;max-height:min(70vh,560px)}.floating-panel-grip{display:none}}@media(max-width:640px){:root{--topbar-h: 48px;--tabbar-h: 62px;--bottombar-h: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px))}.app-body{padding-bottom:var(--bottombar-h)}.app-body .rail{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;height:var(--bottombar-h);flex-direction:row;justify-content:space-around;align-items:stretch;padding:4px 4px calc(4px + env(safe-area-inset-bottom,0px));border-right:none;border-top:1px solid var(--line);z-index:70}.app-body .rail-btn{width:auto;flex:1;min-width:0;padding:6px 2px;gap:2px;font-size:9.5px}.app-body .rail-btn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.app-body .tx-toolrail{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;height:var(--bottombar-h);flex-direction:row;align-items:center;justify-content:flex-start;gap:2px;padding:4px 6px calc(4px + env(safe-area-inset-bottom,0px));border-right:none;border-top:1px solid var(--line);overflow-x:auto;scrollbar-width:none;z-index:70}.app-body .tx-toolrail::-webkit-scrollbar{display:none}.app-body .tx-tool{flex:none}.app-body .tx-toolrail-sep{width:1px;height:26px;margin:0 4px}.app-body .panel,.app-body .inspector{left:0;right:0;top:auto;bottom:var(--bottombar-h);width:auto!important;height:58vh;border:none;border-top:1px solid var(--line-strong);border-radius:var(--r-lg) var(--r-lg) 0 0}.sheet-scrim{left:0;bottom:var(--bottombar-h)}.app-body .panel:before,.app-body .inspector:before{content:"";position:absolute;top:7px;left:50%;transform:translate(-50%);width:36px;height:4px;border-radius:2px;background:var(--line-strong)}.app-body .panel .panel-head,.app-body .inspector .inspector-scroll{padding-top:18px}.topbar .brand span:not(.brand-mark),.topbar .project-button span:not([class]),.topbar .doc-name{display:none}.topbar .project-button{padding:0 6px}.topbar{padding:0 6px;gap:2px}.topbar-spacer{flex:1;min-width:0}.topbar-group{gap:0;flex:none}.topbar .brand,.topbar .export-btn{flex:none}.project-dropdown{position:fixed;left:6px;right:6px;top:calc(var(--topbar-h) + 4px);width:auto;max-height:calc(100dvh - var(--topbar-h) - 24px);overflow-y:auto}.export-btn span{display:none}.export-btn{padding:0 10px}.tabbar{overflow-x:auto;scrollbar-width:none}.tabbar::-webkit-scrollbar{display:none}.tab{max-width:46vw}:root{--zoombar-bottom: calc(var(--bottombar-h) + 12px)}.stage.cropping .zoombar:not(.crop-bar),.stage.masking .zoombar:not(.crop-bar){display:none}.crop-bar{bottom:var(--zoombar-bottom)}.mask-bar{bottom:var(--zoombar-bottom);left:8px;right:8px;transform:none;justify-content:center;flex-wrap:wrap;border-radius:var(--r-md)}.floating-panel{bottom:calc(var(--bottombar-h) + 8px);top:auto!important;max-height:56vh}.selection-toolbar-bar button span{display:none}.selection-toolbar-bar button{padding:0 10px}.layer-grip{width:30px;height:34px}.layer{padding:7px}.modal-backdrop{padding:12px}.modal{width:100%;max-width:none!important}.settings-tab-select{height:34px;margin-bottom:4px}}@media(pointer:coarse){.topbar>*:not(.project-menu),.project-button,.app-body .rail,.sheet-scrim,.zoombar,.selection-toolbar-bar{touch-action:none}.project-dropdown{touch-action:pan-y}.handle:after,.crop-handle:after{content:"";position:absolute;top:-16px;right:-16px;bottom:-16px;left:-16px}.rotate-handle:after{content:"";position:absolute;top:-12px;right:-12px;bottom:-12px;left:-12px}.icon-btn{min-width:34px;min-height:34px}.layer,.rail-btn,.asset-tile,.preset-row{min-height:40px}.layer:hover,.filter-tile:hover,.shape-btn:hover{background:inherit}.filter-strip.scroll,.layer-list,.panel-body,.inspector-scroll,.floating-panel-body{-webkit-overflow-scrolling:touch}}