.framr-container{display:flex;flex-direction:column;min-height:100vh;background:var(--surface-base);color:var(--text-primary)}.framr-header{background:var(--surface-raised);border-bottom:1px solid var(--border-default);padding:var(--spacing-md, 1rem)}.framr-header-content{display:flex;align-items:center;justify-content:space-between;max-width:var(--max-width, 1200px);margin:0 auto}.framr-header-left{display:flex;align-items:center;gap:var(--spacing-md, 1rem)}.framr-logo{height:32px;width:auto}.framr-app-name{font-size:var(--font-size-lg, 1.25rem);font-weight:600;margin:0;color:var(--text-primary)}.framr-header-nav{display:flex;gap:var(--spacing-md, 1rem)}.framr-main{display:flex;flex:1;max-width:var(--max-width, 1200px);margin:0 auto;width:100%}.framr-content{flex:1;padding:var(--spacing-lg, 1.5rem)}.framr-sidebar{width:250px;background:var(--surface-raised);border-right:1px solid var(--border-default);transition:width .3s ease}.framr-sidebar-content.collapsed{width:50px}.framr-sidebar-toggle{width:100%;padding:var(--spacing-sm, .5rem);background:transparent;border:none;cursor:pointer;color:var(--text-secondary)}.framr-sidebar-toggle:hover{background:var(--bg-hover, var(--text-primary))}.framr-sidebar-inner{padding:var(--spacing-md, 1rem)}.framr-footer{background:var(--surface-raised);border-top:1px solid var(--border-default);padding:var(--spacing-md, 1rem);margin-top:auto}.framr-footer-content{display:flex;align-items:center;justify-content:space-between;max-width:var(--max-width, 1200px);margin:0 auto;font-size:var(--font-size-sm, .875rem);color:var(--text-secondary)}.framr-footer-nav{display:flex;gap:var(--spacing-md, 1rem)}.framr-footer-link{color:var(--text-secondary);text-decoration:none}.framr-footer-link:hover{color:var(--text-primary);text-decoration:underline}.framr-layout-minimal .framr-header,.framr-layout-minimal .framr-footer{display:none}.framr-layout-full .framr-content{padding:0;max-width:100%}.framr-loading{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--surface-base)}.framr-spinner{font-size:var(--font-size-lg, 1.25rem);color:var(--text-secondary)}.framr-error{padding:var(--spacing-xl, 2rem);text-align:center;color:var(--color-danger, #dc3545)}.framr-error h2{margin-bottom:var(--spacing-md, 1rem)}.framr-error button{margin-top:var(--spacing-md, 1rem);padding:var(--spacing-sm, .5rem) var(--spacing-md, 1rem);background:var(--color-primary, #007bff);color:#fff;border:none;border-radius:var(--border-radius, 4px);cursor:pointer}.framr-error button:hover{background:var(--color-primary-hover, #0056b3)}[data-theme=dark] .framr-container{background:var(--surface-base);color:var(--text-primary)}[data-theme=dark] .framr-header,[data-theme=dark] .framr-footer,[data-theme=dark] .framr-sidebar{background:var(--surface-raised);border-color:var(--border-default)}@media(max-width:768px){.framr-sidebar{position:fixed;left:0;top:0;height:100vh;z-index:1000;transform:translate(-100%);transition:transform .3s ease}.framr-sidebar.open{transform:translate(0)}.framr-header-content{flex-wrap:wrap}.framr-footer-content{flex-direction:column;gap:var(--spacing-sm, .5rem)}}.skinnr-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;border-radius:var(--skinnr-border-radius, 6px);font-family:var(--skinnr-font-family, system-ui, -apple-system, sans-serif);font-weight:500;cursor:pointer;transition:all .2s ease;white-space:nowrap;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.skinnr-button:focus-visible{outline:2px solid var(--skinnr-color-primary, #0066cc);outline-offset:2px}.skinnr-button:disabled{opacity:.5;cursor:not-allowed}.skinnr-button--sm{padding:4px 12px;font-size:13px;min-height:28px}.skinnr-button--md{padding:6px 16px;font-size:14px;min-height:36px}.skinnr-button--lg{padding:10px 20px;font-size:16px;min-height:44px}.skinnr-button--icon-only{padding:6px;aspect-ratio:1}.skinnr-button--icon-only.skinnr-button--sm{padding:4px;min-width:28px}.skinnr-button--icon-only.skinnr-button--md{padding:6px;min-width:36px}.skinnr-button--icon-only.skinnr-button--lg{padding:10px;min-width:44px}.skinnr-button--full-width{width:100%}.skinnr-button--primary{background:var(--skinnr-color-primary, #0066cc);color:var(--skinnr-color-primary-text, #ffffff)}.skinnr-button--primary:hover:not(:disabled){background:var(--skinnr-color-primary-hover, #0052a3)}.skinnr-button--primary:active:not(:disabled){background:var(--skinnr-color-primary-active, #004080)}.skinnr-button--secondary{background:var(--skinnr-color-secondary, #f0f0f0);color:var(--skinnr-color-secondary-text, #333333)}.skinnr-button--secondary:hover:not(:disabled){background:var(--skinnr-color-secondary-hover, #e0e0e0)}.skinnr-button--secondary:active:not(:disabled){background:var(--skinnr-color-secondary-active, #d0d0d0)}.skinnr-button--ghost{background:transparent;color:var(--skinnr-color-text, #333333)}.skinnr-button--ghost:hover:not(:disabled){background:var(--skinnr-color-ghost-hover, rgba(0, 0, 0, .05))}.skinnr-button--ghost:active:not(:disabled){background:var(--skinnr-color-ghost-active, rgba(0, 0, 0, .1))}.skinnr-button--danger{background:var(--skinnr-color-danger, #dc3545);color:var(--skinnr-color-danger-text, #ffffff)}.skinnr-button--danger:hover:not(:disabled){background:var(--skinnr-color-danger-hover, #c82333)}.skinnr-button--danger:active:not(:disabled){background:var(--skinnr-color-danger-active, #bd2130)}.skinnr-button--active,.skinnr-button--secondary.skinnr-button--active{background:var(--skinnr-color-primary, #0066cc);color:var(--skinnr-color-primary-text, #ffffff)}.skinnr-button--ghost.skinnr-button--active{background:var(--skinnr-color-primary-light, rgba(0, 102, 204, .1));color:var(--skinnr-color-primary, #0066cc)}.skinnr-button__icon{display:inline-flex;align-items:center;justify-content:center;font-size:1.2em;line-height:1}.skinnr-button__text{line-height:1}[data-theme=dark] .skinnr-button--secondary{background:var(--skinnr-color-secondary-dark, #2a2a2a);color:var(--skinnr-color-secondary-text-dark, #e0e0e0)}[data-theme=dark] .skinnr-button--secondary:hover:not(:disabled){background:var(--skinnr-color-secondary-hover-dark, #3a3a3a)}[data-theme=dark] .skinnr-button--ghost{color:var(--skinnr-color-text-dark, #e0e0e0)}[data-theme=dark] .skinnr-button--ghost:hover:not(:disabled){background:var(--skinnr-color-ghost-hover-dark, rgba(255, 255, 255, .1))}.skinnr-slider{display:flex;flex-direction:column;gap:8px;width:100%}.skinnr-slider__header{display:flex;justify-content:space-between;align-items:center;gap:12px}.skinnr-slider__label{font-size:13px;font-weight:500;color:var(--skinnr-color-text, #333333);font-family:var(--skinnr-font-family, system-ui, -apple-system, sans-serif)}.skinnr-slider__value{font-size:12px;font-weight:600;color:var(--skinnr-color-primary, #0066cc);font-family:var(--skinnr-font-family-mono, "SF Mono", Monaco, monospace)}.skinnr-slider__track-container{position:relative;width:100%}.skinnr-slider__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;background:linear-gradient(to right,var(--skinnr-color-primary, #0066cc) 0%,var(--skinnr-color-primary, #0066cc) var(--slider-percentage, 50%),var(--skinnr-color-track, #e0e0e0) var(--slider-percentage, 50%),var(--skinnr-color-track, #e0e0e0) 100%);outline:none;cursor:pointer;transition:opacity .2s ease}.skinnr-slider__input:hover{opacity:.9}.skinnr-slider__input:disabled{opacity:.5;cursor:not-allowed}.skinnr-slider__input:focus-visible{outline:2px solid var(--skinnr-color-primary, #0066cc);outline-offset:2px}.skinnr-slider__input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--skinnr-color-primary, #0066cc);border:2px solid #ffffff;box-shadow:0 2px 4px #0003;cursor:pointer;transition:all .2s ease}.skinnr-slider__input::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 3px 6px #0000004d}.skinnr-slider__input::-webkit-slider-thumb:active{transform:scale(1.05)}.skinnr-slider__input::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--skinnr-color-primary, #0066cc);border:2px solid #ffffff;box-shadow:0 2px 4px #0003;cursor:pointer;transition:all .2s ease}.skinnr-slider__input::-moz-range-thumb:hover{transform:scale(1.1);box-shadow:0 3px 6px #0000004d}.skinnr-slider__input::-moz-range-thumb:active{transform:scale(1.05)}.skinnr-slider__input::-moz-range-track{background:transparent;border:none}[data-theme=dark] .skinnr-slider__label{color:var(--skinnr-color-text-dark, #e0e0e0)}[data-theme=dark] .skinnr-slider__input{background:linear-gradient(to right,var(--skinnr-color-primary, #0066cc) 0%,var(--skinnr-color-primary, #0066cc) var(--slider-percentage, 50%),var(--skinnr-color-track-dark, #3a3a3a) var(--slider-percentage, 50%),var(--skinnr-color-track-dark, #3a3a3a) 100%)}[data-theme=dark] .skinnr-slider__input::-webkit-slider-thumb{border-color:var(--skinnr-color-bg-dark, #1a1a1a)}[data-theme=dark] .skinnr-slider__input::-moz-range-thumb{border-color:var(--skinnr-color-bg-dark, #1a1a1a)}.skinnr-compact-view{display:flex;flex-direction:column;gap:12px;padding:12px;background-color:var(--bg-secondary);border-radius:var(--radius-md)}.skinnr-compact-view.ultra-compact{gap:8px;padding:8px}.compact-section{background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:12px}.ultra-compact .compact-section{padding:8px}.section-header{display:flex;align-items:center;gap:6px;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--border-color)}.ultra-compact .section-header{margin-bottom:6px;padding-bottom:6px}.section-icon{font-size:16px;line-height:1}.section-title{font-size:13px;font-weight:600;color:var(--text-primary);margin:0;text-transform:uppercase;letter-spacing:.05em}.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:6px;margin-bottom:10px}.ultra-compact .theme-grid{gap:4px;margin-bottom:6px}.theme-button{position:relative;display:flex;align-items:center;justify-content:center;padding:6px 10px;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);font-size:12px;font-weight:500;color:var(--text-primary)}.ultra-compact .theme-button{padding:4px 8px;font-size:11px}.theme-button:hover{background-color:var(--bg-hover);border-color:var(--border-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.theme-button.active{background:linear-gradient(135deg,var(--color-primary),var(--color-primary-active));color:#fff;border-color:var(--color-primary);font-weight:600}.theme-name{flex:1}.active-indicator{margin-left:4px;font-size:10px}.mode-toggle-container{display:flex;justify-content:center}.mode-toggle{display:flex;align-items:center;gap:6px;padding:6px 16px;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-normal);font-size:12px;font-weight:500}.ultra-compact .mode-toggle{padding:4px 12px;font-size:11px;gap:4px}.mode-toggle:hover{background-color:var(--bg-hover);border-color:var(--border-hover);transform:scale(1.02)}.mode-toggle.dark-active{background:linear-gradient(135deg,#1e293b,#334155);color:#fff;border-color:#334155}.mode-toggle.light-active{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;border-color:#f59e0b}.mode-icon{font-size:14px;line-height:1}.mode-label{font-weight:600}.color-groups{display:flex;flex-direction:column;gap:10px}.ultra-compact .color-groups{gap:6px}.color-group{display:flex;flex-direction:column;gap:6px}.ultra-compact .color-group{gap:4px}.group-label{font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.color-swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:6px}.ultra-compact .color-swatches{grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:4px}.color-swatch{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.ultra-compact .color-swatch{padding:4px;gap:3px}.color-swatch:hover{border-color:var(--border-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.swatch-color{width:100%;height:24px;border-radius:var(--radius-sm);border:1px solid var(--border-color);box-shadow:inset 0 1px 2px #0000001a}.ultra-compact .swatch-color{height:20px}.swatch-label{font-size:10px;font-weight:500;color:var(--text-secondary);text-align:center;line-height:1.2}.ultra-compact .swatch-label{font-size:9px}.theme-info{display:flex;flex-direction:column;gap:8px}.ultra-compact .theme-info{gap:6px}.info-row{display:flex;align-items:center;gap:8px;font-size:12px}.ultra-compact .info-row{font-size:11px;gap:6px}.info-label{font-weight:600;color:var(--text-secondary);min-width:50px;text-transform:uppercase;font-size:10px;letter-spacing:.05em}.ultra-compact .info-label{font-size:9px;min-width:45px}.info-value{color:var(--text-primary);flex:1}.info-value.badge{display:inline-flex;align-items:center;padding:3px 8px;background:linear-gradient(135deg,var(--color-primary),var(--color-primary-active));color:#fff;border-radius:var(--radius-sm);font-weight:600;font-size:11px;text-transform:capitalize}.ultra-compact .info-value.badge{padding:2px 6px;font-size:10px}.info-value.mode-badge{background:linear-gradient(135deg,var(--color-info),var(--color-info-hover))}.info-value.description{font-size:11px;color:var(--text-secondary);line-height:1.4}.ultra-compact .info-value.description{font-size:10px}@media(max-width:768px){.theme-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.color-swatches{grid-template-columns:repeat(auto-fill,minmax(60px,1fr))}}@media(max-width:480px){.theme-grid{grid-template-columns:1fr 1fr}.color-swatches{grid-template-columns:repeat(auto-fill,minmax(50px,1fr))}}.oc-app-shell{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden;background:var(--surface-base);color:var(--text-primary)}.oc-app-body{display:flex;flex:1;overflow:hidden}.oc-app-content{flex:1;overflow:auto;padding:var(--spacing-lg);background:var(--surface-base)}.oc-app-shell[data-layout=clean] .oc-app-content{padding:0}.oc-topbar{display:flex;align-items:center;justify-content:space-between;height:var(--topbar-height, 48px);padding:0 var(--spacing-md);background:var(--topbar-bg, var(--surface-base));border-bottom:1px solid var(--topbar-border, var(--border-default));flex-shrink:0;z-index:var(--z-sticky)}.oc-topbar-left,.oc-topbar-right{display:flex;align-items:center;gap:var(--spacing-sm)}.oc-topbar-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:transparent;border:none;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast)}.oc-topbar-btn:hover{background:var(--surface-hover);color:var(--text-primary)}.oc-topbar-logo{display:flex;align-items:center;font-size:1.25rem;line-height:1}.oc-topbar-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--text-primary)}.oc-topbar-actions{display:flex;align-items:center;gap:var(--spacing-sm)}.oc-topbar-search-trigger{display:flex;align-items:center;gap:var(--spacing-xs, 4px);padding:var(--spacing-xs, 4px) var(--spacing-sm);font-size:var(--font-size-xs, 12px);border-radius:var(--radius-md);border:1px solid var(--border-default);background:var(--surface-raised, var(--surface-base));color:var(--text-secondary);cursor:pointer;transition:border-color var(--transition-fast)}.oc-topbar-search-trigger:hover{border-color:var(--border-hover, var(--text-secondary))}.oc-topbar-search-trigger .oc-kbd{opacity:.6;font-size:var(--font-size-xs, 11px)}.oc-topbar-notif{position:relative;display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:transparent;border:none;border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;font-size:1rem;transition:background var(--transition-fast)}.oc-topbar-notif:hover{background:var(--surface-hover)}.oc-topbar-notif-badge{position:absolute;top:2px;right:2px;background:var(--color-error, #f44336);color:#fff;border-radius:8px;font-size:9px;font-weight:var(--font-weight-bold, 700);padding:0 4px;min-width:14px;text-align:center;line-height:14px}.oc-topbar-user{position:relative;display:flex;align-items:center;gap:var(--spacing-xs, 4px);background:transparent;border:none;cursor:pointer;padding:2px var(--spacing-xs, 4px);border-radius:var(--radius-md);transition:background var(--transition-fast)}.oc-topbar-user:hover{background:var(--surface-hover)}.oc-topbar-avatar{width:24px;height:24px;border-radius:50%;background:var(--color-primary, #4a9eff);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:var(--font-weight-bold, 700)}.oc-topbar-username{font-size:var(--font-size-xs, 12px);color:var(--text-primary)}.oc-topbar-menu{position:absolute;top:100%;right:0;margin-top:var(--spacing-xs, 4px);background:var(--surface-overlay, var(--surface-raised));border:1px solid var(--border-default);border-radius:var(--radius-lg, 8px);padding:var(--spacing-xs, 4px);min-width:160px;box-shadow:var(--shadow-xl);z-index:var(--z-dropdown, 200)}.oc-topbar-menu-header{padding:var(--spacing-sm) var(--spacing-md, 12px);font-size:var(--font-size-xs, 12px);border-bottom:1px solid var(--border-default);margin-bottom:var(--spacing-xs, 4px)}.oc-topbar-menu-header-name{font-weight:var(--font-weight-medium, 500);color:var(--text-primary)}.oc-topbar-menu-header-email{color:var(--text-secondary);margin-top:2px}.oc-topbar-menu-item{display:block;width:100%;text-align:left;background:none;border:none;padding:var(--spacing-sm) var(--spacing-md, 12px);cursor:pointer;color:var(--text-primary);font-size:var(--font-size-sm, 13px);border-radius:var(--radius-md);transition:background var(--transition-fast)}.oc-topbar-menu-item:hover{background:var(--surface-hover)}.oc-topbar-menu-item--danger{color:var(--color-error, #ff6b6b)}.oc-sidenav{display:flex;flex-direction:column;width:var(--sidebar-width, 240px);background:var(--sidebar-bg, var(--surface-raised));border-right:1px solid var(--sidebar-border, var(--border-default));flex-shrink:0;overflow-y:auto;overflow-x:hidden;transition:width var(--transition-slow) ease}.oc-sidenav--collapsed{width:var(--sidebar-width-collapsed, 64px)}.oc-sidenav-items{flex:1;display:flex;flex-direction:column;padding:var(--spacing-sm) var(--spacing-sm);gap:2px}.oc-sidenav-bottom{display:flex;flex-direction:column;padding:var(--spacing-sm);gap:2px;border-top:1px solid var(--border-default)}.oc-sidenav-item{display:flex;align-items:center;gap:var(--spacing-sm);width:100%;padding:var(--spacing-sm) var(--spacing-sm);background:transparent;border:none;border-radius:var(--radius-md);color:var(--nav-item-text, var(--text-secondary));font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;text-align:left;transition:background var(--transition-fast),color var(--transition-fast);white-space:nowrap}.oc-sidenav-item:hover{background:var(--nav-item-hover, var(--surface-hover));color:var(--text-primary)}.oc-sidenav-item--active{background:var(--nav-item-active, var(--color-primary-light));color:var(--nav-item-text-active, var(--color-primary))}.oc-sidenav-item--active:hover{background:var(--nav-item-active, var(--color-primary-light))}.oc-sidenav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0}.oc-sidenav-label{overflow:hidden;text-overflow:ellipsis;flex:1}.oc-sidenav-action{display:flex;align-items:center;margin-left:auto;opacity:0;transition:opacity var(--transition-fast)}.oc-sidenav-item:hover .oc-sidenav-action{opacity:1}.oc-sidenav--collapsed .oc-sidenav-item{justify-content:center;padding:var(--spacing-sm)}.oc-sidenav--collapsed .oc-sidenav-label{display:none}.oc-tab-nav{display:flex;align-items:stretch;background:var(--surface-raised, var(--surface-base));border-bottom:1px solid var(--border-default);overflow-x:auto;flex-shrink:0;gap:0}.oc-tab-nav-item{display:flex;align-items:center;gap:var(--spacing-xs, 4px);padding:var(--spacing-sm) var(--spacing-md);background:transparent;border:none;border-bottom:2px solid transparent;color:var(--text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;white-space:nowrap;transition:color var(--transition-fast),border-color var(--transition-fast),background var(--transition-fast)}.oc-tab-nav-item:hover{color:var(--text-primary);background:var(--surface-hover)}.oc-tab-nav-item--active{color:var(--color-primary, var(--text-primary));border-bottom-color:var(--color-primary, currentColor)}.oc-tab-nav-item--active:hover{background:transparent}.oc-tab-nav-icon{display:flex;align-items:center;font-size:1rem;line-height:1}.oc-tab-nav-label{line-height:1}.oc-app-shell[data-layout=tabs] .oc-app-body{flex-direction:column}@media(max-width:768px){.oc-sidenav{position:fixed;left:0;top:var(--topbar-height, 48px);bottom:0;z-index:var(--z-fixed);transform:translate(-100%);transition:transform var(--transition-slow) ease;box-shadow:var(--shadow-xl)}.oc-sidenav:not(.oc-sidenav--collapsed){transform:translate(0)}.oc-app-content{padding:var(--spacing-md)}}:root{--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--blue-50: #eff6ff;--blue-100: #dbeafe;--blue-200: #bfdbfe;--blue-300: #93bbfd;--blue-400: #60a5fa;--blue-500: #3b82f6;--blue-600: #2563eb;--blue-700: #1d4ed8;--blue-800: #1e40af;--blue-900: #1e3a8a;--violet-50: #f5f3ff;--violet-100: #ede9fe;--violet-200: #ddd6fe;--violet-300: #c4b5fd;--violet-400: #a78bfa;--violet-500: #8b5cf6;--violet-600: #7c3aed;--violet-700: #6d28d9;--violet-800: #5b21b6;--violet-900: #2e1065;--green-50: #ecfdf5;--green-100: #d1fae5;--green-200: #a7f3d0;--green-300: #6ee7b7;--green-400: #34d399;--green-500: #10b981;--green-600: #059669;--green-700: #047857;--green-800: #065f46;--green-900: #064e3b;--amber-50: #fffbeb;--amber-100: #fef3c7;--amber-200: #fde68a;--amber-300: #fcd34d;--amber-400: #fbbf24;--amber-500: #f59e0b;--amber-600: #d97706;--amber-700: #b45309;--amber-800: #92400e;--amber-900: #78350f;--red-50: #fef2f2;--red-100: #fee2e2;--red-200: #fecaca;--red-300: #fca5a5;--red-400: #f87171;--red-500: #ef4444;--red-600: #dc2626;--red-700: #b91c1c;--red-800: #991b1b;--red-900: #7f1d1d;--cyan-50: #ecfeff;--cyan-100: #cffafe;--cyan-200: #a5f3fc;--cyan-300: #67e8f9;--cyan-400: #22d3ee;--cyan-500: #06b6d4;--cyan-600: #0891b2;--cyan-700: #0e7490;--cyan-800: #155e75;--cyan-900: #164e63}:root{--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-family-mono: "SF Mono", Monaco, "Cascadia Code", "JetBrains Mono", "Fira Code", Consolas, "Courier New", monospace;--font-family-heading: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 2rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--radius-none: 0;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-full: 9999px;--shadow-none: none;--shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, .05);--transition-fast: .15s;--transition-base: .2s;--transition-slow: .3s;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070}[data-theme=dark]{--shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .4), 0 1px 2px -1px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -2px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -4px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .5), 0 8px 10px -6px rgba(0, 0, 0, .3)}:root{--surface-base: #ffffff;--surface-raised: var(--gray-50);--surface-overlay: #ffffff;--surface-popover: #ffffff;--surface-hover: rgba(0, 0, 0, .04);--surface-active: rgba(0, 0, 0, .08);--surface-selected: #e0f2fe;--surface-disabled: var(--gray-100);--text-primary: var(--gray-900);--text-secondary: var(--gray-500);--text-tertiary: var(--gray-400);--text-disabled: var(--gray-300);--text-inverse: #ffffff;--text-link: var(--blue-500);--text-link-hover: var(--blue-600);--border-default: var(--gray-200);--border-subtle: var(--gray-100);--border-strong: var(--blue-500);--border-focus: var(--blue-500);--border-error: var(--red-500);--border-success: var(--green-500);--color-primary: var(--blue-500);--color-primary-hover: var(--blue-600);--color-primary-active: var(--blue-700);--color-primary-light: var(--blue-100);--color-primary-dark: var(--blue-900);--color-secondary: var(--violet-500);--color-secondary-hover: var(--violet-600);--color-secondary-active: var(--violet-700);--color-secondary-light: var(--violet-100);--color-secondary-dark: var(--violet-800);--color-accent: var(--amber-500);--color-accent-hover: var(--amber-600);--color-accent-active: var(--amber-700);--color-accent-light: var(--amber-100);--color-accent-dark: var(--amber-800);--color-success: var(--green-500);--color-success-hover: var(--green-600);--color-success-light: var(--green-100);--color-success-dark: var(--green-800);--color-warning: var(--amber-500);--color-warning-hover: var(--amber-600);--color-warning-light: var(--amber-100);--color-warning-dark: var(--amber-800);--color-error: var(--red-500);--color-error-hover: var(--red-600);--color-error-light: var(--red-100);--color-error-dark: var(--red-800);--color-info: var(--blue-500);--color-info-hover: var(--blue-600);--color-info-light: var(--blue-100);--color-info-dark: var(--blue-900);--color-gray-50: var(--gray-50);--color-gray-100: var(--gray-100);--color-gray-200: var(--gray-200);--color-gray-300: var(--gray-300);--color-gray-400: var(--gray-400);--color-gray-500: var(--gray-500);--color-gray-600: var(--gray-600);--color-gray-700: var(--gray-700);--color-gray-800: var(--gray-800);--color-gray-900: var(--gray-900);--focus-ring: var(--blue-500);--focus-ring-width: 2px;--focus-ring-offset: 2px;--interactive-hover: rgba(0, 0, 0, .05);--interactive-active: rgba(0, 0, 0, .1);--interactive-selected: var(--color-primary-light);--interactive-disabled: var(--surface-disabled);--interactive-focus: var(--focus-ring)}[data-theme=dark]{color-scheme:dark;--surface-base: #111827;--surface-raised: var(--gray-800);--surface-overlay: var(--gray-800);--surface-popover: var(--gray-700);--surface-hover: rgba(255, 255, 255, .06);--surface-active: rgba(255, 255, 255, .1);--surface-selected: #1e3a5f;--surface-disabled: var(--gray-700);--text-primary: var(--gray-50);--text-secondary: var(--gray-400);--text-tertiary: var(--gray-500);--text-disabled: var(--gray-600);--text-inverse: var(--gray-900);--text-link: var(--blue-400);--text-link-hover: var(--blue-300);--border-default: var(--gray-700);--border-subtle: var(--gray-800);--border-strong: var(--blue-400);--border-focus: var(--blue-400);--color-primary: var(--blue-400);--color-primary-hover: var(--blue-500);--color-primary-active: var(--blue-600);--color-primary-light: #1e3a5f;--color-primary-dark: var(--blue-300);--color-secondary: var(--violet-400);--color-secondary-hover: var(--violet-500);--color-secondary-active: var(--violet-600);--color-secondary-light: var(--violet-900);--color-secondary-dark: var(--violet-300);--color-success: var(--green-400);--color-success-hover: var(--green-500);--color-success-light: var(--green-900);--color-success-dark: var(--green-300);--color-warning: var(--amber-400);--color-warning-hover: var(--amber-500);--color-warning-light: var(--amber-900);--color-warning-dark: var(--amber-300);--color-error: var(--red-400);--color-error-hover: var(--red-500);--color-error-light: var(--red-900);--color-error-dark: var(--red-300);--color-info: var(--blue-400);--color-info-hover: var(--blue-500);--color-info-light: #1e3a5f;--color-info-dark: var(--blue-300);--color-gray-50: var(--gray-900);--color-gray-100: var(--gray-800);--color-gray-200: var(--gray-700);--color-gray-300: var(--gray-600);--color-gray-400: var(--gray-500);--color-gray-500: var(--gray-400);--color-gray-600: var(--gray-300);--color-gray-700: var(--gray-200);--color-gray-800: var(--gray-100);--color-gray-900: var(--gray-50);--focus-ring: var(--blue-400);--interactive-hover: rgba(255, 255, 255, .06);--interactive-active: rgba(255, 255, 255, .1)}:root{--button-bg: var(--color-primary);--button-text: var(--text-inverse);--button-border: var(--color-primary);--button-bg-hover: var(--color-primary-hover);--button-border-hover: var(--color-primary-hover);--button-bg-active: var(--color-primary-active);--button-radius: var(--radius-md);--button-padding: var(--spacing-sm) var(--spacing-md);--button-font-size: var(--font-size-sm);--button-font-weight: var(--font-weight-medium);--input-bg: var(--surface-base);--input-text: var(--text-primary);--input-placeholder: var(--text-tertiary);--input-border: var(--color-gray-300);--input-border-focus: var(--color-primary);--input-border-error: var(--border-error);--input-bg-disabled: var(--surface-disabled);--input-bg-error: var(--color-error-light);--input-padding: var(--spacing-sm) .75rem;--input-radius: var(--radius-md);--input-font-size: var(--font-size-sm);--panel-bg: var(--surface-base);--panel-border: var(--border-default);--panel-padding: var(--spacing-md);--frame-bg: var(--surface-raised);--frame-text: var(--text-primary);--view-bg: var(--surface-base);--view-text: var(--text-primary);--card-bg: var(--surface-base);--card-border: var(--border-default);--card-padding: var(--spacing-md);--card-radius: var(--radius-lg);--card-shadow: var(--shadow-sm);--card-shadow-hover: var(--shadow-md);--modal-bg: var(--surface-base);--modal-border: var(--border-default);--modal-padding: var(--spacing-lg);--modal-radius: var(--radius-xl);--modal-shadow: var(--shadow-xl);--modal-backdrop: rgba(0, 0, 0, .5);--tooltip-bg: var(--color-gray-800);--tooltip-text: var(--text-inverse);--tooltip-padding: var(--spacing-xs) var(--spacing-sm);--tooltip-radius: var(--radius-sm);--tab-padding: var(--spacing-sm) var(--spacing-md);--tab-text: var(--text-secondary);--tab-text-hover: var(--text-primary);--tab-text-active: var(--color-primary);--tab-bg-hover: var(--surface-hover);--tab-border-active: var(--color-primary);--dropdown-bg: var(--surface-base);--dropdown-border: var(--color-gray-300);--dropdown-border-focus: var(--color-primary);--dropdown-padding: var(--spacing-sm) .75rem;--dropdown-shadow: var(--shadow-lg);--dropdown-item-hover: var(--surface-hover);--dropdown-item-selected: var(--surface-selected);--nav-bg: var(--surface-raised);--nav-text: var(--text-secondary);--nav-text-hover: var(--text-primary);--nav-item-hover: var(--surface-hover);--nav-item-active: var(--color-primary-light);--nav-item-text: var(--text-secondary);--nav-item-text-active: var(--color-primary);--nav-border: var(--border-default);--table-header-bg: var(--surface-raised);--table-row-hover: var(--surface-hover);--table-row-selected: var(--surface-selected);--table-border: var(--border-subtle);--editor-bg: var(--surface-base);--editor-text: var(--text-primary);--editor-cursor: var(--color-primary);--editor-selection: var(--surface-selected);--editor-line-number: var(--text-tertiary);--editor-line-number-bg: var(--surface-raised);--editor-line-number-active: var(--text-primary);--editor-line-highlight: rgba(0, 0, 0, .04);--editor-border: var(--border-default);--editor-radius: var(--radius-md);--editor-focus-ring: var(--focus-ring);--editor-gutter-border: var(--border-subtle);--syntax-keyword: var(--color-blue-600);--syntax-string: var(--color-green-600);--syntax-comment: var(--text-tertiary);--syntax-number: var(--color-amber-600);--syntax-operator: var(--color-violet-600);--syntax-tag: var(--color-red-600);--syntax-attribute: var(--color-cyan-600);--syntax-heading: var(--text-primary);--syntax-link: var(--color-primary);--syntax-emphasis: var(--text-secondary)}[data-theme=dark]{--tooltip-bg: var(--color-gray-300);--modal-backdrop: rgba(0, 0, 0, .7);--editor-line-highlight: rgba(255, 255, 255, .06)}:root{--topbar-height: 48px;--topbar-bg: var(--surface-base);--topbar-border: var(--border-default);--topbar-text: var(--text-primary);--sidebar-width: 240px;--sidebar-width-collapsed: 64px;--sidebar-bg: var(--surface-raised);--sidebar-border: var(--border-default);--content-padding: var(--spacing-lg);--content-padding-mobile: var(--spacing-md);--content-max-width: 1400px;--breakpoint-mobile: 480px;--breakpoint-tablet: 768px;--breakpoint-desktop: 1024px;--breakpoint-wide: 1400px}:root{--skinnr-primary: var(--color-primary);--skinnr-primary-dark: var(--color-primary-hover);--skinnr-secondary: var(--text-secondary);--skinnr-success: var(--color-success);--skinnr-warning: var(--color-warning);--skinnr-danger: var(--color-error);--skinnr-text-primary: var(--text-primary);--skinnr-text-secondary: var(--text-secondary);--skinnr-text-tertiary: var(--text-tertiary);--skinnr-bg-input: var(--input-bg);--skinnr-bg-secondary: var(--surface-raised);--skinnr-bg-hover: var(--surface-hover);--skinnr-bg-selected: var(--surface-selected);--skinnr-border: var(--border-default);--skinnr-focus: var(--focus-ring);--skinnr-font-family: var(--font-family);--skinnr-font-size-sm: var(--font-size-sm);--skinnr-font-size-xs: var(--font-size-xs);--skinnr-radius: var(--radius-md);--skinnr-radius-md: var(--radius-md);--skinnr-color-text: var(--text-primary);--skinnr-color-text-muted: var(--text-tertiary);--skinnr-color-surface: var(--surface-base);--skinnr-color-surface-alt: var(--surface-raised);--skinnr-color-border: var(--border-default);--skinnr-color-border-subtle: var(--border-subtle);--skinnr-color-hover: var(--surface-hover);--skinnr-color-primary: var(--color-primary);--skinnr-color-primary-light: var(--color-primary-light);--color-bg-primary: var(--surface-base);--color-bg-secondary: var(--surface-raised);--color-bg-tertiary: var(--surface-disabled);--color-text-primary: var(--text-primary);--color-text-secondary: var(--text-secondary);--color-text-tertiary: var(--text-tertiary);--color-border: var(--border-default);--color-border-hover: var(--color-gray-300);--bg-primary: var(--surface-base);--bg-secondary: var(--surface-raised);--bg-tertiary: var(--surface-disabled);--border-color: var(--border-default);--border-color-hover: var(--color-gray-300);--border-color-focus: var(--border-focus);--font-family-sans: var(--font-family);--spacing-1: .25rem;--spacing-2: .5rem;--spacing-3: .75rem;--spacing-4: 1rem;--spacing-6: 1.5rem;--spacing-8: 2rem;--spacing-12: 3rem;--spacing-16: 4rem;--border-radius-sm: var(--radius-sm);--border-radius-md: var(--radius-md);--border-radius-lg: var(--radius-lg);--border-radius-xl: var(--radius-xl);--primary: var(--color-primary);--danger: var(--color-error);--hover-bg: var(--surface-hover);--overlay-bg: var(--modal-backdrop);--primary-alpha-10: var(--color-primary-light);--danger-alpha-10: var(--color-error-light);--tabs-border: var(--border-default)}[data-theme=dark]{--color-border-hover: var(--color-gray-300);--border-color-hover: var(--color-gray-300)}*,*:before,*:after{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;padding:0;overflow:hidden}body{font-family:var(--font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);color:var(--text-primary);background:var(--surface-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code,pre,kbd,samp{font-family:var(--font-family-mono)}button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}a{color:var(--text-link);text-decoration:none}a:hover{color:var(--text-link-hover)}:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring);outline-offset:var(--focus-ring-offset)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-gray-400)}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#f5f5f5;color:#1a1a1a;min-width:320px;min-height:100vh}#root{width:100%}