:root{--b:#1c4c9b;--b2:#163d80;--y:#f0c84b;--t:#1a2430;--m:#67768a;--bg:#f3f7fd;--w:#fff;--bd:#d6e1f0}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--t)}
a{text-decoration:none;color:var(--b)} .container{max-width:1150px;margin:0 auto;padding:0 16px}
.row{display:flex}.between{justify-content:space-between}.center{align-items:center}
.topbar{background:linear-gradient(180deg,var(--b),var(--b2));padding:16px 0;color:#fff;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.brand{display:flex;gap:10px;align-items:center;color:#fff;font-weight:700}.logo{background:var(--y);color:#142340;border-radius:10px;padding:8px 10px}
.nav{display:flex;gap:14px;flex-wrap:wrap;align-items:center}.nav a{color:#fff}
.page{padding:24px 0 40px}.hero{background:linear-gradient(135deg,#2459b5,#19448b);color:#fff;padding:28px;border-radius:22px}
.hero h1{margin:0 0 10px;font-size:34px}.hero p{margin:0 0 18px;max-width:860px;color:#eef4ff}
.btn{display:inline-flex;padding:11px 16px;border-radius:12px;font-weight:700;border:1px solid transparent;cursor:pointer}
.btn.yellow{background:var(--y);color:#142340}.btn.white{background:#fff;color:var(--b)} .btn.line{border-color:#cfd7e6;background:#fff;color:var(--b)}
.grid{display:grid;gap:18px}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--w);border:1px solid var(--bd);border-radius:18px;padding:18px;box-shadow:0 8px 24px rgba(27,55,97,.06)}
.kpi{font-size:28px;font-weight:700}.muted{color:var(--m)}
.alert{padding:12px 14px;border-radius:12px;margin-bottom:16px}.ok{background:#e8faef}.err{background:#fdeaea}
.form-grid{display:grid;gap:14px}.field label{display:block;font-size:14px;margin-bottom:6px;font-weight:700}.field input,.field select,.field textarea{width:100%;padding:12px;border:1px solid var(--bd);border-radius:12px;background:#fff}
.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;background:#fff}.table th,.table td{border-bottom:1px solid #e9eef6;padding:10px;text-align:left;font-size:14px}
.badge{display:inline-block;padding:5px 9px;border-radius:999px;background:#edf3ff;color:var(--b);font-size:12px;font-weight:700}
.badge.y{background:#fff7d8;color:#7f6000}.badge.g{background:#eaf8ef;color:#157347}.badge.r{background:#fde8e8;color:#b42318}
.footer{padding:18px 0;background:#fff;border-top:1px solid var(--bd)}
.searchbar{display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;gap:10px;margin-top:14px}
.ticket-msg{padding:12px;border-radius:12px;background:#f8fbff;border:1px solid var(--bd);margin-bottom:10px}
@media(max-width:900px){.grid-3,.grid-2,.searchbar{grid-template-columns:1fr}.nav{margin-top:10px}}