:root{--red:#ed0015;--red2:#b80010;--black:#050505;--dark:#111827;--bg:#f4f5f7;--text:#111827;--muted:#64748b;--border:#e5e7eb}
*{box-sizing:border-box;font-family:Tahoma,Arial,sans-serif}
body{margin:0;background:radial-gradient(circle at top right,rgba(237,0,21,.08),transparent 30%),var(--bg);color:var(--text)}
a{text-decoration:none;color:inherit}
.login-page{background:#050505;min-height:100vh}
.login-bg{min-height:100vh;position:relative;display:flex;align-items:center;justify-content:center;padding:28px;background:radial-gradient(circle at 15% 20%,rgba(237,0,21,.32),transparent 28%),radial-gradient(circle at 90% 80%,rgba(237,0,21,.16),transparent 24%),linear-gradient(135deg,#050505 0%,#111827 58%,#070707 100%)}
.login-overlay{position:absolute;inset:0;opacity:.08;background-image:linear-gradient(45deg,#fff 1px,transparent 1px),linear-gradient(-45deg,#fff 1px,transparent 1px);background-size:42px 42px}
.login-shell{position:relative;z-index:2;width:min(1120px,100%);min-height:640px;display:grid;grid-template-columns:1.1fr .9fr;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:34px;overflow:hidden;box-shadow:0 35px 100px rgba(0,0,0,.55);backdrop-filter:blur(16px)}
.brand-side{padding:58px;color:#fff;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.brand-badge{width:155px;height:155px;border-radius:34px;background:#050505;border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;box-shadow:0 20px 45px rgba(0,0,0,.45);margin-bottom:26px}
.brand-badge img{max-width:122px;max-height:122px;object-fit:contain}
.brand-side h1{font-size:62px;margin:0;line-height:1;font-weight:900}.brand-side h2{color:var(--red);font-size:31px;margin:12px 0 18px;font-weight:900}.brand-side p{max-width:520px;color:rgba(255,255,255,.82);line-height:2;font-size:17px}
.brand-points{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.brand-points span{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);padding:10px 18px;border-radius:999px;font-weight:900}
.login-box{background:#fff;padding:54px 46px;display:flex;flex-direction:column;justify-content:center;border-right:6px solid var(--red)}
.mobile-logo{display:none;text-align:center;margin-bottom:18px}.mobile-logo img{width:105px;height:105px;object-fit:contain;background:#050505;border-radius:22px;padding:10px}
.login-box h3{font-size:34px;margin:0 0 8px;color:#111827;font-weight:900}.login-subtitle{margin:0 0 28px;color:#64748b}
.login-box label,label{display:block;margin-bottom:8px;font-weight:900;color:#111827}
input,select,textarea{width:100%;padding:13px;border:1px solid #d1d5db;border-radius:12px;margin-bottom:12px;background:#fff;outline:none}textarea{min-height:85px}
.login-box input{height:54px;border-radius:16px;background:#f8fafc;font-size:16px}.login-box input:focus,input:focus,select:focus,textarea:focus{border-color:var(--red);background:#fff;box-shadow:0 0 0 4px rgba(237,0,21,.10)}
.login-btn,.btn-primary,.btn-green{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff}.login-btn{height:56px;border:0;border-radius:16px;font-size:17px;font-weight:900;cursor:pointer;box-shadow:0 14px 28px rgba(237,0,21,.26)}
.login-error{background:#fff1f2;color:#dc2626;border:1px solid #fecdd3;padding:13px 14px;border-radius:14px;margin-bottom:18px;font-weight:900;text-align:center}.login-footer{margin-top:26px;text-align:center;color:#94a3b8;font-size:12px;font-weight:900;letter-spacing:1px}
button,.btn{border:0;border-radius:12px;padding:12px 17px;font-weight:900;cursor:pointer;display:inline-block}.btn-dark{background:var(--dark);color:#fff}.btn-red{background:#dc2626;color:#fff}.btn-gray{background:#f1f5f9;color:#111827}.btn-yellow{background:#f59e0b;color:#111827}
.error{color:#dc2626;font-weight:900;text-align:center}.success{color:#15803d;font-weight:900;text-align:center}
header{background:linear-gradient(90deg,#050505,#111827);color:#fff;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:4px solid var(--red)}
.header-brand{display:flex;align-items:center;gap:14px}.header-logo{width:58px;height:58px;object-fit:contain;background:#050505;border-radius:14px;padding:5px}header h2{margin:0;font-size:25px;font-weight:900}.userbox{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.userbox span{font-weight:900}
.container{max-width:1250px;margin:auto;padding:24px}.nav{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px;background:#fff;padding:12px;border-radius:18px;box-shadow:0 6px 20px rgba(0,0,0,.06)}.nav .btn{background:#fff;border:1px solid var(--border)}.nav .active{background:var(--red);color:#fff;border-color:var(--red)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:22px}.card{background:#fff;border-radius:18px;padding:20px;box-shadow:0 8px 24px rgba(0,0,0,.06);border-top:4px solid var(--red)}.card span{display:block;color:var(--muted);font-size:13px}.card strong{font-size:26px}
.panel{background:#fff;border-radius:20px;padding:22px;margin-bottom:22px;box-shadow:0 8px 24px rgba(0,0,0,.06)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:13px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.06);margin-bottom:22px}th,td{padding:12px;border-bottom:1px solid var(--border);text-align:right;font-size:14px;vertical-align:top}th{background:var(--dark);color:#fff}
.quick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-bottom:24px}.quick-card{background:linear-gradient(145deg,#fff,#f8fafc);border-radius:22px;padding:36px 20px;text-align:center;font-size:22px;font-weight:900;box-shadow:0 10px 28px rgba(0,0,0,.08);border-bottom:6px solid var(--red)}
.searchbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:15px}.searchbar input{max-width:420px}.danger-zone{border:2px dashed #fecaca;background:#fff7f7}.badge{display:inline-block;padding:5px 10px;border-radius:999px;background:#eef2ff;font-weight:800}
@media(max-width:850px){.login-shell{grid-template-columns:1fr;min-height:auto}.brand-side{display:none}.login-box{border-right:0;border-top:6px solid var(--red);padding:38px 26px}.mobile-logo{display:block}}
@media(max-width:700px){header{flex-direction:column;gap:10px;text-align:center}.header-brand{flex-direction:column}.container{padding:12px}}