:root{--primary:#4f6ef7;--primary-hover:#3f5ce0;--primary-light:#e9edfe;--bg-color:#eef1fa;--surface:#fff;--surface-soft:#f5f7fd;--text-color:#242a42;--text-muted:#6b7290;--text-subtle:#9aa0ba;--border-color:#e3e7f5;--error-color:#ef4757;--error-soft:#ffe6ea;--success-color:#1fb573;--success-soft:#ddfaee;--warning-color:#f2a30f;--warning-soft:#fff3da;--r-sm:14px;--r-md:18px;--r-lg:26px;--r-pill:999px;--shadow-clay:0 16px 32px -14px #3f51b547, 0 3px 8px #3f51b514;--shadow-clay-sm:0 8px 18px -8px #3f51b538, 0 2px 5px #3f51b512;--shadow-clay-hover:0 20px 38px -12px #3f51b552, 0 6px 14px #3f51b51f;--shadow-btn-primary:0 10px 22px -8px #4f6ef78c, 0 2px 4px #4f6ef740;--shadow-btn-primary-hover:0 14px 26px -8px #4f6ef799, 0 3px 6px #4f6ef74d;--shadow-btn-danger:0 10px 22px -8px #ef475780, 0 2px 4px #ef475738;--shadow-inset:inset 0 2px 5px #3f51b51f}@media (width<=480px){:root{--r-lg:20px;--r-md:15px}}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-tap-highlight-color:transparent}body{background-color:var(--bg-color);color:var(--text-color);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5}.container{max-width:1200px;margin:0 auto;padding:1rem}.loading-screen{flex-direction:column;justify-content:center;align-items:center;height:100vh;display:flex}.loading-container{justify-content:center;padding:4rem 0;display:flex}.spinner{border:4px solid var(--border-color);border-left-color:var(--primary);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}.spinner-sm{border-width:2px;width:1.5rem;height:1.5rem}@keyframes spin{to{transform:rotate(360deg)}}.icon-primary{color:var(--primary)}.btn-icon{color:var(--text-subtle);cursor:pointer;border-radius:var(--r-pill);background:0 0;border:none;padding:.4rem;transition:background .15s,color .15s;display:inline-flex}.btn-icon:hover{background:var(--primary-light);color:var(--primary)}.btn-icon-danger:hover{color:var(--error-color);background:var(--error-soft)}.empty-state{text-align:center;color:var(--text-muted);grid-column:1/-1;padding:4rem 1rem}.btn{border-radius:var(--r-md);cursor:pointer;border:none;justify-content:center;align-items:center;gap:.5rem;padding:.65rem 1.15rem;font-size:.9375rem;font-weight:600;transition:transform .15s,box-shadow .15s,filter .15s,background .15s;display:inline-flex}.btn:active:not(:disabled){transform:translateY(1px)scale(.99)}.btn:disabled{cursor:not-allowed;opacity:.6}.btn-primary{background:linear-gradient(150deg, #6f8bff, var(--primary) 55%, var(--primary-hover));color:#fff;box-shadow:var(--shadow-btn-primary)}.btn-primary:hover:not(:disabled){box-shadow:var(--shadow-btn-primary-hover);transform:translateY(-1px)}.btn-outline{background:var(--surface);color:var(--text-color);border:1px solid var(--border-color);box-shadow:var(--shadow-clay-sm)}.btn-outline:hover:not(:disabled){box-shadow:var(--shadow-clay);border-color:#ccd4f2;transform:translateY(-1px)}.btn-outline:disabled{box-shadow:none}.btn-danger{background:linear-gradient(150deg, #ff6b7a, var(--error-color));color:#fff;box-shadow:var(--shadow-btn-danger)}.btn-danger:hover:not(:disabled){transform:translateY(-1px)}.btn-block{justify-content:center;width:100%;height:2.85rem;margin-top:1rem}.btn-secondary{background:var(--surface);border:1px solid var(--border-color);width:100%;height:2.85rem;color:var(--text-muted);border-radius:var(--r-md);box-shadow:var(--shadow-clay-sm);cursor:pointer;justify-content:center;align-items:center;gap:.5rem;margin-top:.75rem;font-weight:600;transition:all .2s;display:flex}.btn-secondary:hover:not(:disabled){color:var(--primary);box-shadow:var(--shadow-clay);transform:translateY(-1px)}.btn-secondary:disabled{opacity:.6;cursor:not-allowed}.form-group{margin-bottom:1rem}.form-group label{color:var(--text-muted);margin-bottom:.375rem;font-size:.875rem;font-weight:600;display:block}.form-control{border:1px solid var(--border-color);border-radius:var(--r-sm);background:var(--surface-soft);width:100%;box-shadow:var(--shadow-inset);color:var(--text-color);padding:.65rem .9rem;font-size:1rem;transition:border-color .2s,box-shadow .2s,background .2s}.form-control::placeholder{color:var(--text-subtle)}.form-control:focus{border-color:var(--primary);background:var(--surface);box-shadow:var(--shadow-inset), 0 0 0 3px var(--primary-light);outline:none}.form-control:disabled{opacity:.65;cursor:not-allowed}.alert{border-radius:var(--r-sm);margin-top:0;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}.alert-error{background:var(--error-soft);color:#a3172b}.alert-success{background:var(--success-soft);color:#0d6b45}.modal-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1000;background:#1e213373;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal-content{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-clay-hover);width:100%;max-width:500px;max-height:calc(100vh - 2rem);padding:2rem;overflow-y:auto}.modal-header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.modal-header h2{font-size:1.15rem}.btn-close{background:var(--surface-soft);color:var(--text-subtle);cursor:pointer;border-radius:var(--r-pill);border:none;padding:.375rem;transition:all .15s;display:flex}.btn-close:hover{color:var(--error-color);background:var(--error-soft)}.modal-footer{justify-content:flex-end;gap:.75rem;margin-top:2rem;display:flex}@media (width<=640px){.container{padding:.75rem}.modal-content{padding:1.5rem}.modal-footer{flex-direction:column-reverse}.modal-footer .btn{width:100%}}.login-container{background:radial-gradient(circle at 15% 15%, #6f8bff29, transparent 45%), radial-gradient(circle at 85% 85%, #6f8bff1f, transparent 45%), var(--bg-color);justify-content:center;align-items:center;min-height:100vh;padding:1.5rem 1rem;display:flex}.login-card{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-clay-hover);width:100%;max-width:420px;padding:2.5rem}.login-header{text-align:center;margin-bottom:2rem}.login-icon{color:var(--primary);margin-bottom:1rem}.login-header h1{color:var(--text-color);font-size:1.875rem;font-weight:700}.login-header p{color:var(--text-muted);margin-top:.5rem}@media (width<=480px){.login-card{padding:1.75rem 1.5rem}.login-header h1{font-size:1.5rem}}