:root{--color-bg-primary: #0f0f14;--color-bg-secondary: #1a1a24;--color-bg-tertiary: #24242e;--color-bg-elevated: #2d2d3a;--color-bg-hover: #363644;--color-bg-active: #3f3f4d;--color-text-primary: #e8e8ee;--color-text-secondary: #b0b0bc;--color-text-tertiary: #808090;--color-text-disabled: #5a5a66;--color-border: #2d2d3a;--color-border-hover: #3f3f4d;--color-border-focus: #5a5ff5;--color-accent: #5a5ff5;--color-accent-hover: #6b70ff;--color-accent-active: #4a4fd5;--color-success: #22c55e;--color-success-bg: #14532d;--color-warning: #f59e0b;--color-warning-bg: #451a03;--color-error: #ef4444;--color-error-bg: #450a0a;--color-info: #3b82f6;--color-info-bg: #1e3a8a;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -2px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .6), 0 10px 10px -5px rgba(0, 0, 0, .3);--font-family-base: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-family-mono: "JetBrains Mono", "Fira Code", "Courier New", monospace;--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: 1.875rem;--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;--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--z-dropdown: 1000;--z-modal: 2000;--z-tooltip: 3000;--header-height: 3.5rem;font-family:var(--font-family-base);line-height:var(--line-height-normal);font-weight:var(--font-weight-normal);color:var(--color-text-primary);background-color:var(--color-bg-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box}body{margin:0;padding:0}#app{display:flex;flex-direction:column;min-height:100vh}header{display:flex;justify-content:flex-end;background-color:var(--color-bg-secondary);border-bottom:1px solid var(--color-border);height:var(--header-height);position:sticky;top:0;z-index:var(--z-dropdown);box-shadow:var(--shadow-sm)}header nav{display:flex}header a{color:var(--color-text-secondary);padding:var(--spacing-md) var(--spacing-lg);text-decoration:none;transition:all var(--transition-fast);display:flex;align-items:center;font-weight:var(--font-weight-medium)}header a.active{color:var(--color-text-primary);background-color:var(--color-bg-active)}header a:hover{background-color:var(--color-bg-hover);color:var(--color-text-primary)}main{display:flex;margin:0 auto;width:100%;flex:1}.container{width:100%;padding:var(--spacing-xl);margin:0 auto}@media(max-width:768px){main .container{padding-left:var(--spacing-md);padding-right:var(--spacing-md)}}.footer{padding-top:var(--spacing-xl);border-top:1px solid var(--color-border);text-align:center}.footer__text{font-size:var(--font-size-sm);color:var(--color-text-tertiary);line-height:var(--line-height-relaxed)}.footer a{color:var(--color-accent);text-decoration:none;font-weight:var(--font-weight-medium)}.footer a:hover{color:var(--color-accent-hover);text-decoration:underline}h1,h2,h3,h4,h5,h6{margin:0 0 var(--spacing-md) 0;font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);color:var(--color-text-primary)}h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}h3{font-size:var(--font-size-xl)}h4{font-size:var(--font-size-lg)}h5{font-size:var(--font-size-base)}h6{font-size:var(--font-size-sm)}p{margin:0 0 var(--spacing-md) 0}button{background-color:var(--color-accent);color:var(--color-text-primary);border:none;padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast);font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);min-height:3rem}button:hover:not(:disabled){background-color:var(--color-accent-hover);box-shadow:var(--shadow-md)}button:active:not(:disabled){background-color:var(--color-accent-active);box-shadow:var(--shadow-sm)}button.secondary{background-color:var(--color-bg-tertiary);color:var(--color-text-primary)}button.secondary:hover:not(:disabled){background-color:var(--color-bg-hover)}button.danger{background-color:var(--color-error)}button.danger:hover:not(:disabled){background-color:#dc2626}button:disabled{background-color:var(--color-bg-tertiary);color:var(--color-text-disabled);cursor:not-allowed;opacity:.6}input[type=file]{font-family:inherit;font-size:var(--font-size-sm);color:var(--color-text-secondary);cursor:pointer}input[type=file]:disabled{cursor:not-allowed;opacity:.5}input[type=file]::file-selector-button{background-color:var(--color-bg-tertiary);color:var(--color-text-primary);border:1px solid var(--color-border);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast);margin-right:var(--spacing-sm)}input[type=file]::file-selector-button:hover{background-color:var(--color-bg-hover);border-color:var(--color-border-hover)}input[type=file]:disabled::file-selector-button{cursor:not-allowed;opacity:.5}.error{color:var(--color-error)}.flex{display:flex}.w-100{width:100%}.text-center{text-align:center}.text-muted{color:var(--color-text-secondary)}.text-small{font-size:var(--font-size-sm)}code,pre{font-family:var(--font-family-mono);background-color:var(--color-bg-tertiary);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);font-size:var(--font-size-sm)}b,strong{font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}i,em{font-style:italic}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-bg-elevated);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--color-bg-hover)}::selection{background-color:var(--color-accent);color:var(--color-text-primary)}.card{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);transition:border-color var(--transition-base)}.card:hover{border-color:var(--color-border-hover)}
