.auth-button{position:absolute;z-index:10;top:calc(var(--chrome-height) + var(--step-indicator-height) + 12px);right:200px;display:flex;align-items:center;gap:8px;padding:6px 14px;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:8px;border:1px solid var(--color-border-faint);color:var(--color-fg-muted);font-size:13px;cursor:pointer;transition:background .15s,color .15s}.auth-button:hover{background:var(--color-surface-glass);color:var(--color-fg)}.auth-button-wrapper{position:absolute;z-index:10;top:calc(var(--chrome-height) + var(--step-indicator-height) + 12px);right:200px}.auth-user-btn{position:relative;top:auto;right:auto}.auth-avatar{width:24px;height:24px;border-radius:50%;object-fit:cover}.auth-avatar-placeholder{width:24px;height:24px;border-radius:50%;background:var(--color-control-bg-hover);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:var(--color-fg-muted)}.auth-user-name{max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.auth-dropdown{position:absolute;top:calc(100% + 6px);right:0;min-width:160px;background:var(--color-surface-modal);border:1px solid var(--color-border);border-radius:8px;padding:4px 0;box-shadow:var(--shadow-dropdown);animation:popover-fade-in .12s ease-out}.auth-dropdown-item{display:block;width:100%;padding:8px 14px;background:none;border:none;color:var(--color-fg-muted);font-size:13px;text-align:left;cursor:pointer;transition:background .1s,color .1s}.auth-dropdown-item:hover{background:var(--color-control-bg);color:var(--color-fg)}.auth-dropdown-signout:hover{color:var(--color-danger)}.auth-dropdown-divider{height:1px;background:var(--color-border-faint);margin:4px 0}.global-header{height:var(--global-header-height);min-height:var(--global-header-height);display:flex;align-items:center;justify-content:space-between;padding:0 var(--spacing-sp-md);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);z-index:300;position:relative}.global-header-left{display:flex;align-items:center;gap:var(--spacing-sp-sm)}.global-header-logo-btn{display:flex;align-items:center;gap:var(--spacing-sp-sm);background:none;border:none;padding:0;cursor:pointer;color:var(--color-fg);font:inherit;transition:color var(--default-transition-duration) var(--default-transition-timing-function)}.global-header-logo-btn:hover{color:var(--color-fg-muted)}.global-header-logo{width:22px;height:22px;filter:brightness(0) invert(1)}.global-header-app-name{font-size:var(--font-size-sm);font-weight:600;letter-spacing:.02em}.global-header-right{display:flex;align-items:center;gap:var(--spacing-sp-xs)}.global-header-link{display:flex;align-items:center;gap:var(--spacing-sp-2xs);padding:var(--spacing-sp-2xs) var(--spacing-sp-sm);border-radius:var(--radius-sm);text-decoration:none;color:var(--color-fg-muted);font-size:var(--font-size-xs);transition:background var(--default-transition-duration) var(--default-transition-timing-function),color var(--default-transition-duration) var(--default-transition-timing-function)}.global-header-link:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.global-header-link svg{flex-shrink:0}.global-header-nav-btn{display:flex;align-items:center;gap:var(--spacing-sp-2xs);padding:var(--spacing-sp-2xs) var(--spacing-sp-sm);border-radius:var(--radius-sm);border:none;background:none;color:var(--color-fg-muted);font:inherit;font-size:var(--font-size-xs);cursor:pointer;transition:background var(--default-transition-duration) var(--default-transition-timing-function),color var(--default-transition-duration) var(--default-transition-timing-function)}.global-header-nav-btn:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.global-header-nav-btn svg{flex-shrink:0}.global-header .auth-button{position:static;top:auto;right:auto}.global-header .auth-button-wrapper{position:relative;top:auto;right:auto}.tab-bar{height:var(--tab-bar-height);min-height:var(--tab-bar-height);display:flex;align-items:stretch;background:var(--color-bg);border-bottom:1px solid var(--color-border);z-index:299;position:relative;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}.tab-bar::-webkit-scrollbar{display:none}.tab-bar-tab{display:flex;align-items:center;gap:var(--spacing-sp-2xs);padding:0 var(--spacing-sp-md);font-size:var(--font-size-xs);color:var(--color-fg-subtle);background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap;position:relative;transition:color var(--default-transition-duration) var(--default-transition-timing-function),background var(--default-transition-duration) var(--default-transition-timing-function)}.tab-bar-tab:hover{background:var(--color-control-bg);color:var(--color-fg-muted)}.tab-bar-tab.active{color:var(--color-fg);border-bottom-color:var(--color-fg-muted)}.tab-bar-tab-name{pointer-events:none}.tab-bar-tab-input{background:var(--color-control-bg);border:1px solid var(--color-border-focus);border-radius:var(--radius-sm);color:var(--color-fg);font-size:var(--font-size-xs);padding:1px var(--spacing-sp-2xs);outline:none;width:100px}.tab-bar-close{display:flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--color-fg-subtle);font-size:var(--font-size-2xs);cursor:pointer;opacity:0;transition:opacity var(--default-transition-duration) var(--default-transition-timing-function),background var(--default-transition-duration) var(--default-transition-timing-function)}.tab-bar-tab:hover .tab-bar-close,.tab-bar-tab.active .tab-bar-close{opacity:1}.tab-bar-close:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.tab-bar-add{display:flex;align-items:center;justify-content:center;width:var(--tab-bar-height);min-width:var(--tab-bar-height);font-size:var(--font-size-base);color:var(--color-fg-subtle);background:transparent;border:none;cursor:pointer;transition:color var(--default-transition-duration) var(--default-transition-timing-function),background var(--default-transition-duration) var(--default-transition-timing-function)}.tab-bar-add:hover{background:var(--color-control-bg);color:var(--color-fg)}.preset-size-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:500;animation:preset-size-fade-in .15s ease-out}@keyframes preset-size-fade-in{0%{opacity:0}to{opacity:1}}.preset-size-modal{width:90vw;height:90vh;display:flex;flex-direction:column;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:0 24px 64px #0009;overflow:hidden;animation:preset-size-slide-in .2s ease-out}@keyframes preset-size-slide-in{0%{opacity:0;transform:scale(.97) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.preset-size-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-sp-lg);border-bottom:1px solid var(--color-border-subtle);flex-shrink:0}.preset-size-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-fg)}.preset-size-close-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:20px;line-height:1;background:var(--color-control-bg);border-radius:var(--radius-md);flex-shrink:0}.preset-size-close-btn:hover{background:var(--color-control-bg-hover)}.preset-size-tabs{display:flex;gap:var(--spacing-sp-2xs);padding:var(--spacing-sp-sm) var(--spacing-sp-lg);border-bottom:1px solid var(--color-border-subtle);flex-shrink:0;flex-wrap:wrap}.preset-size-tab-btn{padding:var(--spacing-sp-2xs) var(--spacing-sp-sm);font-size:var(--font-size-xs);border-radius:var(--radius-sm);background:var(--color-control-bg);color:var(--color-fg-muted);border:1px solid transparent;transition:background var(--default-transition-duration) var(--default-transition-timing-function),color var(--default-transition-duration) var(--default-transition-timing-function),border-color var(--default-transition-duration) var(--default-transition-timing-function)}.preset-size-tab-btn:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.preset-size-tab-btn.active{background:var(--color-control-bg-hover);color:var(--color-fg);border-color:var(--color-border-hover)}.preset-size-grid-container{flex:1;overflow-y:auto;padding:var(--spacing-sp-lg)}.preset-size-category-heading{font-size:var(--font-size-sm);font-weight:600;color:var(--color-fg-muted);margin-bottom:var(--spacing-sp-sm);text-transform:uppercase;letter-spacing:.05em}.preset-size-category-heading:not(:first-child){margin-top:var(--spacing-sp-xl)}.preset-size-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--spacing-sp-md)}.preset-size-empty{padding:48px 0;text-align:center;color:var(--color-fg-faint);font-size:var(--font-size-base)}.preset-size-card{padding:var(--spacing-sp-md);background:var(--color-control-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--default-transition-duration) var(--default-transition-timing-function),background var(--default-transition-duration) var(--default-transition-timing-function);display:flex;flex-direction:column;gap:var(--spacing-sp-sm);outline:none}.preset-size-card:hover{border-color:var(--color-border-hover);background:var(--color-control-bg-hover)}.preset-size-card:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.preset-size-aspect-preview{display:flex;align-items:center;justify-content:center;height:60px}.preset-size-aspect-box{border:1.5px solid var(--color-fg-faint);border-radius:2px;background:linear-gradient(135deg,#2d47724d,#356e7133)}.preset-size-card-header{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-sp-2xs)}.preset-size-card-label{font-size:var(--font-size-sm);font-weight:600;color:var(--color-fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preset-size-card-star{background:none;border:none;color:var(--color-fg-faint);font-size:14px;cursor:default;padding:0 2px;line-height:1;flex-shrink:0}.preset-size-card-platform{font-size:var(--font-size-2xs);color:var(--color-fg-subtle)}.preset-size-card-dims{font-size:var(--font-size-xs);color:var(--color-fg-faint);font-variant-numeric:tabular-nums}@media(max-width:640px){.preset-size-modal{width:100vw;height:100vh;border-radius:0}.preset-size-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}.selection-overlay{position:fixed;inset:var(--chrome-height) 0 0 0;z-index:100;-webkit-user-select:none;user-select:none;touch-action:none}.selection-dim{position:absolute;background:var(--color-overlay-backdrop)}.selection-dim-top{top:0;left:0;right:0}.selection-dim-bottom{left:0;right:0}.selection-dim-left{left:0}.selection-box{position:absolute;border:2px dashed oklch(100% 0 0 / 70%);cursor:move;box-sizing:border-box;touch-action:none}.selection-handle{position:absolute;width:10px;height:10px;background:#fff;border:1px solid oklch(0% 0 0 / 50%);border-radius:2px;transform:translate(-50%,-50%);z-index:101;touch-action:none;transition:width .1s,height .1s,box-shadow .1s}.selection-handle:hover{width:12px;height:12px;box-shadow:0 0 6px #ffffff7f}.selection-center-indicator{position:absolute;width:6px;height:6px;border-radius:50%;background:#fff;border:1px solid oklch(0% 0 0 / 50%);transform:translate(-50%,-50%);pointer-events:none;z-index:101}.selection-toolbar{position:absolute;z-index:102;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:8px;border:1px solid var(--color-border);padding:8px 12px;display:flex;flex-direction:column;gap:6px;-webkit-user-select:none;user-select:none;min-width:280px}.selection-toolbar-drag{cursor:grab;padding:2px 0;text-align:center;color:var(--color-fg-faint);font-size:10px;letter-spacing:.2em;touch-action:none}.selection-toolbar-drag:active{cursor:grabbing}.selection-toolbar-row{display:flex;gap:4px;align-items:center}.selection-mode-btn{font-size:11px;padding:4px 10px;background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:4px;color:var(--color-fg-muted);cursor:pointer}.selection-mode-btn:hover{background:var(--color-control-bg-hover)}.selection-mode-btn.active{background:var(--color-control-bg-hover);border-color:var(--color-border-focus);color:var(--color-fg)}.selection-presets-btn{margin-left:auto;border-style:dashed}.selection-detail{display:flex;gap:4px;align-items:center;font-size:11px;color:var(--color-fg-muted)}.selection-detail-input{width:60px;padding:3px 6px;background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:4px;color:var(--color-fg);font-size:11px;text-align:right;font-variant-numeric:tabular-nums}.selection-detail-separator{color:var(--color-fg-faint);font-weight:600}.selection-actions{display:flex;gap:6px;border-top:1px solid var(--color-border-subtle);padding-top:6px}.selection-btn-generate{background:var(--color-control-bg-hover)}.selection-btn-generate:hover{background:var(--color-border-hover)}.selection-btn-json{background:var(--color-control-bg)}.selection-btn-json:hover{background:var(--color-control-bg-hover)}.selection-btn-exit{background:var(--color-control-bg)}.selection-btn-exit:hover{background:var(--color-control-bg-hover)}.composer-hsla-picker{position:fixed;z-index:310;width:320px;padding:12px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:0 4px 12px #0000004d}.composer-hsla-top-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}.composer-hsla-preview{position:relative;width:48px;height:48px;border-radius:6px;border:1px solid var(--color-border-hover);overflow:hidden;flex-shrink:0}.composer-hsla-preview-checkerboard{position:absolute;top:0;right:0;bottom:0;left:0;background-image:repeating-conic-gradient(gray,gray 25%,silver 0%,silver 50%);background-size:12px 12px}.composer-hsla-preview-color{position:absolute;top:0;right:0;bottom:0;left:0}.composer-hsla-hex-input{font-family:monospace;font-size:1rem;width:8rem;padding:4px 6px;background:var(--color-control-bg);border:1px solid var(--color-border-hover);border-radius:var(--radius-sm);color:var(--color-fg);outline:none}.composer-hsla-hex-input:focus{border-color:var(--color-border-focus)}.composer-hsla-slider-row{display:flex;align-items:center;gap:8px;margin-bottom:6px}.composer-hsla-slider-label{font-size:.875rem;color:var(--color-fg-subtle);width:1rem;flex-shrink:0;text-align:center}.composer-hsla-slider-row input[type=range]{flex:1;height:1.5rem;accent-color:var(--color-focus-ring)}.composer-hsla-slider-value{font-size:.875rem;color:var(--color-fg);width:2.5rem;flex-shrink:0;text-align:right}.composer-hsla-swatch-btn{position:relative;display:block;border:1px solid var(--color-border-hover);border-radius:var(--radius-sm);cursor:pointer;overflow:hidden;padding:0;background:none}.composer-hsla-swatch-btn:hover{border-color:var(--color-border-focus)}.composer-hsla-swatch-btn:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-hsla-swatch-checkerboard{position:absolute;top:0;right:0;bottom:0;left:0;background-image:repeating-conic-gradient(gray,gray 25%,silver 0%,silver 50%);background-size:10px 10px}.composer-hsla-swatch-color{position:absolute;top:0;right:0;bottom:0;left:0}.composer-hsla-palette{margin-top:8px;padding-top:8px;border-top:1px solid var(--color-border)}.composer-hsla-palette-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.composer-hsla-palette-label{font-size:.75rem;color:var(--color-fg-subtle);text-transform:uppercase;letter-spacing:.05em}.composer-hsla-palette-add{width:20px;height:20px;display:flex;align-items:center;justify-content:center;padding:0;font-size:1rem;line-height:1;color:var(--color-fg-subtle);background:var(--color-control-bg);border:1px solid var(--color-border-hover);border-radius:var(--radius-sm);cursor:pointer}.composer-hsla-palette-add:hover{color:var(--color-fg);border-color:var(--color-border-focus)}.composer-hsla-palette-swatches{display:flex;flex-wrap:wrap;gap:4px}.composer-hsla-palette-swatch-wrap{position:relative}.composer-hsla-palette-swatch{width:20px;height:20px;border:1px solid var(--color-border-hover);border-radius:50%;cursor:pointer;padding:0}.composer-hsla-palette-swatch:hover{border-color:var(--color-fg-muted);transform:scale(1.1)}.composer-hsla-palette-remove{display:none;position:absolute;top:-4px;right:-4px;width:14px;height:14px;padding:0;font-size:.625rem;line-height:1;color:var(--color-fg);background:var(--color-control-bg-hover);border:1px solid var(--color-border-hover);border-radius:50%;cursor:pointer;align-items:center;justify-content:center}.composer-hsla-palette-swatch-wrap:hover .composer-hsla-palette-remove{display:flex}.composer-hsla-palette-remove:hover{background:#972527;border-color:#b94642}.composer-history-panel{display:flex;flex-direction:column;gap:8px}.composer-history-section-header{font-size:var(--font-size-2xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-subtle);margin:0}.composer-history-snapshots{display:flex;flex-direction:column;gap:2px;border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);padding:4px;max-height:140px;overflow-y:auto}.composer-history-snapshot-empty{padding:6px 8px;text-align:center;color:var(--color-fg-faint);font-size:var(--font-size-2xs)}.composer-history-snapshot-item{display:flex;align-items:center;gap:4px;padding:4px 6px;border-radius:var(--radius-sm);cursor:pointer;font-size:var(--font-size-xs);color:var(--color-fg-muted);transition:background .1s}.composer-history-snapshot-item:hover{background:var(--color-control-bg)}.composer-history-snapshot-icon{flex-shrink:0;width:14px;height:14px;color:#61a3e6}.composer-history-snapshot-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.composer-history-snapshot-delete{flex-shrink:0;width:18px;height:18px;display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--color-fg-faint);cursor:pointer;border-radius:3px;padding:0}.composer-history-snapshot-delete:hover{background:var(--color-control-bg);color:#dc9a94}.composer-history-snapshot-delete svg{width:12px;height:12px}.composer-history-list{display:flex;flex-direction:column;gap:1px;border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);padding:4px;max-height:240px;overflow-y:auto}.composer-history-entry{display:flex;align-items:center;gap:4px;padding:3px 6px;border-radius:var(--radius-sm);cursor:pointer;font-size:var(--font-size-2xs);color:var(--color-fg-subtle);transition:background .1s;font-variant-numeric:tabular-nums}.composer-history-entry:hover{background:var(--color-control-bg);color:var(--color-fg-muted)}.composer-history-entry-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.composer-history-entry-pin{flex-shrink:0;width:18px;height:18px;display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--color-fg-faint);cursor:pointer;border-radius:3px;padding:0;opacity:0;transition:opacity .1s,color .1s}.composer-history-entry:hover .composer-history-entry-pin{opacity:1}.composer-history-entry-pin:hover{background:var(--color-control-bg);color:#61a3e6}.composer-history-entry-pin svg{width:12px;height:12px}.composer-history-empty{padding:8px;text-align:center;color:var(--color-fg-faint);font-size:var(--font-size-2xs)}.composer-history-entry--future{opacity:.35}.composer-history-entry--future:hover{opacity:.6;background:var(--color-control-bg)}.composer-history-current{display:flex;align-items:center;gap:4px;padding:3px 6px;font-size:var(--font-size-2xs);color:#82a2c3;font-weight:500}.composer-history-current-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.composer-history-current-dot{width:6px;height:6px;border-radius:50%;background:#61a3e6;flex-shrink:0}.composer-history-current:hover .composer-history-entry-pin{opacity:1}.file-menu-trigger{position:relative}.file-menu-trigger-btn{padding:var(--spacing-sp-xs) var(--spacing-sp-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;-webkit-user-select:none;user-select:none}.file-menu-trigger-btn:hover{background:var(--color-control-bg-hover)}.file-menu-dropdown{position:absolute;top:calc(100% + 4px);left:0;min-width:180px;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-sp-2xs) 0;box-shadow:0 8px 24px #0000007f;z-index:31}.file-menu-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--spacing-sp-xs) var(--spacing-sp-md);background:none;border:none;color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;text-align:left}.file-menu-item:hover{background:var(--color-control-bg-hover)}.file-menu-item:disabled{opacity:.4;pointer-events:none}.file-menu-separator{height:1px;background:var(--color-border);margin:var(--spacing-sp-2xs) 0}.edit-menu-trigger{position:relative}.edit-menu-trigger-btn{padding:var(--spacing-sp-xs) var(--spacing-sp-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;-webkit-user-select:none;user-select:none}.edit-menu-trigger-btn:hover{background:var(--color-control-bg-hover)}.edit-menu-dropdown{position:absolute;top:calc(100% + 4px);left:0;min-width:180px;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-sp-2xs) 0;box-shadow:0 8px 24px #0000007f;z-index:31}.edit-menu-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--spacing-sp-xs) var(--spacing-sp-md);background:none;border:none;color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;text-align:left}.edit-menu-item:hover{background:var(--color-control-bg-hover)}.edit-menu-item:disabled{opacity:.4;pointer-events:none}.edit-menu-item-shortcut{color:var(--color-fg-subtle);font-size:11px;margin-left:var(--spacing-sp-lg)}.edit-menu-separator{height:1px;background:var(--color-border);margin:var(--spacing-sp-2xs) 0}.view-menu{position:relative}.view-menu-trigger-btn{padding:var(--spacing-sp-xs) var(--spacing-sp-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;-webkit-user-select:none;user-select:none}.view-menu-trigger-btn:hover{background:var(--color-control-bg-hover)}.view-menu-dropdown{position:absolute;top:calc(100% + 4px);left:0;min-width:180px;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-sp-2xs) 0;box-shadow:0 8px 24px #0000007f;z-index:31}.view-menu-item{display:flex;align-items:center;width:100%;padding:var(--spacing-sp-xs) var(--spacing-sp-md);background:none;border:none;color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;text-align:left;gap:var(--spacing-sp-sm)}.view-menu-item:hover{background:var(--color-control-bg-hover)}.view-menu-item-check{display:inline-block;width:1em;text-align:center;flex-shrink:0}.overlay-root{position:fixed;inset:var(--chrome-height) 0 0 0;display:flex;flex-direction:column;background:var(--color-bg);-webkit-user-select:none;user-select:none}.overlay-toolbar{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:var(--color-surface-glass);border-bottom:1px solid var(--color-border);flex-shrink:0}.overlay-workspace{flex:1;display:flex;overflow:hidden}.overlay-panel{width:320px;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-left:1px solid var(--color-border);overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:10px;flex-shrink:0}.image-trace-preview{z-index:210}.image-trace-title{font-size:16px;font-weight:600;color:var(--color-fg)}.image-trace-toolbar-actions{display:flex;gap:8px}.image-trace-preview-area{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;overflow:hidden;background:repeating-conic-gradient(#121212,#121212 25%,#090909 25%,#090909 50%) 50% / 20px 20px}.image-trace-svg-container{max-width:100%;max-height:100%;box-shadow:0 4px 24px #0006;line-height:0;transition:opacity .2s}.image-trace-svg-container svg{max-width:100%;max-height:100%;display:block}.image-trace-svg-container.is-retracing{opacity:.5}.image-trace-loading,.image-trace-error{display:flex;align-items:center;justify-content:center;font-size:14px}.image-trace-loading{color:var(--color-fg-subtle);animation:image-trace-pulse 1.5s ease-in-out infinite}.image-trace-error{color:var(--color-danger)}@keyframes image-trace-pulse{0%,to{opacity:.5}50%{opacity:1}}.image-trace-param{display:flex;flex-direction:column;gap:2px}.image-trace-param-header{display:flex;align-items:center;justify-content:space-between}.image-trace-param-label{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--color-fg-subtle)}.image-trace-param-value{font-size:11px;font-variant-numeric:tabular-nums;color:var(--color-fg-muted)}.image-trace-param input[type=range]{width:100%;accent-color:var(--color-accent)}.image-trace-reset-btn{margin-top:4px;font-size:11px;padding:6px 8px;text-align:center;background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:4px;color:var(--color-fg-muted);cursor:pointer}.image-trace-reset-btn:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.image-trace-reset-btn:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.crop-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;pointer-events:none;touch-action:none}.crop-dim{position:absolute;background:var(--color-overlay-backdrop);pointer-events:auto}.crop-dim-top{top:0;left:0;right:0}.crop-dim-bottom{left:0;right:0}.crop-dim-left{left:0}.crop-dim-right{right:0}.crop-box{position:absolute;border:2px dashed oklch(100% 0 0 / 70%);cursor:move;box-sizing:border-box;pointer-events:auto;overflow:visible}.crop-handle{position:absolute;width:10px;height:10px;background:#fff;border:1px solid oklch(0% 0 0 / 50%);border-radius:2px;transform:translate(-50%,-50%);z-index:21;pointer-events:auto;transition:width .1s,height .1s,box-shadow .1s}.crop-handle:hover{width:12px;height:12px;box-shadow:0 0 6px #ffffff7f}.crop-toolbar{position:absolute;bottom:-36px;right:0;display:flex;gap:4px;z-index:22;pointer-events:auto}.crop-toolbar-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border-hover);border-radius:var(--radius-md);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--color-fg);font-size:14px;cursor:pointer}.crop-toolbar-btn:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.crop-toolbar-btn-confirm{color:var(--color-success)}.crop-toolbar-btn-confirm:hover{color:#79ec80;background:#6bc67033}.crop-toolbar-btn-cancel{color:var(--color-danger)}.crop-toolbar-btn-cancel:hover{color:var(--color-danger-hover);background:#e7958e33}.crop-toolbar-btn-clear{width:auto;padding:0 8px;font-size:11px}.crop-toolbar-mode-label{display:flex;align-items:center;padding:0 6px;font-size:11px;font-weight:600;color:#6ccdea;text-transform:uppercase;letter-spacing:.5px}.crop-aspect-presets{display:flex;gap:2px;margin:0 4px}.crop-aspect-btn{padding:2px 6px;font-size:11px;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--color-fg);border:1px solid var(--color-border-hover);border-radius:var(--radius-md);cursor:pointer;white-space:nowrap}.crop-aspect-btn:hover{background:var(--color-control-bg-hover)}.crop-aspect-btn.active{background:var(--color-control-bg-hover);border-color:var(--color-border-focus);color:var(--color-fg)}.create-template-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:500;display:flex;align-items:center;justify-content:center;background:var(--color-overlay-backdrop);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.create-template-dialog{width:560px;max-width:90vw;max-height:80vh;display:flex;flex-direction:column;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.create-template-header{padding:var(--spacing-sp-lg) var(--spacing-sp-xl);border-bottom:1px solid var(--color-border-subtle)}.create-template-title{margin:0;font-size:var(--font-size-lg);font-weight:600;color:var(--color-fg)}.create-template-body{flex:1;overflow-y:auto;padding:var(--spacing-sp-lg) var(--spacing-sp-xl);display:flex;flex-direction:column;gap:var(--spacing-sp-lg)}.create-template-field{display:flex;flex-direction:column;gap:var(--spacing-sp-2xs)}.create-template-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-fg)}.create-template-hint{font-size:var(--font-size-xs);color:var(--color-fg-subtle);margin:0 0 var(--spacing-sp-sm) 0}.create-template-input{padding:var(--spacing-sp-sm) var(--spacing-sp-md);background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-fg);font:inherit;font-size:var(--font-size-sm);outline:none;transition:border-color var(--default-transition-duration) var(--default-transition-timing-function)}.create-template-input:focus{border-color:var(--color-border-focus)}.create-template-items-section{display:flex;flex-direction:column}.create-template-items{display:flex;flex-direction:column;gap:var(--spacing-sp-sm);margin-bottom:var(--spacing-sp-sm)}.create-template-item{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:var(--spacing-sp-xs);align-items:center;padding:var(--spacing-sp-sm);background:var(--color-control-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm)}.create-template-item-name{padding:var(--spacing-sp-2xs) var(--spacing-sp-sm);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-fg);font:inherit;font-size:var(--font-size-xs);outline:none}.create-template-item-name:focus{border-color:var(--color-border-focus)}.create-template-item-select{padding:var(--spacing-sp-2xs) var(--spacing-sp-sm);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-fg);font:inherit;font-size:var(--font-size-xs);outline:none;cursor:pointer}.create-template-item-remove{display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:none;border:none;border-radius:var(--radius-sm);color:var(--color-fg-subtle);font-size:var(--font-size-base);cursor:pointer;transition:background var(--default-transition-duration) var(--default-transition-timing-function),color var(--default-transition-duration) var(--default-transition-timing-function)}.create-template-item-remove:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.create-template-add-btn{align-self:flex-start;padding:var(--spacing-sp-2xs) var(--spacing-sp-md);background:var(--color-control-bg);border:1px dashed var(--color-border);border-radius:var(--radius-sm);color:var(--color-fg-muted);font-size:var(--font-size-xs);cursor:pointer;transition:background var(--default-transition-duration) var(--default-transition-timing-function),border-color var(--default-transition-duration) var(--default-transition-timing-function)}.create-template-add-btn:hover:not(:disabled){background:var(--color-control-bg-hover);border-color:var(--color-border-hover)}.create-template-add-btn:disabled{opacity:.5;cursor:default}.create-template-error{padding:var(--spacing-sp-sm) var(--spacing-sp-md);background:#86111833;border:1px solid oklch(60% .15 25 / 40%);border-radius:var(--radius-sm);color:#f8a49d;font-size:var(--font-size-xs)}.create-template-footer{display:flex;justify-content:flex-end;gap:var(--spacing-sp-sm);padding:var(--spacing-sp-md) var(--spacing-sp-xl);border-top:1px solid var(--color-border-subtle)}.create-template-cancel-btn{padding:var(--spacing-sp-sm) var(--spacing-sp-lg);background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-fg-muted);font-size:var(--font-size-sm);cursor:pointer}.create-template-cancel-btn:hover{background:var(--color-control-bg-hover)}.create-template-save-btn{padding:var(--spacing-sp-sm) var(--spacing-sp-lg);background:var(--color-control-bg-hover);border:1px solid var(--color-border-hover);border-radius:var(--radius-sm);color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;font-weight:500}.create-template-save-btn:hover:not(:disabled){background:var(--color-border-hover)}.create-template-save-btn:disabled{opacity:.4;cursor:default}.url-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay-backdrop);display:flex;align-items:center;justify-content:center;z-index:500}.url-modal{background:var(--color-surface-modal);border:1px solid var(--color-border-hover);border-radius:var(--radius-lg);padding:24px;max-width:520px;width:90%;box-shadow:var(--shadow-modal)}.url-modal-title{font-size:16px;font-weight:600;color:var(--color-fg);margin-bottom:8px}.url-modal-description{font-size:12px;color:var(--color-fg-subtle);margin:0 0 12px}.url-modal-textarea{width:100%;padding:8px 10px;background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-fg);font-size:12px;font-family:monospace;resize:none;outline:none}.url-modal-textarea:focus{border-color:var(--color-border-focus)}.url-modal-actions{display:flex;gap:8px;margin-top:12px;justify-content:flex-end}.url-modal-copy-btn{background:var(--color-control-bg-hover)}.url-modal-close-btn{background:var(--color-control-bg)}.confirm-dialog{background:var(--color-surface-modal);border:1px solid var(--color-border-hover);border-radius:var(--radius-lg);padding:24px;max-width:480px;width:90%;box-shadow:var(--shadow-modal)}.confirm-dialog-title{font-size:16px;font-weight:600;color:var(--color-fg);margin-bottom:8px}.confirm-dialog-message{font-size:13px;color:var(--color-fg-subtle);margin:0 0 16px;line-height:1.5}.confirm-dialog-content{margin-bottom:16px}.confirm-dialog-actions{display:flex;gap:8px;justify-content:flex-end}.confirm-dialog-cancel{background:var(--color-control-bg)}.confirm-dialog-primary{background:var(--color-control-bg-hover)}.confirm-dialog-danger{background:var(--color-danger);color:var(--color-fg-on-accent)}.confirm-dialog-danger:hover{background:var(--color-danger-hover)}.confirm-dialog-preview{border-radius:8px;overflow:hidden;background:#0000004d;max-height:300px;display:flex;align-items:center;justify-content:center}.confirm-dialog-preview-img{width:100%;max-height:300px;object-fit:contain}.template-values-panel{display:flex;flex-direction:column;height:100%;overflow:hidden}.template-values-header{padding:var(--spacing-sp-md);border-bottom:1px solid var(--color-border-subtle)}.template-values-header-row{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--spacing-sp-sm)}.template-values-header-row>div{display:flex;flex-direction:column;gap:var(--spacing-sp-3xs)}.template-values-title{margin:0;font-size:var(--font-size-sm);font-weight:600;color:var(--color-fg)}.template-values-name{font-size:var(--font-size-xs);color:var(--color-fg-muted)}.template-values-fields{flex:1;overflow-y:auto;padding:var(--spacing-sp-md);display:flex;flex-direction:column;gap:var(--spacing-sp-md)}.template-values-field{display:flex;flex-direction:column;gap:var(--spacing-sp-3xs)}.template-values-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-fg)}.template-values-layer-ref{font-size:var(--font-size-2xs);color:var(--color-fg-subtle)}.template-values-input{padding:var(--spacing-sp-2xs) var(--spacing-sp-sm);background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-fg);font:inherit;font-size:var(--font-size-xs);outline:none;width:100%;box-sizing:border-box;transition:border-color var(--default-transition-duration) var(--default-transition-timing-function)}.template-values-input:focus{border-color:var(--color-border-focus)}.template-values-color-row{display:flex;gap:var(--spacing-sp-xs);align-items:center}.template-values-color-text{flex:1}.template-values-disconnect-btn{padding:var(--spacing-sp-3xs) var(--spacing-sp-sm);font-size:var(--font-size-xs);color:var(--color-fg-muted);background:none;border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;transition:color var(--default-transition-duration) var(--default-transition-timing-function),border-color var(--default-transition-duration) var(--default-transition-timing-function),background var(--default-transition-duration) var(--default-transition-timing-function)}.template-values-disconnect-btn:hover{color:#ed756e;border-color:#ed756e;background:#7c423e26}.composer-tool-palette{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sp-xs);padding:var(--spacing-sp-xs);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-right:1px solid var(--color-border);width:40px;flex-shrink:0}.composer-tool-btn{position:relative;width:32px;height:32px;padding:0;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);color:var(--color-fg-muted);cursor:pointer;transition:background var(--default-transition-duration) var(--default-transition-timing-function),color var(--default-transition-duration) var(--default-transition-timing-function)}.composer-tool-btn svg{width:18px;height:18px}.composer-tool-btn:hover:not(:disabled){background:var(--color-control-bg-hover);color:var(--color-fg)}.composer-tool-btn:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-tool-btn.active{background:var(--color-control-bg-hover);border-color:var(--color-border-focus);color:var(--color-fg)}.composer-tool-btn:disabled{opacity:.3;cursor:not-allowed}.composer-tool-separator{width:24px;height:1px;background:var(--color-border);margin:var(--spacing-sp-xs) 0}.composer-tool-btn[data-tooltip]:hover:after{content:attr(data-tooltip);position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:8px;padding:4px 8px;background:var(--color-surface-elevated, #333);color:var(--color-text-primary, #fff);font-size:12px;white-space:nowrap;border-radius:var(--radius-sm);pointer-events:none;z-index:100}.composition-menu-wrapper{position:relative}.composition-menu-trigger{display:flex;align-items:center;padding:var(--spacing-sp-xs) var(--spacing-sp-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;-webkit-user-select:none;user-select:none;gap:6px}.composition-menu-trigger:hover{background:var(--color-control-bg-hover)}.composition-menu-trigger-title{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.composition-menu-chevron{font-size:10px;opacity:.6}.composition-menu-dropdown{position:absolute;top:calc(100% + 4px);left:0;min-width:180px;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-sp-2xs) 0;box-shadow:0 8px 24px #0000007f;z-index:31}.composition-menu-item{display:flex;align-items:center;width:100%;padding:var(--spacing-sp-xs) var(--spacing-sp-md);background:none;border:none;color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;text-align:left}.composition-menu-item:hover{background:var(--color-control-bg-hover)}.composition-menu-divider{height:1px;background:var(--color-border);margin:var(--spacing-sp-2xs) 0}.composer{z-index:200}.composer-title{font-size:16px;font-weight:600;color:var(--color-fg)}.composer-history-actions{display:flex;gap:4px;margin-left:12px}.composer-history-btn{width:28px;height:28px;padding:0;display:flex;align-items:center;justify-content:center;font-size:14px;background:var(--color-control-bg);border-radius:var(--radius-md)}.composer-history-btn:disabled{opacity:.3;cursor:not-allowed}.composer-toolbar{position:relative}.composer-toolbar-actions{display:flex;gap:8px}.composer-btn{background:var(--color-control-bg)}.composer-btn:hover{background:var(--color-control-bg-hover)}.composer-btn-tweak{padding:var(--spacing-sp-xs) var(--spacing-sp-md);border:1px solid oklch(65% .12 250 / 40%);border-radius:var(--radius-md);background:#5194d526;color:#a1c1e4;font-size:var(--font-size-sm);cursor:pointer}.composer-btn-tweak:hover{background:#5194d540;color:#cbe1f8}.composer-btn-tweak:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-btn-exit{padding:var(--spacing-sp-xs) var(--spacing-sp-md);border:1px solid var(--color-border-hover);border-radius:var(--radius-md);background:var(--color-control-bg);color:var(--color-fg-muted);font-size:var(--font-size-sm);cursor:pointer}.composer-btn-exit:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.composer-btn-exit:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-btn-small{font-size:var(--font-size-xs);padding:var(--spacing-sp-xs) var(--spacing-sp-sm);margin-top:var(--spacing-sp-sm)}.composer-title-editable{cursor:pointer;padding:2px 6px;border-radius:4px;transition:background .1s}.composer-title-editable:hover{background:var(--color-control-bg)}.composer-title-input{font-size:16px;font-weight:600;color:var(--color-fg);background:var(--color-control-bg);border:1px solid var(--color-border-hover);border-radius:4px;padding:2px 6px;outline:none;min-width:120px;max-width:300px}.composer-title-input:focus{border-color:var(--color-border-focus)}.composer-title-group{display:flex;flex-direction:column;gap:2px;min-width:0}.composer-description{font-size:11px;color:var(--color-fg-muted);max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.composer-description-editable{cursor:pointer;padding:1px 6px;border-radius:4px;transition:background .1s}.composer-description-editable:hover{background:var(--color-control-bg)}.composer-description-input{font-size:11px;color:var(--color-fg);background:var(--color-control-bg);border:1px solid var(--color-border-hover);border-radius:4px;padding:2px 6px;outline:none;min-width:200px;max-width:300px;resize:none;font-family:inherit}.composer-description-input:focus{border-color:var(--color-border-focus)}.composer-sidebar{position:relative;display:flex;flex-direction:column;overflow-y:hidden;width:unset}.composer-sidebar-resize-handle{position:absolute;top:0;left:-3px;width:6px;height:100%;cursor:col-resize;z-index:10;transition:background var(--default-transition-duration) var(--default-transition-timing-function);touch-action:none}.composer-sidebar-resize-handle:hover,.composer-sidebar-resize-handle:focus-visible{background:#3a93e64d}.composer-sidebar-resize-handle:focus-visible{outline:2px solid oklch(65% .15 250 / 50%);outline-offset:1px}.composer-sidebar.composer-sidebar-collapsed{width:0!important;min-width:0;padding:0;border-left-width:0;overflow:hidden;opacity:0;pointer-events:none;transition:width var(--default-transition-duration) var(--default-transition-timing-function),opacity var(--default-transition-duration) var(--default-transition-timing-function)}.composer-template-panel.composer-sidebar-collapsed{width:0!important;min-width:0;padding:0;border-right-width:0;overflow:hidden;opacity:0;pointer-events:none;transition:width var(--default-transition-duration) var(--default-transition-timing-function),opacity var(--default-transition-duration) var(--default-transition-timing-function)}.composer-sidebar-toggle{position:relative;z-index:11;flex-shrink:0;width:20px;display:flex;align-items:center;justify-content:center;background:var(--color-control-bg);border:none;border-radius:0;color:var(--color-fg-muted);font-size:16px;cursor:pointer;padding:0;transition:background var(--default-transition-duration) var(--default-transition-timing-function)}.composer-sidebar-toggle:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.composer-sidebar-toggle:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:-2px}.composer-sidebar-toggle-left{border-right:1px solid var(--color-border)}.composer-sidebar-toggle-left-collapse{position:absolute;z-index:11;right:0;top:50%;transform:translateY(-50%) translate(100%);width:20px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--color-control-bg);border:none;border-left:1px solid var(--color-border);border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:var(--color-fg-muted);font-size:16px;cursor:pointer;padding:0;transition:background var(--default-transition-duration) var(--default-transition-timing-function)}.composer-sidebar-toggle-left-collapse:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.composer-sidebar-toggle-right{border-left:1px solid var(--color-border)}.composer-sidebar-toggle-right-collapse{position:absolute;z-index:11;left:0;top:50%;transform:translateY(-50%) translate(-100%);width:20px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--color-control-bg);border:none;border-right:1px solid var(--color-border);border-radius:var(--radius-sm) 0 0 var(--radius-sm);color:var(--color-fg-muted);font-size:16px;cursor:pointer;padding:0;transition:background var(--default-transition-duration) var(--default-transition-timing-function)}.composer-sidebar-toggle-right-collapse:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.composer-sidebar>.composer-panel{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:10px}.composer-sidebar>.composer-history-panel{flex-shrink:0;border-top:1px solid var(--color-border);padding-top:10px}.composer-template-panel{position:relative;width:280px;min-width:280px;border-right:1px solid var(--color-border);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);overflow-y:auto;transition:width var(--default-transition-duration) var(--default-transition-timing-function),opacity var(--default-transition-duration) var(--default-transition-timing-function)}.composer-canvas-area{flex:1;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:auto 1fr;overflow:hidden;position:relative}.composer-canvas-area>.composer-menu-bar{grid-column:2}.composer-canvas-area>.composer-tool-palette{grid-row:1 / -1;grid-column:1}.composer-canvas-area>.composer-canvas-scroll{grid-row:2;grid-column:2}.composer-canvas-scroll{display:flex;align-items:center;justify-content:center;padding:24px;overflow:hidden}.composer-canvas-wrapper{position:relative;display:inline-flex;max-width:100%;max-height:100%;flex-shrink:0}.composer-canvas-wrapper--manual{max-width:unset;max-height:unset;margin:auto}.composer-canvas-wrapper canvas{max-width:100%;max-height:100%;box-shadow:0 4px 24px #0006;cursor:default;touch-action:none}.composer-canvas-wrapper--manual canvas{max-width:unset;max-height:unset}.composer-canvas-scroll--pan-ready{cursor:grab}.composer-canvas-scroll--pan-ready canvas{cursor:grab}.composer-canvas-scroll--pan-active{cursor:grabbing}.composer-canvas-scroll--pan-active canvas{cursor:grabbing}.composer-zoom-bar{position:absolute;bottom:var(--spacing-sp-sm);left:50%;transform:translate(-50%);display:flex;align-items:center;gap:var(--spacing-sp-md);padding:var(--spacing-sp-xs) var(--spacing-sp-md);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-md);z-index:20}.composer-zoom-toggle{display:flex;align-items:center;gap:var(--spacing-sp-xs);font-size:var(--font-size-sm);color:var(--color-fg-muted);cursor:pointer;white-space:nowrap}.composer-zoom-toggle input[type=checkbox]{accent-color:var(--color-accent);margin:0}.composer-canvas-size{font-size:var(--font-size-sm);color:var(--color-fg-muted);white-space:nowrap}.composer-zoom-controls{display:flex;align-items:center;gap:var(--spacing-sp-xs)}.composer-zoom-btn{width:28px;height:28px;padding:0;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-sm);background:var(--color-control-bg);border-radius:var(--radius-sm)}.composer-zoom-btn:hover:not(:disabled){background:var(--color-control-bg-hover)}.composer-zoom-btn:disabled{opacity:.3;cursor:not-allowed}.composer-zoom-btn-reset{width:auto;padding:0 var(--spacing-sp-sm);font-size:var(--font-size-xs)}.composer-zoom-level{font-size:var(--font-size-xs);color:var(--color-fg-muted);min-width:36px;text-align:center;font-variant-numeric:tabular-nums}.composer-canvas-wrapper .crop-overlay{position:absolute;top:0;right:0;bottom:0;left:0}.composer-panel-section{background:var(--color-control-bg);border:1px solid var(--color-border-subtle);border-radius:6px;padding:10px;display:flex;flex-direction:column;gap:6px}.composer-panel-actions{display:flex;gap:6px}.composer-panel-btn{flex:1;font-size:11px;padding:4px 6px;text-align:center}.composer-layer-list{display:flex;flex-direction:column;gap:2px;max-height:220px;overflow-y:auto;border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);padding:4px}.composer-layer-item{display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:var(--radius-sm);cursor:pointer;font-size:12px;color:var(--color-fg-muted);transition:background .1s}.composer-layer-item:hover{background:var(--color-control-bg)}.composer-layer-item:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-layer-item.selected{background:var(--color-control-bg-hover);color:var(--color-fg)}.composer-layer-item.dragging{opacity:.4}.composer-layer-icon{flex-shrink:0;width:18px;text-align:center;font-size:13px}.composer-layer-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.composer-layer-duplicate{flex-shrink:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--color-fg-subtle);font-size:13px;cursor:pointer;border-radius:3px}.composer-layer-duplicate:hover{background:var(--color-control-bg);color:var(--color-fg)}.composer-layer-duplicate:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-layer-delete{flex-shrink:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--color-fg-subtle);font-size:16px;cursor:pointer;border-radius:3px}.composer-layer-delete:hover{background:var(--color-control-bg);color:var(--color-fg)}.composer-layer-delete:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-layer-empty{padding:12px;text-align:center;color:var(--color-fg-faint);font-size:12px}.composer-align-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px}.composer-align-btn{font-size:11px;padding:6px 4px;text-align:center;background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:4px;color:var(--color-fg-muted);cursor:pointer}.composer-align-btn:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.composer-align-btn:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-props-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-subtle);margin-bottom:2px}.composer-prop-label{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--color-fg-subtle);display:block;margin-bottom:2px}.composer-prop-input{width:100%;padding:4px 6px;background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:4px;color:var(--color-fg);font-size:12px;outline:none}.composer-prop-input:focus{border-color:var(--color-border-focus)}.composer-prop-textarea{width:100%;padding:4px 6px;background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:4px;color:var(--color-fg);font-size:12px;resize:vertical;outline:none;font-family:inherit}.composer-prop-textarea:focus{border-color:var(--color-border-focus)}.composer-prop-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 8px}.composer-prop-field{display:flex;flex-direction:column}.composer-prop-num{text-align:right;font-variant-numeric:tabular-nums}.composer-prop-toggle-row{display:flex;gap:4px;align-items:center}.composer-prop-toggle{font-size:11px;padding:3px 8px}.composer-prop-toggle:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-prop-toggle.active{background:var(--color-control-bg-hover);border-color:var(--color-border-focus)}.composer-prop-color-row{display:flex;gap:6px;align-items:center}.composer-prop-color-text{flex:1;min-width:0}.composer-prop-src-row{display:flex;gap:6px;align-items:center}.composer-prop-src-text{flex:1;font-size:10px;color:var(--color-fg-subtle);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.composer-prop-btn-sm{font-size:10px;padding:2px 8px}.composer-props-section{display:flex;flex-direction:column;gap:6px}.composer-props-subsection{border-top:1px solid var(--color-border-subtle);padding-top:6px}.composer-font-picker{display:flex;flex-direction:column;gap:4px}.composer-font-btn-row{display:flex;gap:4px;align-items:center}.composer-font-star-btn{flex-shrink:0;background:none;border:none;color:var(--color-star);font-size:14px;cursor:pointer;padding:2px 4px;line-height:1;border-radius:var(--radius-sm);transition:color var(--default-transition-duration) var(--default-transition-timing-function),background var(--default-transition-duration) var(--default-transition-timing-function)}.composer-font-star-btn:hover{color:#daa500;color:oklch(75% .18 85);background:var(--color-control-bg)}.composer-font-explore-btn{font-size:10px;padding:2px 8px}.composer-font-search{padding:4px 6px;background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:4px;color:var(--color-fg);font-size:12px;outline:none}.composer-font-search:focus{border-color:var(--color-border-focus)}.composer-font-list{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:1px;border:1px solid var(--color-border-subtle);border-radius:4px;padding:2px}.composer-font-section-label{padding:4px 8px 2px;font-size:10px;color:var(--color-fg-subtle);text-transform:uppercase;letter-spacing:.05em}.composer-font-section-divider{height:1px;background:var(--color-border-subtle);margin:2px 4px}.composer-font-item-row{display:flex;align-items:center}.composer-font-item-row .composer-font-item{flex:1;min-width:0}.composer-font-item-row .composer-font-star-btn{font-size:12px;padding:2px 4px}.composer-font-item{padding:3px 8px;background:none;border:none;color:var(--color-fg-muted);font-size:12px;cursor:pointer;text-align:left;border-radius:3px}.composer-font-item:hover{background:var(--color-control-bg)}.composer-font-item:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.composer-font-item.active{background:var(--color-control-bg-hover);color:var(--color-fg)}.composer-props input[type=range],.composer-props-section input[type=range],.composer-panel-section input[type=range]{width:100%;accent-color:var(--color-accent)}.composer-props input[type=checkbox],.composer-props-section input[type=checkbox],.composer-panel-section input[type=checkbox]{accent-color:var(--color-accent);margin-right:4px}.composer-frame-select{width:100%;padding:4px 6px;background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:4px;color:var(--color-fg);font-size:12px}.composer-frame-params{display:flex;flex-direction:column;gap:6px;margin-top:4px}.composer-frame-param-row{display:flex;flex-direction:column;gap:2px}.composer-section-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;background:none;border:none;padding:0;cursor:pointer;color:inherit}.composer-section-toggle:hover .composer-props-title{color:var(--color-fg-muted)}.composer-section-toggle:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px;border-radius:3px}.composer-section-chevron{font-size:8px;color:var(--color-fg-faint);transition:color var(--default-transition-duration) var(--default-transition-timing-function)}.composer-section-toggle:hover .composer-section-chevron{color:var(--color-fg-muted)}.composer-section-content{display:flex;flex-direction:column;gap:6px}.composer-grid-panel{margin-top:auto}.composer-menu-bar{position:absolute;top:8px;left:8px;z-index:30;display:flex;gap:2px}.image-overlay-transform{position:fixed;inset:var(--chrome-height) 0 0 0;z-index:15;pointer-events:none;-webkit-user-select:none;user-select:none;touch-action:none}.image-overlay-bounds{position:absolute;border:2px dashed oklch(100% 0 0 / 70%);cursor:move;box-sizing:border-box;pointer-events:all;touch-action:none}.image-overlay-handle{position:absolute;width:10px;height:10px;background:#fff;border:1px solid oklch(0% 0 0 / 50%);border-radius:2px;transform:translate(-50%,-50%);z-index:16;pointer-events:all;touch-action:none;transition:width .1s,height .1s,box-shadow .1s}.image-overlay-handle:hover{width:12px;height:12px;box-shadow:0 0 6px #ffffff7f}.image-overlay-toolbar{position:absolute;z-index:17;transform:translate(-50%);display:flex;gap:2px;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:6px;border:1px solid var(--color-border);padding:3px;pointer-events:all}.image-overlay-mode-btn{font-size:11px;padding:3px 10px;background:var(--color-control-bg);border:1px solid transparent;border-radius:4px;color:var(--color-fg-muted);cursor:pointer;transition:background var(--default-transition-duration) var(--default-transition-timing-function),color var(--default-transition-duration) var(--default-transition-timing-function)}.image-overlay-mode-btn:hover{background:var(--color-control-bg-hover)}.image-overlay-mode-btn.active{background:var(--color-control-bg-hover);border-color:var(--color-border-focus);color:var(--color-fg)}.step-indicator{position:fixed;top:var(--chrome-height);left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:center;height:var(--step-indicator-height);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border-subtle);-webkit-user-select:none;user-select:none}.step-indicator-track{display:flex;align-items:center;gap:0}.step-indicator-item{display:flex;align-items:center;gap:8px;padding:6px 16px;border:none;background:none;cursor:pointer;color:var(--color-fg-faint);font-size:13px;font-weight:500;letter-spacing:.02em;transition:color var(--default-transition-duration) var(--default-transition-timing-function)}.step-indicator-item:hover{color:var(--color-fg-muted)}.step-indicator-item.active{color:var(--color-fg)}.step-indicator-number{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--color-border-hover);background:var(--color-control-bg);font-size:11px;font-weight:600;font-variant-numeric:tabular-nums;transition:background var(--default-transition-duration) var(--default-transition-timing-function),border-color var(--default-transition-duration) var(--default-transition-timing-function)}.step-indicator-item.active .step-indicator-number{background:var(--color-control-bg-hover);border-color:var(--color-border-focus)}.step-indicator-connector{width:32px;height:1px;background:var(--color-border-hover);flex-shrink:0}.gallery-modal{background:var(--color-surface-modal);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:24px;max-width:680px;width:92%;max-height:80vh;overflow-y:auto;box-shadow:var(--shadow-modal)}.gallery-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.gallery-header-actions{display:flex;gap:8px}.gallery-close-btn{background:var(--color-control-bg)}.gallery-loading{display:flex;align-items:center;gap:12px;padding:32px 0;justify-content:center;color:var(--color-fg-subtle);font-size:13px}.gallery-empty{padding:32px 0;text-align:center;color:var(--color-fg-faint);font-size:13px}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.gallery-card{position:relative;background:var(--color-control-bg);border:1px solid var(--color-border-subtle);border-radius:8px;overflow:hidden;transition:border-color .15s}.gallery-card:hover{border-color:var(--color-border-hover)}.gallery-card-preview{aspect-ratio:1;cursor:pointer;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#0000004d}.gallery-card-img{width:100%;height:100%;object-fit:cover}.gallery-card-placeholder{font-size:11px;color:var(--color-fg-faint);text-transform:uppercase;letter-spacing:.05em;text-align:center;padding:8px}.gallery-card-info{padding:8px}.gallery-card-name{font-size:12px;color:var(--color-fg-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:2px}.gallery-card-description{font-size:10px;color:var(--color-fg-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:2px}.gallery-card-meta{display:flex;gap:8px;font-size:10px;color:var(--color-fg-faint)}.gallery-card-delete{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;background:var(--color-overlay-backdrop);border:none;color:var(--color-fg-muted);font-size:14px;line-height:1;cursor:pointer;opacity:0;transition:opacity .15s,color .15s;display:flex;align-items:center;justify-content:center}.gallery-card:hover .gallery-card-delete{opacity:1}.gallery-card-delete:hover{color:var(--color-danger)}.gallery-load-more{display:block;width:100%;margin-top:16px}.gallery-upload-status{padding:8px 12px;margin-bottom:12px;font-size:12px;color:var(--color-fg-muted);background:var(--color-control-bg);border-radius:var(--radius-md)}.gallery-card-actions{display:flex;align-items:center;justify-content:space-between;padding:4px 8px 8px}.gallery-card-action-btn{font-size:11px;padding:3px 10px}.asset-notes{padding:0 8px 4px}.asset-notes-input{width:100%;padding:4px 6px;background:var(--color-control-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);color:var(--color-fg-muted);font-size:11px;outline:none;transition:border-color .15s}.asset-notes-input::placeholder{color:var(--color-fg-faint)}.asset-notes-input:focus{border-color:var(--color-border-focus)}.gallery-card-action-btn-danger{color:var(--color-danger)}.gallery-card-action-btn-danger:hover{color:var(--color-danger-hover)}.discard-dialog{background:var(--color-surface-modal);border:1px solid var(--color-border-hover);border-radius:var(--radius-lg);padding:24px;max-width:400px;width:90%;box-shadow:var(--shadow-modal)}.discard-dialog-actions{display:flex;gap:8px;margin-top:16px}.discard-dialog-discard{background:var(--color-danger);color:var(--color-fg-on-accent)}.discard-dialog-discard:hover{background:var(--color-danger-hover)}.discard-dialog-keep{background:var(--color-success);color:var(--color-fg-on-accent)}.discard-dialog-keep:hover{background:#006818;background:oklch(45% .15 145)}.pattern-type-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-sp-xs);max-height:320px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--color-border-hover) transparent}.pattern-type-grid-tile{position:relative;aspect-ratio:3 / 2;border-radius:var(--radius-md);overflow:hidden;cursor:pointer;border:2px solid transparent;transition:border-color var(--default-transition-duration) var(--default-transition-timing-function),transform var(--default-transition-duration) var(--default-transition-timing-function)}.pattern-type-grid-tile:hover{border-color:var(--color-border-hover)}.pattern-type-grid-tile:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:-2px}.pattern-type-grid-tile[aria-selected=true]{border-color:var(--color-fg)}.pattern-type-grid-tile canvas{display:block;width:100%;height:100%}.pattern-type-grid-tile-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--color-control-bg);color:var(--color-fg-faint);font-size:var(--font-size-2xs);pointer-events:none}.pattern-type-grid-tile-placeholder[data-rendered=true]{display:none}.pattern-type-grid-tile-label{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;padding:var(--spacing-sp-2xs) var(--spacing-sp-xs);pointer-events:none}.pattern-type-grid-tile-label-text{font-size:var(--font-size-2xs);font-weight:600;line-height:1.2;text-shadow:0 0 4px var(--_shadow-color, oklch(0% 0 0 / 60%)),0 1px 2px var(--_shadow-color, oklch(0% 0 0 / 40%))}.pattern-type-dialog{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:90vw;max-width:900px;max-height:85vh;display:flex;flex-direction:column;box-shadow:0 16px 48px #0000007f}.pattern-type-dialog-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-sp-md) var(--spacing-sp-md) 0}.pattern-type-dialog-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-fg)}.pattern-type-dialog-close{padding:var(--spacing-sp-2xs) var(--spacing-sp-sm);font-size:var(--font-size-base);line-height:1}.pattern-type-dialog-body{padding:var(--spacing-sp-md);overflow-y:auto;flex:1;min-height:0}.pattern-type-dialog .pattern-type-grid{max-height:none;overflow-y:visible;grid-template-columns:repeat(3,1fr)}@media(min-width:700px){.pattern-type-dialog .pattern-type-grid{grid-template-columns:repeat(4,1fr)}}.enlarge-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay-backdrop);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:600;animation:popover-fade-in .15s ease-out}.enlarge-content{position:relative;display:flex;align-items:center;max-width:90vw;max-height:85vh}.enlarge-image{max-width:90vw;max-height:85vh;object-fit:contain;border-radius:4px;box-shadow:var(--shadow-modal)}.enlarge-nav{position:absolute;top:50%;transform:translateY(-50%);background:var(--color-overlay-backdrop);border:1px solid var(--color-border-hover);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:var(--color-fg);font-size:24px;cursor:pointer;transition:background .15s;z-index:1}.enlarge-nav:hover{background:var(--color-surface-glass)}.enlarge-nav-prev{left:-56px}.enlarge-nav-next{right:-56px}.enlarge-footer{display:flex;gap:12px;align-items:center;margin-top:12px;color:var(--color-fg-muted);font-size:13px}.enlarge-counter{font-variant-numeric:tabular-nums;color:var(--color-fg-faint)}.enlarge-filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:400px}.user-page-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay-backdrop);display:flex;align-items:center;justify-content:center;z-index:500;animation:popover-fade-in .15s ease-out}.user-page{background:var(--color-surface-modal);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:92%;max-width:760px;max-height:88vh;display:flex;flex-direction:column;box-shadow:var(--shadow-modal)}.user-page-header{display:flex;align-items:center;gap:16px;padding:20px 24px;border-bottom:1px solid var(--color-border-subtle)}.user-page-photo-section{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0}.user-page-photo{width:56px;height:56px;border-radius:50%;overflow:hidden;cursor:pointer;background:var(--color-control-bg);display:flex;align-items:center;justify-content:center;border:2px solid var(--color-border);transition:border-color .15s}.user-page-photo:hover{border-color:var(--color-border-focus)}.user-page-photo-img{width:100%;height:100%;object-fit:cover}.user-page-photo-placeholder{font-size:20px;font-weight:600;color:var(--color-fg-muted)}.user-page-photo-remove{background:none;border:none;color:var(--color-fg-faint);font-size:10px;cursor:pointer;padding:0}.user-page-photo-remove:hover{color:var(--color-danger)}.user-page-info{flex:1;min-width:0}.user-page-nickname{display:block;background:none;border:none;color:var(--color-fg);font-size:18px;font-weight:600;cursor:pointer;padding:2px 0;text-align:left;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-page-nickname:hover{color:var(--color-fg)}.user-page-nickname-input{font-size:18px;font-weight:600;padding:2px 6px;width:100%}.user-page-email{font-size:12px;color:var(--color-fg-faint);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-page-close{flex-shrink:0;align-self:flex-start}.user-page-tabs{display:flex;border-bottom:1px solid var(--color-border-subtle);padding:0 24px}.user-page-tab{padding:10px 20px;background:none;border:none;border-bottom:2px solid transparent;color:var(--color-fg-faint);font-size:13px;font-weight:500;cursor:pointer;transition:color .15s,border-color .15s}.user-page-tab:hover{color:var(--color-fg-muted)}.user-page-tab.active{color:var(--color-fg);border-bottom-color:var(--color-fg-muted)}.user-page-content{flex:1;overflow-y:auto;padding:20px 24px}.user-page-files-actions{margin-bottom:12px}.user-page-dustbox{margin-top:20px;border-top:1px solid var(--color-border-subtle);padding-top:8px}.user-page-dustbox-toggle{display:block;width:100%;background:none;border:none;color:var(--color-fg-faint);font-size:12px;cursor:pointer;padding:6px 0;text-align:left;transition:color .15s}.user-page-dustbox-toggle:hover{color:var(--color-fg-muted)}.user-page-dustbox-content{background:var(--color-control-bg);border-radius:8px;padding:8px;margin-top:4px}.user-page-dustbox-list{display:flex;flex-direction:column;gap:4px}.user-page-dustbox-item{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);font-size:12px}.user-page-dustbox-item-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-fg-subtle)}.user-page-dustbox-item-meta{color:var(--color-fg-faint);font-size:10px;flex-shrink:0}.user-page-dustbox-restore{font-size:10px;padding:2px 8px;flex-shrink:0}.user-page-dustbox-perm-delete{font-size:10px;padding:2px 8px;flex-shrink:0;color:var(--color-danger)}.user-page-dustbox-perm-delete:hover{color:var(--color-danger-hover)}.home-page{height:100%;overflow-y:auto;background:var(--color-bg);padding:var(--spacing-sp-xl)}.home-page-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--spacing-sp-md)}.home-page-tile{position:relative;aspect-ratio:1 / 1;border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:transform var(--default-transition-duration) var(--default-transition-timing-function)}.home-page-tile:hover{transform:scale(1.02)}.home-page-tile canvas{display:block;width:100%;height:100%}.home-page-tile-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--color-control-bg);color:var(--color-fg-faint);font-size:var(--font-size-sm);pointer-events:none}.home-page-tile-placeholder[data-rendered=true]{display:none}.home-page-tile-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;background:linear-gradient(to top,oklch(0% 0 0 / 60%) 0%,transparent 50%);opacity:0;transition:opacity var(--default-transition-duration) var(--default-transition-timing-function);pointer-events:none}.home-page-tile:hover .home-page-tile-overlay{opacity:1}.home-page-tile-label{padding:var(--spacing-sp-sm) var(--spacing-sp-md);color:var(--color-fg);font-size:var(--font-size-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}.template-list-page{width:100%;height:100%;overflow-y:auto;padding:var(--spacing-sp-2xl) var(--spacing-sp-xl)}.template-list-header{margin-bottom:var(--spacing-sp-xl)}.template-list-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-fg);margin:0 0 var(--spacing-sp-2xs) 0}.template-list-subtitle{font-size:var(--font-size-sm);color:var(--color-fg-muted);margin:0}.template-list-loading,.template-list-empty{text-align:center;padding:var(--spacing-sp-2xl) 0;color:var(--color-fg-muted);font-size:var(--font-size-sm)}.template-list-empty-hint{color:var(--color-fg-subtle);font-size:var(--font-size-xs);margin-top:var(--spacing-sp-sm)}.template-list-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--spacing-sp-lg)}.template-list-card{display:flex;flex-direction:column;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-control-bg);cursor:pointer;overflow:hidden;padding:0;font:inherit;color:inherit;text-align:left;transition:border-color var(--default-transition-duration) var(--default-transition-timing-function),background var(--default-transition-duration) var(--default-transition-timing-function)}.template-list-card:hover{border-color:var(--color-border-hover);background:var(--color-control-bg-hover)}.template-list-card-preview{width:100%;aspect-ratio:1200 / 630;background:var(--color-bg);display:flex;align-items:center;justify-content:center;overflow:hidden}.template-list-card-img{width:100%;height:100%;object-fit:cover}.template-list-card-placeholder{color:var(--color-fg-faint)}.template-list-card-info{display:flex;flex-direction:column;gap:var(--spacing-sp-3xs);padding:var(--spacing-sp-sm)}.template-list-card-name{font-size:var(--font-size-sm);font-weight:500;color:var(--color-fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.template-list-card-fields{font-size:var(--font-size-2xs);color:var(--color-fg-subtle)}.template-list-load-more{display:flex;justify-content:center;padding:var(--spacing-sp-xl) 0}.template-list-load-more-btn{padding:var(--spacing-sp-sm) var(--spacing-sp-xl);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-control-bg);color:var(--color-fg-muted);font-size:var(--font-size-sm);cursor:pointer;transition:background var(--default-transition-duration) var(--default-transition-timing-function)}.template-list-load-more-btn:hover:not(:disabled){background:var(--color-control-bg-hover)}.template-list-load-more-btn:disabled{opacity:.5;cursor:default}.shortcut-panel-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay-backdrop);display:flex;align-items:center;justify-content:center;z-index:500}.shortcut-panel{background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-sp-xl);max-width:400px;width:90%;box-shadow:var(--shadow-modal)}.shortcut-panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-sp-lg)}.shortcut-panel-title{font-size:var(--font-size-lg);font-weight:600;margin:0}.shortcut-panel-close{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:none;color:var(--color-fg-muted);cursor:pointer;border-radius:var(--radius-sm);transition:background var(--default-transition-duration) var(--default-transition-timing-function),color var(--default-transition-duration) var(--default-transition-timing-function)}.shortcut-panel-close:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.shortcut-panel-section{margin-bottom:var(--spacing-sp-md)}.shortcut-panel-section:last-child{margin-bottom:0}.shortcut-panel-section-title{font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-faint);margin:0 0 var(--spacing-sp-sm)}.shortcut-panel-row{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-sp-2xs) 0}.shortcut-panel-action{font-size:var(--font-size-sm);color:var(--color-fg)}.shortcut-panel-key{font-size:var(--font-size-xs);font-family:inherit;padding:var(--spacing-sp-2xs) var(--spacing-sp-sm);background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-fg-muted);min-width:28px;text-align:center}.settings-dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay-backdrop);display:flex;align-items:center;justify-content:center;z-index:500}.settings-dialog{background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-sp-xl);max-width:400px;width:90%;box-shadow:var(--shadow-modal)}.settings-dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-sp-lg)}.settings-dialog-title{font-size:var(--font-size-lg);font-weight:600;margin:0}.settings-dialog-close{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:none;color:var(--color-fg-muted);cursor:pointer;border-radius:var(--radius-sm);transition:background var(--default-transition-duration) var(--default-transition-timing-function),color var(--default-transition-duration) var(--default-transition-timing-function)}.settings-dialog-close:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.settings-dialog-body{display:flex;flex-direction:column;gap:var(--spacing-sp-lg)}.settings-dialog-field{display:flex;flex-direction:column;gap:var(--spacing-sp-2xs)}.settings-dialog-label{font-size:var(--font-size-xs);font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-subtle)}.settings-dialog-checkbox-field{gap:var(--spacing-sp-2xs)}.settings-dialog-checkbox-label{display:flex;align-items:center;gap:var(--spacing-sp-sm);font-size:var(--font-size-sm);color:var(--color-fg);cursor:pointer}.settings-dialog-checkbox-label input[type=checkbox]{accent-color:var(--color-accent);width:14px;height:14px}.settings-dialog-hint{font-size:var(--font-size-xs);color:var(--color-fg-faint);margin:0;line-height:1.4}.settings-dialog-scale-options{display:flex;gap:var(--spacing-sp-2xs);flex-wrap:wrap}.settings-dialog-scale-btn{padding:var(--spacing-sp-2xs) var(--spacing-sp-md);font-size:var(--font-size-sm);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-control-bg);color:var(--color-fg);cursor:pointer;transition:background var(--default-transition-duration) var(--default-transition-timing-function),color var(--default-transition-duration) var(--default-transition-timing-function),border-color var(--default-transition-duration) var(--default-transition-timing-function)}.settings-dialog-scale-btn:hover{background:var(--color-control-bg-hover)}.settings-dialog-scale-btn:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.settings-dialog-scale-btn--active{background:var(--color-accent);color:var(--color-fg-on-accent);border-color:var(--color-accent)}.settings-dialog-scale-btn--active:hover{background:var(--color-accent)}.app-shell{width:100vw;height:100vh;display:flex;flex-direction:column}.app-shell-content{flex:1;position:relative;overflow:hidden}.tab-content-wrapper{width:100%;height:100%}/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-feature-settings:normal;font-variation-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.fixed{position:fixed}.relative{position:relative}.static{position:static}.container{width:100%}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.border{border-style:var(--tw-border-style);border-width:1px}.align-bottom{vertical-align:bottom}.align-top{vertical-align:top}.italic{font-style:italic}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.grayscale{--tw-grayscale:grayscale(100%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.invert{--tw-invert:invert(100%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.sepia{--tw-sepia:sepia(100%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}:root{color-scheme:dark;--palette-neutral-950:oklch(14% 0 0);--palette-neutral-600:oklch(53% 0 0);--palette-neutral-500:oklch(60% 0 0);--palette-neutral-400:oklch(66% 0 0);--palette-neutral-300:oklch(73% 0 0);--palette-neutral-100:oklch(90% 0 0);--palette-glass-bg:oklch(0% 0 0/.75);--palette-glass-light-8:oklch(100% 0 0/.08);--palette-glass-light-10:oklch(100% 0 0/.1);--palette-glass-light-12:oklch(100% 0 0/.12);--palette-glass-light-15:oklch(100% 0 0/.15);--palette-glass-light-30:oklch(100% 0 0/.3)}:root,:host{--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--color-bg:var(--palette-neutral-950);--color-fg:var(--palette-neutral-100);--color-fg-muted:var(--palette-neutral-300);--color-fg-subtle:var(--palette-neutral-400);--color-fg-faint:var(--palette-neutral-600);--color-accent:var(--palette-neutral-500);--color-surface-glass:var(--palette-glass-bg);--color-control-bg:var(--palette-glass-light-8);--color-control-bg-hover:var(--palette-glass-light-15);--color-border:var(--palette-glass-light-12);--color-border-hover:var(--palette-glass-light-15);--color-border-focus:var(--palette-glass-light-30);--color-border-subtle:var(--palette-glass-light-8);--color-border-faint:var(--palette-glass-light-10);--color-focus-ring:oklch(65% .15 250);--color-danger:oklch(65% .2 25);--color-danger-hover:oklch(75% .2 25);--color-success:oklch(65% .15 145);--color-star:oklch(65% .15 85);--color-fg-on-accent:oklch(95% 0 0);--color-surface-modal:oklch(15% .01 260);--color-overlay-backdrop:oklch(0% 0 0/.6);--shadow-dropdown:0 4px 12px oklch(0% 0 0/.3);--shadow-modal:0 16px 48px oklch(0% 0 0/.4);--spacing-sp-3xs:3px;--spacing-sp-2xs:4px;--spacing-sp-xs:6px;--spacing-sp-sm:8px;--spacing-sp-md:12px;--spacing-sp-lg:16px;--spacing-sp-xl:20px;--spacing-sp-2xl:28px;--radius-sm:4px;--radius-md:6px;--radius-lg:12px;--font-size-2xs:10px;--font-size-xs:11px;--font-size-sm:12px;--font-size-base:13px;--font-size-lg:18px;--step-indicator-height:44px;--global-header-height:40px;--tab-bar-height:32px;--chrome-height:calc(var(--global-header-height) + var(--tab-bar-height))}:root{--display-scale:1;--spacing-sp-3xs:calc(3px * var(--display-scale));--spacing-sp-2xs:calc(4px * var(--display-scale));--spacing-sp-xs:calc(6px * var(--display-scale));--spacing-sp-sm:calc(8px * var(--display-scale));--spacing-sp-md:calc(12px * var(--display-scale));--spacing-sp-lg:calc(16px * var(--display-scale));--spacing-sp-xl:calc(20px * var(--display-scale));--spacing-sp-2xl:calc(28px * var(--display-scale));--font-size-2xs:calc(10px * var(--display-scale));--font-size-xs:calc(11px * var(--display-scale));--font-size-sm:calc(12px * var(--display-scale));--font-size-base:calc(13px * var(--display-scale));--font-size-lg:calc(18px * var(--display-scale));--step-indicator-height:calc(44px * var(--display-scale));--global-header-height:calc(40px * var(--display-scale));--tab-bar-height:calc(32px * var(--display-scale))}body{background:var(--color-bg);color:var(--color-fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.app{width:100%;height:100%;position:relative}.canvas-layer{inset:var(--chrome-height) 0 0 0;justify-content:center;align-items:center;display:flex;position:fixed}.canvas-layer canvas{object-fit:cover;width:100%;height:100%}.floating-link{z-index:10;background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--color-border);color:var(--color-fg-muted);letter-spacing:.02em;border-radius:8px;align-items:center;gap:8px;padding:8px 14px;font-size:14px;font-weight:400;text-decoration:none;transition:background .15s,color .15s;display:flex;position:absolute}.floating-link:hover{background:var(--color-control-bg-hover);color:var(--color-fg)}.site-link{top:calc(var(--chrome-height) + var(--step-indicator-height) + 12px);right:16px}.site-logo{filter:brightness(0)invert();width:26px;height:26px}.doc-link{gap:6px;bottom:16px;right:16px}.doc-link svg{flex-shrink:0}.controls{top:calc(var(--chrome-height) + var(--step-indicator-height) + var(--spacing-sp-lg));left:var(--spacing-sp-lg);background:var(--color-surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--radius-lg);width:280px;padding:var(--spacing-sp-xl);z-index:10;max-height:calc(100vh - var(--chrome-height) - var(--step-indicator-height) - var(--spacing-sp-lg) - var(--spacing-sp-lg));position:fixed;overflow-y:auto}.controls h1{font-size:var(--font-size-lg);margin-bottom:var(--spacing-sp-lg);letter-spacing:.02em;font-weight:600}.control-group{margin-bottom:var(--spacing-sp-md)}.control-group label{font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-subtle);margin-bottom:var(--spacing-sp-2xs);font-weight:500;display:block}.slug-row{gap:var(--spacing-sp-xs);display:flex}.slug-row input{flex:1;min-width:0}.pattern-type-select-row{gap:var(--spacing-sp-xs);display:flex}.pattern-type-select-row select{flex:1;min-width:0}.btn-expand-patterns{padding:var(--spacing-sp-xs);flex-shrink:0;justify-content:center;align-items:center;display:flex}input[type=text],select{width:100%;padding:var(--spacing-sp-xs) var(--spacing-sp-sm);background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-fg);font-size:var(--font-size-base);outline:none}input[type=text]:focus,select:focus{border-color:var(--color-border-focus)}.btn{padding:var(--spacing-sp-xs) var(--spacing-sp-md);border:1px solid var(--color-border-hover);border-radius:var(--radius-md);background:var(--color-control-bg);color:var(--color-fg);font-size:var(--font-size-sm);cursor:pointer;white-space:nowrap}.btn:hover{background:var(--color-control-bg-hover)}.collapsible-section{border-top:1px solid var(--color-border-faint);margin-top:var(--spacing-sp-sm)}.collapsible-section:first-of-type{border-top:none;margin-top:0}.collapsible-section-header{width:100%;padding:var(--spacing-sp-sm) 0;color:var(--color-fg-muted);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;transition:color .15s;display:flex}.collapsible-section-header:hover{color:var(--color-fg)}.collapsible-section-title{font-weight:500}.collapsible-section-chevron{font-size:var(--font-size-2xs);opacity:.6}.collapsible-section-content{padding-bottom:var(--spacing-sp-sm)}.range-row{align-items:center;gap:var(--spacing-sp-sm);display:flex}.range-row input[type=range]{accent-color:var(--color-accent);flex:1}.range-value{font-size:var(--font-size-sm);font-variant-numeric:tabular-nums;text-align:right;min-width:28px;color:var(--color-fg-muted)}.range-value-editable{text-align:right;min-width:40px;max-width:60px;color:inherit;font:inherit;background:0 0;border:1px solid #0000;border-radius:3px;outline:none;padding:1px 4px}.range-value-editable:focus{background:var(--color-control-bg);border-color:var(--color-border-hover)}.composer-label-value-editable{width:4ch;min-width:unset;max-width:unset;font-size:inherit;padding:0 2px;display:inline}.scheme-preview{gap:var(--spacing-sp-3xs);margin-top:var(--spacing-sp-xs);display:flex}.scheme-dot{border-radius:var(--radius-sm);border:1px solid var(--color-border-faint);width:20px;height:20px}.param-section{border-top:1px solid var(--color-border-subtle);padding-top:var(--spacing-sp-sm);margin-bottom:var(--spacing-sp-md)}.hsl-section{margin-bottom:var(--spacing-sp-md)}.param-section .section-label,.hsl-section .section-label{font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-faint);margin-bottom:var(--spacing-sp-sm);font-weight:600;display:block}.param-control{margin-bottom:var(--spacing-sp-sm)}.param-label-row{justify-content:space-between;align-items:center;display:flex}.param-control label{font-size:var(--font-size-2xs)}label.fix-toggle{font-size:var(--font-size-2xs);opacity:.6;cursor:pointer;align-items:center;gap:3px;line-height:1;display:inline-flex}label.fix-toggle:has(input:checked){opacity:1}label.fix-toggle input[type=checkbox]{vertical-align:middle;accent-color:var(--color-accent);margin:0}.param-control .range-value{min-width:36px;font-size:var(--font-size-xs)}.toggle-row{justify-content:space-between;align-items:center;display:flex}.toggle-row input[type=checkbox]{accent-color:var(--color-accent);width:14px;height:14px}.hsl-slider-row{align-items:center;gap:var(--spacing-sp-sm);margin-bottom:var(--spacing-sp-xs);display:flex}.hsl-slider-row input[type=range]{accent-color:var(--color-accent);flex:1}.hsl-label{font-size:var(--font-size-xs);color:var(--color-fg-subtle);flex-shrink:0;width:1rem;font-weight:500}.hsl-value{font-size:var(--font-size-xs);font-variant-numeric:tabular-nums;text-align:right;min-width:2.5rem;color:var(--color-fg-muted);flex-shrink:0}.btn-hsl-reset{padding:var(--spacing-sp-2xs) var(--spacing-sp-md);border:1px solid var(--color-border-hover);border-radius:var(--radius-md);background:var(--color-control-bg);color:var(--color-fg);font-size:var(--font-size-xs);cursor:pointer;margin-top:var(--spacing-sp-2xs)}.btn-hsl-reset:hover{background:var(--color-control-bg-hover)}.view-transform-section{border-top:1px solid var(--color-border-subtle);padding-top:var(--spacing-sp-sm);margin-bottom:var(--spacing-sp-md)}.view-transform-section .section-label{font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-faint);margin-bottom:var(--spacing-sp-sm);font-weight:600;display:block}.view-transform-slider-row{align-items:center;gap:var(--spacing-sp-sm);margin-bottom:var(--spacing-sp-xs);display:flex}.view-transform-checkbox-row{align-items:center;gap:var(--spacing-sp-xs);font-size:var(--font-size-xs);color:var(--color-fg);margin-bottom:var(--spacing-sp-xs);display:flex}.view-transform-checkbox-row>label{align-items:center;gap:var(--spacing-sp-xs);cursor:pointer;display:flex}.view-transform-checkbox-row input[type=checkbox]{accent-color:var(--color-accent)}.view-transform-slider-row input[type=range]{accent-color:var(--color-accent);flex:1}.view-transform-slider-row input[type=range]:disabled{opacity:.4;cursor:not-allowed}.view-transform-label{font-size:var(--font-size-xs);color:var(--color-fg-subtle);flex-shrink:0;width:1rem;font-weight:500}.view-transform-value{font-size:var(--font-size-xs);font-variant-numeric:tabular-nums;text-align:right;min-width:2.5rem;color:var(--color-fg-muted);flex-shrink:0}.view-transform-zoom-track{flex:1;position:relative}.view-transform-zoom-track input[type=range]{width:100%;accent-color:var(--color-accent)}.view-transform-zoom-tick{background:var(--color-fg-faint);pointer-events:none;width:1px;height:6px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.btn-view-transform-reset{padding:var(--spacing-sp-2xs) var(--spacing-sp-md);border:1px solid var(--color-border-hover);border-radius:var(--radius-md);background:var(--color-control-bg);color:var(--color-fg);font-size:var(--font-size-xs);cursor:pointer;margin-top:var(--spacing-sp-2xs)}.btn-view-transform-reset:hover{background:var(--color-control-bg-hover)}.button-row{margin-top:var(--spacing-sp-md);gap:var(--spacing-sp-sm);display:flex}.action-buttons{gap:var(--spacing-sp-sm);flex-direction:column;display:flex}.btn-download{flex:1}.btn-next-step{width:100%;margin-bottom:var(--spacing-sp-sm);padding:var(--spacing-sp-sm) var(--spacing-sp-md);border:1px solid var(--color-border-hover);border-radius:var(--radius-md);background:var(--color-control-bg-hover);color:var(--color-fg);font-size:var(--font-size-base);cursor:pointer;font-weight:500;transition:background .15s,border-color .15s}.btn-next-step:hover{background:var(--color-border-hover);border-color:var(--color-border-focus)}.selection-btn-edit{background:var(--color-control-bg)}.selection-btn-edit:hover{background:var(--color-control-bg-hover)}.tweak-banner{margin-bottom:var(--spacing-sp-md);padding:var(--spacing-sp-md);border-radius:var(--radius-md);background:#5194d51a;border:1px solid oklch(65% .12 250/.3)}.tweak-banner-label{font-size:var(--font-size-sm);color:#a1c1e4;margin-bottom:var(--spacing-sp-sm);font-weight:500}.tweak-banner-actions{gap:var(--spacing-sp-xs);flex-direction:column;display:flex}.tweak-banner-btn-return{width:100%;padding:var(--spacing-sp-sm) var(--spacing-sp-md);color:var(--color-fg);background:#5194d533;border:1px solid oklch(65% .12 250/.4);font-weight:500}.tweak-banner-btn-return:hover{background:#5194d54d;border-color:#5194d580}.tweak-banner-btn-discard{width:100%;padding:var(--spacing-sp-xs) var(--spacing-sp-md);border:1px solid var(--color-border-hover);background:var(--color-control-bg);color:var(--color-fg-subtle);font-size:var(--font-size-xs)}.tweak-banner-btn-discard:hover{color:var(--color-danger-hover);background:#0003;background:oklch(0% .1 25/.2);border-color:#ca555166}.image-overlay-section{border-top:1px solid var(--color-border-subtle);padding-top:var(--spacing-sp-sm);margin-bottom:var(--spacing-sp-md)}.image-overlay-section .section-label{font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-faint);margin-bottom:var(--spacing-sp-sm);font-weight:600;display:block}.image-import-area{justify-content:center;align-items:center;gap:var(--spacing-sp-2xs);padding:var(--spacing-sp-lg) var(--spacing-sp-md);border:1px dashed var(--color-border-hover);border-radius:var(--radius-md);background:var(--color-control-bg);color:var(--color-fg-muted);font-size:var(--font-size-sm);cursor:pointer;flex-direction:column;transition:border-color .15s,background .15s;display:flex}.image-import-area:hover,.image-import-area.dragging{border-color:var(--color-border-focus);background:var(--color-control-bg-hover)}.image-import-hint{font-size:var(--font-size-2xs);color:var(--color-fg-faint)}.processing-indicator{align-items:center;gap:var(--spacing-sp-xs);padding:var(--spacing-sp-md);font-size:var(--font-size-sm);color:var(--color-fg-muted);flex-direction:column;display:flex}@keyframes processing-spin{to{transform:rotate(360deg)}}.processing-spinner{border:2px solid var(--color-border);border-top-color:var(--color-fg-muted);border-radius:50%;width:16px;height:16px;animation:.8s linear infinite processing-spin;display:inline-block}.processing-progress-bar{background:var(--color-control-bg);border-radius:2px;width:100%;height:4px;overflow:hidden}.processing-progress-fill{background:var(--color-fg-muted);border-radius:2px;height:100%;transition:width .3s}.canvas-processing-overlay{background:var(--color-overlay-backdrop);z-index:10;pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;top:0;right:0;bottom:0;left:0}.image-overlay-clear-btn{width:100%;margin-bottom:var(--spacing-sp-sm)}.image-overlay-controls{gap:var(--spacing-sp-sm);flex-direction:column;display:flex}.image-overlay-slider-row{gap:var(--spacing-sp-2xs);flex-direction:column;display:flex}.image-overlay-label{font-size:var(--font-size-2xs);color:var(--color-fg-subtle)}.image-overlay-reset-btn{padding:var(--spacing-sp-2xs) var(--spacing-sp-md);border:1px solid var(--color-border-hover);border-radius:var(--radius-md);background:var(--color-control-bg);color:var(--color-fg);font-size:var(--font-size-2xs);cursor:pointer;align-self:flex-start}.image-overlay-reset-btn:hover{background:var(--color-control-bg-hover)}.image-overlay-aspect-row{gap:var(--spacing-sp-2xs);margin-bottom:var(--spacing-sp-sm);flex-direction:column;display:flex}.image-overlay-aspect-btns{gap:var(--spacing-sp-2xs);display:flex}.image-overlay-aspect-btn{font-size:var(--font-size-2xs);padding:var(--spacing-sp-2xs) var(--spacing-sp-sm);flex:1}.image-overlay-aspect-btn.active{background:var(--color-control-bg-hover);border-color:var(--color-border-focus)}.image-overlay-error{margin-top:var(--spacing-sp-xs);padding:var(--spacing-sp-xs) var(--spacing-sp-sm);font-size:var(--font-size-2xs);color:var(--color-danger)}.image-layer-panel{border-top:1px solid var(--color-border-subtle);padding-top:var(--spacing-sp-sm);margin-bottom:var(--spacing-sp-md)}.image-layer-panel .section-label{font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-faint);margin-bottom:var(--spacing-sp-sm);font-weight:600;display:block}.image-layer-add{margin-bottom:var(--spacing-sp-sm);padding:var(--spacing-sp-sm) var(--spacing-sp-md)}.image-layer-list{max-height:240px;margin-bottom:var(--spacing-sp-sm);flex-direction:column;gap:2px;display:flex;overflow-y:auto}.image-layer-item{align-items:center;gap:var(--spacing-sp-xs);padding:var(--spacing-sp-2xs) var(--spacing-sp-xs);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-control-bg);cursor:pointer;font-size:var(--font-size-2xs);-webkit-user-select:none;user-select:none;transition:background .1s,border-color .1s;display:flex}.image-layer-item:hover{background:var(--color-control-bg-hover)}.image-layer-item.selected{border-color:var(--color-border-focus);background:var(--color-control-bg-hover)}.image-layer-item.dragging{opacity:.4}.image-layer-drag-handle{cursor:grab;color:var(--color-fg-faint);font-size:var(--font-size-xs);padding:0 2px;line-height:1}.image-layer-thumbnail{border-radius:var(--radius-sm);object-fit:contain;background:var(--color-control-bg);flex-shrink:0;width:40px;height:40px}.image-layer-thumbnail-empty{border-radius:var(--radius-sm);background:var(--color-control-bg);flex-shrink:0;width:40px;height:40px;display:inline-block}.image-layer-name{text-overflow:ellipsis;white-space:nowrap;color:var(--color-fg);flex:1;overflow:hidden}.image-layer-spinner{border-width:1.5px;flex-shrink:0;width:12px;height:12px}.image-layer-bg-toggle{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-control-bg);color:var(--color-fg-faint);cursor:pointer;flex-shrink:0;padding:2px 6px;font-size:9px;transition:background .1s,color .1s}.image-layer-bg-toggle.active{background:var(--color-control-bg-hover);color:var(--color-fg);border-color:var(--color-border-focus)}.image-layer-bg-toggle:hover{background:var(--color-control-bg-hover)}.image-layer-duplicate{color:var(--color-fg-faint);font-size:var(--font-size-sm);cursor:pointer;background:0 0;border:none;flex-shrink:0;padding:0 4px;line-height:1}.image-layer-duplicate:hover{color:var(--color-fg)}.image-layer-delete{color:var(--color-fg-faint);font-size:var(--font-size-sm);cursor:pointer;background:0 0;border:none;flex-shrink:0;padding:0 4px;line-height:1}.image-layer-delete:hover{color:var(--color-danger)}.image-layer-controls{gap:var(--spacing-sp-sm);flex-direction:column;display:flex}.info-popover-wrapper{display:inline-flex;position:relative}.info-trigger{color:var(--color-fg-faint);cursor:pointer;opacity:.6;background:0 0;border:none;padding:0 4px;font-size:14px;line-height:1;transition:opacity .15s}.info-trigger:hover{opacity:1}.info-popover{background:var(--color-surface-modal);color:var(--color-fg-muted);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-sp-sm) var(--spacing-sp-md);font-size:var(--font-size-sm);z-index:100;max-width:250px;line-height:1.4;animation:.15s ease-out popover-fade-in;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.info-popover-arrow{background:var(--color-surface-modal);clip-path:polygon(0 0,100% 0,50% 100%);width:10px;height:5px;position:absolute;bottom:-5px;left:50%;transform:translate(-50%)}@keyframes popover-fade-in{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}.save-pattern-field{margin-bottom:12px}.save-pattern-label{text-transform:uppercase;letter-spacing:.05em;color:var(--color-fg-subtle);margin-bottom:4px;font-size:11px;font-weight:500;display:block}.save-pattern-label-optional{text-transform:none;color:var(--color-fg-muted);font-weight:400}.save-pattern-textarea{resize:vertical;width:100%;min-height:60px;font-family:inherit;font-size:13px}.save-pattern-preview{border-radius:6px;max-height:120px;margin-bottom:12px;overflow:hidden}.save-pattern-preview img{object-fit:cover;width:100%;height:120px}.save-pattern-error{color:var(--color-danger);border-radius:var(--radius-md);background:#f14d4c1a;margin-bottom:8px;padding:8px 12px;font-size:12px}.image-upload-btn{width:100%;font-size:var(--font-size-2xs);margin-top:var(--spacing-sp-xs)}.toast{background:var(--color-surface-modal);border:1px solid var(--color-border-hover);color:var(--color-fg);z-index:600;box-shadow:var(--shadow-modal);border-radius:8px;padding:10px 20px;font-size:13px;animation:.2s ease-out toast-in;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.media-browser-modal{max-width:600px}.media-browser-filter{margin-bottom:12px}.media-browser-filter input{background:var(--color-control-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);width:100%;color:var(--color-fg);outline:none;padding:6px 10px;font-size:12px}.media-browser-filter input:focus{border-color:var(--color-border-focus)}.image-layer-browse{color:var(--color-fg-faint);font-size:var(--font-size-sm);cursor:pointer;background:0 0;border:none;flex-shrink:0;padding:0 4px;line-height:1}.image-layer-browse:hover{color:var(--color-fg)}[data-theme=light]{color-scheme:light;--palette-neutral-950:oklch(97% 0 0);--palette-neutral-100:oklch(20% 0 0);--palette-neutral-300:oklch(35% 0 0);--palette-neutral-400:oklch(45% 0 0);--palette-neutral-500:oklch(55% 0 0);--palette-neutral-600:oklch(45% 0 0);--palette-glass-bg:oklch(100% 0 0/.75);--palette-glass-light-8:oklch(0% 0 0/.06);--palette-glass-light-10:oklch(0% 0 0/.08);--palette-glass-light-12:oklch(0% 0 0/.1);--palette-glass-light-15:oklch(0% 0 0/.12);--palette-glass-light-30:oklch(0% 0 0/.25);--color-surface-modal:oklch(98% 0 0);--color-overlay-backdrop:oklch(0% 0 0/.4);--shadow-dropdown:0 4px 12px oklch(0% 0 0/.12);--shadow-modal:0 16px 48px oklch(0% 0 0/.15);--color-focus-ring:oklch(55% .15 250);--color-danger:oklch(50% .2 25);--color-danger-hover:oklch(55% .2 25);--color-success:oklch(50% .15 145);--color-star:oklch(55% .15 85);--color-fg-on-accent:oklch(98% 0 0)}[data-theme=light] .global-header-logo,[data-theme=light] .site-logo{filter:brightness(0)}@media(prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}