*{margin:0;padding:0;box-sizing:border-box}#app{min-height:100vh}.navbar{display:flex;align-items:center;padding:0 2rem;height:60px;background:var(--color-surface);border-bottom:1px solid var(--color-border);box-shadow:var(--shadow-sm);position:fixed;top:0;left:0;right:0;z-index:100}.nav-brand a{font-size:1.1rem;font-weight:700;color:var(--color-text);text-decoration:none}.nav-links{display:flex;gap:1.5rem;margin-left:3rem}.nav-links a{color:var(--color-text-muted);text-decoration:none;padding:.5rem 0;border-bottom:2px solid transparent;transition:color .2s ease,border-color .2s ease}.nav-links a:hover,.nav-links a.router-link-active{color:var(--color-text);border-bottom-color:var(--color-primary)}.nav-user{margin-left:auto;display:flex;align-items:center;gap:1rem}.user-name{color:var(--color-text-muted);text-decoration:none}.user-name:hover{color:var(--color-text)}.logout-btn{background:transparent;border:1px solid var(--color-border);padding:8px 12px;border-radius:var(--radius-md);cursor:pointer;color:var(--color-text);transition:background .2s ease,border-color .2s ease}.logout-btn:hover{background:var(--color-surface-2);border-color:var(--color-border-strong)}main{min-height:100vh;background:var(--color-bg);color:var(--color-text)}main.with-nav{padding-top:60px}:root{--color-bg: #0b0c10;--color-surface: #111218;--color-surface-2: #171923;--color-surface-3: #1d2030;--color-text: #e6e8eb;--color-text-muted: #a3a7b1;--color-primary: #6ea8fe;--color-primary-600: #5b93e8;--color-primary-700: #4a7acc;--color-success: #4caf50;--color-danger: #ef5350;--color-warning: #ffb74d;--color-border: #2a2e3d;--color-border-strong: #3a3f55;--color-focus: #9cc2ff;--color-overlay: rgba(0, 0, 0, .3);--font-sans: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, Apple Color Emoji, Segoe UI Emoji;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-md: 16px;--font-size-lg: 18px;--font-size-xl: 24px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-full: 999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .25);--shadow-md: 0 6px 18px rgba(0, 0, 0, .25);--shadow-lg: 0 12px 32px rgba(0, 0, 0, .35);color-scheme:dark}@media(prefers-color-scheme:light){:root{--color-bg: #f7f7fb;--color-surface: #ffffff;--color-surface-2: #fafbff;--color-surface-3: #f3f5fb;--color-text: #1a1c23;--color-text-muted: #6b7280;--color-primary: #3b82f6;--color-primary-600: #2563eb;--color-primary-700: #1d4ed8;--color-success: #16a34a;--color-danger: #ef4444;--color-warning: #f59e0b;--color-border: #e6e8ee;--color-border-strong: #cfd3dc;--color-focus: #60a5fa;color-scheme:light}}*{box-sizing:border-box}html,body,#app{min-height:100%}html,body{margin:0;padding:0;font-family:var(--font-sans);font-size:var(--font-size-md);line-height:1.6;background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--color-primary);text-decoration:none}a:hover{color:var(--color-primary-600)}:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-5)}.btn,.btn-primary,.btn-secondary,.btn-danger{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:10px 16px;border-radius:var(--radius-md);border:1px solid transparent;font-weight:600;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease,opacity .2s ease,box-shadow .2s ease;text-decoration:none;line-height:1.1}.btn{background:var(--color-surface-2);color:var(--color-text);border-color:var(--color-border)}.btn:hover{background:var(--color-surface-3)}.btn-primary{background:var(--color-primary);color:#fff;border-color:transparent;box-shadow:0 1px #0000000f,0 2px 12px #3b82f640}.btn-primary:hover{background:var(--color-primary-600)}.btn-secondary{background:var(--color-surface-2);color:var(--color-text);border-color:var(--color-border)}.btn-secondary:hover{background:var(--color-surface-3)}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover{opacity:.9}.btn:disabled,.btn-primary:disabled,.btn-secondary:disabled,.btn-danger:disabled{opacity:.6;cursor:not-allowed;box-shadow:none}input,select,textarea{width:100%;padding:12px 14px;background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-md);outline:none;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}input::placeholder,textarea::placeholder{color:var(--color-text-muted)}input:focus,select:focus,textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #6366f140}label{display:block;font-weight:600;margin-bottom:var(--space-2);color:var(--color-text)}.badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:600}.dropzone{border:2px dashed var(--color-border-strong);border-radius:var(--radius-lg);padding:var(--space-8);background:var(--color-surface-2);transition:background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}.dropzone:hover{background:var(--color-surface-3);border-color:var(--color-primary-600)}table{width:100%;border-collapse:collapse}th,td{border:1px solid var(--color-border);padding:8px}thead th{background:var(--color-surface-2)}