:root{
  --brand-blue:#0B3A75;
  --brand-blue-2:#082F61;
  --brand-orange:#F28C28;
  --brand-orange-2:#D87412;
  --brand-dark:#10233F;
  --brand-light:#F4F7FB;
  --white:#fff;
  --muted:#667085;
  --muted-2:#8A96A8;
  --line:#E4EAF3;
  --line-strong:#D5DFEC;
  --danger:#B42318;
  --success:#027A48;
  --warning:#B54708;
  --info:#175CD3;
  --shadow-sm:0 8px 20px rgba(16,35,63,.06);
  --shadow:0 20px 55px rgba(16,35,63,.13);
  --radius:18px;
  --sidebar:292px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;background:var(--brand-light);color:var(--brand-dark);line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
input,textarea,button,select{font:inherit}
button{border:0}
code{background:#EEF3FB;border:1px solid #DDE7F3;border-radius:9px;padding:.12rem .42rem;font-size:.88em;color:#143A66}
hr{border:0;border-top:1px solid var(--line);margin:18px 0}
small{color:var(--muted);font-weight:600}.icon{width:20px;height:20px;display:inline-block;vertical-align:-4px;flex:0 0 auto}

.login-page{min-height:100vh;background:radial-gradient(circle at 15% 15%,rgba(242,140,40,.18),transparent 32%),radial-gradient(circle at 90% 0%,rgba(11,58,117,.14),transparent 30%),linear-gradient(135deg,#FAFCFF,#ECF3FA)}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:clamp(18px,4vw,44px)}
.login-card{width:min(455px,100%);background:rgba(255,255,255,.97);border:1px solid rgba(213,223,236,.85);box-shadow:var(--shadow);border-radius:30px;padding:clamp(24px,4vw,38px);position:relative;overflow:hidden}
.login-card::before{content:"";position:absolute;inset:0 0 auto;height:7px;background:linear-gradient(90deg,var(--brand-blue),var(--brand-orange));}
.login-logo,.brand-mark{background:linear-gradient(135deg,var(--brand-blue),#15559F);color:#fff;font-weight:900;letter-spacing:.045em;box-shadow:inset 0 -4px 0 rgba(242,140,40,.92)}
.login-logo{width:78px;height:78px;border-radius:24px;display:grid;place-items:center;margin:0 auto 16px;font-size:1.15rem}
.login-card h1{text-align:center;margin:0;font-size:clamp(1.75rem,4vw,2.15rem);line-height:1.1;letter-spacing:-.03em}.subtitle{text-align:center;color:var(--muted);margin:.45rem 0 1.6rem;font-weight:600}.small-muted{font-size:.84rem;color:var(--muted);text-align:center;margin:18px 0 0}
.login-actions{text-align:center;margin-top:18px;font-weight:800;color:var(--brand-blue)}.login-actions a:hover{text-decoration:underline;text-underline-offset:3px}

.form-stack,.form-grid{display:grid;gap:16px}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.full{grid-column:1/-1}
label{display:grid;gap:8px;font-weight:800;font-size:.92rem;color:#243B59}input,textarea,select{width:100%;border:1px solid #D5DFEC;border-radius:14px;padding:12px 14px;background:#fff;color:var(--brand-dark);outline:none;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}textarea{resize:vertical;line-height:1.55}input::placeholder,textarea::placeholder{color:#9AA7B8}input:focus,textarea:focus,select:focus{border-color:var(--brand-blue);box-shadow:0 0 0 4px rgba(11,58,117,.1)}input:disabled{background:#F2F5FA;color:#7C8798}.btn{border-radius:14px;padding:11px 16px;font-weight:900;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease;border:1px solid transparent;white-space:nowrap}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,var(--brand-orange),#FFA23D);color:#161616;box-shadow:0 10px 22px rgba(242,140,40,.24)}.btn-primary:hover{background:linear-gradient(135deg,var(--brand-orange-2),var(--brand-orange))}.btn-secondary{background:var(--brand-blue);color:#fff;box-shadow:0 10px 22px rgba(11,58,117,.16)}.btn-light{background:#EEF4FB;color:var(--brand-blue);border-color:#DCE7F5}.btn-danger{background:#FEE4E2;color:var(--danger);border-color:#FECDCA}.btn-warning{background:#FFF2CC;color:#8A5A00;border-color:#FEE58A}

.app-layout{display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);min-height:100vh;background:linear-gradient(180deg,#F7FAFD,#EEF4FA)}
.sidebar{background:rgba(255,255,255,.96);border-right:1px solid var(--line);padding:22px 18px;position:sticky;top:0;height:100vh;overflow:auto;z-index:20;box-shadow:8px 0 28px rgba(16,35,63,.035)}.sidebar::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-thumb{background:#D7E1ED;border-radius:99px}
.sidebar-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-mark{width:50px;height:50px;border-radius:17px;display:grid;place-items:center;font-size:.92rem;flex:0 0 auto}.brand strong{display:block;font-size:1.02rem;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand span{display:block;color:var(--muted);font-size:.82rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-toggle{display:none;background:#EEF4FB;border:1px solid var(--line);border-radius:12px;width:42px;height:42px;padding:10px;cursor:pointer}.sidebar-toggle span{display:block;height:2px;background:var(--brand-blue);border-radius:99px;margin:4px 0}.sidebar-nav{display:grid;gap:5px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 13px;border-radius:15px;color:#344054;font-weight:800;margin:1px 0;border:1px solid transparent;transition:background .16s ease,color .16s ease,border-color .16s ease}.nav-icon{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;color:var(--brand-blue);background:#F3F7FC;flex:0 0 auto}.nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-item:hover{background:#F7FAFD;border-color:#E6EEF8}.nav-item.active{background:linear-gradient(135deg,rgba(11,58,117,.1),rgba(242,140,40,.09));color:var(--brand-blue);border-color:#D9E5F3}.nav-item.active .nav-icon{background:#fff;color:var(--brand-orange);box-shadow:0 8px 18px rgba(16,35,63,.06)}
.content{padding:clamp(18px,3vw,34px);max-width:1320px;width:100%;margin:0 auto;min-width:0}.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}.topbar h1{font-size:clamp(1.55rem,3vw,2.05rem);line-height:1.12;margin:0;letter-spacing:-.035em}.topbar p{margin:.35rem 0 0;color:var(--muted);font-weight:600}.topbar .btn{margin-top:2px}.card,.stat-card{background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:clamp(16px,2.3vw,22px)}.card + .card,.card + .table-card,.form-grid + .card,.table-card + .card{margin-top:16px}.alert{border-radius:15px;padding:13px 15px;margin:0 0 16px;font-weight:800;border:1px solid transparent}.alert-danger{background:#FEE4E2;color:var(--danger);border-color:#FECDCA}.alert-success{background:#DCFAE6;color:var(--success);border-color:#ABEFC6}.alert-warning{background:#FFF7E0;color:var(--warning);border-color:#FEE58A}.alert-info{background:#EAF2FF;color:var(--info);border-color:#C9DBFF}

.searchbar{display:flex;gap:10px;margin-bottom:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm);border-radius:18px;padding:10px}.searchbar input{flex:1;border:0;box-shadow:none;background:#F8FAFD}.searchbar input:focus{box-shadow:none}.message-list{padding:0;overflow:hidden}.message-row{display:grid;grid-template-columns:minmax(160px,260px) minmax(0,1fr) 140px;gap:16px;padding:16px 18px;border-bottom:1px solid var(--line);align-items:center;transition:background .16s ease}.message-row:last-child{border-bottom:0}.message-row:hover{background:#FAFCFF}.message-row.unread{background:linear-gradient(90deg,rgba(242,140,40,.09),rgba(255,255,255,0))}.message-row.unread .message-from,.message-row.unread .message-subject{font-weight:900;color:var(--brand-dark)}.message-from,.message-subject{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.message-from{color:#253D5B;font-weight:800}.message-subject{color:#344054}.message-date{color:var(--muted);font-size:.9rem;text-align:right;font-weight:700}.empty-state{padding:48px 20px;text-align:center;color:var(--muted);font-weight:700}.pagination{display:flex;align-items:center;justify-content:center;gap:14px;margin:18px 0;color:var(--muted);font-weight:800}.message-view .message-meta{margin:7px 0;color:#344054}.message-view .message-meta strong{color:var(--brand-dark)}.mail-frame{width:100%;min-height:420px;border:1px solid var(--line);border-radius:15px;background:#fff}.message-body pre{white-space:pre-wrap;font-family:inherit;line-height:1.65;color:#243B59}.attachments{display:flex;flex-wrap:wrap;gap:10px}.attachment{background:#EEF4FB;border:1px solid #DCE7F5;border-radius:13px;padding:10px 12px;color:var(--brand-blue);font-weight:800;display:inline-flex;align-items:center;gap:8px}.attachment small{margin-left:2px}.message-actions,.form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}

.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:18px}.stat-card{position:relative;overflow:hidden}.stat-card::after{content:"";position:absolute;right:-28px;top:-28px;width:84px;height:84px;border-radius:50%;background:rgba(242,140,40,.12)}.stat-card span{display:block;color:var(--muted);font-size:.9rem;font-weight:800}.stat-card strong{display:block;font-size:clamp(1.25rem,2.8vw,1.65rem);line-height:1.2;margin-top:6px;color:var(--brand-blue);letter-spacing:-.025em}.table-card{overflow:auto;padding:0}table{width:100%;border-collapse:collapse;min-width:760px}th,td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{font-size:.78rem;text-transform:uppercase;color:var(--muted);letter-spacing:.07em;background:#F8FAFD}td{font-size:.93rem}tr:last-child td{border-bottom:0}.inline-form{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap;margin:3px}.inline-form input{max-width:190px;padding:9px 11px;border-radius:11px}.inline-form .btn{min-height:38px;padding:8px 12px;border-radius:11px}ul{padding-left:20px}li{margin:7px 0}

@media(max-width:1080px){:root{--sidebar:262px}.message-row{grid-template-columns:minmax(140px,220px) minmax(0,1fr) 120px}.content{padding:22px}}
@media(max-width:920px){.app-layout{grid-template-columns:1fr}.sidebar{position:sticky;height:auto;top:0;border-right:0;border-bottom:1px solid var(--line);padding:14px 16px}.sidebar-top{margin-bottom:0}.sidebar-toggle{display:block}.sidebar-nav{display:none;margin-top:12px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.sidebar.open .sidebar-nav{display:grid}.brand-mark{width:46px;height:46px}.content{padding:18px}.topbar{align-items:stretch;flex-direction:column}.topbar .btn{width:fit-content}.form-grid,.stats-grid{grid-template-columns:1fr}.searchbar{flex-direction:column}.message-row{grid-template-columns:1fr;gap:6px}.message-date{text-align:left}.message-from{font-size:.95rem}.message-subject{font-size:1rem}.pagination{flex-wrap:wrap}.mail-frame{min-height:360px}table{min-width:680px}}
@media(max-width:620px){.login-shell{padding:14px}.login-card{border-radius:24px}.login-logo{width:68px;height:68px;border-radius:20px}.sidebar-nav{grid-template-columns:1fr}.nav-item{padding:11px}.nav-icon{width:32px;height:32px}.content{padding:14px}.card,.stat-card{border-radius:16px}.btn{width:100%;white-space:normal}.topbar .btn{width:100%}.message-actions .btn,.message-actions form,.form-actions .btn,.form-actions a{width:100%}.inline-form,.inline-form input,.inline-form .btn{width:100%;max-width:none}.searchbar{padding:8px}.message-list{border-radius:16px}.message-row{padding:15px}.attachments{display:grid}.attachment{justify-content:flex-start}.brand strong{font-size:.98rem}.brand span{font-size:.78rem}}
@media(min-width:921px){.sidebar-nav{display:grid!important}}
