*{margin:0;padding:0;box-sizing:border-box}
html,body{font-family:'Segoe UI',Tahoma,Arial,sans-serif;color:#1f2937}
.login-body{min-height:100vh;background:linear-gradient(135deg,#0c4a6e,#0369a1 50%,#0284c7);display:flex;align-items:center;justify-content:center;padding:20px}
.login-wrap{width:100%;max-width:420px}
.login-card{background:#fff;border-radius:18px;padding:40px 36px;box-shadow:0 25px 60px rgba(0,0,0,.3)}
.login-logo{font-size:48px;text-align:center;margin-bottom:8px}
.login-card h1{text-align:center;color:#0c4a6e;font-size:24px;margin-bottom:6px}
.login-sub{text-align:center;color:#64748b;font-size:14px;margin-bottom:28px}
.login-card label{display:block;font-size:13px;color:#374151;margin-top:14px;margin-bottom:6px;font-weight:600}
.login-card input{width:100%;padding:12px 14px;border:1.5px solid #cbd5e1;border-radius:8px;font-size:15px}
.login-card input:focus{outline:0;border-color:#0284c7;box-shadow:0 0 0 3px rgba(2,132,199,.15)}
.btn-login{width:100%;margin-top:22px;padding:13px;background:linear-gradient(135deg,#0369a1,#0284c7);color:#fff;border:0;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer}
.btn-login:hover{transform:translateY(-1px);box-shadow:0 8px 16px rgba(2,132,199,.3)}
.alert{padding:11px 14px;border-radius:8px;margin-bottom:14px;font-size:14px}
.alert-err{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}
.alert-warn{background:#fef3c7;color:#92400e;border:1px solid #fde68a}
.alert-info{background:#dbeafe;color:#1e3a8a;border:1px solid #bfdbfe}
.login-foot{text-align:center;margin-top:24px;color:#94a3b8;font-size:12px}
.dash{background:#f1f5f9;min-height:100vh}
.topbar{background:linear-gradient(135deg,#0c4a6e,#0369a1);color:#fff;padding:14px 28px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.brand{display:flex;align-items:center;gap:14px}
.brand .logo{font-size:32px}
.brand-name{font-weight:700;font-size:17px}
.brand-sub{font-size:12px;opacity:.85}
.user-area{display:flex;align-items:center;gap:14px;font-size:14px}
.badge{padding:4px 10px;border-radius:12px;font-size:11px;font-weight:700}
.badge.admin{background:#facc15;color:#713f12}
.badge.user{background:rgba(255,255,255,.2);color:#fff}
.btn{padding:7px 14px;border-radius:6px;text-decoration:none;font-size:13px;font-weight:600}
.btn-admin{background:#fbbf24;color:#7c2d12}
.btn-admin:hover{background:#f59e0b}
.btn-logout{background:#ef4444;color:#fff}
.btn-logout:hover{background:#dc2626}
.container{max-width:1200px;margin:0 auto;padding:30px 24px}
.container h1{color:#0c4a6e;font-size:28px;margin-bottom:6px}
.subtitle{color:#64748b;margin-bottom:24px}
.cat{color:#0369a1;font-size:18px;margin:24px 0 12px;padding-bottom:8px;border-bottom:2px solid #e0f2fe}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.card{background:#fff;border-radius:14px;padding:22px;text-decoration:none;color:#1f2937;box-shadow:0 4px 12px rgba(0,0,0,.06);transition:.25s;border:1px solid #e2e8f0;display:block}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(2,132,199,.18);border-color:#0284c7}
.card-icon{font-size:38px;margin-bottom:10px}
.card-title{font-size:17px;font-weight:700;color:#0c4a6e;margin-bottom:6px}
.card-desc{font-size:13px;color:#64748b;line-height:1.5;min-height:38px}
.card-action{margin-top:14px;color:#0284c7;font-weight:600;font-size:13px}
.empty{background:#fff;border-radius:14px;padding:40px;text-align:center;color:#64748b;border:2px dashed #cbd5e1}
.empty h2{color:#0c4a6e;margin-bottom:10px}
.foot{text-align:center;padding:24px;color:#94a3b8;font-size:13px}
.admin-nav{background:#fff;border-bottom:1px solid #e2e8f0;padding:0 28px;display:flex;gap:4px}
.admin-nav a{padding:14px 20px;color:#475569;text-decoration:none;font-size:14px;font-weight:600;border-bottom:3px solid transparent}
.admin-nav a:hover{color:#0369a1}
.admin-nav a.active{color:#0369a1;border-bottom-color:#0369a1}
.panel{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px rgba(0,0,0,.05);margin-bottom:20px}
.panel h2{color:#0c4a6e;font-size:20px;margin-bottom:16px}
.btn-primary{background:#0284c7;color:#fff;padding:8px 16px;border:0;border-radius:6px;cursor:pointer;text-decoration:none;font-size:13px;font-weight:600;display:inline-block}
.btn-primary:hover{background:#0369a1}
.btn-danger{background:#ef4444;color:#fff;padding:6px 12px;border:0;border-radius:6px;cursor:pointer;font-size:12px}
.btn-edit{background:#facc15;color:#713f12;padding:6px 12px;border-radius:6px;text-decoration:none;font-size:12px;font-weight:600;display:inline-block}
.btn-edit:hover{background:#f59e0b}
table{width:100%;border-collapse:collapse;margin-top:8px}
table th{background:#f1f5f9;padding:11px 14px;text-align:left;font-size:13px;color:#475569;font-weight:700;border-bottom:2px solid #e2e8f0}
table td{padding:11px 14px;font-size:14px;border-bottom:1px solid #e2e8f0}
table tr:hover{background:#f8fafc}
.form-group{margin-bottom:14px}
.form-group label{display:block;font-size:13px;font-weight:600;margin-bottom:5px;color:#374151}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:9px 12px;border:1.5px solid #cbd5e1;border-radius:6px;font-size:14px;font-family:inherit}
.form-group textarea{font-family:Consolas,monospace;font-size:12px;min-height:80px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.checkbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px;margin-top:10px}
.checkbox-grid label{display:flex;align-items:center;gap:8px;background:#f1f5f9;padding:8px 12px;border-radius:6px;cursor:pointer;font-size:14px}
.checkbox-grid label:hover{background:#e0f2fe}
.tag{display:inline-block;padding:2px 8px;background:#e0f2fe;color:#0369a1;border-radius:4px;font-size:11px;font-weight:600}
.tag.role-admin{background:#fef3c7;color:#92400e}
.flash{padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:14px}
.flash.ok{background:#d1fae5;color:#065f46}
.flash.err{background:#fee2e2;color:#991b1b}