:root{--font-ui: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans TC", sans-serif;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--radius-s: 8px;--radius-m: 10px;--radius-l: 12px;--fs-xs: 12px;--fs-sm: 14px;--fs-md: 16px;--fs-lg: 20px;--fs-xl: 24px;--fw-regular: 400;--fw-medium: 500;--fw-semibold: 600;--fw-bold: 700;--topbar-h: 56px;--nav-w-desktop: 220px;--nav-w-tablet: 64px;--tabbar-h: 60px;--transition: .16s ease}:root[data-theme=dark]{--bg: #000000;--surface: #0b0b0f;--surface-2: #14141a;--border: #26262e;--text: #ececf1;--text-muted: #9a9aa5;--danger: #ff7b7b;--warn: #fbbf24;--ok: #34d399}:root[data-theme=dark]{--accent: #2dd4bf;--accent-contrast: #06211d}:root[data-theme=light]{--bg: #f7f7f5;--surface: #ffffff;--surface-2: #eeeeea;--border: #e3e3e8;--text: #1a1a1e;--text-muted: #6b6b73;--danger: #c62828;--warn: #b45309;--ok: #047857}:root[data-theme=light]{--accent: #0d9488;--accent-contrast: #ffffff}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #000000;--surface: #0b0b0f;--surface-2: #14141a;--border: #26262e;--text: #ececf1;--text-muted: #9a9aa5;--danger: #ff7b7b;--warn: #fbbf24;--ok: #34d399;--accent: #2dd4bf;--accent-contrast: #06211d}}@media(prefers-color-scheme:light){:root:not([data-theme=dark]){--bg: #f7f7f5;--surface: #ffffff;--surface-2: #eeeeea;--border: #e3e3e8;--text: #1a1a1e;--text-muted: #6b6b73;--danger: #c62828;--warn: #b45309;--ok: #047857;--accent: #0d9488;--accent-contrast: #ffffff}}:root[data-accent=teal]{--accent: #2dd4bf;--accent-contrast: #06211d}:root[data-accent=blue]{--accent: #60a5fa;--accent-contrast: #081a33}:root[data-accent=violet]{--accent: #a78bfa;--accent-contrast: #1a1033}:root[data-accent=green]{--accent: #34d399;--accent-contrast: #032016}:root[data-accent=amber]{--accent: #fbbf24;--accent-contrast: #241a02}:root[data-accent=rose]{--accent: #fb7185;--accent-contrast: #2a060c}:root[data-theme=light][data-accent=teal]{--accent: #0d9488;--accent-contrast: #ffffff}:root[data-theme=light][data-accent=blue]{--accent: #2563eb;--accent-contrast: #ffffff}:root[data-theme=light][data-accent=violet]{--accent: #7c3aed;--accent-contrast: #ffffff}:root[data-theme=light][data-accent=green]{--accent: #059669;--accent-contrast: #ffffff}:root[data-theme=light][data-accent=amber]{--accent: #d97706;--accent-contrast: #ffffff}:root[data-theme=light][data-accent=rose]{--accent: #e11d48;--accent-contrast: #ffffff}@media(prefers-color-scheme:light){:root:not([data-theme=dark])[data-accent=teal]{--accent: #0d9488;--accent-contrast: #ffffff}:root:not([data-theme=dark])[data-accent=blue]{--accent: #2563eb;--accent-contrast: #ffffff}:root:not([data-theme=dark])[data-accent=violet]{--accent: #7c3aed;--accent-contrast: #ffffff}:root:not([data-theme=dark])[data-accent=green]{--accent: #059669;--accent-contrast: #ffffff}:root:not([data-theme=dark])[data-accent=amber]{--accent: #d97706;--accent-contrast: #ffffff}:root:not([data-theme=dark])[data-accent=rose]{--accent: #e11d48;--accent-contrast: #ffffff}}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-ui);background:var(--bg);color:var(--text);font-size:var(--fs-sm);line-height:1.5;-webkit-font-smoothing:antialiased;transition:background var(--transition),color var(--transition)}button{font:inherit;cursor:pointer}input,select,textarea{font:inherit}a{color:var(--accent)}.muted{color:var(--text-muted)}.error{color:var(--danger);font-size:var(--fs-sm)}.page-center{min-height:100vh;display:grid;place-items:center;padding:var(--space-4)}.login-card{width:100%;max-width:360px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-l);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-2)}.brand{margin:0;font-size:var(--fs-lg);font-weight:var(--fw-bold);letter-spacing:.02em}.login-card label{margin-top:var(--space-2);font-size:var(--fs-xs);color:var(--text-muted)}input,select,textarea{padding:10px var(--space-3);border:1px solid var(--border);border-radius:var(--radius-s);background:var(--bg);color:var(--text);width:100%}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}textarea{resize:vertical;min-height:96px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:44px;padding:0 var(--space-4);border-radius:var(--radius-s);border:1px solid transparent;font-weight:var(--fw-semibold);font-size:var(--fs-sm);transition:background var(--transition),border-color var(--transition),color var(--transition)}.btn:disabled{opacity:.6;cursor:default}.btn-primary{background:var(--accent);color:var(--accent-contrast)}.btn-primary:hover:not(:disabled){filter:brightness(1.08)}.btn-secondary{background:var(--surface);color:var(--text);border-color:var(--border)}.btn-secondary:hover:not(:disabled){background:var(--surface-2)}.btn-ghost{background:transparent;color:var(--text-muted)}.btn-ghost:hover:not(:disabled){color:var(--text);background:var(--surface-2)}.btn-icon{min-height:44px;min-width:44px;padding:0 var(--space-2)}.shell{min-height:100vh;display:flex;flex-direction:column}.topbar{height:var(--topbar-h);display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-4);border-bottom:1px solid var(--border);background:var(--surface);position:sticky;top:0;z-index:20}.topbar .brand{font-size:var(--fs-md);margin-right:auto}.topbar-user{display:flex;align-items:center;gap:var(--space-2);color:var(--text-muted);font-size:var(--fs-sm)}.avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:var(--accent-contrast);font-weight:var(--fw-bold);font-size:var(--fs-sm)}.layout{display:flex;flex:1;min-height:0}.content{flex:1;min-width:0;padding:var(--space-5);max-width:960px;width:100%;margin:0 auto}.sidebar{display:flex;flex-direction:column;gap:var(--space-1);border-right:1px solid var(--border);background:var(--surface);padding:var(--space-3) var(--space-2)}.nav-item{display:flex;align-items:center;gap:var(--space-3);min-height:44px;padding:0 var(--space-3);border-radius:var(--radius-s);color:var(--text-muted);text-decoration:none;font-weight:var(--fw-medium);transition:background var(--transition),color var(--transition)}.nav-item:hover{background:var(--surface-2);color:var(--text)}.nav-item.active{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}.nav-item svg{flex:none}.nav-label{white-space:nowrap}.tabbar{display:none;height:var(--tabbar-h);border-top:1px solid var(--border);background:var(--surface);position:sticky;bottom:0;z-index:20}.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--text-muted);text-decoration:none;font-size:var(--fs-xs);min-height:44px}.tabbar a.active{color:var(--accent)}.dropdown{position:relative}.dropdown-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:200px;z-index:40;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-m);padding:var(--space-1);box-shadow:0 8px 24px #00000059;display:flex;flex-direction:column;gap:2px}.dropdown-item{display:flex;align-items:center;gap:var(--space-2);width:100%;text-align:left;padding:10px var(--space-3);border-radius:var(--radius-s);border:0;background:transparent;color:var(--text);font-size:var(--fs-sm)}.dropdown-item:hover{background:var(--surface)}.dropdown-item.selected{color:var(--accent);font-weight:var(--fw-semibold)}.dropdown-divider{height:1px;background:var(--border);margin:var(--space-1) 0}.segment{display:flex;gap:2px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-s);padding:2px}.segment button{min-height:36px;min-width:36px;display:grid;place-items:center;border:0;border-radius:6px;background:transparent;color:var(--text-muted)}.segment button.active{background:var(--accent);color:var(--accent-contrast)}.swatches{display:flex;gap:var(--space-2);padding:var(--space-2)}.swatch{width:24px;height:24px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}.swatch.selected{border-color:var(--text)}.swatch:hover{transform:scale(1.1)}.page-head{margin-bottom:var(--space-5)}.page-head h1{margin:0 0 var(--space-1);font-size:var(--fs-xl);font-weight:var(--fw-bold)}.page-head p{margin:0;color:var(--text-muted)}.section{margin-bottom:var(--space-6)}.section-title{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin:0 0 var(--space-3)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-m);padding:var(--space-4)}.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:var(--space-2);padding:var(--space-8) var(--space-4);border:1px dashed var(--border);border-radius:var(--radius-m);color:var(--text-muted)}.empty-icon{color:var(--text-muted);opacity:.7}.empty-title{font-weight:var(--fw-semibold);color:var(--text);margin:0}.empty-hint{margin:0;font-size:var(--fs-sm);max-width:340px}.grid-2{display:grid;grid-template-columns:1fr;gap:var(--space-4)}@media(min-width:768px){.grid-2{grid-template-columns:1fr 1fr}.sidebar{width:var(--nav-w-tablet)}.nav-label{display:none}}@media(min-width:1024px){.sidebar{width:var(--nav-w-desktop)}.nav-label{display:inline}}@media(max-width:767px){.sidebar{display:none}.tabbar{display:flex}.topbar-user span{display:none}.content{padding:var(--space-4)}}