.main-layout{min-height:100vh}.header{display:flex;flex-wrap:wrap;height:auto;min-height:64px;gap:12px;align-items:center;padding:0 24px}.logo{color:#fff;font-size:20px;font-weight:700;cursor:pointer;margin-right:24px}.nav-menu{flex:1;min-width:180px}.header-right{margin-left:auto}.content{padding:24px;min-height:calc(100vh - 134px);width:100%;max-width:1200px;margin:0 auto}.footer{text-align:center;color:#999}@media(max-width:600px){.header{padding:12px}.nav-menu{order:3;flex-basis:100%}.content{padding:16px}.logo{margin-right:0}}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2)}.login-card{width:400px}.login-title{text-align:center;margin-bottom:24px;color:#333}.login-footer{text-align:center;color:#666}:root{--bg-primary: #313338;--bg-secondary: #2b2d31;--bg-tertiary: #1e1f22;--bg-accent: #404249;--bg-floating: #232428;--bg-modifier-hover: rgba(79, 84, 92, .4);--bg-modifier-active: rgba(79, 84, 92, .6);--bg-modifier-selected: rgba(79, 84, 92, .32);--text-normal: #f2f3f5;--text-muted: #949ba4;--text-faint: #6d6f78;--text-link: #00a8fc;--text-positive: #23a55a;--text-warning: #f0b232;--text-danger: #f23f43;--interactive-normal: #b5bac1;--interactive-hover: #dbdee1;--interactive-active: #f2f3f5;--interactive-muted: #4e5058;--border-subtle: rgba(255, 255, 255, .06);--border-strong: rgba(255, 255, 255, .1);--scrollbar-thin-thumb: rgba(255, 255, 255, .1);--scrollbar-thin-track: #2b2d31;--brand-primary: #5865f2;--brand-primary-hover: #4752c4;--brand-primary-active: #3c45a5;--brand-success: #23a55a;--brand-danger: #f23f43;--brand-warning: #f0b232;--status-online: #23a55a;--status-idle: #f0b232;--status-dnd: #f23f43;--status-offline: #80848e;--server-sidebar-width: 72px;--channel-sidebar-width: 240px;--member-list-width: 240px;--header-height: 48px;--user-panel-height: 52px;--radius-xs: 3px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-round: 50%;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 24px;--transition-fast: .1s ease;--transition-normal: .2s ease;--transition-slow: .3s ease;--transition-theme: background-color .3s ease, color .3s ease, border-color .3s ease;--shadow-low: 0 1px 0 rgba(0, 0, 0, .2), 0 1.5px 0 rgba(0, 0, 0, .05);--shadow-medium: 0 4px 4px rgba(0, 0, 0, .16);--shadow-high: 0 8px 16px rgba(0, 0, 0, .24);--font-xs: 10px;--font-sm: 12px;--font-md: 14px;--font-lg: 16px;--font-xl: 20px;--font-xxl: 24px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700}[data-theme=light]{--bg-primary: #ffffff;--bg-secondary: #f2f3f5;--bg-tertiary: #e3e5e8;--bg-accent: #e3e5e8;--bg-floating: #ffffff;--bg-modifier-hover: rgba(116, 127, 141, .08);--bg-modifier-active: rgba(116, 127, 141, .16);--bg-modifier-selected: rgba(116, 127, 141, .12);--text-normal: #060607;--text-muted: #4e5058;--text-faint: #80848e;--text-link: #0067e0;--interactive-normal: #4e5058;--interactive-hover: #060607;--interactive-active: #060607;--interactive-muted: #c4c9ce;--border-subtle: rgba(6, 6, 7, .08);--border-strong: rgba(6, 6, 7, .08);--scrollbar-thin-thumb: rgba(74, 77, 83, .2);--scrollbar-thin-track: #e3e5e8;--shadow-low: 0 1px 0 rgba(4, 4, 5, .2), 0 1.5px 0 rgba(6, 6, 7, .05);--shadow-medium: 0 4px 4px rgba(0, 0, 0, .08);--shadow-high: 0 8px 16px rgba(0, 0, 0, .16)}*{margin:0;padding:0;box-sizing:border-box}html,body{min-height:100%}body{font-family:gg sans,Noto Sans SC,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:var(--font-md);line-height:1.375;color:var(--text-normal);background-color:var(--bg-tertiary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--scrollbar-thin-track);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thin-thumb);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:#ffffff26}*{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thin-thumb) var(--scrollbar-thin-track)}::selection{background-color:var(--brand-primary);color:var(--text-normal)}a{color:var(--text-link);text-decoration:none;transition:color var(--transition-fast)}a:hover{text-decoration:underline}button{font-family:inherit;font-size:inherit;border:none;background:none;cursor:pointer;color:inherit}input,textarea{font-family:inherit;font-size:inherit;color:inherit;background:transparent;border:none;outline:none}.text-muted{color:var(--text-muted)}.text-faint{color:var(--text-faint)}.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flex-center{display:flex;align-items:center;justify-content:center}.flex-between{display:flex;align-items:center;justify-content:space-between}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInLeft{0%{transform:translate(-20px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fade-in{animation:fadeIn var(--transition-normal)}.animate-slide-in{animation:slideInLeft var(--transition-normal)}.animate-scale-in{animation:scaleIn var(--transition-normal)}