:root{color-scheme:light dark;--canvas: light-dark(#f5f5f5, #15161b);--panel: light-dark(#ffffff, #202229);--line: light-dark(#e6e6e6, #353843);--text: light-dark(rgba(0, 0, 0, .9), #ffffff);--muted: light-dark(rgba(0, 0, 0, .5), rgba(255, 255, 255, .55));--input: light-dark(#f5f5f5, #2b2d36);--hover: light-dark(#f5f5f5, #2b2d36);--selected: light-dark(rgba(0, 0, 0, .06), rgba(255, 255, 255, .1));--accent: light-dark(#1a1a1a, #f2f2f5);--accent-ink: light-dark(#ffffff, #15161b);--axis: #ff4d8d;--check-a: light-dark(#ffffff, #3d404b);--check-b: light-dark(#e3e3e3, #31333d);--grid: light-dark(rgba(0, 0, 0, .08), rgba(255, 255, 255, .08));--grid-major: light-dark(rgba(0, 0, 0, .22), rgba(255, 255, 255, .22));--frame: light-dark(rgba(0, 0, 0, .12), rgba(255, 255, 255, .12));--handle: #ffffff;--shadow-handle: 0 0 0 1px rgba(0, 0, 0, .25), 0 1px 3px rgba(0, 0, 0, .3);--shadow-thumb: 0 0 0 1px rgba(0, 0, 0, .35);--swatch-edge: rgba(0, 0, 0, .12);--swatch-edge-strong: rgba(0, 0, 0, .2);--menu-bg: light-dark(#ffffff, #1a1b21);--menu-text: light-dark(rgba(0, 0, 0, .9), #ffffff);--menu-muted: light-dark(rgba(0, 0, 0, .3), rgba(255, 255, 255, .35));--menu-shortcut: light-dark(rgba(0, 0, 0, .5), rgba(255, 255, 255, .5));--menu-line: light-dark(rgba(0, 0, 0, .1), rgba(255, 255, 255, .12));--tooltip-bg: #1a1b21;--tooltip-text: #ffffff;--tooltip-muted: rgba(255, 255, 255, .55);--tooltip-hover: rgba(255, 255, 255, .12);--shadow: 0 0 .5px light-dark(rgba(0, 0, 0, .18), rgba(0, 0, 0, .6)), 0 3px 8px light-dark(rgba(0, 0, 0, .1), rgba(0, 0, 0, .35)), 0 1px 3px light-dark(rgba(0, 0, 0, .1), rgba(0, 0, 0, .3));--shadow-pop: 0 0 .5px light-dark(rgba(0, 0, 0, .3), rgba(0, 0, 0, .7)), 0 2px 5px light-dark(rgba(0, 0, 0, .15), rgba(0, 0, 0, .35)), 0 10px 16px light-dark(rgba(0, 0, 0, .12), rgba(0, 0, 0, .35));--shadow-menu: 0 0 .5px rgba(0, 0, 0, .4), 0 5px 17px rgba(0, 0, 0, .25), 0 2px 7px rgba(0, 0, 0, .15);--backdrop: rgba(0, 0, 0, .3);--radius: 5px;--radius-lg: 13px;--font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}:root[data-theme=light]{color-scheme:light}:root[data-theme=dark]{color-scheme:dark}:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}*,*:before,*:after{box-sizing:inherit}html,body,#root{height:100%}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;overflow:hidden;background:var(--canvas);color:var(--text);font:11px/16px var(--font);letter-spacing:.005em;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}button{cursor:default}:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}[hidden]{display:none!important}.icon{display:block;flex:none}.muted{color:var(--muted)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.spacer{flex:1 1 auto}.caret{font-size:9px;color:var(--muted)}body.is-scrubbing,body.is-scrubbing *{cursor:ew-resize!important;-webkit-user-select:none;user-select:none}body.is-resizing,body.is-resizing *{cursor:col-resize!important;-webkit-user-select:none;user-select:none}:root{--toolbar-bottom: calc(16px + env(safe-area-inset-bottom, 0px)) }.app{height:100%;display:grid;grid-template-columns:var(--left-width, 240px) minmax(0,1fr) var(--right-width, 248px);grid-template-rows:minmax(0,1fr)}.app.ui-hidden{grid-template-columns:minmax(0,1fr)}.app.ui-hidden .panel,.app.ui-hidden .toolbar,.app.ui-hidden .tool-options,.app.ui-hidden .coordinates,.app.ui-hidden .resizer,.app.ui-hidden .shortcuts-help-button{display:none}.panel{min-height:0;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;background:var(--panel);scrollbar-width:thin}.panel-left{border-right:1px solid var(--line)}.panel-right{border-left:1px solid var(--line)}.export-preview-wrap{flex:none;padding:12px 16px 4px}.preview.export-preview{height:160px}.export-size{margin:6px 0 0;color:var(--muted)}.segmented{display:flex;flex:1;gap:2px;margin-bottom:4px;padding:2px;border-radius:var(--radius);background:var(--input)}.segmented button{flex:1;min-width:0;height:20px;padding:0;border:0;border-radius:calc(var(--radius) - 1px);background:none;color:var(--muted);font:inherit;cursor:pointer}.segmented button:hover{color:var(--text)}.segmented button[aria-pressed=true]{background:var(--panel);color:var(--text);box-shadow:0 0 0 1px var(--line)}.panel-tabs{display:flex;gap:16px;flex:none;padding:0 16px;border-bottom:1px solid var(--line)}.panel-tab{height:36px;margin-bottom:-1px;padding:0;border:0;border-bottom:2px solid transparent;background:none;color:var(--muted);font:inherit;font-weight:500;cursor:pointer}.panel-tab:hover{color:var(--text)}.panel-tab[aria-selected=true]{border-bottom-color:var(--text);color:var(--text)}.panel-tab:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.panel-tab-body{display:flex;flex-direction:column;flex:1 0 auto}.panel-header{display:flex;align-items:center;gap:6px;min-height:48px;padding:8px 12px 8px 8px;border-bottom:1px solid var(--line);flex:none}.logo-button,.zoom-button{height:32px;padding:0 6px;display:flex;align-items:center;gap:4px;border:0;border-radius:var(--radius);background:transparent;flex:none}.zoom-button{height:28px;padding:0 6px 0 8px}.logo-button:hover,.logo-button[aria-expanded=true],.zoom-button:hover,.zoom-button[aria-expanded=true]{background:var(--hover)}.file-name{display:grid;flex:1;min-width:0}.file-name input{height:22px;min-width:0;padding:0 4px;border:1px solid transparent;border-radius:4px;background:transparent;font-weight:600}.file-name input:hover{border-color:var(--line)}.file-name input:focus{border-color:var(--accent);outline:none}.file-name .muted{padding-left:5px}.section{flex:none;padding:4px 16px 12px;border-bottom:1px solid var(--line)}.section.grow{flex:1 1 auto;min-height:120px}.section-title{display:flex;align-items:center;gap:4px;height:36px;margin:0;font-size:11px;font-weight:600}.section-name{flex:1}.section.is-collapsed{padding-bottom:0}.section-toggle{display:flex;align-items:center;gap:4px;align-self:stretch;min-width:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}.section-toggle .icon{color:var(--muted);opacity:0;transition:opacity .1s}.section-toggle:hover .icon,.section-toggle:focus-visible .icon,.is-collapsed .section-toggle .icon{opacity:1}.is-collapsed .section-toggle .icon{transform:rotate(-90deg)}.section-toggle:focus-visible{outline:none;text-decoration:underline}.section-name:has(+.section-info){flex:0 1 auto}.section-info{display:grid;place-items:center;margin-right:auto;padding:2px;border-radius:50%;color:var(--muted);cursor:help}.section-info:hover,.section-info:focus-visible{color:var(--text);outline:none}.section-title .muted{font-weight:400;max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.subsection-title{display:flex;align-items:center;justify-content:space-between;height:32px;margin-top:4px;font-weight:600}.row{display:flex;align-items:center;gap:8px;min-height:32px}.row-label{width:72px;flex:none;color:var(--muted)}.row-control{flex:1;min-width:0;display:flex}.row-control>.field{flex:1}.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}.button-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.button-group{display:inline-flex;margin-top:8px;padding:2px;border-radius:var(--radius-lg);background:var(--input)}.button-group .icon-btn+.icon-btn{border-left:1px solid var(--line);border-radius:0 var(--radius) var(--radius) 0}.button-group .icon-btn:first-child:not(:only-child){border-radius:var(--radius) 0 0 var(--radius)}.button-group .icon-btn:not(:first-child):not(:last-child){border-radius:0}.hint{margin:6px 0 0;color:var(--muted)}.icon-btn{width:24px;height:24px;flex:none;display:grid;place-items:center;padding:0;border:0;border-radius:var(--radius);background:transparent;color:var(--text)}.icon-btn.large{width:32px;height:32px}.icon-btn:hover,.icon-btn[aria-expanded=true],.icon-btn[aria-pressed=true]{background:var(--hover)}.icon-btn:disabled{opacity:.3;background:transparent}.btn{height:24px;padding:0 8px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);border-radius:var(--radius);background:transparent;font-weight:500;white-space:nowrap}.btn:hover{background:var(--hover)}.btn:disabled{opacity:.4;background:transparent}.btn-primary{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}.btn-primary:hover{background:var(--accent);filter:brightness(1.06)}.btn-wide{width:100%;margin-top:8px}.field{height:24px;min-width:0;display:flex;align-items:center;border:1px solid transparent;border-radius:var(--radius);background:var(--input)}.field:hover{border-color:var(--line)}.field:focus-within{border-color:var(--accent)}.field input,.field select{width:100%;min-width:0;height:22px;padding:0 6px 0 7px;border:0;background:transparent;outline:none}.field input[type=number]{-moz-appearance:textfield}.field input::-webkit-outer-spin-button,.field input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.field-label{flex:none;min-width:22px;padding:0 2px 0 7px;color:var(--muted);-webkit-user-select:none;user-select:none}.field-label.is-scrubbable{cursor:ew-resize}.field-label+input{padding-left:2px}.field-suffix{flex:none;padding-right:7px;color:var(--muted)}.checkbox{display:flex;align-items:center;gap:8px;min-height:28px}.checkbox input{width:12px;height:12px;margin:0;accent-color:var(--accent)}.select-plain{max-width:128px;height:24px;padding:0 2px;border:0;border-radius:var(--radius);background:transparent;font-weight:400}.select-plain:hover{background:var(--hover)}.color-row{display:flex;align-items:center;gap:4px;min-height:32px}.color-row.is-dimmed .field{opacity:.45}.hex-field{flex:1}.hex-field.is-editing{border-color:var(--accent)}.hex-field input{padding-left:6px}.opacity-field{flex:0 0 60px}.color-role{width:62px;flex:none;overflow:hidden;color:var(--muted);text-align:right;text-overflow:ellipsis;white-space:nowrap}.color-chip{position:relative;width:16px;height:16px;flex:none;margin-left:4px;padding:0;overflow:hidden;border:0;border-radius:3px;background:conic-gradient(var(--check-b) 25%,var(--check-a) 0 50%,var(--check-b) 0 75%,var(--check-a) 0) 0 0 / 8px 8px;cursor:pointer}.color-chip i{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:3px;box-shadow:inset 0 0 0 1px var(--swatch-edge)}.recent-colors{margin-top:8px}.palette-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(18px,1fr));gap:4px}.swatch{position:relative;aspect-ratio:1;padding:0;border:0;border-radius:3px;box-shadow:inset 0 0 0 1px var(--swatch-edge);cursor:pointer}.swatch.is-primary:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border:2px solid var(--accent);border-radius:5px}.swatch.is-dragging{opacity:.35}.swatch.drop-before{box-shadow:inset 0 0 0 1px var(--swatch-edge),-3px 0 0 0 var(--accent)}.swatch.drop-after{box-shadow:inset 0 0 0 1px var(--swatch-edge),3px 0 0 0 var(--accent)}.palette-grid.is-sortable .swatch{touch-action:none}.swatch.is-secondary:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border:1px dashed var(--muted);border-radius:5px}.item-list{display:grid;margin:0 -8px}.files-list{max-height:220px;overflow-y:auto}.item{display:flex;align-items:center;gap:8px;height:32px;padding:0 4px 0 8px;border-radius:var(--radius)}.item:hover{background:var(--hover)}.item.is-active,.item.is-selected{background:var(--selected)}.item.is-active .item-name{font-weight:500}.item.is-hidden .item-name,.item.is-hidden .thumb{opacity:.4}.item-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.item-name{-webkit-user-select:none;user-select:none}.item-name input{-webkit-user-select:text;user-select:text;width:100%;height:22px;padding:0 4px;border:1px solid var(--accent);border-radius:4px;background:var(--panel);outline:none}.item-action{opacity:0}.item:hover .item-action,.item.is-hidden .item-action,.item.is-locked .item-lock,.item-action:focus-visible,.item-action[aria-expanded=true]{opacity:1}.thumb{width:20px;height:20px;flex:none;border-radius:3px;image-rendering:pixelated;box-shadow:0 0 0 1px var(--line);background:conic-gradient(var(--check-b) 25%,var(--check-a) 0 50%,var(--check-b) 0 75%,var(--check-a) 0) 0 0 / 6px 6px}.layer-actions{display:flex;gap:2px;margin-top:6px}.preview{position:relative;height:140px;overflow:hidden;border-radius:var(--radius);background:var(--canvas)}.preview canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.workspace{position:relative;min-width:0;overflow:hidden;background:var(--canvas)}.canvas-wrap{position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none}.canvas{display:block;width:100%;height:100%;cursor:crosshair;touch-action:none}.canvas-wrap[data-tool=move] .canvas{cursor:move}.canvas-wrap[data-tool=hand] .canvas{cursor:grab}.canvas-wrap[data-tool=picker] .canvas,.canvas.alt-pick{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='white' stroke-width='4.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 9-8.414 8.414A2 2 0 0 0 3 18.828v1.344a2 2 0 0 1-.586 1.414A2 2 0 0 1 3.828 21h1.344a2 2 0 0 0 1.414-.586L15 12'/%3E%3Cpath d='m18 9 .4.4a1 1 0 1 1-3 3l-3.8-3.8a1 1 0 1 1 3-3l.4.4 3.4-3.4a1 1 0 1 1 3 3z'/%3E%3Cpath d='m2 22 .414-.414'/%3E%3C/g%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 9-8.414 8.414A2 2 0 0 0 3 18.828v1.344a2 2 0 0 1-.586 1.414A2 2 0 0 1 3.828 21h1.344a2 2 0 0 0 1.414-.586L15 12'/%3E%3Cpath d='m18 9 .4.4a1 1 0 1 1-3 3l-3.8-3.8a1 1 0 1 1 3-3l.4.4 3.4-3.4a1 1 0 1 1 3 3z'/%3E%3Cpath d='m2 22 .414-.414'/%3E%3C/g%3E%3C/svg%3E") 2 22,crosshair}.canvas.on-axis-x{cursor:ew-resize}.canvas.on-axis-y{cursor:ns-resize}.canvas.on-label{cursor:default}.frame-name-input{position:absolute;transform:translate(-5px,-100%);width:200px;height:20px;padding:0 4px;border:1px solid var(--accent);border-radius:4px;background:var(--panel);color:var(--text);font:500 11px var(--font);outline:none}body.is-panning .canvas{cursor:grab}.canvas-wrap.is-dropping:after{content:attr(data-drop-label);position:absolute;top:12px;right:12px;bottom:12px;left:12px;display:grid;place-items:center;font-size:13px;font-weight:600;border:2px dashed var(--accent);border-radius:8px;background:color-mix(in srgb,var(--accent) 8%,transparent);pointer-events:none}.toolbar{position:absolute;left:50%;bottom:var(--toolbar-bottom);max-width:calc(100% - 24px);display:flex;align-items:center;gap:2px;padding:4px;overflow-x:auto;transform:translate(-50%);border-radius:var(--radius-lg);background:var(--panel);box-shadow:var(--shadow);scrollbar-width:none}.toolbar::-webkit-scrollbar,.tool-options::-webkit-scrollbar{display:none}.tool-options{position:absolute;left:50%;bottom:calc(var(--toolbar-bottom) + 48px);max-width:calc(100% - 24px);height:36px;display:flex;align-items:center;gap:14px;padding:0 12px;overflow-x:auto;transform:translate(-50%);border-radius:var(--radius-lg);background:var(--panel);box-shadow:var(--shadow);white-space:nowrap;scrollbar-width:none}.tool-options>*{flex:none}.tool-options-name{display:inline-flex;align-items:center;gap:4px;font-weight:600}.tool-options-name .icon{color:var(--muted)}.tool-options-name:focus-visible{outline:none;text-decoration:underline}.tool-options .row{min-height:0}.tool-options .row-label{width:auto}.tool-options .row-control{width:76px}.tool-options .checkbox{min-height:0}.tool-options .button-row,.tool-options .button-group{margin-top:0}.tool-options .button-group{padding:0}.tool-btn{width:32px;height:32px;flex:none;display:grid;place-items:center;padding:0;border:0;border-radius:6px;background:transparent;color:var(--text)}.tool-btn:hover{background:var(--hover)}.tool-btn[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}.tool-btn:disabled{opacity:.3;background:transparent}.item.is-dragging{opacity:.5}.item.drop-before{box-shadow:inset 0 2px 0 var(--accent)}.item.drop-after{box-shadow:inset 0 -2px 0 var(--accent)}body.is-dragging-layer,body.is-dragging-layer *,body.is-dragging-swatch,body.is-dragging-swatch *{cursor:grabbing!important;-webkit-user-select:none;user-select:none}.tool-split{display:flex;align-items:center}.tool-caret{width:14px;height:32px;display:grid;place-items:center;padding:0;border:0;border-radius:6px;background:transparent;color:var(--muted)}.tool-caret:hover,.tool-caret[aria-expanded=true]{background:var(--hover);color:var(--text)}.toolbar-divider{width:1px;height:20px;flex:none;margin:0 4px;background:var(--line)}.coordinates{position:absolute;top:12px;right:12px;height:24px;display:flex;align-items:center;gap:10px;padding:0 8px;border-radius:6px;background:var(--panel);box-shadow:var(--shadow);color:var(--muted);white-space:nowrap;pointer-events:none}.coordinates b{color:var(--text);font-weight:500}.shortcuts-help-button{position:absolute;top:44px;right:12px;z-index:6;background:var(--panel);box-shadow:var(--shadow)}.coordinates i{display:inline-block;width:10px;height:10px;margin-right:5px;vertical-align:-1px;border-radius:2px;box-shadow:inset 0 0 0 1px var(--swatch-edge-strong)}.resizer{position:absolute;top:0;bottom:0;z-index:5;width:7px;cursor:col-resize;touch-action:none}.resizer-left{left:0}.resizer-right{right:0}.resizer:after{content:"";position:absolute;top:0;bottom:0;width:2px;background:var(--accent);opacity:0;transition:opacity .12s}.resizer-left:after{left:0}.resizer-right:after{right:0}.resizer:hover:after,.resizer.is-dragging:after{opacity:1}.mobile-bar{display:none}.popover{position:fixed;z-index:40;width:240px;border-radius:var(--radius-lg);background:var(--panel);box-shadow:var(--shadow-pop)}.popover-header{display:flex;align-items:center;justify-content:space-between;height:40px;padding:0 8px 0 16px;border-bottom:1px solid var(--line);font-weight:600}.popover-body{display:grid;gap:10px;padding:12px 16px 16px}.adjust-panel{bottom:calc(var(--toolbar-bottom) + 96px);width:260px}.adjust-row{display:grid;gap:6px}.adjust-label{display:flex;align-items:center;justify-content:space-between}.adjust-value{display:flex;align-items:center;gap:2px;color:var(--muted)}.adjust-value input{width:48px;height:22px;padding:0 4px;border:1px solid transparent;border-radius:var(--radius);background:var(--input);color:var(--text);text-align:right}.adjust-value input:focus{border-color:var(--accent);outline:none}.adjust-slider{width:100%;height:12px;margin:0;border-radius:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--input)}.adjust-slider::-webkit-slider-thumb{width:14px;height:14px;border:2px solid var(--handle);border-radius:50%;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;box-shadow:var(--shadow-thumb)}.adjust-slider::-moz-range-thumb{width:10px;height:10px;border:2px solid var(--handle);border-radius:50%;background:transparent;box-shadow:var(--shadow-thumb)}.adjust-hue{background:linear-gradient(to right,#0ff,#00f,#f0f,red,#ff0,#0f0,#0ff)}.adjust-saturation{background:linear-gradient(to right,#888,#e2533c 50%,#ff2a00)}.adjust-brightness{background:linear-gradient(to right,#000,#e2533c 50%,#fff)}.adjust-actions{display:flex;gap:6px;margin-top:2px}.adjust-spacer{flex:1}.popover-section{display:grid;gap:8px;margin:2px -16px 0;padding:10px 16px 0;border-top:1px solid var(--line)}.sv-area{position:relative;aspect-ratio:1;overflow:hidden;border-radius:4px;cursor:crosshair;touch-action:none}.sv-area canvas,.slider canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.picker-row{display:flex;align-items:center;gap:8px}.picker-bars{flex:1;display:grid;gap:8px}.slider{position:relative;height:12px;overflow:hidden;border-radius:6px;touch-action:none}.knob{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border:3px solid var(--handle);border-radius:50%;box-shadow:var(--shadow-handle);pointer-events:none}.slider .knob{top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-width:2px}.picker-fields{display:grid;grid-template-columns:1fr 64px;gap:6px}.menu{position:fixed;z-index:60;min-width:220px;padding:8px;border-radius:var(--radius-lg);background:var(--menu-bg);color:var(--menu-text);box-shadow:var(--shadow-menu)}.menu-item{position:relative;width:100%;height:24px;display:flex;align-items:center;gap:16px;padding:0 8px 0 24px;border:0;border-radius:var(--radius);background:transparent;color:var(--menu-text);text-align:left;white-space:nowrap}.menu-item:hover:not(:disabled),.menu-item:focus-visible{background:var(--accent);color:var(--accent-ink);outline:none}.menu-item:disabled{color:var(--menu-muted)}.menu-item>.icon{margin-right:-8px}.menu-item.is-checked:before{content:"✓";position:absolute;left:8px}.menu-shortcut{margin-left:auto;color:var(--menu-shortcut)}.menu-item:hover:not(:disabled) .menu-shortcut,.menu-item:focus-visible .menu-shortcut{color:inherit;opacity:.85}.menu-separator{height:1px;margin:8px -8px;background:var(--menu-line)}.tooltip{position:fixed;z-index:70;left:-999px;padding:4px 8px;border-radius:var(--radius);background:var(--tooltip-bg);color:var(--tooltip-text);width:max-content;max-width:240px;line-height:1.4;pointer-events:none;opacity:0;transition:opacity .1s}.tooltip.is-visible{opacity:1}.tooltip-shortcut{margin-left:8px;color:var(--tooltip-muted)}.toast{position:fixed;left:50%;bottom:calc(var(--toolbar-bottom) + 96px);z-index:80;max-width:calc(100vw - 32px);padding:8px 12px;border-radius:6px;background:var(--tooltip-bg);color:var(--tooltip-text);text-align:center;transform:translate(-50%,6px);opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}.toast.is-visible{opacity:1;transform:translate(-50%)}.toast-action{margin:-4px -6px -4px 10px;padding:4px 6px;border:0;border-radius:4px;background:none;color:inherit;font:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px;cursor:pointer;pointer-events:auto}.toast-action:hover{background:var(--tooltip-hover)}.dialog{width:min(400px,calc(100vw - 32px));padding:0;border:0;border-radius:var(--radius-lg);background:var(--panel);color:var(--text);box-shadow:var(--shadow-pop)}.dialog::backdrop{background:var(--backdrop)}.dialog-header{display:flex;align-items:center;height:48px;padding:0 16px;border-bottom:1px solid var(--line);font-size:13px;font-weight:600}.dialog-body{display:grid;gap:12px;padding:16px}.dialog-body p{margin:0}.dialog-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{height:24px;padding:0 8px;border:1px solid var(--line);border-radius:var(--radius);background:transparent}.chip[aria-pressed=true]{border-color:var(--accent);background:var(--selected)}.textarea{height:110px;padding:8px;border:1px solid transparent;border-radius:var(--radius);background:var(--input);resize:vertical;outline:none}.textarea:focus{border-color:var(--accent)}.palette-list{display:grid;max-height:320px;overflow-y:auto;margin:0 -8px}.palette-row{display:flex;align-items:center;gap:8px;min-height:32px;padding:0 8px;border-radius:var(--radius)}.palette-row:hover{background:var(--hover)}.palette-row input{margin:0;accent-color:var(--accent)}.palette-name{flex:none;width:128px}.palette-strip{display:flex;flex:1;min-width:0;height:12px;overflow:hidden;border-radius:2px;box-shadow:inset 0 0 0 1px var(--swatch-edge)}.palette-strip i{flex:1;min-width:3px}.radios{display:grid;gap:4px}.radios label{display:flex;align-items:center;gap:8px}.radios input{margin:0;accent-color:var(--accent)}.output-image{max-width:100%;max-height:50vh;justify-self:center;image-rendering:pixelated;background:conic-gradient(var(--check-b) 25%,var(--check-a) 0 50%,var(--check-b) 0 75%,var(--check-a) 0) 0 0 / 12px 12px}.shortcuts{display:grid;gap:12px;max-height:60vh;overflow:auto}.shortcuts h3{margin:0 0 4px;font-size:11px;font-weight:600}.shortcut{display:flex;justify-content:space-between;gap:16px;padding:2px 0}.shortcut kbd{font:inherit;color:var(--muted)}@media (max-width: 820px){.app,.app.ui-hidden{grid-template-columns:minmax(0,1fr)}.workspace{grid-column:1;grid-row:1}.panel{position:fixed;left:0;right:0;bottom:0;z-index:30;height:min(70vh,600px);padding-bottom:env(safe-area-inset-bottom,0px);border:0!important;border-radius:var(--radius-lg) var(--radius-lg) 0 0;box-shadow:var(--shadow-pop);transform:translateY(105%);transition:transform .2s ease}.sheet-left .panel-left,.sheet-right .panel-right{transform:none}.mobile-bar{position:absolute;top:8px;left:8px;right:8px;display:flex;align-items:center;gap:6px;padding:4px;border-radius:var(--radius-lg);background:var(--panel);box-shadow:var(--shadow)}.mobile-name{flex:1;min-width:0;padding-left:4px;overflow:hidden;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.coordinates,.resizer{display:none}.shortcuts-help-button{top:56px;right:12px}:root{--toolbar-bottom: calc(10px + env(safe-area-inset-bottom, 0px)) }.tool-options{gap:10px}.tool-options .row-label{display:none}.popover.color-picker{left:0!important;right:0;top:auto!important;bottom:0;width:auto;padding-bottom:env(safe-area-inset-bottom,0px);border-radius:var(--radius-lg) var(--radius-lg) 0 0}.popover.color-picker .sv-area{aspect-ratio:auto;height:160px}}@media (prefers-reduced-motion: reduce){*{transition:none!important}}