.panel-wrap{display:block;min-height:100vh;background:#070d1c}
@media(min-width:1024px){
    .panel-wrap{display:grid;grid-template-columns:280px 1fr}
    html[dir="ltr"] .panel-wrap{grid-template-columns:280px 1fr}
}

/* Sidebar */
.sidebar{background:linear-gradient(180deg,#0b1428 0%,#0f1729 100%);border-color:#1e293b;scrollbar-width:thin;scrollbar-color:#334155 transparent}
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-thumb{background:#334155;border-radius:3px}

.sidebar-brand{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;background:linear-gradient(135deg,rgba(59,130,246,.1),rgba(6,182,212,.06));border:1px solid rgba(96,165,250,.15)}
.brand-logo{width:44px;height:44px;min-width:44px;border-radius:14px;background:linear-gradient(135deg,#2563eb,#06b6d4);display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff;overflow:hidden;position:relative;box-shadow:0 8px 20px -6px rgba(37,99,235,.5);padding:4px}
.brand-logo.admin{background:linear-gradient(135deg,#7c3aed,#ec4899)}
.brand-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.brand-fallback{display:none}
.brand-text{display:flex;flex-direction:column;line-height:1.3;overflow:hidden}
.brand-text strong{font-size:14px;color:#e8eeff;font-weight:800;white-space:nowrap}
.brand-text small{font-size:11px;color:#8fa1c7}

.sidebar-nav{display:flex;flex-direction:column;gap:3px;flex:1;margin-top:20px}
.sidebar-nav a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;color:#8fa1c7;font-weight:600;font-size:14px;transition:all .25s;position:relative;overflow:hidden}
.sidebar-nav a:hover{background:rgba(59,130,246,.1);color:#60a5fa;transform:translateX(-4px)}
html[dir="ltr"] .sidebar-nav a:hover{transform:translateX(4px)}
.sidebar-nav a.active{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;box-shadow:0 8px 24px -8px rgba(37,99,235,.6)}
.sidebar-nav a i{width:20px;text-align:center;font-size:15px;flex-shrink:0}
.sidebar-logout{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;color:#f87171;font-weight:700;font-size:14px;background:rgba(239,68,68,.08);transition:all .25s;border:1px solid rgba(239,68,68,.15);margin-top:auto}
.sidebar-logout:hover{background:#ef4444;color:#fff;transform:translateY(-2px);box-shadow:0 12px 24px -8px rgba(239,68,68,.5)}

.main-area{padding:20px 16px;overflow-x:auto;min-height:100vh;background:#070d1c}
@media(min-width:768px){.main-area{padding:28px 32px}}
@media(min-width:1280px){.main-area{padding:32px 40px}}

/* Tables - responsive scroll */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-wrap table{min-width:640px}
@media(max-width:640px){.table-wrap table{min-width:560px}}

/* Stats grid */
.stat-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:24px}
@media(min-width:640px){.stat-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.stat-grid{grid-template-columns:repeat(4,1fr)}}

.stat{background:#0f1729;border:1px solid #1e293b;border-radius:20px;padding:20px;position:relative;overflow:hidden;transition:.3s}
.stat:hover{transform:translateY(-4px);box-shadow:0 20px 40px -20px rgba(37,99,235,.3)}
.stat .num{font-size:1.5rem;font-weight:900;color:#60a5fa;margin:8px 0;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
@media(min-width:768px){.stat .num{font-size:1.9rem}}
.stat .num small{font-size:.7rem;color:#8fa1c7;font-weight:500}
.stat .lbl{color:#8fa1c7;font-size:.85rem;font-weight:500}
.stat-icon{position:absolute;top:20px;inset-inline-end:20px;font-size:1.5rem;color:#3b82f6;opacity:.35}

/* Forms */
.form-card{background:#0f1729;border:1px solid #1e293b;border-radius:20px;padding:20px;margin-bottom:20px}
@media(min-width:768px){.form-card{padding:28px}}
.form-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:640px){.form-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}

input,select,textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #334155;background:#0a1428;color:#e8eeff;font-family:inherit;font-size:14px;transition:.25s}
input:focus,select:focus,textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 4px rgba(59,130,246,.12)}
label{display:block;margin-bottom:6px;color:#8fa1c7;font-size:.85rem;font-weight:600}

/* Badges */
.badge{padding:4px 12px;border-radius:100px;font-size:.75rem;font-weight:700;display:inline-flex;align-items:center;gap:5px}
.badge-green{background:rgba(16,185,129,.15);color:#34d399}
.badge-yellow{background:rgba(245,158,11,.15);color:#fbbf24}
.badge-red{background:rgba(239,68,68,.15);color:#f87171}
.badge-blue{background:rgba(59,130,246,.15);color:#60a5fa}
.badge-purple{background:rgba(168,85,247,.15);color:#c084fc}