.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .15s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:#252526;border:1px solid #3c3c3c;border-radius:6px;box-shadow:0 8px 32px #0006;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;animation:slideIn .2s ease-out}@keyframes slideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-small{width:400px;max-width:90vw}.modal-medium{width:600px;max-width:90vw}.modal-large{width:800px;max-width:90vw}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;border-bottom:1px solid #3c3c3c}.modal-title{margin:0;font-size:16px;font-weight:600;color:#fff}.modal-close{background:transparent;border:none;color:#8c8c8c;font-size:24px;line-height:1;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:3px;transition:background .15s,color .15s}.modal-close:hover{background:#3c3c3c;color:#fff}.modal-body{padding:1.5rem;flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}.btn{font-family:inherit;font-weight:500;border-radius:4px;cursor:pointer;transition:background .15s,border-color .15s,transform .1s;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:not(:disabled):active{transform:translateY(1px)}.btn-small{padding:4px 12px;font-size:12px}.btn-medium{padding:8px 16px;font-size:13px}.btn-large{padding:10px 20px;font-size:14px}.btn-primary{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.btn-primary:not(:disabled):hover{background:var(--primary-hover);border-color:var(--primary-hover)}.btn-secondary{background:#3c3c3c;color:#ccc;border-color:#3c3c3c}.btn-secondary:not(:disabled):hover{background:#4c4c4c;border-color:#4c4c4c}.btn-danger{background:#c72e0f;color:#fff;border-color:#c72e0f}.btn-danger:not(:disabled):hover{background:#e03e0f;border-color:#e03e0f}.btn-ghost{background:transparent;color:#ccc;border-color:#3c3c3c}.btn-ghost:not(:disabled):hover{background:#2a2a2a;border-color:#4c4c4c}.pro-upgrade-modal{display:flex;flex-direction:column;gap:24px;flex:1;min-height:0;overflow-y:auto}.pro-upgrade-header{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:8px 0}.pro-upgrade-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:999px;color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 4px 12px #667eea4d}.pro-upgrade-title{margin:0;font-size:28px;font-weight:700;color:var(--text-primary);line-height:1.2}.pro-upgrade-description{margin:0;font-size:15px;color:var(--text-secondary);line-height:1.5;max-width:560px}.pro-upgrade-highlight{display:flex;gap:16px;padding:20px;background:linear-gradient(135deg,#667eea14,#764ba214);border:1px solid rgba(102,126,234,.2);border-radius:12px}.pro-upgrade-highlight-icon{flex-shrink:0;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:10px;box-shadow:0 4px 12px #667eea40}.pro-upgrade-highlight-content{flex:1;display:flex;flex-direction:column;gap:6px}.pro-upgrade-highlight-title{margin:0;font-size:16px;font-weight:600;color:var(--text-primary)}.pro-upgrade-highlight-text{margin:0;font-size:13px;line-height:1.5;color:var(--text-secondary)}.pro-upgrade-features{display:flex;flex-direction:column;gap:16px}.pro-upgrade-features-title{margin:0;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary)}.pro-upgrade-features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.pro-upgrade-feature-item{display:flex;gap:12px;padding:14px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;transition:all .2s ease}.pro-upgrade-feature-item:hover{background:var(--bg-tertiary);border-color:#667eea4d}.pro-upgrade-feature-icon{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea1f,#764ba21f);color:#667eea;border-radius:8px}.pro-upgrade-feature-content{flex:1;display:flex;flex-direction:column;gap:2px}.pro-upgrade-feature-label{font-size:13px;font-weight:600;color:var(--text-primary)}.pro-upgrade-feature-description{font-size:12px;color:var(--text-secondary);line-height:1.4}.pro-upgrade-footer{display:flex;flex-direction:column;gap:16px;padding-top:8px;border-top:1px solid var(--border-color)}.pro-upgrade-footer-info{text-align:center}.pro-upgrade-coming-soon{margin:0;font-size:13px;color:var(--text-secondary);line-height:1.5}.pro-upgrade-footer-actions{display:flex;gap:12px;justify-content:center}.pro-upgrade-footer-actions .button{min-width:140px}.pro-upgrade-footer-actions .button-primary{background:linear-gradient(135deg,#667eea,#764ba2);border:none;box-shadow:0 4px 12px #667eea4d}.pro-upgrade-footer-actions .button-primary:hover:not(:disabled){box-shadow:0 6px 20px #667eea66}.pro-upgrade-footer-actions .button-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.segmented-control{display:flex;gap:.25em;padding:4px;background-color:#0003;border-radius:.3em}.segmented-control button{background:transparent;border:none;color:#8c8c8c;padding:4px 6px;cursor:pointer;border-radius:.2em;display:flex;align-items:center;justify-content:center;transition:background-color .15s,color .15s}.segmented-control button:hover{background:#3e3e42;color:#ccc}.segmented-control button.active{background:var(--primary-color);color:#fff}.topbar{display:flex;align-items:center;justify-content:space-between;height:100%;padding:0 1rem;gap:1rem}.topbar-logo{width:24px;height:24px;border-radius:6px;background-color:var(--primary-color)}.topbar-left{display:flex;align-items:center;gap:.75rem}.topbar-title{margin:0;font-size:14px;font-weight:600;color:#fff}.topbar-badge{font-size:11px;padding:2px 8px;background:var(--primary-hover);border-radius:3px;color:#fff;line-height:1.7}.topbar-badge-bordered{font-size:11px;padding:2px 8px;border:1px solid var(--primary-hover);border-radius:3px;color:var(--primary-hover);background-color:var(--bg-primary);line-height:1.7}.topbar-divider{width:1px;height:20px;background:#3c3c3c;margin:0 4px}.topbar-workspace-btn{display:flex;align-items:center;gap:8px;background:transparent;border:1px solid #3c3c3c;color:#ccc;padding:4px 12px;font-size:12px;border-radius:3px;cursor:pointer;transition:all .15s}.topbar-workspace-btn:hover{background:#2a2a2a;border-color:var(--primary-color);color:#fff}.topbar-workspace-btn svg{flex-shrink:0}.topbar-workspace-btn span{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar-upgrade-btn{display:flex;align-items:center;gap:6px;background:linear-gradient(135deg,#667eea,#764ba2);border:none;color:#fff;padding:4px 12px;font-size:12px;font-weight:600;border-radius:3px;cursor:pointer;transition:all .2s;box-shadow:0 2px 8px #667eea4d}.topbar-upgrade-btn:hover{box-shadow:0 4px 12px #667eea66}.topbar-upgrade-btn svg{flex-shrink:0}.topbar-center{display:flex;gap:.5rem}.topbar-right{display:flex;align-items:center;gap:.5rem}.topbar-tutorial-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--primary-color);background:color-mix(in srgb,var(--primary-color) 10%,transparent);color:var(--text-primary);border-radius:999px;padding:2px 8px;max-width:360px}.topbar-tutorial-chip-label{font-size:11px;max-width:160px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-tutorial-chip-progress{font-size:10px;color:var(--text-secondary)}.topbar-tutorial-chip{cursor:pointer}.topbar-tutorial-chip-close{border:none;background:transparent;color:var(--text-secondary);font-size:10px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;padding:0;margin-right:-4px;cursor:pointer}.topbar-tutorial-chip-close:hover{background:color-mix(in srgb,var(--primary-color) 18%,transparent);color:var(--text-primary)}.topbar-btn,.topbar-btn-primary{text-decoration:none}.topbar-btn{background:transparent;border:1px solid #3c3c3c;color:#ccc;padding:4px 12px;font-size:12px;border-radius:3px;cursor:pointer;transition:background .15s}.topbar-btn:hover{background:#2a2a2a}.topbar-btn-primary{background:var(--primary-color);border:none;color:#fff;padding:4px 16px;font-size:12px;font-weight:500;border-radius:3px;cursor:pointer;transition:background .15s}.topbar-btn-primary:hover{background:var(--primary-hover)}.topbar-tutorial-chip{margin-right:14px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:32px;text-align:center}.empty-state-icon{opacity:.6;margin-bottom:12px;color:var(--color-text-primary)}.empty-state-title{font-size:13px;color:var(--color-text-primary);margin:0 0 8px;font-weight:600}.empty-state-description{font-size:12px;color:var(--color-text-secondary);margin:0 0 16px}.empty-state-action{color:var(--color-primary);cursor:pointer;text-decoration:underline;font-size:13px;margin-top:4px}.empty-state-action:hover{opacity:.8}.empty-state-upgrade{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:6px;color:#fff;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 2px 8px #667eea4d}.empty-state-upgrade:hover{box-shadow:0 4px 12px #667eea66}.collab-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.collab-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:26px}.collab-panel-title{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.collab-panel-content{flex:1;overflow-y:auto;min-height:0}.ai-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.ai-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:26px}.ai-panel-title{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.ai-panel-content{flex:1;overflow-y:auto;min-height:0}.file-tree{display:flex;flex-direction:column;height:100%;background:var(--bg-primary);overflow-y:auto}.file-tree-list{display:flex;flex-direction:column;padding:4px 0;flex:1}.file-tree-item{display:flex;align-items:center;padding:8px 16px;cursor:pointer;border-left:2px solid transparent;transition:all .15s ease;gap:8px}.file-tree-item:hover{background:var(--bg-secondary);border-left-color:var(--border-color)}.file-tree-item.active{background:var(--bg-secondary);border-left-color:var(--primary-color)}.file-tree-item.open{font-weight:500}.file-tree-item-icon{width:16px;height:16px;flex-shrink:0;color:var(--text-secondary)}.file-tree-item-name{flex:1;font-size:14px;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-tree-item-actions{display:none;gap:4px}.file-tree-item:hover .file-tree-item-actions{display:flex}.file-tree-item-action{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:2px;border-radius:3px;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.file-tree-item-action:hover{background:var(--bg-tertiary);color:var(--text-primary)}.file-tree-item-action.delete:hover{color:var(--danger-color)}.file-tree-new-file-btn{display:flex;align-items:center;gap:8px;padding:4px 12px;margin:1em;background:transparent;border:1px dashed var(--border-color);color:var(--text-secondary);cursor:pointer;border-radius:6px;font-size:13px;transition:all .15s ease;line-height:2}.file-tree-new-file-btn:hover{background:#007acc1a;border-color:var(--primary-color);color:var(--primary-color)}.input-wrapper{display:flex;flex-direction:column;gap:.5rem}.input-label{font-size:13px;font-weight:500;color:#ccc}.input{background:#3c3c3c;border:1px solid #3c3c3c;color:#ccc;padding:8px 12px;font-size:13px;font-family:inherit;border-radius:4px;transition:border-color .15s,background .15s}.input:focus{outline:none;border-color:var(--primary-color);background:#2a2a2a}.input::placeholder{color:#6c6c6c}.input-error{border-color:#f48771}.input-error:focus{border-color:#f48771}.input-error-text{font-size:12px;color:#f48771}.input-helper-text{font-size:12px;color:#8c8c8c}.template-card{display:flex;flex-direction:column;gap:6px;padding:8px;background:#2d2d30;border:1px solid #3e3e42;border-radius:6px;cursor:pointer;transition:border-color .15s,background .15s;text-align:left;color:inherit;font-family:inherit;width:100%}.template-card:not(.template-card--selected):hover{border-color:#505050;background:#333337}.template-card--selected{border-color:var(--primary-color);background:var(--alternative-color)}.template-card:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px}.template-card__thumbnail-wrapper{position:relative;width:100%}.template-card__thumbnail{width:100%;height:110px;background:#1e1e1e;border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:11px;color:#858585;border:1px solid #3e3e42;overflow:hidden}.template-card__thumbnail-image{width:100%;height:100%;object-fit:cover}.template-card__name{font-size:12px;font-weight:500;color:#ccc;margin:0}.template-card__description{font-size:11px;color:#858585;margin:0;line-height:1.3}.template-card__preview{position:fixed;transform:translateY(-100%);width:280px;background:#1e1e1e;border:1px solid #555;border-radius:6px;box-shadow:0 8px 24px #0009;overflow:hidden;z-index:9999;pointer-events:none;animation:template-preview-in .12s ease forwards}@keyframes template-preview-in{0%{opacity:0}to{opacity:1}}.template-card__preview-image{width:100%;height:auto;display:block}.create-file-modal-content{display:flex;flex-direction:column;gap:20px;flex:1;min-height:0;overflow:hidden}.create-file-form{display:flex;flex-direction:column;gap:16px;flex:1;min-height:0;overflow:hidden}.create-file-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:12px}.create-file-error{padding:12px;background:var(--danger-bg);border:1px solid var(--danger-color);border-radius:6px;color:var(--danger-color);font-size:14px}.template-selection{display:flex;flex-direction:column;gap:8px;flex:1;min-height:0;overflow:hidden}.template-selection-label{font-size:13px;font-weight:500;color:#ccc}.template-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;overflow-y:auto;flex:1;min-height:0;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;padding:8px;align-content:start}.tab-bar{display:flex;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);overflow-x:auto;overflow-y:hidden}.tab-bar::-webkit-scrollbar{height:6px}.tab-bar::-webkit-scrollbar-track{background:transparent}.tab-bar::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.tab-bar::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.tab{display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--bg-secondary);border-right:1px solid var(--border-color);cursor:pointer;min-width:180px;max-width:200px;transition:background .15s ease,color .15s ease;position:relative}.tab:hover{background:#37373d}.tab.active{background:var(--bg-primary);color:#fff}.tab.active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--primary-color);z-index:1}.tab-icon{flex-shrink:0;color:var(--text-secondary);transition:color .15s ease}.tab:hover .tab-icon{color:#ccc}.tab.active .tab-icon{color:var(--primary-color)}.tab-name{flex:1;font-size:13px;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tab-close{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:background .15s ease,color .15s ease;flex-shrink:0;opacity:0}.tab:hover .tab-close,.tab.active .tab-close{opacity:1}.tab-close:hover{background:#ffffff1a;color:#fff}} .tab-close:hover{background:var(--bg-tertiary);color:var(--text-primary)}.tab-close svg{width:12px;height:12px}.tab-bar-empty{padding:10px 16px;font-size:13px;color:var(--text-secondary);font-style:italic}.export-modal{display:flex;flex-direction:column;gap:0}.export-body{display:flex;gap:0;min-height:300px;margin-bottom:1.5em}.export-col{display:flex;flex-direction:column;gap:12px;padding:0 20px 20px}.export-col--screens{width:200px;flex-shrink:0}.export-col--settings{flex:1;min-width:0;gap:16px}.export-divider{width:1px;background:#2d2d30;flex-shrink:0}.export-col-label{margin:0;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:#6e6e6e}.export-seg-group{display:flex;gap:2px;background:#1e1e1e;border:1px solid #3e3e42;border-radius:6px;padding:3px}.export-seg{flex:1;padding:4px 10px;border:none;border-radius:4px;background:transparent;color:#9d9d9d;font-size:12px;cursor:pointer;transition:background .1s,color .1s;white-space:nowrap}.export-seg:hover:not(:disabled){color:#ccc;background:#ffffff0d}.export-seg--active{background:var(--alternative-color);color:#fff}.export-seg--active:hover:not(:disabled){background:var(--alternative-color)}.export-seg:disabled{opacity:.4;cursor:default}.export-seg--icon{display:inline-flex;align-items:center;justify-content:center;gap:5px}.export-screens-area{flex:1;min-height:0;display:flex;flex-direction:column}.export-active-screen{display:flex;align-items:center;padding:8px 10px;background:#1e1e1e;border:1px solid #3e3e42;border-radius:6px;font-size:13px}.export-active-screen-name{color:#ccc}.export-active-screen-empty{color:#5a5a5a;font-style:italic;font-size:12px}.export-screen-list{display:flex;flex-direction:column;gap:6px;flex:1;min-height:0}.export-screen-list-actions{display:flex;align-items:center;gap:6px}.export-link-btn{background:none;border:none;color:var(--primary-color);font-size:11px;cursor:pointer;padding:0}.export-link-btn:hover:not(:disabled){text-decoration:underline}.export-link-btn:disabled{opacity:.4;cursor:default}.export-link-sep{color:#555;font-size:11px}.export-screen-items{display:flex;flex-direction:column;gap:1px;max-height:200px;overflow-y:auto;border:1px solid #3e3e42;border-radius:6px;padding:4px;background:#1a1a1a}.export-screen-items--readonly{pointer-events:none}.export-screen-item{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:4px;cursor:pointer;font-size:12px;color:#ccc;transition:background .1s}.export-screen-item:hover{background:#252526}.export-screen-item--all{opacity:.7}.export-screen-hidden-input{display:none}.export-screen-checkbox{width:14px;height:14px;border:1px solid #555;border-radius:3px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;transition:background .1s,border-color .1s}.export-screen-checkbox--checked{background:var(--primary-color);border-color:var(--primary-color)}.export-screen-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.export-screens-count{font-size:11px;color:#5a5a5a;margin-top:auto}.export-format-cards{display:flex;gap:6px}.export-format-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:64px;height:64px;border:1px solid #3e3e42;border-radius:8px;background:#1e1e1e;color:#9d9d9d;font-size:11px;font-weight:500;cursor:pointer;transition:background .12s,border-color .12s,color .12s;position:relative}.export-format-card:hover:not(:disabled){background:#252526;border-color:var(--primary-color);color:#ccc}.export-format-card--active{background:var(--alternative-active);border-color:var(--primary-color);color:#fff}.export-format-card--active:hover:not(:disabled){background:var(--alternative-hover)}.export-format-card:disabled{cursor:default}.export-format-card--soon{opacity:.35;border-style:dashed}.export-format-card--soon:after{content:"Pro";position:absolute;top:-7px;right:-4px;font-size:8px;font-weight:700;letter-spacing:.04em;background:#4a3f6b;color:#c084fc;border-radius:3px;padding:1px 4px;line-height:1.4}.export-options{display:flex;flex-direction:column;gap:10px;padding:14px;background:#1a1a1a;border:1px solid #2d2d30;border-radius:8px}.export-option-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.export-option-label{font-size:12px;color:#858585;white-space:nowrap;min-width:72px}.export-dimension-input{flex:1;max-width:120px;padding:5px 10px;background:#1e1e1e;border:1px solid #3e3e42;border-radius:4px;color:#ccc;font-size:12px;font-family:monospace;text-align:right}.export-dimension-input:focus{outline:none;border-color:var(--alternative-color)}.export-dimension-input:disabled{opacity:.5;cursor:not-allowed}.export-dimension-input::placeholder{color:#6e6e6e}.export-error{margin:0 20px;padding:10px 12px;background:#f4433614;border:1px solid rgba(244,67,54,.4);border-radius:6px;color:#f98080;font-size:12px}.export-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-top:1px solid #2d2d30;background:#161616;border-radius:0 0 8px 8px}.export-footer-info{display:flex;align-items:center;gap:6px;overflow:hidden;min-width:0}.export-footer-label{font-size:12px;color:#6e6e6e;white-space:nowrap}.export-footer-filename{font-size:12px;color:#ccc;font-family:monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.export-footer-filename--zip{color:#4ec9b0}.export-progress{font-size:12px;color:#858585}.export-footer-actions{display:flex;gap:8px;flex-shrink:0}.explorer-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.explorer-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:26px}.explorer-panel-title{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.explorer-panel-header-btn{display:inline-flex;align-items:center;justify-content:center;padding:4px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;transition:color .15s,border-color .15s}.explorer-panel-header-btn:hover{color:var(--text-primary);border-color:var(--primary-color)}.explorer-panel-content{flex:1;overflow-y:auto;min-height:0}.screens-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.screens-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:26px}.screens-panel-title{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.screens-panel-header-btn{display:inline-flex;align-items:center;justify-content:center;padding:4px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;transition:color .15s,border-color .15s}.screens-panel-header-btn:hover{color:var(--text-primary);border-color:var(--primary-color)}.screens-panel-content{flex:1;overflow-y:auto;min-height:0}.screens-grid{display:grid;grid-template-columns:1fr;gap:8px}.screen-card{display:flex;flex-direction:column;gap:5px;cursor:pointer;border-radius:6px;padding:4px;transition:background .1s;background:transparent;border:none;text-align:left}.screen-card:hover{background:var(--bg-tertiary)}.screen-card-active .screen-card-thumbnail{outline:2px solid var(--primary-color);outline-offset:1px}.screen-card-thumbnail{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:4px;overflow:hidden;background:var(--bg-secondary);border:1px solid var(--border-color)}.screen-card-thumbnail img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.screen-card-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:var(--text-secondary)}.screen-card-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:#00000073;color:var(--text-secondary);font-size:10px;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}.screen-card-spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.15);border-top-color:#ffffffb3;border-radius:50%;animation:thumbnail-spin .75s linear infinite}@keyframes thumbnail-spin{to{transform:rotate(360deg)}}.screen-card-name{font-size:11px;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}.screen-card-active .screen-card-name{color:var(--primary-color)}.settings-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.settings-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:26px}.settings-panel-title-header{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.settings-panel-content{flex:1;overflow-y:auto;min-height:0;display:flex;flex-direction:column;gap:12px}.settings-empty-state{padding:12px;border:1px dashed var(--border-color);border-radius:6px;background:var(--bg-secondary)}.settings-feature-badge{display:inline-flex;align-items:center;padding:1px 5px;border-radius:3px;font-size:9px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#c9a227;background:#c9a2271f;border:1px solid rgba(201,162,39,.3);vertical-align:middle;margin-left:5px;line-height:1.4;-webkit-user-select:none;user-select:none}.settings-empty-state p{margin:0;font-size:12px;color:var(--text-secondary)}.settings-section{display:flex;flex-direction:column;gap:12px;padding:12px;border:1px solid var(--border-color);border-radius:8px;background:var(--bg-secondary)}.settings-section-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.settings-section-title{margin:0;font-size:13px;font-weight:600;color:var(--text-primary)}.settings-section-scope{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--primary-color);background:color-mix(in srgb,var(--primary-color) 14%,transparent);border:1px solid color-mix(in srgb,var(--primary-color) 45%,transparent);padding:1px 6px;border-radius:999px}.settings-field{display:flex;flex-direction:column;gap:6px}.settings-label{font-size:12px;font-weight:600;color:var(--text-primary)}.settings-select{width:100%;border:1px solid var(--border-color);background:var(--bg-tertiary);color:var(--text-primary);border-radius:6px;padding:8px 10px;font-size:13px}.settings-select:focus{outline:none;border-color:var(--primary-color)}.settings-help{margin:0;font-size:12px;color:var(--text-secondary)}.settings-checkbox-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--text-primary);cursor:pointer}.settings-checkbox{width:14px;height:14px;margin:0;accent-color:var(--primary-color)}.settings-save-state{margin:0;font-size:11px;color:var(--text-secondary)}.settings-save-state-saving{color:var(--text-secondary)}.settings-save-state-saved{color:var(--success-color, #4caf50)}.settings-save-state-error{color:var(--danger-color)}.settings-bg-swatches{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.settings-bg-swatch{width:28px;height:28px;border-radius:4px;border:2px solid var(--border-color);cursor:pointer;transition:border-color .15s,transform .1s;flex-shrink:0;padding:0}.settings-bg-swatch:hover{border-color:var(--text-secondary);transform:scale(1.08)}.settings-bg-swatch--active{border-color:var(--primary-color)!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--primary-color) 35%,transparent)}.settings-bg-swatch--dark{background:#141414}.settings-bg-swatch--light{background:#f0f0f0}.settings-bg-swatch--checkerboard{background-color:#888;background-image:repeating-conic-gradient(#666 0% 25%,#aaa 0% 50%);background-size:7px 7px}.settings-bg-swatch--color{background:linear-gradient(135deg,#f06,#6366f1,#06f)}.settings-bg-swatch--reset{background:var(--bg-secondary);border-style:dashed;font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.settings-bg-swatch--reset:before{content:"↩"}.settings-bg-color-input{width:28px;height:28px;border:2px solid var(--border-color);border-radius:4px;cursor:pointer;padding:0;background:transparent;flex-shrink:0}.settings-bg-color-input::-webkit-color-swatch-wrapper{padding:2px}.settings-bg-color-input::-webkit-color-swatch{border:none;border-radius:2px}.settings-accent-swatches{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.settings-accent-swatch{width:22px;height:22px;border-radius:50%;border:2px solid var(--border-color);cursor:pointer;padding:0;flex-shrink:0;background-color:var(--swatch-color);transition:border-color .15s,transform .1s,box-shadow .15s}.settings-accent-swatch:hover{border-color:var(--text-secondary);transform:scale(1.12)}.settings-accent-swatch--active{border-color:var(--text-primary)!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--swatch-color) 50%,transparent);transform:scale(1.08)}.components-panel{display:flex;flex-direction:column;height:100%;min-height:0;background:var(--bg-secondary)}.components-panel-search{padding:8px;border-bottom:1px solid var(--color-border);background:var(--bg-tertiary)}.components-panel-search-input{width:100%;height:32px;border:1px solid var(--border-color);border-radius:4px;background:var(--bg-secondary);color:var(--text-primary);padding:0 10px;font-size:13px}.components-panel-search-input::placeholder{color:var(--text-secondary)}.components-panel-search-input:focus{outline:1px solid var(--primary-color);outline-offset:0}.components-panel-group{flex:1;min-height:0}.components-stack-section{display:flex;flex-direction:column;height:100%;overflow:hidden}.components-stack-header{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:600;color:#8c8c8c;padding:4px 12px;background:var(--bg-tertiary);border-bottom:1px solid var(--border-color);height:40px}.components-stack-content{flex:1;min-height:0;overflow-y:auto;background:var(--bg-secondary);display:flex;flex-direction:column}.components-split-separator{height:4px;background:transparent;cursor:row-resize;transition:background-color .2s}.components-split-separator:hover{background:var(--primary-color)}.components-list{display:flex;flex-direction:column;gap:6px;padding:8px;background:var(--bg-primary);flex:1}.components-item{border:1px solid #3e3e42;border-radius:6px;background:#252526;overflow:hidden}.components-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;cursor:pointer}.components-row:hover{background:#2d2d30}.components-row:focus-visible{outline:2px solid var(--primary-color);outline-offset:-2px}.components-row-main{min-width:0;display:flex;align-items:center;gap:8px}.components-row-chevron{color:var(--text-secondary);display:inline-flex;align-items:center}.components-row-icon{color:var(--text-secondary);flex-shrink:0}.components-row-title{font-size:13px;color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.components-row-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.components-row-action-btn{width:28px;height:28px;border:1px solid var(--border-color);border-radius:4px;background:var(--bg-tertiary);color:var(--text-tertiary);padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.components-row-action-btn:hover{background:var(--bg-secondary)}.components-row-action-btn:disabled{opacity:.45;cursor:not-allowed}.components-row-expanded-content{border-top:1px solid var(--border-color);padding:10px;display:flex;flex-direction:column;gap:8px}.components-row-thumbnail{width:100%;height:96px;border-radius:6px;border:1px solid var(--border-color);object-fit:cover}.components-row-description{margin:0;font-size:12px;color:var(--text-secondary);line-height:1.45}.components-row-code{margin:0;padding:8px;border-radius:6px;background:var(--bg-primary);border:1px solid var(--border-color);color:var(--text-primary);font-size:11px;line-height:1.4;white-space:pre-wrap;word-break:break-word;width:100%;resize:none;font-family:var(--font-mono, "Consolas", "Monaco", monospace);box-sizing:border-box;overflow-x:hidden;overflow-y:hidden}.components-row-code:focus{outline:none}.components-row-properties{border:1px solid #333;border-radius:6px;background:#1b1b1b}.components-row-properties-summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px}.components-row-properties-summary::-webkit-details-marker{display:none}.components-row-properties-title{margin:0;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#9aa0aa}.components-row-properties-count{font-size:11px;color:#9aa0aa}.components-row-properties-list{display:flex;flex-direction:column;gap:8px;padding:0 8px 8px}.components-row-property-item{border:1px solid #2c2c2c;border-radius:6px;background:#171717;padding:8px;display:flex;flex-direction:column;gap:4px}.components-row-property-main{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.components-row-property-name{font-size:12px;font-weight:600;color:#e0e0e0}.components-row-property-type{font-size:11px;color:#9aa0aa;border:1px solid #3a3a3a;border-radius:999px;padding:1px 6px}.components-row-property-flag{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:#88b9f7}.components-row-property-description{margin:0;font-size:11px;color:#a9a9a9;line-height:1.35}.components-row-property-meta{margin:0;font-size:11px;color:#b5b5b5}.components-row-property-meta code{font-family:var(--font-mono, "Consolas", "Monaco", monospace);color:#d8d8d8}@media(max-width:720px){.components-row{flex-direction:column;align-items:flex-start}.components-row-actions{width:100%;flex-wrap:wrap}}.account-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.account-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:26px}.account-panel-title{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.account-panel-content{flex:1;overflow-y:auto;min-height:0}.create-workspace-form{display:flex;flex-direction:column;gap:1.5rem}.create-workspace-actions{display:flex;justify-content:flex-end;gap:.75rem;margin-top:.5rem}.workspaces-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.workspaces-panel-header{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:26px}.workspaces-panel-title{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.workspaces-panel-header-actions{display:flex;align-items:center;gap:6px}.workspaces-panel-header-btn{display:inline-flex;align-items:center;justify-content:center;padding:4px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;transition:color .15s,border-color .15s}.workspaces-panel-header-btn:hover{color:var(--text-primary);border-color:var(--primary-color)}.workspaces-panel-header-btn:disabled{opacity:.5;cursor:not-allowed;border-color:var(--border-color)}.workspaces-panel-header-btn:disabled:hover{color:var(--text-secondary);border-color:var(--border-color)}.workspaces-settings-shortcut{display:inline-flex;align-items:center;justify-content:center;padding:4px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;transition:color .15s,border-color .15s}.workspaces-settings-shortcut:hover{color:var(--text-primary);border-color:var(--primary-color)}.workspaces-list{display:flex;flex-direction:column;gap:8px;overflow-y:auto;min-height:0}.workspaces-empty{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:10px;border:1px dashed var(--border-color);border-radius:6px;color:var(--text-secondary);font-size:12px}.workspaces-empty p{margin:0}.workspaces-item{display:flex;align-items:flex-start;gap:8px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-secondary);transition:background-color .15s ease,border-color .15s ease;padding:10px}.workspaces-item-active{border-color:var(--primary-color)}.workspaces-item:hover{background:var(--bg-tertiary)}.workspaces-item-open{border:none;background:transparent;text-align:left;padding:0;cursor:pointer;color:inherit;flex:1;min-width:0;display:block}.workspaces-item-name-row{display:flex;align-items:center;gap:6px}.workspaces-item-name{font-size:13px;font-weight:600;color:var(--text-primary)}.workspaces-item-badge{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--primary-color);background:color-mix(in srgb,var(--primary-color) 16%,transparent);border:1px solid color-mix(in srgb,var(--primary-color) 50%,transparent);padding:1px 5px;border-radius:999px}.workspaces-item-description{margin:6px 0 0;font-size:12px;line-height:1.35;color:var(--text-secondary);display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.workspaces-item-meta{margin-top:8px;display:flex;align-items:center;gap:6px;font-size:11px;color:var(--color-text-tertiary)}.workspaces-item-actions{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0}.workspaces-item-action{width:24px;height:24px;border:1px solid transparent;background:transparent;color:var(--text-secondary);border-radius:4px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease}.workspaces-item-action:hover{color:var(--text-primary);background:var(--bg-primary);border-color:var(--border-color)}.workspaces-item-action-delete:hover{color:var(--danger-color);border-color:var(--danger-color);background:color-mix(in srgb,var(--danger-color) 10%,transparent)}.workspaces-item-action:disabled{opacity:.4;cursor:not-allowed}.workspaces-item-action:disabled:hover{color:var(--text-secondary);background:transparent;border-color:transparent}.help-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.help-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:26px}.help-panel-title-header{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.help-panel-content{flex:1;overflow-y:auto;min-height:0;display:flex;flex-direction:column;gap:12px}.help-panel-section{border:1px solid var(--border-color);background:var(--bg-secondary);border-radius:6px;padding:10px}.help-panel-title{margin:0 0 8px;font-size:12px;font-weight:600;color:var(--text-primary)}.help-panel-list,.help-panel-links,.help-panel-steps{margin:0;padding-left:18px;font-size:12px;color:var(--text-secondary);display:flex;flex-direction:column;gap:6px}.help-panel-links a{color:var(--primary-color);text-decoration:none}.help-panel-links a:hover{text-decoration:underline}.help-panel-shortcuts-button{margin-top:10px;border:1px solid var(--border-color);background:var(--bg-primary);color:var(--text-primary);border-radius:6px;padding:6px 10px;font-size:12px;cursor:pointer}.help-panel-shortcuts-button:hover{border-color:var(--primary-color);color:var(--primary-color)}.help-panel-version{padding:8px 10px;margin-top:auto;border:none;background:transparent}.help-panel-version-text{margin:0;font-size:11px;color:var(--text-secondary);text-align:center}.help-panel-version-number{font-weight:600;color:var(--text-primary);font-family:monospace}.help-panel-guide-groups{display:flex;flex-direction:column;gap:10px}.help-panel-guide-group{border:1px solid var(--border-color);background:var(--bg-primary);border-radius:6px;padding:8px}.help-panel-guide-area{margin:0 0 6px;font-size:12px;font-weight:600;color:var(--text-primary)}.help-panel-faq-list{display:flex;flex-direction:column;gap:8px}.help-panel-faq-item{border:1px solid var(--border-color);border-radius:6px;background:var(--bg-primary);padding:8px}.help-panel-faq-item summary{cursor:pointer;font-size:12px;font-weight:600;color:var(--text-primary)}.help-panel-faq-item p{margin:8px 0 0;font-size:12px;color:var(--text-secondary)}.tutorials-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.tutorials-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:26px}.tutorials-panel-title{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.tutorials-panel-content{flex:1;overflow-y:auto;min-height:0;display:flex;flex-direction:column;gap:12px}.tutorials-panel-section{border:1px solid var(--border-color);background:var(--bg-secondary);border-radius:6px;padding:10px}.tutorials-panel-section-title{margin:0;font-size:12px;font-weight:600;color:var(--text-primary)}.tutorials-panel-section-subtitle{margin:6px 0 0;font-size:12px;color:var(--text-secondary)}.tutorials-panel-list{display:flex;flex-direction:column;gap:8px;margin-top:10px}.tutorials-panel-list-item{border:1px solid var(--border-color);border-radius:6px;background:var(--bg-primary);color:var(--text-primary);text-align:left;padding:8px;cursor:pointer}.tutorials-panel-mode-chip{display:inline-flex;margin-top:8px;font-size:10px;color:var(--text-secondary);border:1px solid var(--border-color);border-radius:999px;padding:2px 8px}.tutorials-panel-list-item-active{border-color:var(--primary-color)}.tutorials-panel-list-item-header,.tutorials-panel-list-item-meta,.tutorials-panel-progress-row,.tutorials-panel-detail-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.tutorials-panel-detail-content{margin-top:10px}.tutorials-panel-back-button{border:1px solid var(--border-color);border-radius:6px;background:var(--bg-primary);color:var(--text-primary);padding:6px 8px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:12px}.tutorials-panel-list-item-header{font-size:12px;font-weight:600}.tutorials-panel-list-item-meta{margin-top:6px;font-size:11px;color:var(--text-secondary)}.tutorials-panel-detail-title{margin:0;font-size:12px;font-weight:600;color:var(--text-primary)}.tutorials-panel-detail-description{margin:6px 0 0;font-size:12px;color:var(--text-secondary)}.tutorials-panel-detail-mode{margin:6px 0 0;font-size:11px;color:var(--text-secondary)}.tutorials-panel-reset-button{border:1px solid var(--border-color);border-radius:6px;background:var(--bg-primary);color:var(--text-primary);padding:6px 8px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:12px}.tutorials-panel-progress-wrap{margin-top:10px}.tutorials-panel-progress-row{font-size:11px;color:var(--text-secondary)}.tutorials-panel-progress-bar{margin-top:6px;height:6px;border-radius:999px;background:var(--bg-primary);border:1px solid var(--border-color);overflow:hidden}.tutorials-panel-progress-fill{height:100%;background:var(--primary-color)}.tutorials-panel-steps{margin:10px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:8px}.tutorials-panel-step-button{width:100%;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-primary);color:var(--text-primary);padding:8px;text-align:left;display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:12px}.tutorials-panel-step-button:disabled{cursor:not-allowed;opacity:.6}.tutorials-panel-step-button-completed{border-color:color-mix(in srgb,var(--primary-color) 65%,var(--border-color));color:var(--primary-color)}.tutorials-panel-note{display:flex;align-items:flex-start;gap:8px;margin-top:12px;border:1px solid var(--border-color);background:var(--bg-primary);border-radius:6px;padding:8px}.tutorials-panel-note p{margin:0;font-size:12px;color:var(--text-secondary)}.github-panel{display:flex;flex-direction:column;gap:12px;height:100%;padding:12px;background:var(--bg-primary)}.github-panel-header{display:flex;align-items:center;justify-content:space-between;min-height:26px}.github-panel-title{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.github-panel-content{flex:1;overflow-y:auto;min-height:0;display:flex;flex-direction:column;gap:10px}.github-panel-connect-section{display:flex;flex-direction:column;align-items:center;gap:14px;padding:24px 8px;text-align:center}.github-panel-icon-wrap{color:var(--text-secondary);opacity:.6}.github-panel-description{margin:0;font-size:12px;color:var(--text-secondary);line-height:1.5}.github-panel-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 12px;border-radius:6px;font-size:12px;cursor:pointer;border:none;transition:opacity .15s;width:100%}.github-panel-btn:disabled{opacity:.45;cursor:not-allowed}.github-panel-btn-primary{background:var(--primary-color, #6366f1);color:#fff}.github-panel-btn-primary:not(:disabled):hover{opacity:.88}.github-panel-btn-secondary{background:var(--color-bg-secondary, rgba(255,255,255,.06));color:var(--color-text-primary, inherit);border:1px solid var(--color-border, rgba(255,255,255,.1))}.github-panel-btn-secondary:not(:disabled):hover{background:var(--color-bg-hover, rgba(255,255,255,.1))}.github-panel-label{margin:0;font-size:12px;color:var(--text-secondary)}.github-panel-search{width:100%;padding:5px 8px;font-size:12px;background:var(--color-bg-secondary, rgba(255,255,255,.06));border:1px solid var(--color-border, rgba(255,255,255,.1));border-radius:4px;color:inherit;box-sizing:border-box}.github-panel-search:focus{outline:none;border-color:var(--primary-color, #6366f1)}.github-panel-repo-list{display:flex;flex-direction:column;gap:2px;max-height:220px;overflow-y:auto}.github-panel-repo-item{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:4px;cursor:pointer;font-size:12px;border:1px solid transparent;color:var(--color-text-primary, inherit);background:transparent;text-align:left;width:100%}.github-panel-repo-item:hover{background:var(--color-bg-hover, rgba(255,255,255,.06))}.github-panel-repo-item-selected{border-color:var(--primary-color, #6366f1);background:var(--color-bg-secondary, rgba(255,255,255,.04))}.github-panel-repo-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.github-panel-repo-badge{font-size:10px;padding:1px 5px;border-radius:3px;background:var(--color-bg-secondary, rgba(255,255,255,.08));color:var(--text-secondary);flex-shrink:0}.github-panel-repo-check{color:var(--primary-color, #6366f1);flex-shrink:0}.github-panel-create-repo{display:flex;flex-direction:column;gap:8px;padding:10px;background:var(--color-bg-secondary, rgba(255,255,255,.03));border:1px solid var(--color-border, rgba(255,255,255,.1));border-radius:6px}.github-panel-create-repo-title{margin:0;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary)}.github-panel-private-toggle{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none}.github-panel-private-toggle input[type=checkbox]{cursor:pointer;accent-color:var(--primary-color, #6366f1)}.github-panel-divider{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--text-secondary);opacity:.6}.github-panel-divider:before,.github-panel-divider:after{content:"";flex:1;height:1px;background:var(--color-border, rgba(255,255,255,.1))}.github-panel-repo-badge{display:flex;align-items:center;gap:6px;padding:6px 8px;background:var(--color-bg-secondary, rgba(255,255,255,.04));border:1px solid var(--color-border, rgba(255,255,255,.1));border-radius:6px;font-size:12px;color:var(--color-text-primary, inherit);overflow:hidden}.github-panel-conflict{display:flex;align-items:flex-start;gap:6px;padding:8px 10px;background:#eab30814;border:1px solid rgba(234,179,8,.4);border-radius:6px;font-size:12px;color:var(--color-text-primary, inherit);line-height:1.4}.github-panel-conflict svg{flex-shrink:0;color:#eab308;margin-top:1px}.github-panel-success{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--color-success, #22c55e)}.github-panel-success a{color:inherit;text-decoration:underline}.github-panel-sync-actions{display:flex;flex-direction:column;gap:6px}.github-panel-status-text{margin:0;font-size:11px;color:var(--text-secondary)}.github-panel-error{margin:0;font-size:12px;color:var(--color-error, #ef4444)}.github-panel-disconnect-btn{margin-top:auto;display:flex;align-items:center;gap:5px;font-size:11px;color:var(--text-secondary);background:none;border:none;cursor:pointer;padding:4px 0}.github-panel-disconnect-btn:hover{color:var(--color-error, #ef4444)}@keyframes github-panel-spin{to{transform:rotate(360deg)}}.github-panel-spin{animation:github-panel-spin 1s linear infinite}.activity-bar{display:flex;height:100%;background:var(--color-bg-primary)}.activity-bar-icons{width:48px;display:flex;flex-direction:column;justify-content:space-between;background:var(--color-bg-tertiary);border-right:1px solid var(--color-border);flex-shrink:0;overflow:hidden}.activity-bar-icon-group{display:flex;flex-direction:column;align-items:center;gap:10px}.activity-bar-icon-group-top{overflow-y:auto;overflow-x:hidden}.activity-bar-icon-group-bottom{padding-top:8px}.activity-bar-button{width:45px;height:45px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:4px;color:var(--color-text-secondary);cursor:pointer;transition:background .1s,color .1s;position:relative}.activity-bar-badge{position:absolute;top:4px;right:4px;min-width:18px;height:14px;border-radius:999px;background:var(--primary-color);color:#fff;font-size:9px;line-height:14px;text-align:center;padding:0 4px;font-weight:600}.activity-bar-badge-dot{position:absolute;top:5px;right:5px;width:8px;height:8px;border-radius:50%;background:var(--primary-color)}.activity-bar-button:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.activity-bar-button-active{color:var(--text-primary)!important}.activity-bar-button-active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--primary-color)}.activity-bar-content{flex:1;overflow:hidden;display:flex;flex-direction:column;position:relative}.activity-bar-resume-overlay{position:absolute;left:10px;right:10px;bottom:10px;background:var(--bg-secondary);border:1px solid var(--primary-color);border-radius:8px;padding:10px;z-index:5;box-shadow:0 4px 14px #0003}.activity-bar-resume-overlay p{margin:0;font-size:12px;color:var(--text-primary)}.activity-bar-resume-overlay-actions{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}.activity-bar-resume-overlay-actions button{border:1px solid var(--border-color);background:var(--bg-primary);color:var(--text-primary);font-size:11px;border-radius:6px;padding:4px 8px;cursor:pointer}.activity-bar-resume-overlay-actions button:hover{border-color:var(--primary-color);color:var(--primary-color)}.wire-tooltip{min-width:200px;max-width:340px;padding:8px 10px;font-family:inherit;font-size:13px;line-height:1.5;color:var(--text-primary);background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:3px;box-shadow:0 4px 16px #00000080}.cm-tooltip{border:none!important;background:transparent!important;padding:0!important;border-radius:3px!important;display:flex;flex-direction:column;gap:8px}.cm-tooltip li{background:var(--bg-tertiary)}.wire-tooltip__header{display:flex;align-items:center;gap:6px;margin-bottom:5px}.wire-tooltip__title{font-size:13px;font-weight:600;color:var(--text-primary);font-family:Consolas,Monaco,Courier New,monospace}.wire-tooltip__badge{font-size:10px;font-weight:600;padding:1px 5px;border-radius:2px;text-transform:uppercase;letter-spacing:.04em}.wire-tooltip__badge--component{background:#007acc26;color:#75beff;border:1px solid rgba(0,122,204,.3)}.wire-tooltip__badge--layout{background:#4ec9b01f;color:#4ec9b0;border:1px solid rgba(78,201,176,.25)}.wire-tooltip__desc{margin:0 0 5px;color:var(--text-secondary);font-size:12px;line-height:1.5}.wire-tooltip__section{margin-top:6px}.wire-tooltip__section+.wire-tooltip__section{margin-top:6px;padding-top:6px;border-top:1px solid var(--border-color)}.wire-tooltip__section-label{display:block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary);margin-bottom:4px}.wire-tooltip__props{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px}.wire-tooltip__prop{display:flex;align-items:baseline;gap:5px;font-size:12px;flex-wrap:wrap}.wire-tooltip__code{font-family:Consolas,Monaco,Courier New,monospace;font-size:12px;color:#9cdcfe}.wire-tooltip__prop-type{color:var(--color-text-secondary);font-size:11px;font-family:Consolas,Monaco,Courier New,monospace}.wire-tooltip__prop-desc{color:var(--text-primary);font-size:11px}.wire-tooltip__required{font-size:10px;font-weight:600;color:var(--danger-text);background:var(--danger-bg);padding:0 4px;border-radius:2px;margin-left:3px;text-transform:uppercase;letter-spacing:.03em}.wire-tooltip__req-list{margin:0;font-size:12px;display:flex;flex-wrap:wrap;gap:4px}.wire-tooltip__more{font-size:11px;color:var(--color-text-tertiary);list-style:none;padding-top:2px;font-style:italic}.wire-tooltip__example{margin:0;padding:6px 8px;background:var(--bg-primary);border-radius:2px;border:1px solid var(--border-color);overflow-x:auto}.wire-tooltip__example code{font-family:Consolas,Monaco,Courier New,monospace;font-size:11px;color:var(--text-secondary);white-space:pre}.code-editor{width:100%;height:100%;overflow:auto}.code-editor .cm-editor{height:100%;font-size:14px;font-family:Consolas,Monaco,Courier New,monospace}.code-editor .cm-scroller{overflow:auto}.code-editor .cm-content{padding:16px 0}.code-editor .cm-line{padding:0 16px}.code-editor .cm-gutters{background-color:#1e1e1e;border-right:1px solid #333333;color:#858585}.code-editor .cm-activeLineGutter{background-color:#2a2a2a}.code-diff-viewer{width:100%;height:100%;background:var(--bg-primary)}.code-diff-viewer .cm-mergeView{height:100%;overflow:auto;border-radius:6px}.code-diff-viewer .cm-editor{font-size:13px;font-family:Consolas,Monaco,Courier New,monospace}.welcome-placeholder{display:flex;align-items:center;justify-content:center;height:100%;width:100%;padding:32px;cursor:default;-webkit-user-select:none;user-select:none;transition:background-color .2s ease}.welcome-placeholder:active{background-color:var(--color-bg-secondary)}.welcome-container{display:flex;flex-direction:column;align-items:center;max-width:420px;text-align:center}.welcome-logo{margin-bottom:24px;color:var(--color-text-secondary);opacity:.6}.welcome-logo img{width:256px;height:256px;filter:grayscale(1) brightness(.3)}.welcome-title{font-size:16px;font-weight:600;color:var(--color-text-primary);margin:0 0 8px}.welcome-subtitle{font-size:13px;color:var(--color-text-secondary);margin:0 0 16px;line-height:1.4}.welcome-hint{padding:12px 16px;background-color:var(--color-bg-secondary);border-radius:6px;margin-bottom:20px;border:1px solid var(--color-border)}.welcome-hint-text{font-size:12px;color:var(--color-text-tertiary);margin:0;font-weight:500}.welcome-shortcuts{margin-top:16px;width:100%}.welcome-shortcuts-title{font-size:12px;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;margin:0 0 12px}.welcome-shortcuts-list{display:flex;flex-direction:column;gap:8px;list-style:none;padding:0;margin:0}.welcome-shortcut-item{display:flex;flex-direction:row;align-items:center;gap:8px;margin-bottom:8px;text-align:left;border-radius:4px;transition:background-color .2s ease}.welcome-shortcut-item:hover{background-color:var(--color-bg-secondary)}.welcome-shortcut-key{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 8px;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:4px;font-size:11px;font-weight:600;color:var(--text-primary);font-family:Consolas,Monaco,Courier New,monospace;box-shadow:0 1px 2px #0003}.welcome-shortcut-description{flex:1;font-size:13px;color:var(--text-primary);text-align:left}@media(max-width:600px){.welcome-container{max-width:100%}}.editor-panel{display:flex;flex-direction:column;height:100%;background:#1e1e1e}.editor-tabs{display:flex;background:#2d2d30;border-bottom:1px solid #333333;overflow-x:auto}.editor-tab{display:flex;align-items:center;gap:8px;background:transparent;border:none;color:#8c8c8c;padding:8px 12px;font-size:13px;cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}.editor-tab:hover{color:#ccc;background:#2a2a2a}.editor-tab-active{color:#fff;background:#1e1e1e;border-bottom-color:var(--primary-color)}.editor-tab-close{background:transparent;border:none;color:#8c8c8c;font-size:18px;line-height:1;padding:0;width:16px;height:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:3px}.editor-tab-close:hover{color:#fff;background:#5a5a5a}.editor-content{flex:1;overflow:hidden;background:#1e1e1e;display:flex;flex-direction:column}.editor-placeholder{flex:1;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--text-secondary);margin:0;font-family:Consolas,Monaco,Courier New,monospace}.svg-viewer{width:100%;height:100%;background:var(--bg-secondary);overflow:hidden;position:relative}.svg-viewer--bg-dark{background:#141414}.svg-viewer--bg-light{background:#f0f0f0}.svg-viewer--bg-checkerboard{background-color:#888;background-image:repeating-conic-gradient(#666 0% 25%,#aaa 0% 50%);background-size:14px 14px}.svg-viewer__error-banner{position:absolute;top:16px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;background:#cc7800f2;color:#fff;padding:8px 16px;border-radius:6px;font-size:13px;font-weight:500;z-index:20;box-shadow:0 2px 8px #0000004d;border:1px solid rgba(255,160,0,.5)}.svg-viewer__controls{position:absolute;top:16px;right:16px;display:flex;gap:4px;z-index:10;background:#2d2d30f2;padding:6px;border-radius:6px;border:1px solid #3c3c3c;box-shadow:0 2px 8px #0000004d}.svg-viewer__control-btn{background:#3c3c3c;border:none;color:#ccc;width:32px;height:32px;font-size:16px;font-weight:700;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}.svg-viewer__control-btn:hover{background:var(--primary-hover);color:#fff}.svg-viewer__control-btn:active{background:var(--primary-color)}.svg-viewer__wrapper{width:100%!important;height:100%!important;cursor:grab}.svg-viewer__wrapper:active{cursor:grabbing}.svg-viewer__wrapper.panning-disabled,.svg-viewer__wrapper.panning-disabled:active{cursor:default}.svg-viewer__wrapper.has-error{opacity:.6}.svg-viewer__content{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.svg-viewer__container{background:#fff;box-shadow:0 4px 12px #00000026;border-radius:4px;display:inline-block;overflow:hidden;margin:1em}.svg-viewer__container.with-separation{padding:1em}.svg-viewer__container.theme-light{background:#f8fafc;box-shadow:0 4px 12px #00000026}.svg-viewer__container.theme-dark{background:#0f172a;box-shadow:0 4px 12px #0000004d}.svg-viewer__container svg{display:block;max-width:100%;height:auto}.svg-viewer__drag-layers{position:relative}.svg-viewer__preview-layer{position:absolute;inset:0;pointer-events:none}.selection-overlay{border:2px solid var(--primary-color);border-radius:2px;box-shadow:0 0 0 1px #007acc33,0 0 8px #007acc4d;z-index:5}.breadcrumb{display:inline-flex;align-items:center;gap:8px;font-size:8px;color:var(--color-text-secondary);-webkit-user-select:none;user-select:none;min-width:0;overflow:visible;background:var(--bg-primary);border-radius:4px;padding:3px}.breadcrumb-wrapper{flex:1}.breadcrumb-item{padding:3px 8px;background:transparent;border:1px solid transparent;border-radius:4px;color:var(--color-text-secondary);white-space:nowrap;cursor:pointer;transition:all .15s ease;font-size:13px;font-family:inherit}.breadcrumb-item:hover:not(:disabled){background:var(--color-surface-tertiary);border-color:var(--color-border);color:var(--color-text-primary)}.breadcrumb-item-active{color:var(--color-text-primary);font-weight:500;background:var(--color-surface-tertiary)}.breadcrumb-item-disabled{cursor:default;opacity:.7}.breadcrumb-item-disabled:hover{background:transparent;border-color:transparent}.breadcrumb-separator{color:var(--color-text-tertiary);-webkit-user-select:none;user-select:none;padding:0 2px}.breadcrumb-dropdown-container{position:relative;display:inline-flex;align-items:center}.breadcrumb-ellipsis{display:inline-flex;align-items:center;gap:2px;padding:2px 6px;background:var(--bg-secondary);border:1px solid var(--color-border);border-radius:3px;color:var(--color-text-secondary);font-size:13px;cursor:pointer;transition:all .15s ease}.breadcrumb-ellipsis:hover{background:var(--color-surface-tertiary);border-color:var(--color-border-hover);color:var(--color-text-primary)}.breadcrumb-dropdown{position:absolute;top:calc(100% + 4px);left:0;min-width:200px;background:#2d2d30;border:1px solid #454545;border-radius:4px;box-shadow:0 4px 12px #00000080;z-index:1000;overflow:hidden}.breadcrumb-dropdown-item{padding:8px 12px;background:transparent;border:none;width:100%;text-align:left;cursor:pointer;color:#ccc;transition:background .15s ease;white-space:nowrap;font-size:13px;font-family:inherit}.breadcrumb-dropdown-item:hover:not(:disabled){background:#3e3e42;color:#fff}.breadcrumb-dropdown-item-disabled{cursor:default;opacity:.7}.breadcrumb-dropdown-item-disabled:hover{background:transparent;color:#8c8c8c}.context-menu{position:fixed;z-index:9999;min-width:220px;background:var(--color-surface-secondary);border:1px solid var(--color-border);border-radius:6px;box-shadow:0 4px 16px #0003;padding:4px 0;animation:context-menu-fade-in .1s ease-out}@keyframes context-menu-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.context-menu-header{padding:6px 12px;font-size:11px;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.context-menu-item{display:flex;align-items:center;gap:8px;padding:6px 12px;font-size:13px;color:var(--color-text-primary);cursor:pointer;border:none;background:none;width:100%;text-align:left;transition:background .1s}.context-menu-item.active:not(:disabled){background:var(--color-list-hover)}.context-menu-item.danger{color:var(--color-danger, #e74c3c)}.context-menu-item:disabled{opacity:.4;cursor:not-allowed}.context-menu-icon{display:flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0}.context-menu-label{flex:1}.context-menu-shortcut{font-size:11px;color:var(--color-text-secondary);opacity:.6;font-family:Consolas,Courier New,monospace}.context-menu-separator{height:1px;background:var(--color-border);margin:4px 0}.command-palette-overlay{position:fixed;inset:0;z-index:10000;background:#0006;display:flex;justify-content:center;padding-top:15vh;animation:command-palette-overlay-fade-in .15s ease-out}@keyframes command-palette-overlay-fade-in{0%{opacity:0}to{opacity:1}}.command-palette{width:500px;max-width:90vw;max-height:400px;background:var(--color-surface-primary);border:1px solid var(--color-border);border-radius:8px;box-shadow:0 8px 32px #0000004d;display:flex;flex-direction:column;overflow:hidden;animation:command-palette-slide-down .15s ease-out}@keyframes command-palette-slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.command-palette-header{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--color-border)}.command-palette-search-icon{color:var(--color-text-tertiary);flex-shrink:0}.command-palette-input{flex:1;background:none;border:none;color:var(--color-text-primary);font-size:14px;outline:none}.command-palette-input::placeholder{color:var(--color-text-tertiary)}.command-palette-mode{flex-shrink:0;font-size:11px;font-weight:500;padding:2px 7px;border-radius:10px;letter-spacing:.02em;background:var(--color-surface-secondary);color:var(--color-text-tertiary);border:1px solid var(--color-border);transition:background .1s,color .1s}.command-palette-mode--symbols{background:color-mix(in srgb,var(--color-accent) 15%,transparent);color:var(--color-accent);border-color:color-mix(in srgb,var(--color-accent) 30%,transparent)}.command-palette-mode--screens{background:color-mix(in srgb,#a78bfa 15%,transparent);color:#a78bfa;border-color:color-mix(in srgb,#a78bfa 30%,transparent)}.command-palette-list{flex:1;overflow-y:auto;padding:4px 0}.command-palette-list::-webkit-scrollbar{width:8px}.command-palette-list::-webkit-scrollbar-track{background:transparent}.command-palette-list::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}.command-palette-list::-webkit-scrollbar-thumb:hover{background:var(--color-text-tertiary)}.command-palette-category{padding:8px 16px 4px;font-size:11px;font-weight:600;color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.5px}.command-palette-item{display:flex;align-items:center;gap:12px;padding:8px 16px;cursor:pointer;transition:background .1s}.command-palette-item.active{background:var(--color-list-hover)}.command-palette-item-icon{display:flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0;color:var(--color-text-secondary)}.command-palette-item-content{flex:1;min-width:0}.command-palette-item-label-row{display:flex;align-items:baseline;gap:8px;min-width:0}.command-palette-item-label{font-size:13px;font-weight:500;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}.command-palette-item-badge{flex-shrink:0;font-size:11px;font-weight:500;color:var(--color-text-secondary);background:var(--color-surface-secondary);border:1px solid var(--color-border);border-radius:4px;padding:1px 6px;white-space:nowrap;line-height:1.6}.command-palette-item-description{font-size:12px;color:var(--color-text-secondary);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.command-palette-empty{padding:24px 16px;text-align:center;color:var(--color-text-tertiary);font-size:13px}.drop-indicator-overlay{position:absolute;z-index:7;pointer-events:none;background:var(--primary-color);box-shadow:0 0 0 1px #007acc40,0 0 8px #007acc73;border-radius:1px}.drop-indicator-overlay--invalid{background:#e53e3e;box-shadow:0 0 0 1px #e53e3e40,0 0 8px #e53e3e73;border-radius:3px;opacity:.75}.drag-ghost-overlay{position:fixed;pointer-events:none;z-index:9999;opacity:.55;border-radius:3px;outline:2px solid var(--color-accent, #4f8ef7);outline-offset:1px;will-change:transform;box-shadow:0 6px 24px #00000040;overflow:hidden;transition:opacity .2s ease}.drag-ghost-overlay--idle{opacity:0}.drag-ghost-svg{display:block;width:100%;height:100%}.container-guides-overlay{position:absolute;inset:0;z-index:4;pointer-events:none}.container-guide-rect{position:absolute;border:1px dashed rgba(0,122,204,.45);background:#007acc0a;border-radius:2px}.canvas-status-bar{display:flex;align-items:center;justify-content:space-between;height:24px;padding:0 8px;background:var(--bg-secondary);border-top:1px solid var(--border-color);flex-shrink:0;font-size:11px;color:var(--text-secondary);-webkit-user-select:none;user-select:none;gap:8px;overflow:visible;position:relative;z-index:10}.csb-left{display:flex;align-items:center;gap:4px;flex-shrink:0}.csb-center{display:flex;align-items:center;justify-content:center;flex:1;min-width:0;overflow:hidden}.csb-right{display:flex;align-items:center;flex-shrink:0}.csb-zoom{font-size:11px;color:var(--text-secondary);min-width:34px;text-align:right;font-variant-numeric:tabular-nums;cursor:default;padding:0 4px}.csb-screen-selector{position:relative}.csb-screen-btn{display:flex;align-items:center;gap:3px;background:transparent;border:none;border-radius:2px;padding:2px 5px;color:var(--text-secondary);font-size:11px;cursor:pointer;transition:background .1s,color .1s;white-space:nowrap;max-width:160px}.csb-screen-btn:hover{background:var(--color-list-hover);color:var(--text-primary)}.csb-screen-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:140px}.csb-chevron{flex-shrink:0;transition:transform .15s;opacity:.6}.csb-chevron--open{transform:rotate(180deg)}.csb-screen-dropdown{position:absolute;bottom:calc(100% + 2px);left:0;min-width:160px;max-height:240px;overflow-y:auto;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:3px;box-shadow:0 -4px 16px #00000080;padding:2px;margin:0;list-style:none;z-index:100}.csb-screen-option{padding:4px 8px;border-radius:2px;font-size:12px;color:var(--text-primary);cursor:pointer;transition:background .1s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.csb-screen-option:hover{background:var(--color-list-hover)}.csb-screen-option--active{color:var(--primary-color)}.csb-hints{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;overflow:hidden;font-size:11px}.csb-hint{display:flex;align-items:center;gap:3px;white-space:nowrap;color:var(--color-text-tertiary)}.csb-hint kbd{font-family:inherit;font-size:11px;color:var(--text-secondary);background:transparent;border:none;padding:0;line-height:1}.csb-hint span{color:var(--color-text-tertiary)}.csb-hint-sep{color:var(--border-color);font-size:11px;line-height:1}.csb-renderer-badge{display:flex;align-items:center;gap:4px;background:transparent;border:none;border-radius:2px;padding:2px 5px;color:var(--text-secondary);font-size:11px;cursor:pointer;transition:background .1s,color .1s;white-space:nowrap}.csb-renderer-badge:hover{background:var(--color-list-hover);color:var(--text-primary)}.hover-overlay{border:1.5px dashed var(--primary-color);border-radius:2px;opacity:.75;z-index:4;overflow:visible}.hover-overlay__label{position:absolute;bottom:-1px;left:-1px;transform:translateY(100%);font-size:10px;font-weight:500;line-height:1.4;color:#fff;background:color-mix(in srgb,var(--primary-color) 85%,#000 15%);border-radius:0 3px 3px;padding:1px 6px 2px;white-space:nowrap;pointer-events:none;max-width:220px;overflow:hidden;text-overflow:ellipsis;box-shadow:0 1px 4px #0000004d}.canvas-panel{display:flex;flex-direction:column;height:100%;background:#252526}.canvas-drill-mode-banner{position:absolute;bottom:12px;left:50%;transform:translate(-50%);z-index:20;display:flex;align-items:center;gap:7px;padding:6px 12px 6px 10px;background:#1e1e22eb;border:1px solid rgba(97,175,239,.35);border-radius:20px;font-size:11px;color:#abb2bf;white-space:nowrap;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:auto;box-shadow:0 2px 10px #0006}.canvas-drill-mode-banner svg{flex-shrink:0;color:#61afef}.canvas-drill-mode-banner strong{color:#61afef;font-weight:600;margin:0 1px}.canvas-drill-mode-exit{margin-left:4px;padding:2px 8px;border:1px solid rgba(97,175,239,.35);border-radius:10px;background:#61afef1a;color:#61afef;font-size:10px;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s}.canvas-drill-mode-exit:hover{background:#61afef33;border-color:#61afef8c}.canvas-toolbar{display:flex;gap:18px;align-items:center;padding:7px 9px;background:#2d2d30;border-bottom:1px solid #333333;overflow:visible;position:relative;z-index:10}.canvas-breadcrumb-bar{display:flex;align-items:center;height:26px;line-height:1;padding:0 8px;background:var(--bg-secondary);border-bottom:1px solid #2e2e2e;flex-shrink:0;overflow:visible;position:relative;z-index:9}.canvas-breadcrumb-bar-hint{font-size:10px;color:var(--text-secondary);margin-left:8px;font-style:italic}.canvas-breadcrumb-bar .breadcrumb{background:transparent;padding:0;gap:2px}.canvas-breadcrumb-bar .breadcrumb-item{font-size:11px;padding:1px 5px;line-height:1}.canvas-breadcrumb-bar .breadcrumb-separator{font-size:10px;opacity:.45}.canvas-breadcrumb-bar .breadcrumb-ellipsis{padding:1px 4px}.canvas-tools{display:flex;gap:4px}.canvas-tools-divider{width:1px;height:20px;background:#444;align-self:center;flex-shrink:0}.canvas-view-toggles{display:flex;gap:6px}.canvas-view-toggle{background:transparent;border:1px solid transparent;color:#5a5a5a;width:30px;height:30px;border-radius:4px;cursor:pointer;transition:background .15s,color .15s,border-color .15s;display:flex;align-items:center;justify-content:center}.canvas-view-toggle:hover{background:#ffffff0f;color:#aaa;border-color:#444}.canvas-view-toggle:focus,.canvas-view-toggle:focus-visible{outline:none}.canvas-view-toggle:disabled{opacity:.35;cursor:default;pointer-events:none}.canvas-view-toggle-active{background:color-mix(in srgb,var(--primary-color) 18%,transparent);border-color:color-mix(in srgb,var(--primary-color) 40%,transparent);color:color-mix(in srgb,var(--primary-color) 90%,#fff 10%)}.canvas-view-toggle-active:hover{background:color-mix(in srgb,var(--primary-color) 25%,transparent);border-color:color-mix(in srgb,var(--primary-color) 55%,transparent);color:color-mix(in srgb,var(--primary-color) 90%,#fff 10%)}.canvas-tool{background:transparent;border:1px solid #3c3c3c;color:#8c8c8c;width:32px;height:32px;font-size:16px;border-radius:4px;cursor:pointer;transition:background .15s,color .15s,border-color .15s;display:flex;align-items:center;justify-content:center}.canvas-tool:hover{background:#2a2a2a;color:#ccc;border-color:#555}.canvas-tool:focus,.canvas-tool:focus-visible{outline:none}.canvas-tool-active{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.canvas-tool-active:hover{background:var(--primary-color);border-color:var(--primary-color)}.action-tools{display:flex;gap:4px}.action-separator{display:block;width:1px;height:32px;margin:0 4px;background:#404040}.action-tool{background:transparent;border:1px solid #484848;color:#8c8c8c;width:32px;height:32px;font-size:16px;border-radius:4px;cursor:pointer;transition:background .15s,color .15s,border-color .15s;display:flex;align-items:center;justify-content:center}.action-tool:hover{background:#2a2a2a;color:#ccc;border-color:#555}.canvas-scale{font-size:.75em;line-height:0;align-self:center;padding:1em;border:1px solid var(--border-color);border-radius:.25em;background:var(--bg-secondary);cursor:default;color:var(--text-secondary)}.canvas-mode{background:transparent;border:1px solid #3c3c3c;color:#8c8c8c;padding:4px 12px;font-size:11px;border-radius:3px;cursor:pointer;transition:background .15s,color .15s}.canvas-mode:hover{background:#2a2a2a;color:#ccc;border-color:#555}.canvas-mode-active{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.canvas-content{flex:1;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);position:relative}.canvas-placeholder-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:2rem}.canvas-placeholder{font-size:13px;color:#6c6c6c;margin:0;font-family:Consolas,Monaco,Courier New,monospace}.canvas-errors{display:flex;flex-direction:column;gap:8px;max-width:600px}.canvas-error{padding:8px 12px;background:#3c2a2a;border-left:3px solid #e74c3c;color:#fcc;font-family:Consolas,Monaco,Courier New,monospace;font-size:12px;border-radius:3px}.inspector-tab-content{overflow-y:auto;height:100%;padding:1em}.inspector-instance-context{display:flex;align-items:center;gap:6px;padding:7px 10px;background:#c678dd12;border:1px solid rgba(198,120,221,.18);border-radius:4px;margin-bottom:10px;font-size:11px;color:var(--color-text-secondary);line-height:1.5}.inspector-instance-context svg{flex-shrink:0;color:#c678dd}.inspector-instance-context strong{color:#c678dd;font-weight:600}.inspector-instance-context-hint{opacity:.7}.inspector-go-to-definition-btn{display:flex;align-items:center;gap:4px;margin-left:auto;flex-shrink:0;padding:3px 7px;border:1px solid rgba(198,120,221,.35);border-radius:3px;background:#c678dd1a;color:#c678dd;font-size:10px;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s}.inspector-go-to-definition-btn:hover{background:#c678dd2e;border-color:#c678dd80}.inspector-definition-context{display:flex;align-items:flex-start;gap:6px;padding:7px 10px;background:#61afef12;border:1px solid rgba(97,175,239,.18);border-radius:4px;margin-bottom:10px;font-size:11px;color:var(--color-text-secondary);line-height:1.5}.inspector-definition-context svg{flex-shrink:0;margin-top:1px;color:#61afef}.inspector-definition-context strong{color:#61afef;font-weight:600}.inspector-node-header{padding:12px;background:var(--color-surface-secondary);border-radius:4px;margin-bottom:16px}.inspector-node-title{display:flex;align-items:center;gap:8px;margin-bottom:4px}.inspector-node-name{font-size:14px;font-weight:600;color:var(--color-text-primary)}.inspector-node-badge{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;padding:1px 6px;border-radius:3px;line-height:1.4}.inspector-node-badge--screen{color:#e5c07b;background:#e5c07b1f}.inspector-node-badge--layout{color:#c678dd;background:#c678dd1f}.inspector-node-badge--component{color:#61afef;background:#61afef1f}.inspector-node-badge--project{color:#98c379;background:#98c3791f}.inspector-node-meta{display:flex;align-items:center;gap:8px;justify-content:space-between}.inspector-node-id{font-size:11px;color:var(--color-text-secondary);font-family:Consolas,Monaco,monospace;flex:1}.inspector-go-to-code-btn{width:20px;height:20px;padding:0;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border);border-radius:3px;background:var(--color-bg-primary);color:var(--color-text-secondary);cursor:pointer;flex-shrink:0}.inspector-go-to-code-btn:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.inspector-group{margin-bottom:20px}.inspector-group-title{font-size:11px;font-weight:600;color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;padding-bottom:4px;border-bottom:1px solid var(--color-border)}.inspector-properties{display:flex;flex-direction:column;gap:6px}.inspector-property{display:grid;grid-template-columns:100px 1fr;gap:12px;padding:6px 0;font-size:12px}.inspector-property-label{color:var(--color-text-secondary);font-weight:500}.inspector-property-value{color:var(--color-text-primary);font-family:Consolas,Monaco,monospace;word-break:break-word;white-space:pre-wrap}.inspector-property-input{width:100%;padding:4px 8px;background:var(--color-input-background);border:1px solid var(--color-border);border-radius:3px;color:var(--color-text-primary);font-family:Consolas,Monaco,monospace;font-size:12px;transition:border-color .15s,background-color .15s}.inspector-property-input:hover{background:var(--color-input-background-hover);border-color:var(--color-border-hover)}.inspector-property-input:focus{outline:none;border-color:var(--color-accent);background:var(--color-input-background-focus)}.inspector-property-input::placeholder{color:var(--color-text-tertiary);opacity:.6}.inspector-property-input:disabled,.inspector-property-select:disabled{background:var(--color-input-background-disabled);color:var(--color-text-disabled);cursor:not-allowed;border-color:var(--color-border);opacity:.8}.inspector-property-input:disabled:hover,.inspector-property-select:disabled:hover{background:var(--color-input-background-disabled);border-color:var(--color-border)}.inspector-property-select{width:100%;padding:4px 8px;background:var(--color-input-background);border:1px solid var(--color-border);border-radius:3px;color:var(--color-text-primary);font-family:Consolas,Monaco,monospace;font-size:12px;cursor:pointer;transition:border-color .15s,background-color .15s}.inspector-property-select:hover{background:var(--color-input-background-hover);border-color:var(--color-border-hover)}.inspector-property-select:focus{outline:none;border-color:var(--color-accent);background:var(--color-input-background-focus)}.inspector-property-checkbox{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:12px}.inspector-property-checkbox input[type=checkbox]{width:14px;height:14px;accent-color:var(--color-accent);cursor:pointer}.inspector-checkbox-label{font-family:Consolas,Monaco,monospace;color:var(--color-text-secondary);-webkit-user-select:none;user-select:none}.inspector-property--required .inspector-property-label{color:var(--color-text-primary)}.inspector-required-dot{display:inline-block;width:5px;height:5px;background:var(--color-accent);border-radius:50%;margin-left:4px;vertical-align:middle}.inspector-property[title]{cursor:help}.inspector-property--expose-mode{grid-template-columns:100px 1fr auto}.inspector-expose-btn{flex-shrink:0;align-self:center;display:flex;align-items:center;justify-content:center;width:22px;height:22px;border:1px solid transparent;border-radius:3px;background:transparent;color:var(--color-text-secondary);cursor:pointer;opacity:.4;transition:opacity .15s,background .15s,color .15s,border-color .15s}.inspector-expose-btn:hover{opacity:1;background:#ffffff0f;border-color:#ffffff1a}.inspector-expose-btn--active{opacity:1;color:#56b6c2;border-color:#56b6c24d;background:#56b6c21a}.inspector-expose-btn--active:hover{background:#56b6c22e;border-color:#56b6c280}.inspector-exposed-prop-row{display:flex;align-items:stretch;flex:1;min-width:0}.inspector-exposed-prop-prefix{font-size:10px;font-family:Consolas,Monaco,monospace;color:#56b6c2;background:#56b6c21f;border:1px solid rgba(86,182,194,.28);border-right:none;border-radius:3px 0 0 3px;padding:0 5px;display:flex;align-items:center;flex-shrink:0;white-space:nowrap}.inspector-exposed-prop-row .inspector-property-input{border-radius:0 3px 3px 0;border-left-color:#56b6c247;color:#56b6c2;font-weight:500}.tree-search-header{display:flex;gap:4px;padding:8px;border-bottom:1px solid var(--color-border);background:var(--color-bg-secondary)}.tree-search-input-wrapper{position:relative;flex:1;display:flex;align-items:center}.tree-search-icon{position:absolute;left:8px;color:var(--color-text-tertiary);pointer-events:none}.tree-search-input{width:100%;padding:4px 24px 4px 28px;font-size:12px;border:1px solid var(--color-border);border-radius:4px;background:var(--color-bg-primary);color:var(--color-text-primary);outline:none}.tree-search-input:focus{border-color:var(--color-primary)}.tree-search-clear{position:absolute;right:4px;width:16px;height:16px;display:flex;align-items:center;justify-items:center;border:none;background:transparent;color:var(--color-text-tertiary);cursor:pointer;font-size:16px;line-height:1;padding:0}.tree-search-clear:hover{color:var(--color-text-primary)}.tree-expand-collapse-btn{width:24px;height:24px;padding:0;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border);border-radius:4px;background:var(--color-bg-primary);color:var(--color-text-secondary);cursor:pointer;flex-shrink:0}.tree-expand-collapse-btn:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.tree-search-count{display:flex;align-items:center;padding:0 8px;font-size:11px;color:var(--color-text-tertiary);white-space:nowrap}.tree-view-content{padding:4px 0;overflow-y:auto;height:calc(100% - 44px);-webkit-user-select:none;user-select:none;font-size:13px;outline:none}.tree-view-content:focus{outline:none}.tree-node{width:100%}.tree-node-label{display:flex;align-items:center;gap:6px;padding:3px 10px;cursor:pointer;border-radius:4px;margin:1px 4px;transition:background .1s ease;position:relative;line-height:1.6}.tree-node-label:hover{background:var(--color-surface-tertiary)}.tree-node-selected{background:#007acc40!important}.tree-node-selected:before{display:none;content:"";position:absolute;left:0;top:2px;bottom:2px;width:2px;border-radius:1px;background:var(--primary-color)}.tree-node-matched{background:#ffc10726!important;border-left:2px solid rgba(255,193,7,.6)}.tree-node-matched.tree-node-selected{background:#007acc59!important;border-left:2px solid var(--color-primary)}.tree-node-toggle{background:transparent;border:none;padding:0;cursor:pointer;color:var(--color-text-tertiary);display:flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0;border-radius:3px;transition:color .1s,background .1s}.tree-node-toggle:hover{color:var(--color-text-primary);background:#ffffff0f}.tree-node-spacer{width:16px;height:16px;flex-shrink:0}.tree-node-type{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;padding:1px 5px;border-radius:3px;flex-shrink:0;line-height:1.4}.tree-node-type--screen{color:#e5c07b;background:#e5c07b1f}.tree-node-type--layout{color:#c678dd;background:#c678dd1f}.tree-node-type--component{color:#61afef;background:#61afef1f}.tree-node-type--project{color:#98c379;background:#98c3791f}.tree-node-type--component-definition,.tree-node-type--default{color:var(--color-text-secondary);background:#00000040}.tree-node-selected .tree-node-type{opacity:.9}.tree-node-name{color:var(--color-text-primary);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.tree-node-selected .tree-node-name{color:var(--color-text-primary)}.tree-node-expand-all,.tree-node-go-to-code,.tree-node-more{background:transparent;border:none;padding:2px;cursor:pointer;color:var(--color-text-tertiary);display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;border-radius:3px;transition:color .1s,background .1s;opacity:0;pointer-events:none}.tree-node-label:hover .tree-node-expand-all,.tree-node-label:hover .tree-node-go-to-code,.tree-node-label:hover .tree-node-more,.tree-node-selected .tree-node-expand-all,.tree-node-selected .tree-node-go-to-code,.tree-node-selected .tree-node-more{opacity:1;pointer-events:auto}.tree-node-expand-all:hover,.tree-node-go-to-code:hover,.tree-node-more:hover{color:var(--color-text-primary);background:#ffffff14}.tree-node-children{display:flex;flex-direction:column;position:relative}.tree-node-children:before{content:"";position:absolute;top:0;bottom:8px;left:var(--guide-left, 23px);width:1px;background:var(--color-border);opacity:.4}.add-color-form{display:flex;flex-direction:column;gap:16px}.color-preview-field{display:flex;flex-direction:column;gap:8px}.color-preview-label{font-size:12px;font-weight:500;color:var(--color-text-primary)}.color-preview-group{display:flex;gap:8px;align-items:center}.color-preview-group>div{flex:1}.color-preview-picker{width:48px;height:36px;border:1px solid var(--color-border);border-radius:4px;cursor:pointer;background:none;padding:2px}.color-preview-picker::-webkit-color-swatch-wrapper{padding:0}.color-preview-picker::-webkit-color-swatch{border:none;border-radius:2px}.add-color-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}.add-mock-form{display:flex;flex-direction:column;gap:16px}.mock-values-field{display:flex;flex-direction:column;gap:8px}.mock-values-label{font-size:12px;font-weight:500;color:var(--color-text-primary);display:flex;flex-direction:column;gap:2px}.mock-values-hint{font-size:11px;font-weight:400;color:var(--color-text-tertiary)}.add-mock-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}.project-tab{display:flex;flex-direction:column;height:100%;overflow:hidden}.project-sub-tabs{display:flex;gap:4px;padding:8px 12px 0;border-bottom:1px solid var(--color-border);background:var(--color-surface-primary)}.project-sub-tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--color-text-secondary);font-size:12px;font-weight:500;padding:6px 12px;border-radius:4px 4px 0 0;cursor:pointer;transition:all .15s}.project-sub-tab:hover{color:var(--color-text-primary);background:var(--color-surface-tertiary)}.project-sub-tab.active{color:var(--color-text-primary);border-bottom-color:var(--color-accent)}.project-tab-content{flex:1;overflow-y:auto;padding:16px}.project-form{display:flex;flex-direction:column;gap:16px}.project-color-sections{display:flex;flex-direction:column;gap:12px}.project-color-section{border:1px solid var(--color-border);border-radius:8px;padding:12px;background:var(--color-surface-secondary)}.project-color-section-base,.project-color-section-variants,.project-color-section-custom{background:var(--color-surface-secondary)}.project-color-section-header{margin-bottom:10px}.project-color-section-header h4{margin:0;font-size:12px;font-weight:600;color:var(--color-text-primary)}.project-color-section-header p{margin:4px 0 0;font-size:11px;color:var(--color-text-secondary)}.project-color-section-empty{padding:8px 10px;border:1px dashed var(--color-border);border-radius:6px;color:var(--color-text-secondary);font-size:11px}.project-color-section-empty p{margin:0}.project-form-header h3{font-size:14px;font-weight:600;color:var(--color-text-primary);margin:0 0 4px}.project-form-description{font-size:12px;color:var(--color-text-secondary);margin:0}.project-form-fields{display:flex;flex-direction:column;gap:12px}.project-form-field{display:flex;flex-direction:column;gap:4px}.project-form-label{font-size:12px;font-weight:500;color:var(--color-text-primary);display:flex;flex-direction:column;gap:2px}.project-form-hint{font-size:11px;font-weight:400;color:var(--color-text-tertiary)}.project-form-input,.project-form-select{background:var(--color-input-background);border:1px solid var(--color-border);border-radius:4px;color:var(--color-text-primary);font-size:12px;padding:6px 8px;outline:none;transition:all .15s}.project-form-select option{background:var(--color-input-background);color:var(--color-text-primary)}.project-form-input:hover,.project-form-select:hover{background:var(--color-input-hover);border-color:var(--color-border-hover)}.project-form-input:focus,.project-form-select:focus{background:var(--color-input-focus);border-color:var(--color-accent);box-shadow:0 0 0 2px #007acc1a}.project-button-group{display:flex;gap:6px;flex-wrap:wrap}.project-directive-controls{display:flex;align-items:center;gap:8px}.project-option-button{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--color-border);background:var(--color-input-background);color:var(--color-text-secondary);border-radius:6px;font-size:12px;padding:6px 10px;cursor:pointer;transition:all .15s;text-transform:capitalize}.project-option-button-icon{width:34px;height:34px;padding:0;justify-content:center}.project-option-button:hover:not(.active):not(:disabled){background:var(--color-input-hover);border-color:var(--color-border-hover);color:var(--color-text-primary)}.project-option-button.active{background:var(--alternative-color);border-color:var(--color-accent);color:var(--color-text-primary)}.project-option-button:disabled{opacity:.45;cursor:not-allowed}.project-option-icon{display:inline-flex;align-items:center;justify-content:center}.project-input-group{display:flex;gap:8px;align-items:center}.project-input-group .project-form-input{flex:1;min-width:0}.project-color-text{font-family:Consolas,Courier New,monospace;text-transform:uppercase}.project-color-picker{width:40px;height:32px;border:1px solid var(--color-border);border-radius:4px;cursor:pointer;background:none;padding:2px;flex-shrink:0}.project-color-picker::-webkit-color-swatch-wrapper{padding:0}.project-color-picker::-webkit-color-swatch{border:none;border-radius:2px}.project-color-default{opacity:.5}.project-input-action{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:none;border-radius:4px;cursor:pointer;opacity:.6;transition:all .15s;flex-shrink:0}.project-input-action:hover{opacity:1;background:var(--color-surface-tertiary)}.project-input-reset{color:var(--color-text-secondary)}.project-input-reset:hover{color:var(--color-accent)}.project-input-delete{color:var(--color-text-secondary)}.project-input-delete:hover{color:var(--color-danger, #e74c3c)}.project-add-button{display:flex;align-items:center;gap:6px;background:var(--color-surface-secondary);border:1px dashed var(--color-border);border-radius:4px;color:var(--color-text-secondary);font-size:12px;padding:8px 12px;cursor:pointer;transition:all .15s;margin-top:1em;width:100%}.project-add-button:hover{background:var(--color-surface-tertiary);border-color:var(--color-accent);color:var(--color-accent)}.project-empty-state{text-align:center;padding:32px 16px;color:var(--color-text-tertiary)}.project-empty-state p{margin:0 0 4px;font-size:12px}.project-empty-state .project-form-hint{display:block;margin-top:4px}.inspector-panel{display:flex;flex-direction:column;height:100%}.inspector-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #333333;background:#2d2d30}.inspector-tabs{display:flex;flex:1}.inspector-tab{flex:1;background:transparent;border:none;color:#8c8c8c;padding:8px 12px;font-size:11px;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;transition:color .15s,border-color .15s}.inspector-tab:hover{color:#ccc}.inspector-tab-active{color:#fff;border-bottom-color:var(--primary-color)}.inspector-toggle{background:transparent;border:none;color:#8c8c8c;padding:6px 8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s,background .15s;margin-right:4px}.inspector-toggle:hover{color:#fff;background:#ffffff1a}.inspector-content{flex:1;overflow-y:auto}.inspector-placeholder{font-size:12px;color:#6c6c6c;margin:0}.version-preview{display:flex;flex-direction:column;gap:12px}.version-preview-controls{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--bg-primary);padding:.5em;border-radius:.25em}.version-preview-mode-switch{display:flex;align-items:center;gap:8px}.version-preview-mode-btn{border:1px solid #4f4f55;background:#2a2a2f;color:#d4d4d4;border-radius:4px;padding:7px 10px;font-size:11px;cursor:pointer}.version-preview-mode-btn:hover:not(:disabled):not(.active){border-color:var(--alternative-hover)}.version-preview-mode-btn.active{background:var(--alternative-active);border-color:var(--primary-color);color:#fff}.version-preview-mode-btn:disabled{opacity:.6;cursor:not-allowed}.version-preview-code{height:min(50vh,720px);border:1px solid #3c3c3c;border-radius:6px;overflow:hidden}.version-preview-render{display:flex;flex-direction:column;gap:10px}.version-preview-render-toolbar{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-secondary)}.version-preview-status-badge{display:inline-flex;align-items:center;padding:3px 7px;border-radius:999px;font-size:10px;line-height:1;border:1px solid transparent}.version-preview-status-valid{color:#8be9b5;border-color:#2f7f5a;background:#2f7f5a33}.version-preview-status-invalid{color:#ff9a9a;border-color:#8f3d3d;background:#8f3d3d33}.version-preview-status-unknown{color:#d6d6d6;border-color:#606068;background:#60606833}.version-preview-screen-select{min-width:220px;border:1px solid #3c3c3c;background:#1f1f20;color:#d4d4d4;border-radius:4px;padding:6px 8px}.version-preview-render-canvas{height:min(50vh,720px);border:1px solid #3c3c3c;border-radius:6px;overflow:hidden;background:#1e1e1e}.version-preview-placeholder{margin:0;color:var(--text-secondary);font-size:12px;padding:12px}.version-preview-error{margin:0;color:var(--danger-color);font-size:12px;padding:12px}.version-preview-diff{width:100%;border:1px solid #3c3c3c;border-radius:6px;overflow:hidden;height:min(50vh,720px)}.version-preview-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--text-secondary);font-size:11px}.version-preview-file{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.version-preview-time{flex-shrink:0}.bottom-drawer{display:flex;flex-direction:column;height:100%}.drawer-tabs{display:flex;border-bottom:1px solid #333333;background:#2d2d30;align-items:center}.drawer-tab-controls{display:flex;gap:4px;margin-left:auto;padding-right:6px;align-items:center}.drawer-tab{background:transparent;border:none;color:#8c8c8c;padding:6px 12px;font-size:11px;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;transition:color .15s,border-color .15s;display:inline-flex;align-items:center;gap:6px;min-height:28px}.drawer-badge{background:var(--danger-color);color:#fff;font-size:9px;padding:1px 5px;border-radius:9px;min-width:14px;height:16px;display:inline-flex;align-items:center;justify-content:center;line-height:1}.drawer-tab:hover{color:#ccc}.drawer-tab-active{color:#fff;border-bottom-color:var(--primary-color)}.drawer-toggle{margin-left:auto;background:transparent;border:none;color:var(--text-secondary);padding:6px 12px;cursor:pointer;display:flex;align-items:center;transition:color .15s,background .15s}.drawer-toggle:hover{color:var(--text-primary);background:#ffffff0d}.drawer-content{padding:.75rem 1rem;flex:1;overflow-y:auto}.drawer-placeholder{font-size:12px;color:#6c6c6c;margin:0}.problems-list{display:flex;flex-direction:column;gap:1px}.problem-item{display:flex;gap:8px;padding:6px 8px;font-size:12px;border-left:3px solid transparent;background:#2d2d30}.problem-item:hover{background:#2a2a2a}.problem-error{border-left-color:var(--danger-color)}.problem-warning{border-left-color:var(--warning-color)}.problem-info{border-left-color:var(--info-color)}.problem-icon{flex-shrink:0;color:inherit;margin-top:2px}.problem-error .problem-icon{color:var(--danger-color)}.problem-warning .problem-icon{color:var(--warning-color)}.problem-info .problem-icon{color:var(--info-color)}.problem-details{flex:1;min-width:0}.problem-message{color:#ccc;line-height:1.4}.problem-location{color:#8c8c8c;font-size:11px;margin-top:2px;display:flex;align-items:center;gap:4px}.problem-file{color:var(--color-accent);font-weight:500}.output-list{display:flex;flex-direction:column;font-family:Consolas,Courier New,monospace;font-size:12px;height:100%;overflow-y:auto}.output-btn{background:transparent;border:none;color:#8c8c8c;padding:4px 6px;font-size:13px;cursor:pointer;border-radius:3px;display:inline-flex;align-items:center;gap:3px;transition:background .15s,color .15s;min-height:20px;line-height:1}.output-btn:hover{background:#3e3e42;color:#fff}.output-btn-active{background:var(--primary-color);color:#fff}.output-btn-active:hover{background:#0098ff}.output-item{color:#ccc;padding:2px 0;white-space:pre-wrap;word-break:break-all;flex-shrink:0}.versions-list{display:flex;flex-direction:column;gap:8px}.version-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid #3d3d41;border-radius:6px;background:#2d2d30}.version-main{min-width:0;display:flex;flex-direction:column;gap:6px}.version-time{color:#d4d4d4;font-size:12px;line-height:1.2}.version-meta{display:flex;align-items:center;gap:6px}.version-badge{display:inline-flex;align-items:center;padding:2px 6px;border-radius:999px;font-size:10px;line-height:1;border:1px solid transparent}.version-status-valid{color:#8be9b5;border-color:#2f7f5a;background:#2f7f5a33}.version-status-invalid{color:#ff9a9a;border-color:#8f3d3d;background:#8f3d3d33}.version-status-unknown{color:#d6d6d6;border-color:#606068;background:#60606833}.version-reason{color:#b8c8ff;border-color:#465b9f;background:#465b9f33}.version-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px}.version-action-btn{flex-shrink:0;border:1px solid #4f4f55;background:#2a2a2f;color:#d4d4d4;border-radius:4px;padding:5px 10px;font-size:11px;cursor:pointer}.version-action-btn:hover:not(:disabled){background:#34343b}.version-action-btn-primary{border:1px solid var(--alternative-color);background:var(--alternative-active);color:#fff}.version-action-btn-primary:hover:not(:disabled){background:var(--alternative-hover)}.version-action-btn:disabled{opacity:.6;cursor:not-allowed}.error-boundary{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#1e1e1e;color:#ccc;padding:2rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.error-boundary-content{max-width:600px;background:#252526;border:1px solid #3c3c3c;border-radius:6px;padding:2rem;box-shadow:0 4px 12px #0000004d}.error-boundary h1{margin:0 0 1rem;font-size:24px;color:#f48771}.error-message{margin:0 0 1.5rem;font-size:14px;line-height:1.5;color:#ccc}.error-details{margin:1.5rem 0;background:#1e1e1e;border:1px solid #3c3c3c;border-radius:4px;padding:1rem}.error-details summary{cursor:pointer;font-size:13px;font-weight:600;color:#ccc;-webkit-user-select:none;user-select:none}.error-details summary:hover{color:#fff}.error-stack{margin:1rem 0 0;font-size:12px;font-family:Consolas,Monaco,Courier New,monospace;color:#f48771;overflow-x:auto;white-space:pre-wrap;word-break:break-word}.error-actions{display:flex;gap:.75rem;margin-top:1.5rem}.error-btn-primary,.error-btn-secondary{padding:10px 20px;font-size:14px;font-weight:500;border-radius:4px;cursor:pointer;transition:background .15s;border:none}.error-btn-primary{background:var(--primary-color);color:#fff}.error-btn-primary:hover{background:var(--primary-hover)}.error-btn-secondary{background:#3c3c3c;color:#ccc}.error-btn-secondary:hover{background:#4c4c4c}.error-help{margin:1.5rem 0 0;font-size:12px;color:#8c8c8c;line-height:1.5}.error-help a{color:#4fc3f7;text-decoration:none}.error-help a:hover{text-decoration:underline}.shortcuts-modal-backdrop{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.shortcuts-modal{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;width:90%;max-width:800px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 8px 32px #0006}.shortcuts-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border-color)}.shortcuts-modal-header h2{margin:0;font-size:18px;font-weight:600;color:var(--text-primary)}.shortcuts-modal-close{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;transition:background .15s,color .15s}.shortcuts-modal-close:hover{background:#ffffff1a;color:var(--text-primary)}.shortcuts-modal-content{flex:1;overflow-y:auto;padding:24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:24px;align-content:start}.shortcuts-group{display:flex;flex-direction:column;gap:12px}.shortcuts-group-title{font-size:13px;font-weight:600;color:var(--primary-color);margin:0;text-transform:uppercase;letter-spacing:.5px}.shortcuts-list{display:flex;flex-direction:column;gap:8px}.shortcut-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 12px;background:var(--bg-tertiary);border-radius:6px;transition:background .15s}.shortcut-item:hover{background:#ffffff0d}.shortcut-keys{display:flex;align-items:center;gap:4px;flex-shrink:0}.shortcut-key{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 8px;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:4px;font-size:11px;font-weight:600;color:var(--text-primary);font-family:Consolas,Monaco,Courier New,monospace;box-shadow:0 1px 2px #0003}.shortcut-plus{color:var(--text-secondary);font-size:12px;padding:0 2px}.shortcut-description{flex:1;font-size:13px;color:var(--text-primary);text-align:right}.shortcuts-modal-footer{padding:16px 24px;border-top:1px solid var(--border-color);background:var(--bg-tertiary)}.shortcuts-modal-note{margin:0;font-size:12px;color:var(--text-secondary);font-style:italic}.shortcuts-modal-content::-webkit-scrollbar{width:8px}.shortcuts-modal-content::-webkit-scrollbar-track{background:transparent}.shortcuts-modal-content::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.shortcuts-modal-content::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}*{box-sizing:border-box}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ccc;background-color:#1e1e1e;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--primary-color: #d17a1a;--primary-hover: #b36512;--bg-primary: #1e1e1e;--bg-secondary: #252526;--bg-tertiary: #2d2d30;--border-color: #3e3e42;--text-primary: #cccccc;--text-secondary: #858585;--color-text-primary: var(--text-primary);--color-text-secondary: var(--text-secondary);--color-text-tertiary: #5a5a5a;--color-text-muted: #5a5a5a;--color-surface-primary: var(--bg-primary);--color-surface-secondary: #2d2d30;--color-surface-tertiary: #333337;--color-border: var(--border-color);--color-border-hover: #505050;--color-accent: var(--primary-color);--alternative-color: #6c492d;--alternative-hover: #5a3e27;--alternative-active: #4e342e;--color-list-hover: #383838;--color-input-background: #2a2a2e;--color-input-background-hover: #303034;--color-input-background-focus: #1e1e22;--color-input-background-disabled: #232327;--color-text-disabled: #555555;--danger-bg: #5a1d1d;--danger-color: #f48771;--danger-text: #f48771;--warning-bg: #4d4000;--warning-color: #cca700;--warning-text: #cca700;--info-bg: #1a3a52;--info-color: #75beff;--info-text: #75beff}body{margin:0;padding:0;min-width:320px;min-height:100vh;overflow:hidden}#root{width:100vw;height:100vh}button{font-family:inherit;outline:none}button:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#1e1e1e}::-webkit-scrollbar-thumb{background:#424242;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#4e4e4e}.flex{display:flex}.flex-column{flex-direction:column}.justify-content-start{justify-content:start}.justify-content-center{justify-content:center}.justify-content-end{justify-content:flex-end}.flex-grow-1{flex-grow:1}.align-items-center{align-items:center}.gap-4{gap:4px}.p-1{padding:4px}[data-sonner-toaster][data-sonner-theme=dark]{--normal-bg: var(--color-surface-tertiary);--normal-bg-hover: #3a3a3e;--normal-border: var(--border-color);--normal-border-hover: var(--color-border-hover);--normal-text: var(--text-primary);--border-radius: 6px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-description]{color:var(--text-secondary)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-styled=true] [data-button]{background:var(--primary-color);color:#fff}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-styled=true] [data-button]:hover{background:var(--primary-hover)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]{background:var(--color-surface-tertiary);border-color:var(--border-color);color:var(--text-secondary)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]:hover{background:#3a3a3e;border-color:var(--color-border-hover)}[data-sonner-toast][data-styled=true]{box-shadow:0 4px 16px #0006,0 1px 4px #00000040}.dotted-button{display:flex;align-items:center;gap:6px;background:var(--color-surface-secondary);border:1px dashed var(--color-border);border-radius:4px;color:var(--color-text-secondary);font-size:12px;padding:8px 12px;cursor:pointer;transition:all .15s}.dotted-button:hover{background:var(--color-surface-tertiary);border-color:var(--color-accent);color:var(--color-accent)}.new-file-route{height:100vh;overflow:hidden;padding:40px 20px;background:#1e1e1e;color:#ccc;display:flex;justify-content:center;box-sizing:border-box}.new-file-route__content{width:100%;max-width:860px;display:flex;flex-direction:column;gap:16px;overflow:hidden;min-height:0}.new-file-route .create-file-form,.new-file-route .template-selection{flex:1;min-height:0;overflow:hidden}.new-file-route .template-grid{flex:1;min-height:0;overflow-y:auto;max-height:100%;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;padding:8px;align-content:start}.new-file-route__title{margin:0;font-size:28px;line-height:1.2}.new-file-route__subtitle{margin:0;color:#a8a8a8;font-size:14px}.new-file-route__message{padding:12px;background:#007acc26;border:1px solid rgba(0,122,204,.5);border-radius:6px;color:#7ec3ff;font-size:13px}.new-file-route__workspace-field{display:flex;flex-direction:column;gap:6px}.new-file-route__workspace-label{font-size:13px;font-weight:500;color:#ccc}.new-file-route__workspace-select{border:1px solid #3e3e42;border-radius:6px;padding:10px 12px;background:#252526;color:#ccc;font-size:14px}.new-file-route__workspace-select:focus{outline:2px solid var(--primary-color);outline-offset:1px}.ide-layout{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:#1e1e1e;color:#ccc}.ide-topbar{height:48px;background:#1e1e1e;border-bottom:1px solid #333333;flex-shrink:0}.ide-main{display:flex;flex:1;overflow:hidden}.resize-handle{position:relative;background:transparent;transition:background-color .2s}.resize-handle:hover{background:var(--primary-color)}.resize-handle-vertical{width:4px;cursor:col-resize}.resize-handle-horizontal{height:4px;cursor:row-resize}.ide-activitybar{height:100%;background:var(--bg-secondary);border-right:1px solid #333333;overflow-y:auto}.ide-workspace{display:flex;height:100%;overflow:hidden}.ide-editor{height:100%;background:var(--bg-primary);overflow:auto}.ide-canvas{height:100%;background:var(--bg-secondary);border-left:1px solid #333333;overflow:auto}.ide-drawer{height:100%;background:var(--bg-secondary);border-top:1px solid #333333;overflow-y:hidden}.ide-inspector{width:100%;min-width:250px;max-width:500px;height:100%;background:var(--bg-secondary);border-left:1px solid #333333;overflow-y:auto;flex-shrink:0}