body{min-height:100vh}
.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);direction:rtl}
.sidebar{direction:rtl;position:sticky;top:0;height:100vh;background:linear-gradient(180deg,var(--navy-900),var(--navy-950));color:#fff;padding:22px 16px;display:flex;flex-direction:column;z-index:20}
.brand-block{display:flex;align-items:center;gap:12px;padding:0 8px 22px;border-bottom:1px solid #ffffff1f}
.brand-block img{width:82px;height:34px;object-fit:contain}
.brand-block div{display:grid;gap:2px}.brand-block strong{font-size:1.25rem}.brand-block span{font-size:.77rem;color:#b8c8dd}
#primaryNav{display:grid;gap:5px;margin-top:20px;overflow-y:auto;padding-left:3px}
.nav-link{border:0;background:transparent;color:#c3d1e3;display:flex;align-items:center;gap:11px;width:100%;padding:11px 12px;border-radius:12px;text-align:right;cursor:pointer;font-weight:800;text-decoration:none}
.nav-link:hover,.nav-link.active{background:#ffffff13;color:#fff}.nav-link.active{box-shadow:inset -3px 0 var(--blue-600)}
.nav-icon{width:24px;text-align:center;font-size:1.05rem}.nav-badge{margin-right:auto;background:#ffffff18;border-radius:999px;min-width:24px;padding:2px 7px;text-align:center;font-size:.7rem}
.sidebar-footer{margin-top:auto;border-top:1px solid #ffffff1f;padding:16px 8px 0;display:grid;gap:10px;font-size:.78rem}.sidebar-footer a,.sidebar-footer button{color:#d5e1f0;background:transparent;border:0;text-align:right;text-decoration:none;padding:0;cursor:pointer}.health-line{display:flex;align-items:center;gap:8px;color:#b8c8dd}.health-line i{width:8px;height:8px;border-radius:50%;background:#28c67a;box-shadow:0 0 0 4px #28c67a22}.health-line i.offline{background:var(--red)}
.app-main{direction:rtl;min-width:0}.topbar{height:78px;position:sticky;top:0;z-index:15;background:#fffffff2;backdrop-filter:blur(12px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:18px;padding:0 28px}.page-identity{display:grid;gap:2px}.page-identity span{color:var(--blue-600);font-size:.72rem;font-weight:900}.page-identity h1{font-size:1.35rem;margin:0}.topbar-actions{margin-right:auto;display:flex;align-items:center;gap:14px}.operator{display:grid;text-align:left}.operator span{font-weight:900;font-size:.82rem}.operator small,.last-updated{color:var(--muted);font-size:.7rem}.mobile-menu{display:none}
#screenHost{padding:26px 28px 48px;outline:none;max-width:1680px;margin:0 auto;width:100%}
.screen-header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:20px}.screen-header h2{font-size:1.7rem;margin:0 0 5px}.screen-header p{margin:0;color:var(--muted);line-height:1.5}.screen-actions{display:flex;gap:8px;flex-wrap:wrap}
.login-screen{min-height:100vh;background:radial-gradient(circle at 15% 15%,#1a5fb8 0,transparent 34%),linear-gradient(145deg,var(--navy-950),#0b3670);display:grid;place-items:center;padding:24px}.login-brand{position:fixed;top:28px;right:34px;display:flex;align-items:center;gap:14px;color:#cfe0f5;font-size:.75rem;font-weight:900;letter-spacing:.13em}.login-brand img{height:42px;width:auto}.login-card{background:#fff;width:min(440px,100%);border-radius:28px;padding:34px;box-shadow:0 30px 80px #0005;display:grid;gap:17px}.login-card h1{font-size:1.8rem;margin:0}.login-card p{margin:0;color:var(--muted);line-height:1.55}.login-card label{display:grid;gap:7px;font-weight:800;font-size:.85rem}.login-card input{height:49px;border:1px solid var(--line);border-radius:12px;padding:0 14px}.eyebrow{font-size:.72rem;color:var(--blue-600);font-weight:950;letter-spacing:.08em}.text-link{text-align:center;color:var(--navy-800);font-weight:800;text-decoration:none;font-size:.8rem}.form-alert{background:var(--red-soft);color:var(--red);padding:11px 13px;border-radius:10px;font-size:.82rem}
@media(max-width:900px){.app-shell{display:block}.sidebar{position:fixed;right:0;transform:translateX(102%);width:min(290px,86vw);transition:transform .22s}.sidebar.open{transform:none}.topbar{padding:0 14px;height:70px}.mobile-menu{display:inline-grid}.operator,.last-updated{display:none}#screenHost{padding:20px 14px 34px}.screen-header{align-items:flex-start;flex-direction:column}.login-brand{position:static;margin-bottom:18px}.login-screen{align-content:center}}

/* Arial uses a consistent regular/bold hierarchy across the entire panel. */
.nav-link,
.page-identity span,
.operator span,
.login-brand,
.login-card label,
.eyebrow,
.text-link{font-weight:var(--font-weight-bold)}
