@charset "UTF-8";:root{--bg: #000000;--panel: #0a0a0a;--border: #1a1a1a;--muted: #666666;--text: #cccccc;--primary: #333333;--ruler-bg: #0a0a0a;--ruler-tick: #333333;--ruler-text: #666666;--guide-stroke: #ff0000;--guide-spacing: #3b82f6;--guide-spacing-text: #ffffff;--guide-spacing-bg: #3b82f6;--selection-key-stroke: #3b82f6;--color-success: #10b981;--color-success-bg: #f0fdf4;--color-danger: #ef4444;--color-danger-bg: #fef2f2;--color-default-text: #ffffff;--color-default-line: #ffffff;--page-drag-border: #1890ff;--color-swatches: #FFFFFF,#FFFF00,#00FF00,#00FFFF,#FF00FF,#FF0000,#0000FF,#FFA500,#FFD700,#00FF7F,#FF69B4,#8A2BE2,#32CD32,#FF4500,#1E90FF,#FF1493;--msg-preview-text: #FFFFFF;--msg-preview-bg: #000000;--msg-preview-stroke: #000000;--blue-accent: #4a9eff;--seq-placeholder-bg: #444444;--seq-placeholder-border: #666666;--seq-placeholder-text: #cccccc;--seq-placeholder-subtext: #999999;--menu-card-bg: #151515;--menu-input-bg: #1a1a1a;--menu-button-bg: #2a2a2a;--menu-button-bg-hover: #333333;--menu-button-bg-active: #252525;--menu-button-border: #444444;--menu-subtle-text: #9ca3af;--menu-muted-text: #6b7280;--menu-blue: #4a9eff;--menu-neutral-swatches: #FFFFFF,#CCCCCC,#999999,#666666,#333333,#000000;--menu-link-swatches: #FFFF00,#FFA500,#FF6B6B,#4ECDC4,#95E1D3,#F38181;--color-default-link: #ffff00}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes glow{0%,to{filter:drop-shadow(0 0 8px rgba(74,158,255,.2))}50%{filter:drop-shadow(0 0 20px rgba(74,158,255,.5))}}@keyframes popoverFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--text);overflow:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#ffffff40}#app-splash{position:fixed;inset:0;background:radial-gradient(circle at center,#1a1a1a,#000);z-index:999999;display:flex;align-items:center;justify-content:center;transition:opacity .6s ease-out,visibility .6s}.splash-content{display:flex;flex-direction:column;align-items:center}.splash-svg{color:#4a9eff;filter:drop-shadow(0 0 10px rgba(74,158,255,.5));overflow:visible}.draw-path:nth-child(1){animation-delay:.1s}.draw-path:nth-child(2){animation-delay:.3s}.draw-path:nth-child(3){animation-delay:.5s}.draw-path:nth-child(4){animation-delay:.7s}@keyframes drawLogo{to{stroke-dashoffset:0;fill:#4a9eff1a}}.splash-text-group{margin-top:24px;text-align:center;opacity:0;transform:translateY(20px);animation:fadeInUp .8s ease-out .8s forwards}.splash-title{font-size:24px;font-weight:800;color:#fff;letter-spacing:2px;font-family:system-ui,-apple-system,sans-serif}.splash-title .highlight{color:#4a9eff}.splash-sub{font-size:12px;color:#666;margin-top:8px;letter-spacing:1px;text-transform:uppercase}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}.app{height:100%;display:grid;grid-template-columns:280px 1fr 280px;grid-template-rows:52px 1fr;gap:0;padding:0;box-sizing:border-box;background:#000}#leftPanel{grid-column:1;grid-row:2;display:flex;flex-direction:column;gap:0;overflow:hidden;position:relative;background:#18181b;border-right:1px solid rgba(255,255,255,.08);padding:0;box-shadow:none}.panel-section{display:flex;flex-direction:column;border-bottom:1px solid rgba(255,255,255,.08);background:transparent}.panel-section:last-child{border-bottom:none}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:10px 4px;cursor:pointer;-webkit-user-select:none;user-select:none;color:#e4e4e7;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.panel-header:hover{color:#fff}.panel-content{padding:16px}#leftPanel>.card{display:contents}.scroll,#stageOuter{-ms-overflow-style:none;scrollbar-width:none}.scroll::-webkit-scrollbar,#stageOuter::-webkit-scrollbar{width:0;height:0}#stageOuter{background-color:#18181b;background-image:linear-gradient(45deg,#27272a 25%,transparent 25%,transparent 75%,#27272a 75%),linear-gradient(45deg,#27272a 25%,transparent 25%,transparent 75%,#27272a 75%);background-position:0 0,10px 10px;background-size:20px 20px;border-radius:0;overflow:hidden;border:none;grid-column:2;grid-row:2;height:100%;position:relative;box-shadow:inset 0 0 40px #00000080}#rightPanel{grid-column:3;grid-row:2;display:flex;flex-direction:column;gap:0;overflow:hidden;position:relative;background:#18181b;border-left:1px solid rgba(255,255,255,.08);padding:0;box-shadow:none}#stageInner{display:inline-block;margin-left:20px;margin-top:20px;margin-bottom:32px;opacity:1}#stagePlaceholder{position:absolute;inset:28px 0 0;margin-top:20px;display:flex;align-items:center;justify-content:center;pointer-events:auto;-webkit-user-select:none;user-select:none;color:#94a3b8e6;opacity:1;transition:opacity .1s ease-in-out;z-index:10}#welcomeMessage i{animation:scaleIn .6s cubic-bezier(.175,.885,.32,1.275) forwards,float 4s ease-in-out infinite .6s,glow 3s ease-in-out infinite}#welcomeMessage .text-xl{opacity:0;animation:fadeInUp .8s cubic-bezier(.2,.8,.2,1) .2s forwards;text-shadow:0 2px 10px rgba(0,0,0,.5)}#welcomeMessage .text-sm{opacity:0;animation:fadeInUp .8s cubic-bezier(.2,.8,.2,1) .4s forwards}input,select,textarea{background:#0f0f0f99!important;border:1px solid rgba(255,255,255,.1)!important;color:var(--text)!important;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}input:focus,select:focus,textarea:focus{outline:none!important;border-color:#4a9eff!important;box-shadow:0 0 0 2px #4a9eff33!important;background:#0f0f0fcc!important}input[type=checkbox]{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:2px solid #444444!important;border-radius:4px;background:#0f0f0f!important;cursor:pointer;position:relative;transition:all .2s ease;flex-shrink:0}input[type=checkbox]:hover{border-color:#666!important;background:#1a1a1a!important}input[type=checkbox]:checked{background:#4a9eff!important;border-color:#4a9eff!important}input[type=checkbox]:focus{outline:none!important;border-color:#4a9eff!important;box-shadow:0 0 0 3px #4a9eff33!important}.pcr-app{background:var(--panel)!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:0 4px 16px #00000080!important}#swapModeStyleRow .btn-ghost{position:relative;background:transparent;border:none;color:#fff9;transition:all .15s cubic-bezier(.4,0,.2,1);cursor:pointer}#swapModeStyleRow .btn-ghost:hover{background:#ffffff14;color:#ffffffe6}#swapModeStyleRow .btn-ghost:active{transform:scale(.96)}#swapModeStyleRow .btn-ghost.active{background:#4a9eff26;color:#6eb3ff}#swapModeStyleRow .btn-ghost.active:hover{background:#4a9eff40}#swapModeStyleRow .btn-ghost.active i,#swapModeStyleRow .btn-ghost.active svg{color:#6eb3ff;stroke:#6eb3ff}#swapModeStyleRow .btn-ghost.has-stroke,#swapModeStyleRow .btn-ghost.has-shadow{background:#6eb3ff1f;color:#8cc5ff}#swapModeStyleRow .btn-ghost.has-stroke i,#swapModeStyleRow .btn-ghost.has-stroke svg,#swapModeStyleRow .btn-ghost.has-shadow i,#swapModeStyleRow .btn-ghost.has-shadow svg{color:#8cc5ff;stroke:#8cc5ff}#swapModeStyleRow .btn-ghost.has-stroke:hover,#swapModeStyleRow .btn-ghost.has-shadow:hover{background:#6eb3ff33}#swapModeStyleRow .btn-ghost i,#swapModeStyleRow .btn-ghost svg{transition:all .15s ease}#swapModeStyleRow label{font-size:11px;font-weight:500;letter-spacing:.02em;color:#ffffff73}#swapModeStyleRow input[type=range]::-webkit-slider-thumb{appearance:none;width:10px;height:10px;border-radius:50%;background:#6eb3ff;cursor:ew-resize;transition:all .2s ease}#swapModeStyleRow input[type=range]::-webkit-slider-thumb:hover{background:#8cc5ff;transform:scale(1.2)}#swapModeStyleRow input[type=range]::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:#6eb3ff;border:none;cursor:ew-resize;transition:all .2s ease}#swapModeStyleRow input[type=range]::-moz-range-thumb:hover{background:#8cc5ff;transform:scale(1.2)}input{max-height:38px}input,select,textarea{background:#18181b!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:8px!important;transition:border-color .2s,background-color .2s}input:not(.inline-text-editor),select,textarea{color:var(--text)!important}input:focus,select:focus,textarea:focus{outline:none!important;border-color:#3b82f6!important;background:#18181b!important;box-shadow:none!important}input::placeholder,textarea::placeholder{color:#555!important;opacity:1}input[type=number]{-moz-appearance:textfield;appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.dialog-input{width:100%;background:var(--panel)!important;border:1px solid var(--border)!important;border-radius:8px!important;color:var(--text)!important;transition:border-color .2s,background-color .2s}.dialog-input:focus{outline:none!important;border-color:var(--primary)!important;background:var(--panel)!important;box-shadow:none!important}#universalModal:has(#gridSketchColsInput) select.dialog-input option{color:#111827!important;background:#f9fafb!important}#universalModal:has(#gridSketchColsInput) select.dialog-input option:disabled{color:#9ca3af!important}.box-model-container{display:flex;flex-direction:column;gap:4px;padding:8px 0;background:transparent;border:none;border-radius:0}.box-model-top,.box-model-bottom{display:flex;justify-content:center}.box-model-middle{display:flex;align-items:center;gap:4px}.box-model-center{flex:1;display:flex;align-items:center;justify-content:center;min-height:48px;background:#ffffff05;border:1px dashed rgba(255,255,255,.1);border-radius:4px;padding:8px}.box-model-input{width:56px;height:28px;padding:4px 8px!important;text-align:center!important;font-size:12px!important;font-weight:500;background:#0003!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:4px!important;color:#a1a1aa!important;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:ns-resize}.box-model-input:hover{background:#0006!important;border-color:#fff3!important;color:#fff!important}.box-model-input:focus{outline:none!important;background:#000!important;border-color:#3b82f6!important;color:#fff!important}input[type=checkbox]{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:2px solid rgba(255,255,255,.1)!important;border-radius:4px;background:#ffffff05!important;cursor:pointer;position:relative;transition:all .2s cubic-bezier(.4,0,.2,1);flex-shrink:0}input[type=checkbox]:hover{border-color:#ffffff26!important;background:#ffffff0d!important}input[type=checkbox]:checked{background:#3b82f6!important;border-color:#3b82f6!important}input[type=checkbox]:checked:after{content:"";position:absolute;left:5px;top:3px;width:4px;height:7px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}input[type=checkbox]:focus{outline:none!important;border-color:#3b82f6!important;box-shadow:0 0 0 3px #3b82f626!important}input[type=checkbox]:disabled{opacity:.5;cursor:not-allowed}input[type=radio]{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:2px solid #444444!important;border-radius:50%;background:#0f0f0f!important;cursor:pointer;position:relative;transition:all .2s ease;flex-shrink:0}input[type=radio]:hover{border-color:#666!important;background:#1a1a1a!important}input[type=radio]:checked{border-color:#4a9eff!important;background:#0f0f0f!important}input[type=radio]:checked:after{content:"";position:absolute;left:3px;top:3px;width:8px;height:8px;border-radius:50%;background:#4a9eff}input[type=radio]:focus{outline:none!important;border-color:#4a9eff!important;box-shadow:0 0 0 3px #4a9eff33!important}input[type=radio]:disabled{opacity:.5;cursor:not-allowed}.toggle-switch{appearance:none;-webkit-appearance:none;width:36px!important;height:20px!important;background:#2a2a2a!important;border:1px solid #444!important;border-radius:10px!important;position:relative;cursor:pointer;transition:all .2s ease;flex-shrink:0}.toggle-switch:after{content:"";position:absolute;top:2px!important;left:2px!important;width:14px!important;height:14px!important;background:#888!important;border-radius:50%!important;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 3px #0000004d;border:none!important;transform:none!important}.toggle-switch:hover{background:#333!important;border-color:#666!important}.toggle-switch:checked{background:#4a9eff!important;border-color:#4a9eff!important}.toggle-switch:checked:after{transform:translate(16px)!important;background:#fff!important;border:none!important}.toggle-switch:focus{outline:none;box-shadow:0 0 0 2px #4a9eff33}label{cursor:pointer;-webkit-user-select:none;user-select:none}label:has(input[type=checkbox]:disabled),label:has(input[type=radio]:disabled){cursor:not-allowed;opacity:.6}.color-picker-btn{flex:1}.pcr-button{width:100%!important;height:32px!important;border-radius:8px!important;border:1px solid var(--border)!important;background:var(--panel)!important}.pcr-app{background:var(--panel)!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:0 4px 16px #00000080!important;z-index:10002!important}.pcr-app.stroke-color-picker,.pcr-app.shadow-color-picker{z-index:100100!important}.pcr-app.gradient-color-picker{z-index:100120!important}#btnGradientMore{cursor:pointer}#btnGradientMore:disabled{cursor:not-allowed!important;opacity:.45;box-shadow:none!important;filter:saturate(.55)}#btnGradientMore:disabled:hover,#btnGradientMore:disabled:active{background:inherit!important;border-color:#fff3!important;transform:none!important}.pcr-app .pcr-interaction input{background:#0f0f0f!important;border:1px solid var(--border)!important;color:var(--text)!important}.pcr-app .pcr-interaction .pcr-save{background:var(--primary)!important;color:#fff!important}.pcr-app .pcr-swatches{display:grid!important;grid-template-columns:repeat(6,1fr)!important;gap:4px!important}.pcr-app .pcr-swatches button{width:100%!important;height:28px!important;border-radius:4px!important;border:1px solid var(--border)!important}.custom-select-container{position:relative;display:inline-block;min-width:100px;box-sizing:border-box;vertical-align:middle}.custom-select-trigger{display:flex;align-items:center;justify-content:space-between;padding:0 12px;height:38px;background:#18181b;border:1px solid #333;border-radius:8px;color:#e2e8f0;font-size:14px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:border-color .2s,background-color .2s,box-shadow .2s;box-sizing:border-box}.custom-select-trigger:hover{border-color:#555;background:#1a1a1a}.custom-select-trigger.active{border:1px solid #3b82f6;background:#141414;box-shadow:0 0 0 2px #3b82f61a}.custom-select-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:8px}.custom-select-options{position:absolute;top:100%;left:0;width:100%;margin-top:4px;background:#131316;border:1px solid #333;border-radius:8px;box-shadow:0 10px 25px #00000080;z-index:9999;max-height:240px;overflow-y:auto;box-sizing:border-box;opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);transition:all .2s cubic-bezier(.16,1,.3,1);transform-origin:top center}.custom-select-options.open{opacity:1;visibility:visible;transform:translateY(0) scale(1)}.custom-select-option{padding:8px 12px;color:#ccc;font-size:14px;cursor:pointer;transition:all .1s;display:flex;align-items:center;justify-content:space-between}.custom-select-option:hover{background:#ffffff14;color:#fff}.custom-select-option.selected{background:#3b82f61a;color:#3b82f6}.custom-select-arrow{flex-shrink:0;width:14px;height:14px;color:#666;transition:transform .2s}.custom-select-trigger.active .custom-select-arrow{transform:rotate(180deg);color:#3b82f6}.modal-container{transition:opacity .2s ease-out;z-index:10100!important}.modal-container.modal-hidden{opacity:0;pointer-events:none}.modal-container.modal-visible{opacity:1;pointer-events:auto}.modal-mask{transition:opacity .2s ease-out}.modal-content{background:#181818f2;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 60px #00000080;transition:transform .2s ease-out,opacity .2s ease-out}.modal-hidden .modal-content{transform:scale(.95) translateY(-10px);opacity:0}.modal-visible .modal-content{transform:scale(1) translateY(0);opacity:1}#toast{transition:transform .3s cubic-bezier(.68,-.55,.265,1.55),opacity .3s ease-out}#toast.toast-show{transform:translate(-50%) translateY(0);opacity:1}#toast.toast-hide{transform:translate(-50%) translateY(-20px);opacity:0}.element-search-compact{width:120px;padding:4px 8px 4px 26px!important;border-radius:4px!important;font-size:11px!important;background:transparent!important;border:1px solid transparent!important;color:#a1a1aa!important;transition:all .2s ease}.element-search-compact:hover{background:#ffffff0d!important;color:#fff!important}.element-search-compact:focus{outline:none!important;width:140px;background:#000!important;border-color:#3b82f6!important;color:#fff!important;box-shadow:none!important}.element-search-input{width:100%;padding:8px 12px 8px 32px!important;border-radius:6px!important;font-size:12px!important;background:#ffffff0d!important;border:1px solid rgba(255,255,255,.1)!important;color:var(--text)!important;transition:all .2s ease}.element-search-input:hover{background:#ffffff14!important;border-color:#ffffff26!important}.element-search-input:focus{outline:none!important;background:#3b82f614!important;border-color:#3b82f6!important;box-shadow:0 0 0 3px #3b82f61a!important}.element-filter-group-compact{display:flex;gap:2px;padding:4px 0;background:transparent;border-radius:0;border:none;border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0}.filter-btn-icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid transparent;border-radius:4px;color:#71717a;cursor:pointer;transition:all .2s ease;position:relative;flex-shrink:0}.filter-btn-icon:hover{background:#ffffff0d;color:#e4e4e7;transform:none}.filter-btn-icon.active{background:#3b82f61a;color:#60a5fa;border-color:#3b82f633}.elements-empty-compact{display:flex;align-items:center;gap:8px;padding:16px 12px;margin-top:8px;background:#ffffff05;border:1px dashed rgba(255,255,255,.06);border-radius:6px}.elements-list{display:flex;flex-direction:column;gap:4px;flex:1;min-height:0;overflow-y:auto;padding:4px}.elements-list-bordered{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-height:0;overflow-y:auto!important;overflow-x:hidden;padding:8px 0 20px!important;opacity:1;transition:opacity .15s ease-in-out;scrollbar-width:none;-ms-overflow-style:none}.elements-list-bordered::-webkit-scrollbar{display:none}.elements-empty{padding:20px;text-align:center;color:var(--text-secondary);font-size:12px}.element-item{display:flex;align-items:center;gap:8px;padding:4px 12px;background:transparent;border:1px solid transparent;border-radius:6px;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;margin-bottom:0;overflow:hidden;flex-shrink:0;min-height:36px;transition:background-color .2s,border-color .2s}.element-item:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#4a9eff26,#4a9eff0d);opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:0}.element-item>*{position:relative;z-index:1}.element-item:hover{background:#ffffff14;color:#fff;box-shadow:0 0 0 1px #ffffff1a inset}.element-item:hover:before{opacity:1}.element-item:active{transform:translate(4px) scale(.98)}.element-item.selected{background:#3b82f626;border-color:#3b82f633;box-shadow:0 0 12px #3b82f61a}.element-item.selected .element-name{color:#fff;font-weight:600;text-shadow:0 0 10px rgba(59,130,246,.3)}.element-item.locked{opacity:.6}.element-item.locked .element-name{text-decoration:line-through;color:var(--text-muted)}.element-drag-handle{display:flex;align-items:center;justify-content:center;color:#888;cursor:grab;opacity:0;width:20px;flex-shrink:0;transition:opacity .2s,color .2s}.element-item:hover .element-drag-handle{opacity:.8}.element-drag-handle:hover{opacity:1!important;color:#fff}.element-drag-handle:active{cursor:grabbing;color:#fff}.element-lock-btn,.element-visibility-btn{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:#888;font-size:14px;cursor:pointer;border-radius:4px;opacity:.4;flex-shrink:0;transition:opacity .2s,color .2s,background .2s}.element-item:hover .element-lock-btn,.element-item:hover .element-visibility-btn{opacity:1;color:#ccc}.element-lock-btn:hover,.element-visibility-btn:hover{background:#ffffff26;color:#fff!important;opacity:1!important}.element-item.locked .element-lock-btn{opacity:1;color:#f59e0b}.element-visibility-btn.hidden{opacity:1;color:#444}.element-visibility-btn.hidden:hover{color:#666!important}.element-icon{font-size:16px;width:20px;display:flex;justify-content:center;flex-shrink:0}.element-name{flex:1;font-size:12px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;margin-right:4px}.element-zindex{font-size:10px;color:#ffffff4d;padding:0 4px;min-width:24px;text-align:right;font-family:monospace}.element-item.dragging{opacity:.4;transform:scale(.98);box-shadow:0 4px 12px #00000080;cursor:grabbing}.element-item.drag-over{border-color:#3b82f6;background:#3b82f626}.element-drop-indicator{height:2px;background:#3b82f6;border-radius:1px;margin:2px 0;transition:all .2s;box-shadow:0 0 4px #3b82f6cc}.element-icon.type-text{color:#60a5fa!important}.element-icon.type-image{color:#34d399!important}.element-icon.type-icon{color:#9c27b0!important}.element-icon.type-line{color:#fb923c!important}.element-icon.type-sequence{color:#e10c73!important}.element-icon.type-itembox{color:#06e91c!important}.element-item:has(.type-icon) .element-name{font-family:Consolas,Monaco,Courier New,monospace;font-size:11px;color:#a1a1aa}.element-icon svg,.element-icon i{color:inherit!important;stroke:currentColor!important}.filter-btn{display:flex;align-items:center;justify-content:center;gap:4px;transition:all .2s;border:1px solid transparent}.filter-btn:hover{background:#3b82f61a;border-color:#3b82f64d}.filter-btn.active{background:#3b82f633;border-color:#3b82f680;color:#60a5fa}#elementsSearchInput{background:#1e293bf2;border:1px solid rgba(71,85,105,.6);color:#e2e8f0;font-size:12px}#elementsSearchInput::placeholder{color:#64748b}#elementsSearchInput:focus{outline:none;border-color:#3b82f699;box-shadow:0 0 0 2px #3b82f61a}.element-item.filtered-out{display:none}.right-panel-mask{position:absolute;inset:0;opacity:.5;background:#000;z-index:49;border-radius:12px;display:flex;align-items:center;justify-content:center;pointer-events:all;transition:opacity .3s ease}.elements-list::-webkit-scrollbar{width:4px}.elements-list::-webkit-scrollbar-track{background:transparent}.elements-list::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}.elements-list::-webkit-scrollbar-thumb:hover{background:#fff3}.element-filter-group{display:flex;background:#0000004d;padding:3px;border-radius:8px;border:1px solid rgba(255,255,255,.1);gap:2px}.filter-btn{flex:1;height:26px;border-radius:6px;font-size:11px;display:flex;align-items:center;justify-content:center;gap:4px;color:var(--muted);background:transparent;border:none;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none}.filter-btn:hover{color:var(--text);background:#ffffff0d}.filter-btn.active{background:#4a9eff26;color:#4a9eff;font-weight:600;box-shadow:0 1px 2px #0003}.filter-btn i,.filter-btn svg{opacity:.7}.filter-btn.active i,.filter-btn.active svg{opacity:1}#topMenuBar{grid-column:1/-1;grid-row:1;display:flex;align-items:center;gap:8px;padding:0 16px;background:#18181b99;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(255,255,255,.08);z-index:2000;position:relative;box-shadow:none}#topMenuBar:before{display:none}.menu-logo{display:flex;align-items:center;gap:10px;margin-right:8px;padding:0;border:none;background:transparent;cursor:default;height:40px;border-radius:0;box-shadow:none}.menu-logo:hover{background:transparent;box-shadow:none}.menu-logo-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:transparent;border-radius:0;border:none;color:#3b82f6;position:relative;overflow:visible}.menu-logo-icon:before{display:none}.menu-logo:hover .menu-logo-icon{background:transparent;border-color:transparent;box-shadow:none;transform:none}.logo-path{stroke-dasharray:0;stroke-dashoffset:0;transition:none}.menu-logo:hover .logo-path{animation:none}.menu-logo-text{font-size:13px;font-weight:600;line-height:1;letter-spacing:.5px;display:flex;align-items:center;gap:4px}.brand-gradient{background:none;-webkit-text-fill-color:#e4e4e7;filter:none;font-weight:600}.menu-logo-badge{display:none}.menu-items{display:flex;align-items:center;gap:2px;flex:1}.menu-item{position:relative;cursor:pointer}.menu-trigger{display:flex;align-items:center;gap:4px;padding:6px 10px;border-radius:4px;font-size:13px;font-weight:400;color:#a1a1aa;background:transparent;border:none;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.menu-input{background:var(--menu-input-bg);border:1px solid var(--border);border-radius:6px}.menu-card{background:var(--menu-card-bg)}.menu-btn{background:var(--menu-button-bg);border:1px solid var(--menu-button-border)}.menu-btn:hover{background:var(--menu-button-bg-hover)}.menu-btn:active{background:var(--menu-button-bg-active)}.context-menu{position:fixed;z-index:100000;min-width:180px;max-width:240px;background:#18181b;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 12px 32px #00000080;padding:6px;font-size:13px;color:var(--text);-webkit-user-select:none;user-select:none}.context-menu-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:6px;color:#ffffffd9;cursor:pointer;transition:all .15s ease}.context-menu-item:hover{background:#ffffff14;color:#fff}.context-menu-item i{flex-shrink:0}.context-menu-divider{height:1px;margin:4px 0;background:#ffffff14}.ctx-separator{height:1px;margin:4px 8px;background:var(--border)}.menu-trigger:before{display:none}.menu-trigger:hover{background:#ffffff0f;color:#fff;box-shadow:none;transform:none}.menu-trigger.active{background:#ffffff1a;color:#fff;box-shadow:none}.menu-dropdown{position:absolute;top:100%;left:0;min-width:200px;background:#18181b;border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:4px;box-shadow:0 4px 12px #00000080;z-index:2001;opacity:0;visibility:hidden;transform:translateY(-10px) scale(.95);transition:opacity .2s cubic-bezier(.4,0,.2,1),transform .2s cubic-bezier(.4,0,.2,1),visibility .2s}.menu-dropdown:before{display:none}.menu-dropdown.show{opacity:1;visibility:visible;transform:translateY(0) scale(1)}@keyframes menuFadeIn{0%{opacity:0;transform:translateY(-12px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.menu-dropdown-item{display:flex;align-items:center;gap:12px;padding:0 14px;height:36px;border-radius:8px;font-size:13px;color:#fffc;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.menu-dropdown-item:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#4a9eff26,#4a9eff0d);opacity:0;transition:opacity .3s ease}.menu-dropdown-item:hover{background:#ffffff14;color:#fff;transform:translate(3px);box-shadow:0 0 0 1px #ffffff1a inset}.menu-dropdown-item:hover:before{opacity:1}.menu-dropdown-item:active{transform:translate(3px) scale(.98)}#topMenuBar [data-lucide],#topMenuBar svg.lucide{width:14px;height:14px}#topMenuBar .menu-dropdown-item svg.lucide,#topMenuBar .menu-dropdown-item [data-lucide]{width:15px;height:15px}#topMenuBar .menu-trigger svg.lucide,#topMenuBar .menu-trigger [data-lucide=chevron-down]{width:12px;height:12px}#topMenuBar svg.lucide{opacity:.92;stroke:currentColor}#topMenuBar .menu-trigger:hover svg.lucide,#topMenuBar .menu-dropdown-item:hover svg.lucide,#topMenuBar .menu-trigger.active svg.lucide{opacity:1}#topMenuBar .menu-dropdown svg.lucide{opacity:.95}.menu-dropdown-item i{width:15px;height:15px;opacity:.85}.menu-dropdown-divider{height:1px;background:#ffffff0d;margin:6px 8px}#menuProjectName:not(.has-project)+.menu-dropdown-divider{display:none}.menu-dropdown-item .kbd{margin-left:auto;font-size:10px;padding:2px 4px;white-space:nowrap;flex-shrink:0}.menu-dropdown-item .check-icon{margin-left:4px;opacity:1;color:#10b981;flex-shrink:0}.menu-dropdown-item{white-space:nowrap}.menu-project-info{display:flex;align-items:center;gap:12px;margin-left:auto}.menu-project-name{display:flex;align-items:center;gap:8px;padding:8px 14px;background:linear-gradient(135deg,#ffffff0a,#ffffff05);border:1px solid rgba(255,255,255,.08);border-radius:10px;font-size:13px;color:#ffffff80;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;max-width:240px}#menuProjectNameText{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}#menuProjectNameText{max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.menu-project-name:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);opacity:0;transition:opacity .3s ease}.menu-project-name:hover{background:linear-gradient(135deg,#ffffff14,#ffffff0a);border-color:#ffffff26;transform:translateY(-1px);box-shadow:0 2px 8px #0000004d}.menu-project-name:hover:before{opacity:1}.menu-project-name.has-project{color:#fff;border-color:#4a9eff66;background:linear-gradient(135deg,#4a9eff26,#4a9eff14);box-shadow:0 0 16px #4a9eff26}.menu-project-name.has-project:hover{border-color:#4a9eff99;background:linear-gradient(135deg,#4a9eff33,#4a9eff1f);box-shadow:0 0 20px #4a9eff4d,0 2px 8px #0000004d}.menu-project-name .edit-icon{opacity:0;transition:opacity .2s ease}.menu-project-name:hover .edit-icon{opacity:.6}.menu-project-name.has-project:hover .edit-icon{opacity:1}.menu-save-status{display:flex;align-items:center;gap:8px;padding:8px 14px;background:linear-gradient(135deg,#ffffff0a,#ffffff05);border:1px solid rgba(255,255,255,.08);border-radius:10px;font-size:12px;color:#ffffff80;transition:all .3s cubic-bezier(.4,0,.2,1);max-width:350px;min-width:140px;cursor:help;position:relative;overflow:hidden}.menu-save-status:hover{background:linear-gradient(135deg,#ffffff14,#ffffff0a);transform:translateY(-1px);box-shadow:0 2px 8px #0000004d}.menu-save-status span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.menu-save-status.saved{color:#10b981;border-color:#10b98166;background:linear-gradient(135deg,#10b98126,#10b98114);box-shadow:0 0 16px #10b98126}.menu-save-status.saved:hover{box-shadow:0 0 20px #10b98140,0 2px 8px #0000004d}.menu-save-status.unsaved{color:#f59e0b;border-color:#f59e0b66;background:linear-gradient(135deg,#f59e0b26,#f59e0b14);box-shadow:0 0 16px #f59e0b26;animation:pulse 2s ease-in-out infinite}.menu-save-status.saving{color:#3b82f6;border-color:#3b82f666;background:linear-gradient(135deg,#3b82f626,#3b82f614);box-shadow:0 0 16px #3b82f626}.menu-save-status.saving [data-lucide]{animation:spin 1s linear infinite}@keyframes pulse{0%,to{opacity:1;box-shadow:0 0 16px #f59e0b26}50%{opacity:.9;box-shadow:0 0 24px #f59e0b4d}}.menu-save-status i{animation:none}.menu-save-status.saving i{animation:spin 1s linear infinite}#app-splash{position:fixed;inset:0;background:#0a0a0f;z-index:999999;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:opacity .6s ease-out,visibility .6s;cursor:pointer}.splash-grid-bg{position:absolute;inset:-50%;width:200%;height:200%;background-image:linear-gradient(rgba(74,158,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(74,158,255,.03) 1px,transparent 1px);background-size:40px 40px;transform:perspective(500px) rotateX(60deg) translateY(0) translateZ(-200px);animation:gridMove 20s linear infinite;-webkit-mask-image:radial-gradient(circle at center,black 0%,transparent 70%);mask-image:radial-gradient(circle at center,black 0%,transparent 70%);pointer-events:none}@keyframes gridMove{0%{transform:perspective(500px) rotateX(60deg) translateY(0) translateZ(-200px)}to{transform:perspective(500px) rotateX(60deg) translateY(40px) translateZ(-200px)}}.splash-content{display:flex;flex-direction:column;align-items:center;position:relative;z-index:2}.splash-logo-wrapper{position:relative;width:120px;height:120px;display:flex;align-items:center;justify-content:center}.splash-logo-wrapper:before{content:"";position:absolute;inset:0;border:1px solid rgba(74,158,255,.3);border-radius:50%;animation:ringExpand 3s ease-out infinite}.splash-logo-wrapper:after{content:"";position:absolute;inset:20px;border:1px solid rgba(74,158,255,.5);border-radius:50%;animation:ringExpand 3s ease-out 1s infinite}.splash-svg{color:#4a9eff;filter:drop-shadow(0 0 15px rgba(74,158,255,.8));overflow:visible;position:relative;z-index:10}@keyframes ringExpand{0%{transform:scale(.8);opacity:0;border-width:2px}20%{opacity:1}to{transform:scale(2);opacity:0;border-width:0px}}.draw-path{stroke-dasharray:40;stroke-dashoffset:40;animation:drawLogo 1.5s cubic-bezier(.4,0,.2,1) forwards}.draw-path:nth-child(1){animation-delay:.2s}.draw-path:nth-child(2){animation-delay:.4s}.draw-path:nth-child(3){animation-delay:.6s}.draw-path:nth-child(4){animation-delay:.8s}@keyframes drawLogo{0%{stroke-dashoffset:40;fill:transparent}60%{stroke-dashoffset:0;fill:transparent}to{stroke-dashoffset:0;fill:#4a9eff26}}.splash-text-group{margin-top:40px;text-align:center;opacity:0;animation:fadeInUp .8s ease-out 1s forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px);filter:blur(5px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}.splash-title{font-size:32px;font-weight:800;color:#fff;letter-spacing:6px;font-family:system-ui,-apple-system,sans-serif;margin-bottom:8px;text-shadow:0 0 20px rgba(74,158,255,.4)}.splash-title .highlight{color:#4a9eff;position:relative;display:inline-block}.splash-sub{font-size:12px;color:#6b7280;letter-spacing:3px;text-transform:uppercase}.splash-loading-container{margin-top:32px;width:330px;display:flex;flex-direction:column;align-items:center;gap:8px}.splash-loading-bar{width:100%;height:2px;background:#ffffff1a;border-radius:2px;overflow:hidden;position:relative}.splash-loading-progress{position:absolute;left:0;top:0;height:100%;width:0%;background:#4a9eff;box-shadow:0 0 10px #4a9eff;transition:width .2s linear}.splash-loading-progress:after{content:"";position:absolute;top:0;right:0;height:100%;width:4px;background:#fff;box-shadow:0 0 5px #fff}.splash-loading-text{font-family:JetBrains Mono,monospace;font-size:10px;color:#4a9eff;opacity:.7}.splash-skip-hint{position:absolute;bottom:32px;font-size:12px;color:#ffffff4d;letter-spacing:1px;opacity:0;animation:fadeIn .5s ease-out 2s forwards;pointer-events:none}@keyframes fadeIn{to{opacity:1}}#app-splash.hide{opacity:0;visibility:hidden;pointer-events:none}.ruler-h,.ruler-v{position:absolute;background:var(--ruler-bg);border:1px solid var(--border);-webkit-user-select:none;user-select:none;font-size:10px;color:var(--muted);z-index:10}.ruler-h{top:0;left:20px;right:0;height:20px;border-bottom:1px solid var(--border)}.ruler-v{top:20px;left:0;bottom:0;width:20px;border-right:1px solid var(--border)}.ruler-origin{position:absolute;top:0;left:0;width:20px;height:20px;background:var(--ruler-bg);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--muted);z-index:11}.placeholder-bg-btn{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px 36px;min-width:150px;background:linear-gradient(135deg,#1e293b,#0f172a);border:2px solid #334155;border-radius:14px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);color:#f1f5f9;font-size:15px;font-weight:600;overflow:hidden;box-shadow:0 4px 12px #0000004d;z-index:100;pointer-events:auto}.placeholder-bg-btn:before{content:"";position:absolute;inset:-2px;background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-radius:14px;opacity:0;transition:opacity .3s ease;z-index:-1}.placeholder-bg-btn:after{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(59,130,246,.4) 0%,transparent 70%);opacity:0;transform:scale(0);transition:transform .5s ease,opacity .3s ease}.placeholder-bg-btn i{color:#64748b;transition:all .3s cubic-bezier(.4,0,.2,1);filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.placeholder-bg-btn span{-webkit-user-select:none;user-select:none;position:relative;z-index:1}.placeholder-bg-btn:hover{background:linear-gradient(135deg,#334155,#1e293b);border-color:#3b82f6;transform:translateY(-4px) scale(1.02);box-shadow:0 12px 32px #3b82f666,0 0 0 1px #3b82f633}.placeholder-bg-btn:hover:before{opacity:.15}.placeholder-bg-btn:hover i{color:#3b82f6;transform:scale(1.2) rotate(-5deg);filter:drop-shadow(0 4px 8px rgba(59,130,246,.5))}.placeholder-bg-btn:active{transform:translateY(-2px) scale(.98);transition:all .1s ease}.placeholder-bg-btn:active:after{opacity:1;transform:scale(2);transition:transform .6s ease,opacity .4s ease}.placeholder-bg-btn:focus-visible{outline:2px solid #3b82f6;outline-offset:4px}.floating-panel{position:fixed;right:20px;top:72px;width:320px;max-height:calc(100vh - 92px);background:#18181bbf;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 20px 50px #00000080,0 0 0 1px #ffffff0d inset;z-index:10001;display:flex;flex-direction:column;overflow:visible;transition:transform .3s cubic-bezier(.4,0,.2,1);outline:none!important}.floating-panel input:invalid,.floating-panel input:required:invalid{box-shadow:none!important;outline:none!important}.floating-panel:hover{box-shadow:0 25px 60px #0009,0 0 0 1px #ffffff0d inset;border-color:#ffffff26}.floating-panel-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;height:40px;border-bottom:1px solid rgba(255,255,255,.08);cursor:move;cursor:grab;-webkit-user-select:none;user-select:none;background:#ffffff05;border-radius:8px 8px 0 0}.floating-panel-header:active{cursor:grabbing}.floating-panel-content{overflow-y:auto;overflow-x:hidden;flex:1;padding:0;display:flex;flex-direction:column;gap:0}.panel-section{background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,.08);border-radius:0;padding:12px 16px}.panel-section:last-child{margin-bottom:0;border-bottom:none;padding-bottom:0}.panel-section-simple{padding:12px 0}.panel-title{font-weight:700;font-size:14px;margin-bottom:12px;color:var(--text)}.collapsible-title{display:flex;align-items:center;justify-content:space-between;cursor:pointer;-webkit-user-select:none;user-select:none;height:32px;padding:0;margin:0!important;font-weight:700;font-size:12px;color:var(--text)}.collapsible-title:hover{opacity:.8}.toggle-icon{font-size:10px;transition:transform .2s;color:var(--muted)}.panel-content{overflow:hidden;transition:max-height .3s ease,opacity .3s ease,margin-top .3s ease,padding-bottom .3s ease,transform .3s ease;margin-top:4px;padding-bottom:12px;transform:translateY(0)}.panel-content.collapsed{max-height:0!important;opacity:0;margin-top:0!important;padding-bottom:0!important;margin-bottom:0;transform:translateY(-10px)}.panel-content>div{margin-bottom:12px}.panel-content>div:last-child{margin-bottom:0}.panel-content input[type=text],.panel-content input[type=number],.panel-content .btn{height:35px;font-size:13px}.panel-content label{font-size:12px;color:#888;margin-bottom:6px;display:block}.floating-panel-content::-webkit-scrollbar{width:4px}.floating-panel-content::-webkit-scrollbar-track{background:transparent}.floating-panel-content::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}.floating-panel-content::-webkit-scrollbar-thumb:hover{background:#fff3}.floating-panel-footer{padding:8px 12px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:8px;flex-shrink:0;border-radius:0 0 12px 12px}#moreAlignMenu{z-index:3000;box-shadow:0 4px 20px #00000080;animation:menuFadeIn .15s ease-out}.right-panel-mask{position:absolute;inset:0;opacity:0;background:#000;z-index:49;border-radius:12px;display:flex;align-items:center;justify-content:center;pointer-events:all;transition:opacity .3s ease}.right-panel-mask.hidden{opacity:0;pointer-events:none}#fontSelectorDropdown input{outline:none!important;box-shadow:none!important}#fontSelectorDropdown input:focus{outline:none!important;box-shadow:none!important}#fontSelectorDropdown .font-item{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;cursor:pointer;transition:background .15s ease;border-bottom:1px solid #e5e7eb;min-height:36px;background:#f9fafb}#fontSelectorDropdown .font-item:hover{background:#eff6ff}#fontSelectorDropdown .font-item.selected{background:#dbeafe;border-left:3px solid #3b82f6;padding-left:7px}#fontSelectorDropdown .font-item:last-child{border-bottom:none}#fontSelectorDropdown .font-item-preview{width:100%;height:auto;display:block;image-rendering:crisp-edges}#fontSelectorDropdown .font-item-name{flex:1;font-size:13px;color:#18181b;display:flex;align-items:center;gap:6px}#fontSelectorDropdown .font-item-vip{display:inline-block;padding:2px 6px;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#000;font-size:9px;font-weight:700;border-radius:4px;text-transform:uppercase;letter-spacing:.5px}#fontSelectorDropdown .font-item-category{font-size:10px;color:#71717a;background:#e5e7eb;padding:2px 8px;border-radius:4px;white-space:nowrap}.accordion-section{margin-bottom:8px;border-radius:6px;overflow:hidden}.accordion-header{width:100%;display:flex;align-items:center;gap:8px;padding:10px 12px;background:#ffffff08;border:1px solid rgba(255,255,255,.05);border-radius:6px;cursor:pointer;transition:all .2s ease}.accordion-header:hover{background:#ffffff0f;border-color:#ffffff14}.accordion-header.active{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-color:transparent}.accordion-icon{transition:transform .25s cubic-bezier(.4,0,.2,1);color:#9ca3af;flex-shrink:0}.accordion-header.active .accordion-icon{transform:rotate(180deg)}.accordion-content{max-height:0;overflow:hidden;transition:max-height .3s cubic-bezier(.4,0,.2,1);background:#00000026;border:1px solid rgba(255,255,255,.05);border-top:none;border-bottom-left-radius:6px;border-bottom-right-radius:6px;padding:0 12px}.accordion-content.active{max-height:1000px;padding:12px}.text-style-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border-radius:6px;background:#0000004d;border:1px solid rgba(255,255,255,.1);color:#9ca3af;cursor:pointer;transition:all .2s ease}.text-style-btn:hover{background:#ffffff1a;border-color:#fff3;color:#e5e7eb}.text-style-btn.active{background:#3b82f633;border-color:#3b82f6;color:#60a5fa}.text-style-btn:disabled{opacity:.4;cursor:not-allowed}.text-style-btn:disabled:hover{background:#0000004d;border-color:#ffffff1a;color:#9ca3af}.color-tabs{display:flex;gap:4px;padding:2px;background:#0000004d;border-radius:8px;margin-bottom:6px;width:96px}.color-tab{flex:1;padding:1px 4px;border-radius:6px;font-size:10px;font-weight:500;color:#9ca3af;background:transparent;border:none;cursor:pointer;transition:all .2s ease}.color-tab:hover{color:#e5e7eb;background:#ffffff0d}.color-tab.active{color:#fff;background:#3b82f633;box-shadow:0 0 0 1px #3b82f64d}.color-tab:disabled{opacity:.4;cursor:not-allowed;background:transparent;box-shadow:none}.color-panel{animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}#statusBar{position:absolute;bottom:0;left:0;right:0;height:28px;background:#0a0a0a;border-top:1px solid var(--border);display:flex;align-items:center;padding:0 12px;font-size:12px;color:var(--muted);z-index:10;-webkit-user-select:none;user-select:none;transform:translateY(100%);transition:transform .3s cubic-bezier(.16,1,.3,1)}#statusBar.visible{transform:translateY(0)}#statusBar .status-item{display:flex;align-items:center;gap:8px}#statusBar .status-label{color:#666;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.5px}#statusBar .status-value{color:#aaa;font-weight:400;font-family:Consolas,Monaco,monospace;font-size:11px}.status-divider{width:1px;height:14px;background:#ffffff14;margin:0 12px}.status-tools{margin-left:auto;display:flex;align-items:center;gap:8px;padding-right:8px}.status-tool-item{display:flex;align-items:center;gap:6px;padding:4px 8px;border-radius:4px;cursor:pointer;font-size:12px;color:#666;transition:all .2s;position:relative;-webkit-user-select:none;user-select:none}.status-tool-item:hover{background:#ffffff0d;color:#999}.status-tool-item.active{color:#4a9eff;background:#4a9eff1a}.status-tool-item.active:hover{background:#4a9eff26}.status-popover{position:absolute;bottom:100%;right:0;margin-bottom:8px;background:#1e1e1e;border:1px solid #333;border-radius:8px;padding:12px;width:180px;box-shadow:0 4px 12px #00000080;display:none;z-index:100;cursor:default}.status-popover.show{display:block;animation:popoverFadeIn .15s ease-out}.popover-title{font-weight:600;color:#e2e8f0;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid #333}.popover-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.popover-row:last-child{margin-bottom:0}.popover-input{width:60px;padding:2px 4px;background:#0f0f0f;border:1px solid #333;border-radius:4px;color:#ccc;font-size:12px;text-align:right}.popover-input:focus{border-color:#4a9eff;outline:none}#menuSaveStatus{transition:all .2s;padding:0 4px;border-radius:4px}#menuSaveStatus:hover{background:#ffffff0d}#menuSaveStatus.saved .status-value{color:#10b981}#menuSaveStatus.unsaved .status-value{color:#f59e0b}#menuSaveStatus.saving .status-value{color:#3b82f6}#menuSaveStatus.saving i{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.layer-panel{display:flex;flex-direction:column;height:100%;background:var(--panel)}.layer-panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-bottom:1px solid var(--border);background:var(--bg)}.layer-list{flex:1;overflow-y:auto;padding:4px}.layer-item{display:flex;align-items:center;padding:8px 12px;margin-bottom:4px;background:var(--panel);border:1px solid var(--border);border-radius:6px;cursor:pointer;transition:all .2s ease}.layer-item:hover{background:#ffffff0d;border-color:#fff3}.layer-item-active{background:#3b82f633!important;border-color:#3b82f680!important}.layer-item-left{display:flex;gap:4px;margin-right:8px}.layer-item-center{flex:1;min-width:0}.layer-name{font-size:13px;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-info{font-size:11px;color:var(--text-muted);margin-top:2px}.layer-item-right{display:flex;gap:4px;margin-left:8px}.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;background:transparent;border:none;border-radius:4px;color:var(--text-muted);cursor:pointer;transition:all .2s ease}.btn-icon:hover:not(:disabled){background:#ffffff1a;color:var(--text)}.btn-icon:disabled{opacity:.3;cursor:not-allowed}.btn-danger:hover:not(:disabled){background:#ef444433;color:#ef4444}.layer-list::-webkit-scrollbar{width:6px}.layer-list::-webkit-scrollbar-track{background:transparent}.layer-list::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}.layer-list::-webkit-scrollbar-thumb:hover{background:#fff3}.layer-item-wrapper{margin-bottom:4px}.layer-nodes-list{margin-left:24px;padding:4px 0;border-left:2px solid var(--border)}.layer-node-item{display:flex;align-items:center;gap:8px;padding:4px 12px;margin:2px 0;background:#0003;border-radius:4px;font-size:12px;cursor:pointer;transition:all .2s ease}.layer-node-item:hover{background:#ffffff1a}.layer-node-item .node-type{color:var(--text-muted);font-size:11px}.layer-node-item .node-name{flex:1;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-expand-icon{transform:rotate(-90deg);transition:transform .2s ease}.message-preview-container{display:flex;gap:20px;min-height:500px;max-height:600px}.config-panel{width:450px;flex-shrink:0;overflow-y:auto;padding-right:10px;scrollbar-width:none;-ms-overflow-style:none}.config-panel::-webkit-scrollbar{display:none}.form-group{margin-bottom:20px}.form-group .form-label{display:block;color:#999;font-size:13px;margin-bottom:8px;font-weight:500}.form-group .form-input{width:100%;padding:8px 12px;background:#1a1a1a;border:1px solid #333;border-radius:6px;color:#fff;font-size:14px;transition:border-color .2s}.form-group .form-input:focus{outline:none;border-color:#4a9eff}.form-group .form-input::placeholder{color:#666}.radio-group{display:flex;gap:12px}.radio-group .radio-item{flex:1;display:flex;align-items:center;justify-content:center;padding:8px 12px;background:#1a1a1a;border:1px solid #333;border-radius:6px;cursor:pointer;transition:all .2s}.radio-group .radio-item input[type=radio]{margin-right:6px;cursor:pointer}.radio-group .radio-item span{color:#999;font-size:14px;-webkit-user-select:none;user-select:none}.radio-group .radio-item:has(input:checked){background:#2a4a6a;border-color:#4a9eff}.radio-group .radio-item:has(input:checked) span{color:#fff}.radio-group .radio-item:hover:not(:has(input:checked)){background:#222;border-color:#444}.collapse-header{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#1a1a1a;border:1px solid #333;border-radius:6px;cursor:pointer;transition:all .2s;margin-bottom:10px}.collapse-header:hover{background:#222;border-color:#444}.collapse-header .collapse-icon{width:16px;height:16px;color:#4a9eff}.collapse-header .collapse-title{flex:1;color:#fff;font-size:14px;font-weight:500}.collapse-header .collapse-arrow{width:16px;height:16px;color:#999;transition:transform .3s}.collapse-header .collapse-arrow.rotated{transform:rotate(180deg)}.collapse-content{max-height:0;overflow:hidden;transition:max-height .3s ease-out}.collapse-content.expanded{max-height:1000px}.current-color-display{display:flex;align-items:center;gap:12px;padding:12px;background:#0f0f0f;border:1px solid #333;border-radius:6px;margin-bottom:12px}.current-color-display .color-preview{width:40px;height:40px;border-radius:4px;border:2px solid #333;flex-shrink:0}.current-color-display .color-info{flex:1}.current-color-display .color-info .color-name{font-size:13px;color:#999;margin-bottom:4px}.current-color-display .color-info .color-hex{font-size:14px;color:#fff;font-family:Consolas,Monaco,monospace}.color-grid{display:grid;grid-template-columns:repeat(12,32px);gap:4px;padding:4px;background:#0f0f0f;border:1px solid #333;border-radius:6px;justify-content:center}.color-grid-item{position:relative;width:32px;height:32px;border-radius:4px;cursor:pointer;transition:all .2s;border:2px solid transparent;display:flex;align-items:center;justify-content:center}.color-grid-item .color-name-label{font-size:10px;color:#ffffffb3;text-shadow:0 0 2px rgba(0,0,0,.8);font-weight:600;pointer-events:none;-webkit-user-select:none;user-select:none}.color-grid-item:hover{transform:scale(1.15);box-shadow:0 4px 8px #0006;z-index:10}.color-grid-item.selected{border-color:#4a9eff;box-shadow:0 0 8px #4a9eff99}.color-grid-item.selected:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:16px;font-weight:700;text-shadow:0 0 4px rgba(0,0,0,.8)}.preview-panel{flex:1;display:flex;flex-direction:column;overflow:hidden;border-radius:10px;border:1px solid #333}.preview-panel .preview-label{padding:12px 16px;background:#151515;border-bottom:1px solid #333;color:#999;font-size:13px;font-weight:500}.preview-panel .preview-content{flex:1;overflow-y:auto;position:relative}.preview-panel .preview-content::-webkit-scrollbar{width:8px}.preview-panel .preview-content::-webkit-scrollbar-track{background:#0a0a0a}.preview-panel .preview-content::-webkit-scrollbar-thumb{background:#333;border-radius:4px}.preview-panel .preview-content::-webkit-scrollbar-thumb:hover{background:#444}.preview-panel .preview-content .preview-content-wrapper{background-image:url(../assets/images/prview_bg.jpg);background-repeat:no-repeat;background-size:100% 100%;height:454px;overflow:hidden;width:100%}.preview-panel .preview-content .msg-system-preview{position:absolute;top:320px;width:315px;height:108px;left:25px}.preview-panel .preview-content .msg-top-preview{position:absolute;top:190px;left:0;right:0;text-align:center;height:100px;display:flex;flex-direction:column;justify-content:end}.message-line{overflow:hidden;height:15px;line-height:15px!important}.message-line span{font-size:12px;font-family:宋体;position:relative;top:-1px}.message-line.message-top{background:transparent;text-align:center;height:17px!important;line-height:17px!important}#universalModal:has(.message-preview-container) .modal-content{max-width:900px;width:900px}#universalModalFooter{display:flex;justify-content:flex-end;gap:20px;margin-top:24px}#universalModalFooter button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:90px;padding:9px 22px;font-size:13px;font-weight:500;border-radius:8px;border:none;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}#universalModalFooter button:after{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(255,255,255,.3) 0%,transparent 70%);opacity:0;transform:scale(0);transition:transform .5s ease,opacity .3s ease}#universalModalFooter button:active:after{opacity:1;transform:scale(2);transition:transform .6s ease,opacity .4s ease}#universalModalFooter button.btn-primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;box-shadow:0 2px 8px #3b82f64d}#universalModalFooter button.btn-primary:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 4px 12px #3b82f666;transform:translateY(-1px)}#universalModalFooter button.btn-primary:active{transform:translateY(0) scale(.98)}#universalModalFooter button.btn-secondary{background:linear-gradient(135deg,#374151,#1f2937);color:#e5e7eb;border:1px solid #4b5563;box-shadow:0 2px 4px #0003}#universalModalFooter button.btn-secondary:hover{background:linear-gradient(135deg,#4b5563,#374151);box-shadow:0 3px 8px #0000004d;transform:translateY(-1px)}#universalModalFooter button.btn-secondary:active{transform:translateY(0) scale(.98)}#universalModalFooter button:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}#universalModal:has(.frame-selector-dialog) .modal-content{max-width:1280px;height:80vh}.frame-range-input:not(:disabled){cursor:pointer}.frame-range-input:not(:disabled):hover{border-color:#3b82f6}.frame-selector-dialog{display:flex;gap:16px;height:100%;width:100%}#frame-grid-container{flex:1;min-width:0;display:flex;flex-direction:column}.virtual-grid-container{flex:1;min-width:0;height:100%;overflow-y:auto;position:relative;background:#0a0a0a;border:1px solid #2a2a2a;border-radius:6px}.virtual-grid-container::-webkit-scrollbar{width:6px}.virtual-grid-container::-webkit-scrollbar-track{background:#1a1a1a}.virtual-grid-container::-webkit-scrollbar-thumb{background:#404040;border-radius:3px}.virtual-grid-container::-webkit-scrollbar-thumb:hover{background:#505050}.frame-grid{display:grid;grid-template-columns:repeat(auto-fill,64px);gap:4px;padding:8px}.frame-item{width:64px;height:64px;position:relative;border:1px solid #2a2a2a;border-radius:3px;overflow:hidden;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;background:#0a0a0a}.frame-item img{max-width:100%;max-height:100%;object-fit:contain}.frame-item:hover{transform:scale(1.05);z-index:1}.frame-item.selected{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f6;background:#3b82f61a}.frame-item.start-pending{border-color:#ef4444;box-shadow:0 0 0 2px #ef4444}.frame-item.jump-highlight{animation:highlight-pulse 1s ease-out}.frame-index{position:absolute;top:2px;right:2px;padding:1px 4px;font-size:9px;color:#999;background:#000000b3;border-radius:2px;font-weight:500;pointer-events:none;font-family:monospace;line-height:1.2}.frame-error{width:64px;height:64px;font-size:10px}.frame-error i{font-size:20px;margin-bottom:4px;display:none}.frame-badge{position:absolute;top:0;padding:2px 4px;font-size:10px;color:#fff;font-weight:700;pointer-events:none}.frame-badge.badge-start{left:0;background:#ef4444}.frame-badge.badge-end{right:0;background:#3b82f6}@keyframes highlight-pulse{0%{box-shadow:0 0 #fbbf24}50%{box-shadow:0 0 0 6px #fbbf2499}to{box-shadow:0 0 #fbbf2400}}.frame-info-panel{width:300px;flex-shrink:0;display:flex;flex-direction:column;gap:12px}.frame-info-panel .info-section{padding:12px;background:#0a0a0a80;border:1px solid #2a2a2a;border-radius:6px}.frame-info-panel .section-title{font-size:12px;color:gray;margin-bottom:8px;font-weight:500}.frame-info-panel .section-content{font-size:13px;color:#d0d0d0}.frame-info-panel .selection-inputs{display:flex;flex-direction:column;gap:8px}.frame-info-panel .selection-inputs input[type=number]{width:100%;padding:6px 8px;background:#1a1a1a;border:1px solid #2a2a2a;border-radius:4px;color:#d0d0d0;font-size:13px}.frame-info-panel .selection-inputs input[type=number]:focus{outline:none;border-color:#3b82f6}.frame-info-panel .selection-inputs input[type=number].error{border-color:#ef4444}.frame-info-panel .selection-inputs--two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:start}.frame-info-panel .quick-actions{display:flex;flex-direction:column;gap:6px}.frame-info-panel .quick-actions button{padding:6px 12px;font-size:12px;border-radius:4px;border:none;cursor:pointer;transition:background .15s;display:flex;align-items:center;justify-content:center}.frame-info-panel .quick-actions button.btn-primary{background:#3b82f6;color:#fff}.frame-info-panel .quick-actions button.btn-primary:hover{background:#4a90ff}.frame-info-panel .quick-actions button.btn-secondary{background:#2a2a2a;color:#d0d0d0}.frame-info-panel .quick-actions button.btn-secondary:hover{background:#3a3a3a}.frame-info-panel .shortcut-hint{font-size:11px;color:#606060;text-align:center}.frame-info-panel .shortcut-hint kbd{background:#2a2a2a;padding:2px 6px;border-radius:3px;font-family:monospace;font-size:10px;color:#a0a0a0}.frame-info-panel .dialog-actions{display:flex;gap:20px;margin-top:auto;padding-top:16px;justify-content:flex-end}.frame-info-panel .dialog-actions button{flex:0 0 auto;min-width:100px;padding:11px 28px;font-size:14px;font-weight:600;border-radius:8px;border:none;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.frame-info-panel .dialog-actions button:after{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(255,255,255,.3) 0%,transparent 70%);opacity:0;transform:scale(0);transition:transform .5s ease,opacity .3s ease}.frame-info-panel .dialog-actions button:active:after{opacity:1;transform:scale(2);transition:transform .6s ease,opacity .4s ease}.frame-info-panel .dialog-actions button.btn-primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;box-shadow:0 2px 8px #3b82f64d}.frame-info-panel .dialog-actions button.btn-primary:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 4px 12px #3b82f666;transform:translateY(-1px)}.frame-info-panel .dialog-actions button.btn-primary:active{transform:translateY(0) scale(.98)}.frame-info-panel .dialog-actions button.btn-secondary{background:linear-gradient(135deg,#374151,#1f2937);color:#e5e7eb;border:1px solid #4b5563;box-shadow:0 2px 4px #0003}.frame-info-panel .dialog-actions button.btn-secondary:hover{background:linear-gradient(135deg,#4b5563,#374151);border-color:#6b7280;box-shadow:0 4px 8px #0000004d;transform:translateY(-1px)}.frame-info-panel .dialog-actions button.btn-secondary:active{transform:translateY(0) scale(.98)}.frame-info-panel .dialog-actions button:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.inline-text-editor{background:transparent;border:none;outline:none;padding:0;margin:0;resize:none;white-space:nowrap;box-sizing:border-box;border-radius:0!important;overflow:visible;caret-color:#3b82f6}.inline-text-editor:focus{border-bottom:2px solid #007acc;background:transparent}.symbol-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.symbol-btn{background:#151515;border:1px solid #333;color:#fff;cursor:pointer;padding:8px 0;font-size:16px;border-radius:4px;transition:all .2s;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-family:SimSun,宋体,monospace}.symbol-btn:not(.disabled):hover{background:#007acc;border-color:#fff;transform:scale(1.05)}.symbol-btn:not(.disabled):active{transform:scale(.95)}.symbol-btn.disabled{opacity:.3;cursor:not-allowed;pointer-events:none;background:#0a0a0a;border-color:#222;color:#555}#symbolPanel{right:auto;width:300px;max-height:480px}#symbolPanel.hidden{display:none}#symbolPanel .symbol-panel-close{display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;outline:none}#symbolPanel .symbol-panel-close:hover{background:#ffffff1a}#symbolPanel .symbol-panel-close:active{transform:scale(.95)}#symbolPanel .floating-panel-content{max-height:420px;padding:0}#symbolPanel .panel-section{padding:10px 12px}#symbolPanel .panel-section:last-child{padding-bottom:10px}.symbol-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.symbol-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:4px;color:#fff;font-size:16px;font-weight:400;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none;outline:none}.symbol-btn:hover{background:#3b82f626!important;border-color:#3b82f64d!important;transform:translateY(-1px)!important;box-shadow:0 4px 12px #3b82f626!important}.symbol-btn:active,.symbol-btn.symbol-btn-pressed{transform:translateY(0) scale(.95);background:#3b82f659!important;border-color:#3b82f680!important;box-shadow:0 2px 6px #3b82f633,inset 0 2px 4px #0000004d!important}#pageGroupsList{padding:0}.page-group{border-bottom:1px solid rgba(255,255,255,.08)}.page-group:last-child{border-bottom:none}.page-group-header{display:flex;align-items:center;justify-content:space-between;padding:8px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .15s ease}.page-group-header:hover{background:#ffffff08}.page-group-header-left{display:flex;align-items:center;gap:8px;flex:1}.page-group-toggle{padding:2px;transition:transform .2s ease}.page-group-toggle i{display:block}.page-group-name{font-size:13px;font-weight:600;color:#e4e4e7}.page-group-count{font-size:11px;color:#71717a}.page-group-menu{opacity:0;transition:opacity .15s ease}.page-group-header:hover .page-group-menu{opacity:1}.page-group-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease;overflow:hidden}.page-group-content>*{min-height:0}.page-group-content.is-expanded{grid-template-rows:1fr}.page-item{display:flex;align-items:center;justify-content:space-between;padding:6px 8px 6px 22px;background:transparent;border:1px solid transparent;border-radius:6px;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;flex-shrink:0;min-height:32px;transition:background-color .2s,border-color .2s;margin:0 4px 2px}.page-item:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#4a9eff26,#4a9eff0d);opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:0}.page-item>*{position:relative;z-index:1}.page-item:hover{background:#ffffff14;box-shadow:0 0 0 1px #ffffff1a inset}.page-item:hover:before{opacity:1}.page-item:active{transform:scale(.98)}.page-item-active{background:#3b82f626;border-color:#3b82f633;box-shadow:0 0 12px #3b82f61a}.page-item-left{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.page-item-name{font-size:13px;color:#d4d4d8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.page-item-active .page-item-name{color:#fff;font-weight:600;text-shadow:0 0 10px rgba(59,130,246,.3)}.page-item-drag-handle{opacity:0;display:flex;align-items:center;justify-content:center;width:18px;height:18px;color:#71717a;cursor:grab;transition:opacity .15s ease;flex-shrink:0;margin-left:2px}.page-item-drag-handle:active{cursor:grabbing}.page-item-drag-handle:hover{color:#a1a1aa}.page-item-actions{display:flex;align-items:center;gap:2px;opacity:0;transition:opacity .15s ease}.btn-icon-sm{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border-radius:4px;background:transparent;border:none;cursor:pointer;color:#71717a;transition:all .15s ease}.btn-icon-sm:hover{background:#f8717126;color:#f87171}.btn-icon-sm:active{transform:scale(.95)}.btn-icon-sm:disabled{cursor:not-allowed;pointer-events:none}.page-item:hover .page-item-drag-handle,.page-item:hover .page-item-actions{opacity:1}.btn-icon{display:flex;align-items:center;justify-content:center;padding:4px;border-radius:4px;background:transparent;border:none;cursor:pointer;color:#71717a;transition:all .15s ease}.btn-icon:hover{background:#ffffff14;color:#e4e4e7}.btn-icon:active{transform:scale(.95)}.custom-scrollbar{scrollbar-width:thin;scrollbar-color:#27272a #18181b}.custom-scrollbar::-webkit-scrollbar{width:6px}.custom-scrollbar::-webkit-scrollbar-track{background:transparent}.custom-scrollbar::-webkit-scrollbar-thumb{background:#27272a;border-radius:3px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:#3f3f46}.page-item.drag-over{border-top:2px solid #3b82f6;margin-top:-2px}.page-drop-end{height:12px;margin:0 8px 8px 5px;border:1px dashed transparent;border-radius:6px;transition:border-color .2s,background-color .2s}.page-drop-end.drag-over{border-color:#3b82f6cc;background:#3b82f614}#universalModal:has(.material-library-container) .modal-content{max-width:1120px;width:90vw}.material-library-container{display:flex;min-height:500px;max-height:calc(85vh - 180px);border-radius:6px;overflow:hidden}.material-category-sidebar{width:180px;overflow-y:auto;flex-shrink:0;padding-right:10px}.material-category-sidebar::-webkit-scrollbar{width:6px}.material-category-sidebar::-webkit-scrollbar-thumb{background:#475569;border-radius:3px}.material-category-sidebar::-webkit-scrollbar-thumb:hover{background:#64748b}.material-category-sidebar .category-btn{display:flex;align-items:center;width:100%;padding:8px 12px;margin-bottom:4px;background:transparent;border:none;border-radius:6px;color:#cbd5e1;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s ease;text-align:left}.material-category-sidebar .category-btn:hover:not(.active){background:#334155;color:#f1f5f9}.material-category-sidebar .category-btn.active{background:#176ffc80;color:#fff}.material-category-sidebar .category-btn.active .count{color:#fffc}.material-category-sidebar .category-btn .count{margin-left:auto;font-size:12px;color:#94a3b8;font-weight:400}.material-content-area{flex:1;display:flex;flex-direction:column;overflow:hidden;border-radius:10px}.material-toolbar{display:flex;align-items:center;gap:16px;margin-bottom:16px;flex-shrink:0}.material-toolbar .material-search-box{position:relative;flex:1;max-width:320px}.material-toolbar .material-search-box .material-search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:#94a3b8;pointer-events:none}.material-toolbar .material-search-box .material-search-input{width:100%;height:38px;padding:0 12px 0 36px;background:#0f172a;border:1px solid #334155;border-radius:6px;color:#f1f5f9;font-size:14px;outline:none;transition:all .15s ease}.material-toolbar .material-search-box .material-search-input::placeholder{color:#64748b}.material-toolbar .material-search-box .material-search-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.material-toolbar .material-stat-info{margin-left:auto;font-size:13px;color:#94a3b8;white-space:nowrap}.material-grid{overflow:hidden;padding:0;flex:1;width:100%;position:relative}.virtual-scroll-container{position:relative;height:100%;overflow-y:auto;overflow-x:hidden;padding:4px}.virtual-scroll-container::-webkit-scrollbar{width:8px}.virtual-scroll-container::-webkit-scrollbar-thumb{background:#475569;border-radius:4px}.virtual-scroll-container::-webkit-scrollbar-thumb:hover{background:#64748b}.virtual-scroll-content{position:absolute;top:0;left:0;right:0}.material-card{border:1px solid rgba(255,255,255,.1);border-radius:8px;overflow:hidden;cursor:pointer;transition:all .2s ease-out;height:120px;display:flex;flex-direction:column}.material-card:hover{border-color:#3b82f6;box-shadow:0 10px 25px #3b82f680;z-index:10}.material-card:active{transform:scale(.98)}.material-preview{flex:1;min-height:0;background:#00000080;display:flex;align-items:center;justify-content:center;padding:8px;position:relative;overflow:hidden}.material-preview:before{content:"";position:absolute;inset:0;background-image:linear-gradient(45deg,#334155 25%,transparent 25%),linear-gradient(-45deg,#334155 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#334155 75%),linear-gradient(-45deg,transparent 75%,#334155 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;opacity:.25;z-index:0}.material-preview img{position:relative;z-index:1;max-width:100%;max-height:100%;object-fit:scale-down;image-rendering:pixelated}.material-preview.is-error{color:#f87171;font-size:12px;text-align:center}.material-name{background:#0003;color:#cbd5e1;font-size:13px;text-align:center;padding:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.empty-state{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#94a3b8;text-align:center}#tour-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9998;pointer-events:none;display:none;opacity:0;transition:opacity .3s ease}#tour-overlay.visible{display:block;opacity:1}#tour-overlay svg{width:100%;height:100%;fill:#000000bf}#tour-highlight-box{position:fixed;z-index:9998;border:2px solid #3b82f6;border-radius:4px;box-shadow:0 0 0 4px #3b82f64d;pointer-events:none;transition:all .3s ease;display:none}#tour-highlight-box.visible{display:block}#tour-popover{position:fixed;z-index:9999;background:#1f1f1f;border:1px solid #333;border-radius:8px;width:320px;padding:20px;box-shadow:0 10px 25px #00000080;opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease;display:none}#tour-popover.visible{display:block;opacity:1;transform:translateY(0)}#tour-popover .tour-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}#tour-popover .tour-header h3{font-size:16px;font-weight:600;color:#fff;margin:0}#tour-popover .tour-header .tour-close{cursor:pointer;color:#666}#tour-popover .tour-header .tour-close:hover{color:#fff}#tour-popover .tour-body{font-size:14px;color:#ccc;line-height:1.5;margin-bottom:20px}#tour-popover .tour-footer{display:flex;justify-content:space-between;align-items:center}#tour-popover .tour-footer .tour-progress{font-size:12px;color:#666}#tour-popover .tour-footer .tour-buttons{display:flex;gap:8px}#tour-popover .tour-footer .tour-buttons button{padding:6px 12px;border-radius:4px;font-size:12px;cursor:pointer;transition:all .2s;border:1px solid transparent}#tour-popover .tour-footer .tour-buttons button.btn-skip{background:transparent;color:#888}#tour-popover .tour-footer .tour-buttons button.btn-skip:hover{color:#ccc}#tour-popover .tour-footer .tour-buttons button.btn-next{background:#3b82f6;color:#fff}#tour-popover .tour-footer .tour-buttons button.btn-next:hover{background:#2563eb}#tour-popover .tour-footer .tour-buttons button.btn-finish{background:#10b981;color:#fff}#tour-popover .tour-footer .tour-buttons button.btn-finish:hover{background:#059669}#tour-popover .tour-arrow{position:absolute;width:12px;height:12px;background:#1f1f1f;border:1px solid #333;transform:rotate(45deg);z-index:-1}#tour-popover .tour-arrow.top{bottom:-7px;left:50%;margin-left:-6px;border-top:none;border-left:none}#tour-popover .tour-arrow.bottom{top:-7px;left:50%;margin-left:-6px;border-bottom:none;border-right:none}#tour-popover .tour-arrow.left{right:-7px;top:50%;margin-top:-6px;border-bottom:none;border-left:none}#tour-popover .tour-arrow.right{left:-7px;top:50%;margin-top:-6px;border-top:none;border-right:none}.card{background:var(--panel);border:1px solid rgba(255,255,255,.08)}.kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;background:#0f0f0f;border:1px solid var(--border);padding:2px 6px;border-radius:8px;color:#999}button:hover svg.lucide,.btn:hover svg.lucide,.menu-trigger:hover svg.lucide,.menu-dropdown-item:hover svg.lucide,.element-visibility-btn:hover svg.lucide,.element-lock-btn:hover svg.lucide{color:#60a5fa;transition:color .2s ease,transform .2s ease}.hover-rotate:hover svg.lucide{transform:rotate(90deg)}.tooltip{position:fixed;top:0;left:0;background:#000000d9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#e2e8f0;padding:8px 12px;border:1px solid rgba(56,189,248,.3);border-radius:8px;font-size:12px;line-height:1.4;white-space:pre-wrap;max-width:320px;z-index:99999;pointer-events:none;opacity:0;transition:opacity .15s ease-out;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;transform:translate(0)}.tooltip.show{opacity:1}.status-tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%);background:#000000e6;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;white-space:nowrap;z-index:2000;pointer-events:none;transition:opacity .2s}.status-tooltip.show{opacity:1}.status-tooltip.hide{opacity:0}#dragCoordTooltip{position:fixed;background:#000000d9;color:#fff;padding:6px 10px;border-radius:6px;font-size:12px;font-weight:600;font-family:Consolas,Monaco,monospace;pointer-events:none;z-index:10000;white-space:nowrap;border:1px solid #333333;box-shadow:0 2px 8px #00000080}.pickr{position:relative;overflow:visible;transform:translateY(0)}.pickr *{box-sizing:border-box;outline:none;border:none;-webkit-appearance:none}.pickr .pcr-button{position:relative;height:2em;width:2em;padding:.5em;cursor:pointer;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;border-radius:.15em;background:url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" stroke="%2342445A" stroke-width="5px" stroke-linecap="round"><path d="M45,45L5,5"></path><path d="M45,5L5,45"></path></svg>') no-repeat center;background-size:0;transition:all .3s}.pickr .pcr-button:before{position:absolute;content:"";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');background-size:.5em;border-radius:.15em;z-index:-1}.pickr .pcr-button:before{z-index:initial}.pickr .pcr-button:after{position:absolute;content:"";top:0;left:0;height:100%;width:100%;transition:background .3s;background:var(--pcr-color);border-radius:.15em}.pickr .pcr-button.clear{background-size:70%}.pickr .pcr-button.clear:before{opacity:0}.pickr .pcr-button.clear:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px var(--pcr-color)}.pickr .pcr-button.disabled{cursor:not-allowed}.pickr *,.pcr-app *{box-sizing:border-box;outline:none;border:none;-webkit-appearance:none}.pickr input:focus,.pickr input.pcr-active,.pickr button:focus,.pickr button.pcr-active,.pcr-app input:focus,.pcr-app input.pcr-active,.pcr-app button:focus,.pcr-app button.pcr-active{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px var(--pcr-color)}.pickr .pcr-palette,.pickr .pcr-slider,.pcr-app .pcr-palette,.pcr-app .pcr-slider{transition:box-shadow .3s}.pickr .pcr-palette:focus,.pickr .pcr-slider:focus,.pcr-app .pcr-palette:focus,.pcr-app .pcr-slider:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #00000040}.pcr-app{position:fixed;display:flex;flex-direction:column;z-index:10000;border-radius:.1em;background:#fff;opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;box-shadow:0 .15em 1.5em #0000001a,0 0 1em #00000008;left:0;top:0}.pcr-app.visible{transition:opacity .3s;visibility:visible;opacity:1}.pcr-app .pcr-swatches{display:flex;flex-wrap:wrap;margin-top:.75em}.pcr-app .pcr-swatches.pcr-last{margin:0}@supports (display: grid){.pcr-app .pcr-swatches{display:grid;align-items:center;grid-template-columns:repeat(auto-fit,1.75em)}}.pcr-app .pcr-swatches>button{font-size:1em;position:relative;width:calc(1.75em - 5px);height:calc(1.75em - 5px);border-radius:.15em;cursor:pointer;margin:2.5px;flex-shrink:0;justify-self:center;transition:all .15s;overflow:hidden;background:#0000;z-index:1}.pcr-app .pcr-swatches>button:before{position:absolute;content:"";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');background-size:6px;border-radius:.15em;z-index:-1}.pcr-app .pcr-swatches>button:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--pcr-color);border:1px solid rgba(0,0,0,.05);border-radius:.15em;box-sizing:border-box}.pcr-app .pcr-swatches>button:hover{filter:brightness(1.05)}.pcr-app .pcr-swatches>button:not(.pcr-active){box-shadow:none}.pcr-app .pcr-interaction{display:flex;flex-wrap:wrap;align-items:center;margin:0 -.2em}.pcr-app .pcr-interaction>*{margin:0 .2em}.pcr-app .pcr-interaction input{letter-spacing:.07em;font-size:.75em;text-align:center;cursor:pointer;color:#75797e;background:#f1f3f4;border-radius:.15em;transition:all .15s;padding:.45em .5em;margin-top:.75em}.pcr-app .pcr-interaction input:hover{filter:brightness(.975)}.pcr-app .pcr-interaction input:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #4285f4bf}.pcr-app .pcr-interaction .pcr-result{color:#75797e;text-align:left;flex:1 1 8em;min-width:8em;transition:all .2s;border-radius:.15em;background:#f1f3f4;cursor:text}.pcr-app .pcr-interaction .pcr-result::-moz-selection{background:#4285f4;color:#fff}.pcr-app .pcr-interaction .pcr-result::selection{background:#4285f4;color:#fff}.pcr-app .pcr-interaction .pcr-type.active{color:#fff;background:#4285f4}.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear{color:#fff;width:auto}.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear{color:#fff}.pcr-app .pcr-interaction .pcr-save:hover,.pcr-app .pcr-interaction .pcr-cancel:hover,.pcr-app .pcr-interaction .pcr-clear:hover{filter:brightness(.925)}.pcr-app .pcr-interaction .pcr-save{background:#4285f4}.pcr-app .pcr-interaction .pcr-clear,.pcr-app .pcr-interaction .pcr-cancel{background:#f44250}.pcr-app .pcr-interaction .pcr-clear:focus,.pcr-app .pcr-interaction .pcr-cancel:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #f44250bf}.pcr-app .pcr-selection .pcr-picker{position:absolute;height:18px;width:18px;border:2px solid #fff;border-radius:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pcr-app .pcr-selection .pcr-color-palette,.pcr-app .pcr-selection .pcr-color-chooser,.pcr-app .pcr-selection .pcr-color-opacity{position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;flex-direction:column;cursor:grab;cursor:-webkit-grab}.pcr-app .pcr-selection .pcr-color-palette:active,.pcr-app .pcr-selection .pcr-color-chooser:active,.pcr-app .pcr-selection .pcr-color-opacity:active{cursor:grabbing;cursor:-webkit-grabbing}.pcr-app[data-theme=nano]{width:14.25em;max-width:95vw}.pcr-app[data-theme=nano] .pcr-swatches{margin-top:.6em;padding:0 .6em}.pcr-app[data-theme=nano] .pcr-interaction{padding:0 .6em .6em}.pcr-app[data-theme=nano] .pcr-selection{display:grid;grid-gap:.6em;grid-template-columns:1fr 4fr;grid-template-rows:5fr auto auto;align-items:center;height:10.5em;width:100%;align-self:flex-start}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview{grid-area:2/1/4/1;height:100%;width:100%;display:flex;flex-direction:row;justify-content:center;margin-left:.6em}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview .pcr-last-color{display:none}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview .pcr-current-color{position:relative;background:var(--pcr-color);width:2em;height:2em;border-radius:50em;overflow:hidden}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview .pcr-current-color:before{position:absolute;content:"";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');background-size:.5em;border-radius:.15em;z-index:-1}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-palette{grid-area:1/1/2/3;width:100%;height:100%;z-index:1}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-palette .pcr-palette{border-radius:.15em;width:100%;height:100%}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-palette .pcr-palette:before{position:absolute;content:"";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');background-size:.5em;border-radius:.15em;z-index:-1}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser{grid-area:2/2/2/2}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity{grid-area:3/2/3/2}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser,.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity{height:.5em;margin:0 .6em}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser .pcr-picker,.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity .pcr-picker{top:50%;transform:translateY(-50%)}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser .pcr-slider,.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity .pcr-slider{flex-grow:1;border-radius:50em}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser .pcr-slider{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity .pcr-slider{background:linear-gradient(to right,transparent,black),url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');background-size:100%,.25em}