:root {
    --navy: #171b3b;
    --navy-2: #252a5c;
    --teal: #159eb3;
    --teal-dark: #0d8295;
    --gold: #c99052;
    --bg: #f4f5fa;
    --surface-soft: #f8f9fc;
    --text: #1c2236;
    --muted: #697086;
    --line: #e3e5ee;
    --info: #376fc4;
    --shadow: 0 12px 35px rgba(23, 27, 59, .09);
}

.sidebar {
    color: #dde1f0;
    background: linear-gradient(180deg, #171b3b, #202452 72%, #13243f);
    box-shadow: 8px 0 30px rgba(23, 27, 59, .16);
}

.brand strong { font-size: 18px; letter-spacing: .08em; }
.brand-mark { clip-path: none; filter: drop-shadow(0 5px 14px rgba(21, 158, 179, .24)); }
.nav-item.is-active { background: linear-gradient(90deg, rgba(21, 158, 179, .3), rgba(21, 158, 179, .09)); }
.welcome { background: linear-gradient(120deg, #171b3b 0%, #28316a 58%, #159eb3 130%); }
.welcome img { width: 138px; height: 138px; clip-path: none; filter: drop-shadow(0 12px 25px rgba(0, 0, 0, .16)); opacity: 1; }
.login-visual { background: linear-gradient(145deg, #11152f, #24295f 58%, #0c7187); }
.login-brand { display: flex; align-items: center; gap: 18px; margin-bottom: 38px; }
.login-brand .login-logo { width: 96px; height: 96px; margin: 0; object-fit: contain; clip-path: none; filter: drop-shadow(0 10px 25px rgba(21, 158, 179, .22)); }
.login-brand > div { display: flex; flex-direction: column; }
.login-brand strong { color: #fff; font-size: 34px; letter-spacing: .13em; }
.login-brand span { margin-top: 5px; color: #aeb8dc; font-size: 11px; letter-spacing: .22em; }