*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100vh;margin:0;font-family:Inter,system-ui,sans-serif}body{margin:0}.login-page{background:#f5f6f8;justify-content:center;align-items:center;min-height:100vh;display:flex}.login-form{background:#fff;border:1px solid #e2e8f0;border-radius:12px;flex-direction:column;gap:20px;width:100%;max-width:400px;padding:32px;display:flex}.login-form h1{margin:0}.login-form p{color:#64748b;margin:-10px 0 10px}.login-form>p{text-align:center;margin:0 0 24px}.login-form label{flex-direction:column;gap:8px;font-size:14px;display:flex}.login-form input{border:1px solid #cbd5e1;border-radius:8px;padding:12px;font-size:16px}.login-form input:focus{border-color:#2563eb;outline:none}.login-form button{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:8px;padding:12px;font-size:16px}.login-form button:disabled{opacity:.6;cursor:not-allowed}.login-error{color:#991b1b;background:#fee2e2;border-radius:8px;padding:12px}.brand-logo{justify-content:center;align-items:center;gap:12px;margin:0 0 8px;font-size:32px;line-height:1;display:flex}.brand-logo__icon{width:42px;height:42px;display:block}.brand-logo__text{color:#172554;letter-spacing:.08em;font-size:32px;font-weight:700}.dashboard{flex-direction:column;gap:32px;display:flex}.dashboard-title{margin:0;font-size:28px}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;display:grid}.stat-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.stat-card-title{color:#64748b;margin:0 0 12px;font-size:14px}.stat-card-value{margin:0;font-size:32px;font-weight:700}.recent-tasks{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.recent-tasks h2{margin-top:0}.task-list{flex-direction:column;gap:12px;display:flex}.task-item{background:#f8fafc;border-radius:8px;justify-content:space-between;align-items:center;padding:16px;display:flex}.task-status{background:#e2e8f0;border-radius:999px;padding:4px 10px;font-size:13px}.tasks-page{flex-direction:column;gap:24px;display:flex}.tasks-header{justify-content:space-between;align-items:center;display:flex}.tasks-header h1{margin:0}.tasks-header p{color:#64748b;margin:6px 0 0}.tasks-header button{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:8px;padding:10px 16px}.tasks-list{flex-direction:column;gap:12px;display:flex}.task-row{background:#fff;border:1px solid #e2e8f0;border-radius:10px;justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.task-info h3{margin:0 0 6px}.task-info span{color:#64748b;font-size:14px}.status{border-radius:999px;padding:6px 12px;font-size:13px}.status.completed{color:#166534;background:#dcfce7}.status.pending{color:#92400e;background:#fef3c7}.empty-state{text-align:center;color:#64748b;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:40px}.create-task-form{background:#fff;border:1px solid #e2e8f0;border-radius:10px;flex-direction:column;gap:16px;padding:24px;display:flex}.create-task-form input{border:1px solid #cbd5e1;border-radius:8px;width:100%;padding:12px 14px;font-size:16px}.create-task-form input:focus{border-color:#2563eb;outline:none}.create-task-actions{gap:12px;display:flex}.create-task-actions button{cursor:pointer;border:none;border-radius:8px;padding:10px 16px}.app-layout{background:#f5f6f8;min-height:100vh;display:flex}.sidebar{color:#fff;background:#1e293b;width:240px;padding:24px 16px}.logo{margin-bottom:40px;font-size:24px;font-weight:700}.navigation{flex-direction:column;gap:8px;display:flex}.navigation a{color:#cbd5e1;border-radius:8px;padding:12px 16px;text-decoration:none}.navigation a:hover{color:#fff;background:#334155}.navigation a.active{color:#fff;background:#334155;font-weight:600}.main-content{flex-direction:column;flex:1;display:flex}.header{background:#fff;border-bottom:1px solid #e2e8f0;justify-content:flex-end;align-items:center;height:64px;padding:0 32px;display:flex}.page-content{padding:32px}.user-menu{align-items:center;gap:16px;display:flex}.user-name{font-weight:500}.logout-button{cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:8px 14px}.logout-button:hover{background:#f8fafc}