:root{--glass-bg:#ffffff26;--glass-border:#ffffff40;--glass-shadow:0 8px 32px #0000001a;--glass-blur:blur(20px);--radius-lg:24px;--radius-md:16px;--radius-sm:12px;--transition-fast:.15s ease;--transition-med:.3s cubic-bezier(.4, 0, .2, 1);--transition-slow:.5s cubic-bezier(.4, 0, .2, 1);--color-primary:#6366f1;--color-primary-light:#818cf8;--color-primary-dark:#4f46e5;--color-on-primary:#fff;--color-surface:#f0f4f8;--color-surface-glass:#fff9;--color-text:#1e293b;--color-text-secondary:#64748b;--color-border:#94a3b84d;--color-hover:#6366f114;--color-error:#ef4444;--gradient-primary:linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #a78bfa 100%);--gradient-glass:linear-gradient(135deg, #fff6 0%, #ffffff1a 100%)}[data-theme=dark]{--color-surface:#0f172a;--color-surface-glass:#0f172ab3;--color-text:#f1f5f9;--color-text-secondary:#94a3b8;--color-border:#47556966;--color-hover:#6366f126;--glass-bg:#1e293b99;--glass-border:#4755694d;--glass-shadow:0 8px 32px #0000004d;--gradient-glass:linear-gradient(135deg, #33415566 0%, #1e293b33 100%)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--color-surface:#0f172a;--color-surface-glass:#0f172ab3;--color-text:#f1f5f9;--color-text-secondary:#94a3b8;--color-border:#47556966;--color-hover:#6366f126;--glass-bg:#1e293b99;--glass-border:#4755694d;--glass-shadow:0 8px 32px #0000004d;--gradient-glass:linear-gradient(135deg, #33415566 0%, #1e293b33 100%)}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%;min-height:100%}body{background:var(--color-surface);color:var(--color-text);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;transition:background var(--transition-slow), color var(--transition-med);background-image:radial-gradient(at 20% 20%,#6366f114 0%,#0000 50%),radial-gradient(at 80% 80%,#8b5cf60f 0%,#0000 50%);font-family:Inter,Noto Sans SC,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}.glass{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow);transition:all var(--transition-med)}.glass:hover{border-color:#ffffff59;box-shadow:0 12px 40px #00000026}.glass-card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow);transition:all var(--transition-med);opacity:0;animation:.6s cubic-bezier(.16,1,.3,1) forwards slideUp}.glass-card:hover{border-color:var(--color-primary-light);transform:translateY(-4px)scale(1.01);box-shadow:0 20px 50px #6366f126}.portal{max-width:1200px;margin:0 auto;padding:24px}.topbar{z-index:100;background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow);justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;animation:.5s cubic-bezier(.16,1,.3,1) forwards slideDown;display:flex;position:sticky;top:16px}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.brand{align-items:center;gap:14px;display:flex}.brand-mark{border-radius:var(--radius-md);letter-spacing:.5px;width:48px;height:48px;color:var(--color-on-primary);background:var(--gradient-primary);justify-content:center;align-items:center;font-size:1.1rem;font-weight:800;animation:3s ease-in-out infinite pulse;display:inline-flex;box-shadow:0 4px 16px #6366f159}@keyframes pulse{0%,to{box-shadow:0 4px 16px #6366f159}50%{box-shadow:0 4px 24px #6366f180}}.brand-title{background:var(--gradient-primary);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.125rem;font-weight:700}.brand-subtitle{color:var(--color-text-secondary);letter-spacing:.05em;font-size:.75rem}.topnav{align-items:center;gap:8px;display:flex}.topnav a{border-radius:var(--radius-sm);color:var(--color-text-secondary);transition:all var(--transition-fast);padding:8px 16px;font-size:.9rem;font-weight:500;position:relative}.topnav a:after{content:"";background:var(--gradient-primary);width:0;height:2px;transition:all var(--transition-fast);border-radius:1px;position:absolute;bottom:4px;left:50%;transform:translate(-50%)}.topnav a:hover{color:var(--color-text)}.topnav a:hover:after{width:calc(100% - 32px)}.header-actions{align-items:center;gap:8px;display:flex}.btn{border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);border:none;padding:10px 20px;font-size:.875rem;font-weight:600;position:relative;overflow:hidden}.btn:before{content:"";opacity:0;transition:opacity var(--transition-fast);background:linear-gradient(135deg,#fff3 0%,#0000 50%);position:absolute;inset:0}.btn:hover:before{opacity:1}.btn:hover{transform:scale(1.02)}.btn:active{transform:scale(.98)}.btn-tonal{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);color:var(--color-text)}.btn-filled{background:var(--gradient-primary);color:var(--color-on-primary);box-shadow:0 4px 16px #6366f14d}.btn-outlined{border:1px solid var(--color-border);color:var(--color-text);background:0 0}.btn-outlined:hover{border-color:var(--color-primary);color:var(--color-primary)}.main-content{gap:20px;margin-top:24px;display:grid}.hero{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow);grid-template-columns:1.2fr .8fr;align-items:center;gap:24px;padding:40px;animation:.6s cubic-bezier(.16,1,.3,1) forwards slideUp;display:grid}.eyebrow{letter-spacing:.1em;text-transform:uppercase;color:var(--color-primary);background:#6366f11a;border-radius:20px;padding:6px 12px;font-size:.75rem;font-weight:700;animation:.5s forwards fadeIn;display:inline-block}.hero h1{background:linear-gradient(135deg, var(--color-text) 0%, var(--color-primary) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:16px 0;font-size:clamp(2rem,5vw,3rem);font-weight:800;line-height:1.15}.hero-desc{color:var(--color-text-secondary);max-width:50ch;font-size:1.05rem;line-height:1.7}.hero-actions{flex-wrap:wrap;gap:12px;margin-top:24px;display:flex}.hero-image{border-radius:var(--radius-lg);opacity:0;width:100%;max-width:400px;height:auto;animation:.8s cubic-bezier(.16,1,.3,1) .2s forwards scaleIn;box-shadow:0 20px 50px #00000026}.dashboard-grid{grid-template-columns:1fr;gap:20px;display:grid}.card{animation:.6s cubic-bezier(.16,1,.3,1) forwards slideUp;animation-delay:calc(var(--i,0) * .1s);opacity:0;padding:24px}.card-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.card-header h2{font-size:1.25rem;font-weight:700}.text-link{color:var(--color-primary);transition:all var(--transition-fast);font-size:.875rem;font-weight:600}.text-link:hover{opacity:.8}.timeline,.notices{flex-direction:column;gap:16px;list-style:none;display:flex}.timeline li,.notices li{border-radius:var(--radius-sm);transition:all var(--transition-fast);animation:.4s forwards fadeIn;animation-delay:calc(var(--i,0) * 50ms);opacity:0;background:#6366f108;align-items:center;gap:16px;padding:12px 16px;display:flex}.timeline li:hover,.notices li:hover{background:#6366f114;transform:translate(4px)}.time{color:var(--color-primary);min-width:50px;font-size:.875rem;font-weight:700}.item-title{margin-bottom:4px;font-weight:600}.item-sub{color:var(--color-text-secondary);font-size:.8rem}.chip{color:var(--color-primary);white-space:nowrap;background:#6366f11a;border-radius:20px;padding:4px 10px;font-size:.75rem;font-weight:600}.login-page{background:var(--color-surface);background-image:radial-gradient(at 30% 20%,#6366f11a 0%,#0000 50%),radial-gradient(at 70% 80%,#8b5cf614 0%,#0000 50%);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{background:var(--glass-bg);width:100%;max-width:420px;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow);padding:40px;animation:.5s cubic-bezier(.16,1,.3,1) forwards scaleIn}.admin-layout{min-height:100vh;display:flex}.sidebar{background:var(--glass-bg);width:280px;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-right:1px solid var(--glass-border);transition:all var(--transition-med);flex-direction:column;padding:24px;display:flex}.sidebar-header{margin-bottom:32px}.sidebar-header h2{background:var(--gradient-primary);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:800}.user-info{color:var(--color-text-secondary);margin-top:4px;font-size:.8rem}.sidebar-nav{flex-direction:column;flex:1;gap:8px;display:flex}.nav-item{border-radius:var(--radius-md);cursor:pointer;text-align:left;color:var(--color-text-secondary);transition:all var(--transition-fast);background:0 0;border:none;align-items:center;gap:12px;padding:14px 18px;font-size:.9rem;font-weight:500;display:flex}.nav-item:hover{background:var(--color-hover);color:var(--color-text)}.nav-item.active{background:var(--gradient-primary);color:var(--color-on-primary);box-shadow:0 4px 16px #6366f14d}.nav-icon{font-size:1.25rem}.sidebar-footer{border-top:1px solid var(--color-border);flex-direction:column;gap:8px;padding-top:20px;display:flex}.theme-toggle,.logout-btn{border-radius:var(--radius-sm);cursor:pointer;color:var(--color-text-secondary);transition:all var(--transition-fast);background:0 0;border:none;align-items:center;gap:8px;padding:12px 16px;font-size:.875rem;font-weight:500;display:flex}.theme-toggle:hover,.logout-btn:hover{background:var(--color-hover);color:var(--color-text)}.admin-main{flex:1;padding:32px;overflow-y:auto}.admin-section{margin-bottom:32px}.admin-section h3{margin-bottom:20px;font-size:1.5rem;font-weight:700}.data-table{border-collapse:collapse;background:var(--glass-bg);width:100%;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-radius:var(--radius-md);overflow:hidden}.data-table th,.data-table td{text-align:left;border-bottom:1px solid var(--color-border);padding:16px 20px}.data-table th{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary);background:#6366f10d;font-size:.8rem;font-weight:700}.data-table tr{transition:all var(--transition-fast)}.data-table tbody tr:hover{background:var(--color-hover)}.data-table tbody tr{animation:.4s forwards fadeIn;animation-delay:calc(var(--i,0) * 50ms);opacity:0}.form-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-bottom:24px;display:grid}.form-group{flex-direction:column;gap:8px;display:flex}.form-group label{color:var(--color-text-secondary);font-size:.875rem;font-weight:600}.form-group input,.form-group select{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-glass);color:var(--color-text);transition:all var(--transition-fast);padding:14px 16px;font-size:.95rem}.form-group input:focus,.form-group select:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #6366f126}.btn-danger{color:#fff;background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);box-shadow:0 4px 16px #ef444440}.btn-danger:hover{box-shadow:0 6px 20px #ef444459}.btn-sm{padding:8px 14px;font-size:.8rem}.action-btns{gap:8px;display:flex}.empty-state{text-align:center;color:var(--color-text-secondary);padding:48px 24px}@media (width<=768px){.hero{grid-template-columns:1fr;padding:24px}.hero-image{display:none}.topbar{flex-direction:column;gap:12px;padding:16px}.topnav{flex-wrap:wrap;justify-content:center}.admin-layout{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--color-border);width:100%}.sidebar-nav{flex-direction:row;overflow-x:auto}.nav-item{white-space:nowrap}}