html, body { min-height: 100%; }
body.zulu-static-shell { margin: 0; overflow-x: hidden; }
[hidden] { display: none !important; }
.shell-status { align-items: center; background: var(--ui-color-canvas); display: flex; inset: 0; justify-content: center; position: fixed; z-index: 10000; }
.shell-status-card { background: var(--ui-color-surface); border: 1px solid var(--ui-color-border); border-radius: var(--ui-radius-lg); box-shadow: var(--ui-shadow-md); padding: 32px; text-align: center; width: min(90vw, 360px); }
.shell-status-logo { display: block; margin: 0 auto 20px; max-height: 72px; max-width: 240px; }
.shell-spinner { animation: shell-spin .8s linear infinite; border: 3px solid var(--ui-color-border); border-top-color: var(--ui-color-accent); border-radius: 50%; height: 32px; margin: 0 auto 16px; width: 32px; }
@keyframes shell-spin { to { transform: rotate(360deg); } }
.shell-login { background: var(--ui-color-header); display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(380px, .55fr); min-height: 100vh; }
.shell-login-brand { background-image: linear-gradient(135deg, rgba(17,24,39,.82), rgba(37,99,235,.24)), var(--ui-login-background); background-position: center; background-size: cover; }
.shell-login-card { align-self: stretch; background: var(--ui-color-surface); box-shadow: -20px 0 55px rgba(0,0,0,.16); display: flex; flex-direction: column; justify-content: center; padding: clamp(40px, 6vw, 84px); width: 100%; }
.shell-login-logo { max-height: 88px; max-width: 280px; }
.shell-login-card label { display: block; font-weight: 650; margin: 18px 0 6px; }
.shell-login-card .btn { margin-top: 24px; }
.shell-error { color: var(--ui-color-danger); margin-top: 16px; min-height: 22px; }
.shell-navbar { align-items: center; background: var(--ui-color-header); border-bottom: 1px solid var(--ui-color-header-border); box-shadow: 0 4px 14px rgba(15,23,42,.18); color: #fff; display: flex; height: 56px; inset: 0 0 auto 0; padding: 5px 18px; position: fixed; z-index: 1100; }
.shell-navbar-logo { height: 44px; max-width: 210px; object-fit: contain; }
.shell-icon-button { background: transparent; border: 1px solid transparent; border-radius: var(--ui-radius-sm); color: #fff; font-size: 22px; margin-right: 12px; min-height: 40px; min-width: 40px; }
.shell-icon-button:hover, .shell-icon-button:focus { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.14); }
.shell-user { align-items: center; display: flex; gap: 16px; margin-left: auto; }
.shell-sidebar { background: var(--ui-color-sidebar); border-right: 1px solid var(--ui-color-border); bottom: 0; box-shadow: 4px 0 18px rgba(15,23,42,.04); color: var(--ui-color-text); left: 0; overflow-y: auto; padding: 18px 12px; position: fixed; top: 56px; transition: transform var(--ui-transition); width: 252px; z-index: 1000; }
.shell-search-label { color: var(--ui-color-muted); display: block; font-size: 11px; font-weight: 700; letter-spacing: .04em; margin: 0 4px 6px; text-transform: uppercase; }
.shell-sidebar .form-control { margin-bottom: 16px; }
.shell-menu-group { margin-bottom: 8px; }
.shell-menu-heading { color: var(--ui-color-muted); font-size: 10px; font-weight: 750; letter-spacing: .08em; padding: 14px 10px 6px; text-transform: uppercase; }
.shell-menu-link { align-items: center; border-radius: var(--ui-radius-sm); color: #374151; display: flex; gap: 11px; margin: 2px 0; padding: 9px 10px; text-decoration: none; }
.shell-menu-link .icon { color: #6b7280; font-size: 18px; width: 20px; }
.shell-menu-link:hover, .shell-menu-link:focus, .shell-menu-link.active { background: var(--ui-color-sidebar-active); color: var(--ui-color-primary); text-decoration: none; }
.shell-menu-link:hover .icon, .shell-menu-link:focus .icon, .shell-menu-link.active .icon { color: var(--ui-color-accent); }
.shell-main { margin-left: 252px; min-height: 100vh; padding: 80px 30px 30px; transition: margin-left var(--ui-transition); }
.shell-route-loading { color: var(--ui-color-muted); padding: 32px; text-align: center; }
.shell-collapsed .shell-sidebar { transform: translateX(-252px); }
.shell-collapsed .shell-main { margin-left: 0; }
@media (max-width: 800px) {
  .shell-login { display: block; padding: 24px; }
  .shell-login-brand { display: none; }
  .shell-login-card { border-radius: var(--ui-radius-lg); margin: 8vh auto 0; max-width: 460px; padding: 32px 24px; }
  .shell-sidebar { box-shadow: var(--ui-shadow-md); transform: translateX(-252px); }
  .shell-main { margin-left: 0; padding: 80px 14px 20px; }
  .shell-menu-open .shell-sidebar { transform: translateX(0); }
  .shell-user span { display: none; }
}
