:root{--navy:#102a43;--navy-2:#173a5e;--navy-soft:#eaf0f5;--gold:#b89255;--gold-soft:#f6f0e7;--ink:#172b3d;--muted:#687887;--line:#dfe6ec;--surface:#fff;--canvas:#f5f7f9;font-family:"Tahoma","Arial",sans-serif;color:var(--ink);background:var(--canvas);line-height:1.5}
*{box-sizing:border-box}
body{margin:0;background:var(--canvas)}
::selection{background:#b8925540;color:var(--navy)}
:focus-visible{outline:3px solid #b8925570;outline-offset:2px}
button,input,select,textarea{font:inherit}
button:disabled{cursor:not-allowed;opacity:.58;box-shadow:none!important}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:28px 16px;background:radial-gradient(circle at 85% 5%,#e9edf2 0,transparent 42%),linear-gradient(145deg,#f8f9fb,#f2f5f7)}
.login-card{width:min(92vw,430px);background:var(--surface);padding:34px 40px 40px;border:1px solid #e3e8ed;border-radius:20px;box-shadow:0 20px 60px #102a4317}
.login-brand{position:relative;width:190px;margin:0 auto 12px;padding-bottom:10px}
.brand-logo{display:block;object-fit:contain;background:#fff}
.login-logo{width:100%;height:150px}
.brand-accent{position:absolute;right:50%;bottom:0;width:46px;height:3px;border-radius:10px;background:var(--gold);transform:translateX(50%)}
.login-card h1{text-align:center;margin:12px 0 0;color:var(--navy);font-size:26px}
.login-card p{text-align:center;color:var(--muted);margin:3px 0 28px}
label{display:grid;gap:7px;font-weight:600;margin-bottom:16px;color:#263b4d}
input,select,textarea{border:1px solid #d3dce4;border-radius:10px;padding:11px 13px;background:#fff;color:var(--ink);outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--navy-2);box-shadow:0 0 0 3px #173a5e1c}
button{border:0;border-radius:10px;padding:11px 16px;cursor:pointer}
.login-card>button,.primary{background:var(--navy);color:#fff;font-weight:700;transition:background .2s,box-shadow .2s}
.login-card>button:hover,.primary:hover{background:var(--navy-2);box-shadow:0 6px 16px #102a4324}
.login-card>button{width:100%}
.error{display:block;color:#b42318;margin-top:10px}
.workspace{min-height:100vh;display:grid;grid-template-columns:230px 1fr}
aside{background:linear-gradient(180deg,var(--navy),#0c2237);color:#fff;padding:22px 14px;display:flex;flex-direction:column}
.aside-brand{display:flex;align-items:center;gap:11px;padding:0 8px 24px;border-bottom:1px solid #ffffff17;margin-bottom:18px}
.sidebar-logo{width:49px;height:49px;flex:none;border:1px solid #ffffff26;border-radius:11px;padding:3px}
.aside-brand-copy{display:grid;line-height:1.35}
.aside-brand-copy strong{font-size:18px}
.aside-brand-copy small{color:#c9d4de;font-size:11px;font-weight:400}
.aside-brand::after{content:"";width:3px;height:28px;margin-right:auto;border-radius:3px;background:var(--gold)}
nav{display:grid;gap:5px}
.nav,.logout{background:transparent;color:#d5dee7;text-align:right}
.nav:hover,.nav.active{background:#ffffff13;color:#fff}
.nav.active{box-shadow:inset -3px 0 var(--gold)}
.logout{margin-top:auto}
.content{padding:26px 32px;min-width:0}
.notice{display:block;padding:12px 14px;margin-bottom:18px;border:1px solid #f0c8c3;border-radius:10px;background:#fff4f2;color:#8f2018;font-weight:600}
.content>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
.content header h1{margin:0;font-size:25px;color:var(--navy)}
.content header p{margin:4px 0;color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}
.cards article,.panel{background:var(--surface);border:1px solid var(--line);border-radius:15px}
.cards article{position:relative;padding:20px;overflow:hidden}
.cards span{color:var(--muted)}
.cards strong{display:block;font-size:30px;margin-top:7px;color:var(--navy)}
.panel{padding:20px;box-shadow:0 4px 18px #102a4308}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px}
.panel h2{margin:0;font-size:19px;color:var(--navy)}
.panel p{margin:3px 0;color:var(--muted)}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse;white-space:nowrap}
th,td{text-align:right;padding:13px 10px;border-bottom:1px solid #e8edf1}
th{color:#596b7a;font-size:13px;background:#fafbfc}
td{font-size:14px}
td:nth-child(2),td:nth-child(3),td:nth-child(4){max-width:28ch;overflow:hidden;text-overflow:ellipsis}
.table-message{padding-block:30px;text-align:center;color:var(--muted);white-space:normal}
.error-cell{color:#8f2018}
.badge{display:inline-block;padding:3px 9px;border-radius:20px;background:var(--navy-soft);color:var(--navy-2);font-size:12px}
dialog{border:0;border-radius:18px;padding:0;width:min(92vw,700px);box-shadow:0 30px 90px #06152252}
dialog::backdrop{background:#102a4380}
dialog form{padding:24px}
.dialog-head,.dialog-actions{display:flex;justify-content:space-between;align-items:center}
.dialog-head h2{margin:0 0 20px;color:var(--navy)}
.dialog-head button{font-size:25px;background:transparent;color:var(--navy)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.required-field select{border-color:#b45309}
.users-table td{max-width:none;overflow:visible;text-overflow:clip}
.user-identity{display:grid;min-width:15ch;max-width:28ch;white-space:normal}
.user-identity strong,.user-identity small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-identity small,.muted-label{color:var(--muted);font-size:12px}
.role-badge{white-space:nowrap}
.status-dot{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:700;white-space:nowrap}
.status-dot::before{content:"";width:8px;height:8px;border-radius:50%;background:#98a6b3}
.status-dot.is-active{color:#176b43}.status-dot.is-active::before{background:#27a568}
.status-dot.is-inactive{color:#8f2018}.status-dot.is-inactive::before{background:#c94a3b}
.row-actions{display:flex;gap:6px}.row-actions button{padding:7px 9px;border:1px solid var(--line);background:#fff;color:var(--navy);font-size:12px;white-space:nowrap}.row-actions button:hover{background:var(--navy-soft);border-color:#bdcad5}
.switch-row{display:flex;grid-column:1/-1;align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fafbfc}.switch-row input{width:18px;height:18px;margin:0;accent-color:var(--navy)}
.temporary-password-content{padding:24px}.temporary-password-content p{color:var(--muted)}
.secret-value{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid var(--line);border-radius:11px;background:#f8fafb;direction:ltr}.secret-value code{flex:1;overflow:auto;font-family:Consolas,monospace;font-size:14px;color:var(--navy)}.secret-value button{border:1px solid var(--line);background:#fff;color:var(--navy);font-weight:700}
.wide{grid-column:1/-1}
.dialog-actions{justify-content:flex-end;gap:10px;margin-top:10px}
@media(max-width:850px){.workspace{grid-template-columns:1fr}
aside{position:static;flex-direction:row;align-items:center;overflow:auto;padding-block:12px}
.aside-brand{padding:0 0 0 16px;margin:0 0 0 4px;border:0}
.sidebar-logo{width:43px;height:43px}
.aside-brand::after,.aside-brand-copy small{display:none}
nav{display:flex}
.logout{margin:0 auto 0 0}
.cards{grid-template-columns:1fr 1fr}
.content{padding:20px}
}
@media(max-width:520px){.login-card{padding:28px 24px 32px}
.login-brand{width:160px}
.login-logo{height:126px}
.cards,.form-grid{grid-template-columns:1fr}
.wide{grid-column:auto}
.content{padding:14px}
.panel{padding:12px}
.content>header{align-items:flex-start}.panel-head{align-items:stretch;flex-direction:column}.panel-head input{width:100%}
.row-actions{flex-direction:column}.row-actions button{width:100%}.secret-value{align-items:stretch;flex-direction:column}.secret-value button{width:100%}
.aside-brand-copy{display:none}
.sidebar-logo{width:40px;height:40px}
}

/* Sidebar brand and navigation refinement */
aside{padding:18px 14px 22px}
.aside-brand{position:relative;display:grid;grid-template-columns:68px 1fr;align-items:center;gap:12px;padding:12px 10px 17px;margin-bottom:16px;border:1px solid #ffffff17;border-radius:16px;background:linear-gradient(145deg,#ffffff12,#ffffff05);box-shadow:0 10px 28px #06152224;overflow:hidden}
.aside-brand::before{content:"";position:absolute;right:12px;bottom:0;width:42px;height:2px;border-radius:2px;background:var(--gold)}
.sidebar-logo{width:68px;height:68px;flex:none;border:1px solid #ffffff2b;border-radius:13px;padding:3px;box-shadow:0 7px 18px #06152238}
.aside-brand-copy{display:grid;line-height:1.4;min-width:0}
.aside-brand-copy strong{font-size:17px;white-space:nowrap}
.aside-brand-copy small{color:#c9d4de;font-size:10.5px;font-weight:400}
.aside-brand::after{position:absolute;top:13px;left:10px;width:3px;height:24px;margin:0;border-radius:3px;background:var(--gold);opacity:.9}
nav{gap:6px}
.nav{min-height:44px;display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid transparent;transition:background .2s,color .2s,border-color .2s}
.nav-icon{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.82}
.nav:hover{border-color:#ffffff12}
.nav.active{border-color:#b892553d;box-shadow:inset -3px 0 var(--gold),0 5px 15px #06152217}
.nav.active .nav-icon{color:#d5b47d;opacity:1}
@media(max-width:850px){
aside{padding-block:10px}
.aside-brand{grid-template-columns:48px auto;flex:none;gap:9px;padding:5px 8px 5px 10px;margin:0 0 0 10px;border:1px solid #ffffff17;border-radius:12px}
.sidebar-logo{width:48px;height:48px;border-radius:9px}
.aside-brand::before,.aside-brand::after,.aside-brand-copy small{display:none}
.aside-brand-copy strong{font-size:15px}
.nav{min-height:42px;white-space:nowrap}
}
@media(max-width:520px){
.aside-brand-copy{display:none}
.aside-brand{grid-template-columns:42px;padding:4px}
.sidebar-logo{width:42px;height:42px}
.nav{padding-inline:10px}
.nav-icon{width:18px;height:18px}
}

/* Horizontal sidebar brand lockup */
.workspace{grid-template-columns:258px 1fr}
.aside-brand{display:flex;flex-direction:column;align-items:stretch;gap:7px;padding:12px 11px 15px;margin-bottom:16px}
.aside-brand::before{display:none}
.aside-brand::after{content:"";position:static;display:block;width:56px;height:2px;margin:1px auto 0;border-radius:2px;background:var(--gold);opacity:.9}
.sidebar-horizontal-logo{width:100%;height:auto;max-height:none;object-fit:contain;border:1px solid #ffffff24;border-radius:11px;box-shadow:0 7px 18px #0615222e}
.sidebar-brand-subtitle{display:block;color:#d2b27d;font-size:11px;font-weight:400;text-align:center;line-height:1.5;letter-spacing:.1px}
@media(max-width:850px){
.workspace{grid-template-columns:1fr}
.aside-brand{width:205px;display:flex;flex-direction:column;gap:3px;padding:5px 7px 7px;margin:0 0 0 10px}
.sidebar-horizontal-logo{width:100%;height:auto;border-radius:8px}
.sidebar-brand-subtitle{font-size:9px;line-height:1.35}
.aside-brand::after{display:block;width:36px;height:1px;margin-top:0}
}
@media(max-width:520px){
.aside-brand{width:172px;display:flex;padding:4px 6px 6px}
.sidebar-brand-subtitle{display:block;font-size:8.5px}
}