:root {
  --navy: #071526;
  --text: #0d1b2d;
  --muted: #68778c;
  --line: rgba(126, 149, 178, 0.24);
  --shadow: 0 28px 80px rgba(16, 36, 59, 0.16);
  color: var(--text);
  background: #f5f8fc;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: #f5f8fc; }
body { margin: 0; min-width: 320px; min-height: 100vh; overflow-x: hidden; }
button, input { font: inherit; }
a { color: inherit; text-decoration: none; }
.page { position: relative; min-height: 100vh; isolation: isolate; overflow: hidden; }

.animated-background {
  position: fixed;
  inset: 0;
  z-index: -2;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 18%, rgba(47, 128, 237, 0.18), transparent 28%),
    radial-gradient(circle at 82% 22%, rgba(158, 178, 204, 0.18), transparent 30%),
    linear-gradient(135deg, #f9fbff 0%, #eef5fb 42%, #ffffff 100%);
}

.mesh-gradient {
  position: absolute;
  inset: -30%;
  background:
    linear-gradient(120deg, rgba(7, 21, 38, 0.08), transparent 35%),
    linear-gradient(280deg, rgba(47, 128, 237, 0.16), transparent 48%),
    linear-gradient(25deg, rgba(196, 210, 228, 0.34), transparent 55%);
  animation: meshShift 13s ease-in-out infinite alternate;
}

.silver-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(7, 21, 38, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(7, 21, 38, 0.035) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.72), transparent 76%);
}

.bg-block {
  position: absolute;
  display: block;
  border: 1px solid rgba(255, 255, 255, 0.65);
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.72), rgba(214, 229, 246, 0.36));
  box-shadow: 0 24px 80px rgba(39, 78, 122, 0.12);
  backdrop-filter: blur(18px);
  animation: floatBlock 18s ease-in-out infinite;
}

.bg-block-one { width: 260px; height: 160px; left: 5%; top: 12%; }
.bg-block-two { width: 340px; height: 210px; right: -80px; top: 16%; animation-duration: 21s; }
.bg-block-three { width: 190px; height: 190px; left: 14%; bottom: 8%; border-radius: 46px; animation-duration: 24s; }
.bg-block-four { width: 300px; height: 140px; right: 16%; bottom: 7%; animation-duration: 20s; }

.hero-shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 72px 0 64px; }
.hero-copy { display: flex; min-height: 35vh; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.brand-mark { width: 118px; height: 118px; margin-bottom: 24px; border-radius: 28px; object-fit: contain; background: #fff; box-shadow: 0 24px 60px rgba(7, 21, 38, 0.22); }
.eyebrow { margin: 0 0 12px; color: #497094; font-size: 0.76rem; font-weight: 800; letter-spacing: 0; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }

:root {
  --z-sidebar: 100;
  --z-app-header: 200;
  --z-sticky: 300;
  --z-overlay: 900;
  --z-drawer: 1000;
  --z-toast: 2000;
}
.hero-copy h1 { margin-bottom: 16px; color: var(--navy); font-size: clamp(3.1rem, 8vw, 7.3rem); font-weight: 850; line-height: 0.94; letter-spacing: 0; }
.hero-subtitle { width: min(680px, 100%); margin-bottom: 0; color: #506176; font-size: clamp(1rem, 2vw, 1.28rem); line-height: 1.65; }
.portal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 22px; }

.portal-card, .glass-panel, .dashboard-card {
  border: 1px solid rgba(255, 255, 255, 0.68);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(241, 247, 254, 0.58));
  box-shadow: var(--shadow);
  backdrop-filter: blur(22px);
}

.portal-card {
  position: relative;
  display: flex;
  min-height: 400px;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  border-radius: 28px;
  padding: 30px;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.portal-card::before {
  position: absolute;
  inset: 0;
  content: "";
  background: radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--portal-accent), transparent 76%), transparent 32%), linear-gradient(145deg, transparent 34%, rgba(255, 255, 255, 0.48));
  pointer-events: none;
}
.portal-card > * { position: relative; z-index: 1; }
.portal-card:hover { box-shadow: 0 34px 90px rgba(16, 36, 59, 0.22); }

.portal-icon, .dashboard-icon {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 22px;
  color: var(--portal-accent);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 18px 40px color-mix(in srgb, var(--portal-accent), transparent 80%);
}

.portal-icon.large { width: 76px; height: 76px; border-radius: 26px; }
.float { animation: iconFloat 4.4s ease-in-out infinite; }
.portal-copy h2 { margin-bottom: 16px; color: var(--navy); font-size: clamp(1.8rem, 3vw, 2.45rem); line-height: 1; letter-spacing: 0; }
.portal-copy p:last-child { color: #53647a; font-size: 1rem; line-height: 1.7; }

.primary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  border: 0;
  border-radius: 18px;
  padding: 0 20px;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
  background: linear-gradient(135deg, var(--navy), color-mix(in srgb, var(--portal-accent), #071526 38%));
  box-shadow: 0 16px 38px color-mix(in srgb, var(--portal-accent), transparent 72%);
  transition: box-shadow 180ms ease, transform 180ms ease, filter 180ms ease;
}
.primary-action:hover { transform: translateY(-2px); filter: saturate(1.16); box-shadow: 0 20px 48px color-mix(in srgb, var(--portal-accent), transparent 58%); }
[data-tooltip] { position: relative; }
[data-tooltip]::before, [data-tooltip]::after { position: absolute; left: 50%; z-index: 50; pointer-events: none; opacity: 0; transform: translate(-50%, 6px); transition: opacity 120ms ease, transform 160ms ease; }
[data-tooltip]::before { content: attr(data-tooltip); bottom: calc(100% + 10px); width: max-content; max-width: 170px; border: 1px solid rgba(255,255,255,.68); border-radius: 11px; padding: 7px 10px; color: #0d2138; background: rgba(255,255,255,.92); box-shadow: 0 16px 38px rgba(16,36,59,.16); backdrop-filter: blur(16px); font-size: .72rem; font-weight: 850; line-height: 1.2; text-align: center; white-space: nowrap; }
[data-tooltip]::after { content: ""; bottom: calc(100% + 5px); width: 9px; height: 9px; border-right: 1px solid rgba(255,255,255,.68); border-bottom: 1px solid rgba(255,255,255,.68); background: rgba(255,255,255,.92); transform: translate(-50%, 6px) rotate(45deg); }
[data-tooltip]:hover::before, [data-tooltip]:hover::after, [data-tooltip]:focus-visible::before, [data-tooltip]:focus-visible::after, [data-tooltip]:active::before, [data-tooltip]:active::after { opacity: 1; transform: translate(-50%, 0); }
[data-tooltip]:hover::after, [data-tooltip]:focus-visible::after, [data-tooltip]:active::after { transform: translate(-50%, 0) rotate(45deg); }
.tooltip-button { position: relative; overflow: visible; cursor: pointer; transition: transform 160ms ease, color 160ms ease, background 160ms ease, box-shadow 160ms ease, border-color 160ms ease; }
.tooltip-button:hover, .tooltip-button:focus-visible { color: #07506a; border-color: rgba(12,154,191,.28); background: rgba(232,248,252,.95); box-shadow: 0 10px 28px rgba(12,154,191,.16); transform: translateY(-1px); outline: 0; }
.tooltip-button::before,
.tooltip-button::after,
.icon-button[data-tooltip]::before,
.icon-button[data-tooltip]::after {
  display: none !important;
}

.floating-tooltip {
  position: fixed;
  z-index: 2100;
  max-width: 220px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 9px;
  padding: 6px 9px;
  color: #fff;
  background: rgba(8, 21, 35, .92);
  box-shadow: 0 14px 34px rgba(8, 21, 35, .22);
  font-size: .68rem;
  font-weight: 850;
  line-height: 1.2;
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 90ms ease, transform 110ms ease;
  white-space: nowrap;
}

.floating-tooltip.visible {
  opacity: 1;
  transform: translateY(0);
}
.mini-action-label { display: none; white-space: nowrap; }
.full-width { width: 100%; }
.plain-button { border: 0; background: transparent; cursor: pointer; padding: 0; }

.login-page { display: grid; min-height: 100vh; place-items: center; padding: 36px 18px; }
.login-panel { width: min(520px, 100%); border-radius: 32px; padding: 30px; }
.back-link { display: inline-flex; align-items: center; gap: 8px; color: #48657f; font-weight: 800; transition: color 180ms ease, transform 180ms ease; }
.back-link:hover { color: var(--navy); transform: translateX(-2px); }
.back-link.compact { margin-top: auto; padding-top: 18px; }
.login-brand { display: flex; align-items: center; gap: 18px; margin: 36px 0 30px; }
.login-brand h1 { margin-bottom: 0; color: var(--navy); font-size: clamp(2rem, 7vw, 3.2rem); line-height: 1; letter-spacing: 0; }
.login-form { display: grid; gap: 18px; }
.login-form label { display: grid; gap: 8px; color: #53647a; font-size: 0.9rem; font-weight: 800; }
.login-error { border: 1px solid rgba(156,45,45,.18); border-radius: 14px; padding: 11px 12px; color: #9c2d2d; background: rgba(255,229,229,.72); font-size: .9rem; font-weight: 850; }
.login-debug-panel { display: grid; gap: 5px; margin-top: 14px; border: 1px dashed rgba(13,43,82,.18); border-radius: 14px; padding: 11px 12px; color: #52677f; background: rgba(255,255,255,.58); font-size: .76rem; font-weight: 760; }
.login-debug-panel strong { color: #0d2b52; font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; }
.input-shell { display: flex; align-items: center; gap: 12px; min-height: 56px; border: 1px solid rgba(89, 112, 138, 0.18); border-radius: 18px; padding: 0 16px; color: #6a7b8f; background: rgba(255, 255, 255, 0.72); transition: border 180ms ease, box-shadow 180ms ease; }
.input-shell:focus-within { border-color: color-mix(in srgb, var(--portal-accent), white 20%); box-shadow: 0 0 0 4px color-mix(in srgb, var(--portal-accent), transparent 86%); }
.input-shell input { width: 100%; border: 0; outline: 0; color: var(--text); background: transparent; }
.dashboard-page { min-height: 100vh; padding: 22px; }
.dashboard-shell { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 22px; width: min(1440px, 100%); margin: 0 auto; }
.sidebar { position: sticky; top: 22px; display: flex; height: calc(100vh - 44px); flex-direction: column; border-radius: 28px; padding: 22px; }
.os-lockup { display: flex; align-items: center; gap: 12px; margin-bottom: 28px; color: var(--navy); font-size: 1.05rem; font-weight: 850; }
.os-lockup img { width: 42px; height: 42px; border-radius: 13px; object-fit: contain; background: #fff; }
.sidebar-portal { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; border-radius: 22px; padding: 18px; color: var(--navy); background: linear-gradient(135deg, rgba(255, 255, 255, 0.84), rgba(237, 245, 253, 0.74)); }
.sidebar-portal svg { color: var(--portal-accent); }
.sidebar-portal strong, .sidebar-portal span { display: block; }
.sidebar-portal span { margin-top: 3px; color: var(--muted); font-size: 0.8rem; }
.sidebar-nav { display: grid; gap: 8px; }
.sidebar-nav a { display: flex; align-items: center; justify-content: space-between; min-height: 44px; border-radius: 15px; padding: 0 13px; color: #445a72; font-size: 0.92rem; font-weight: 800; transition: background 180ms ease, color 180ms ease, transform 180ms ease; }
.sidebar-nav a:hover { color: var(--navy); background: rgba(255, 255, 255, 0.72); transform: translateX(3px); }
.dashboard-main { min-width: 0; }
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-radius: 28px; padding: 24px; }
.topbar h1 { margin-bottom: 0; color: var(--navy); font-size: clamp(1.9rem, 4vw, 3.3rem); line-height: 1; letter-spacing: 0; }
.topbar-actions { display: flex; align-items: center; gap: 10px; }
.search-box, .icon-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; border: 1px solid rgba(89, 112, 138, 0.18); border-radius: 15px; color: #5f7187; background: rgba(255, 255, 255, 0.72); }
.search-box { gap: 10px; padding: 0 14px; font-size: 0.9rem; font-weight: 750; }
.icon-button { width: 44px; cursor: pointer; }
.dashboard-intro { display: flex; align-items: flex-start; justify-content: space-between; gap: 22px; padding: 26px 4px 22px; }
.dashboard-intro p { width: min(640px, 100%); margin-bottom: 0; color: #53647a; font-size: 1rem; line-height: 1.65; }
.status-strip { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.status-strip span { border: 1px solid var(--line); border-radius: 999px; padding: 8px 12px; color: #4b6078; background: rgba(255, 255, 255, 0.62); font-size: 0.8rem; font-weight: 800; }
.dashboard-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.dashboard-card { min-height: 190px; border-radius: 24px; padding: 22px; transition: transform 180ms ease; }
.dashboard-card:hover { transform: translateY(-5px); }
.dashboard-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; }
.dashboard-card-top span { color: var(--navy); font-size: 1.8rem; font-weight: 850; }
.dashboard-icon { width: 50px; height: 50px; border-radius: 18px; }
.dashboard-card h3 { margin-bottom: 8px; color: var(--navy); font-size: 1.12rem; letter-spacing: 0; }
.dashboard-card p { margin-bottom: 0; color: var(--muted); }
.reveal { animation: reveal 0.7s cubic-bezier(0.22, 1, 0.36, 1) both; }

@keyframes reveal { from { opacity: 0; transform: translateY(26px) scale(0.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes meshShift { from { transform: translate3d(-2%, -1%, 0) rotate(0deg); } to { transform: translate3d(2%, 1%, 0) rotate(2deg); } }
@keyframes floatBlock { 0%, 100% { transform: translate(0, 0) rotate(0deg); } 35% { transform: translate(24px, -18px) rotate(3deg); } 70% { transform: translate(-15px, 18px) rotate(-2deg); } }
@keyframes iconFloat { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-6px) rotate(-3deg); } }

@media (max-width: 980px) {
  .portal-grid, .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-shell { grid-template-columns: 1fr; }
  .sidebar { position: relative; top: 0; height: auto; }
  .sidebar-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .hero-shell { width: min(100% - 28px, 1180px); padding-top: 44px; }
  .hero-copy { min-height: 30vh; }
  .portal-grid, .dashboard-grid, .sidebar-nav { grid-template-columns: 1fr; }
  .portal-card { min-height: 340px; padding: 24px; }
  .dashboard-page { padding: 14px; }
  .topbar, .dashboard-intro { flex-direction: column; align-items: stretch; }
  .topbar-actions, .status-strip { justify-content: flex-start; }
  .search-box { flex: 1; }
  .login-panel { padding: 22px; }
  .login-brand { align-items: flex-start; flex-direction: column; }
  .bg-block-two, .bg-block-four { opacity: 0.48; }
}

.ops-page { overflow: visible; }
.ops-shell { display: grid; grid-template-columns: 292px minmax(0, 1fr); gap: 22px; width: min(1540px, 100%); margin: 0 auto; }
.ops-sidebar { position: sticky; top: 22px; display: flex; height: calc(100vh - 44px); flex-direction: column; border-radius: 28px; padding: 22px; }
.ops-workspace-card { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; border: 1px solid rgba(255,255,255,.72); border-radius: 22px; padding: 17px; color: var(--navy); background: linear-gradient(135deg, rgba(255,255,255,.9), rgba(231,246,250,.72)); box-shadow: 0 20px 48px rgba(12,154,191,.11); }
.ops-workspace-card svg { color: var(--portal-accent); }
.ops-workspace-card strong, .ops-workspace-card span { display: block; }
.ops-workspace-card span { margin-top: 3px; color: var(--muted); font-size: .8rem; line-height: 1.35; }
.current-user-card { position: relative; display: grid; gap: 6px; margin-bottom: 16px; border: 1px solid rgba(126,149,178,.14); border-radius: 18px; padding: 13px; background: rgba(255,255,255,.48); }
.profile-trigger { display: grid; gap: 6px; width: 100%; text-align: left; cursor: pointer; }
.current-user-card strong { color: var(--navy); font-size: .92rem; }
.current-user-card small { color: #6a7b8f; font-weight: 720; overflow-wrap: anywhere; }
.profile-menu { display: grid; gap: 6px; border-top: 1px solid rgba(126,149,178,.16); margin-top: 8px; padding-top: 8px; }
.profile-menu button { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; border: 1px solid rgba(89,112,138,.16); border-radius: 12px; padding: 0 10px; color: var(--navy); background: rgba(255,255,255,.78); cursor: pointer; font-weight: 850; }
.profile-menu button:hover { background: #fff; box-shadow: 0 12px 24px rgba(35,72,111,.08); }
.topbar-profile { position: relative; min-width: 210px; }
.topbar-profile-button { display: grid; min-height: 48px; border: 1px solid rgba(89,112,138,.18); border-radius: 16px; padding: 7px 14px; color: var(--navy); background: rgba(255,255,255,.76); cursor: pointer; text-align: left; box-shadow: 0 14px 34px rgba(35,72,111,.07); }
.topbar-profile-button span { font-size: .86rem; font-weight: 850; }
.topbar-profile-button strong { color: #60748b; font-size: .72rem; text-transform: uppercase; }
.topbar-profile .profile-menu { position: absolute; right: 0; top: calc(100% + 8px); z-index: 30; min-width: 220px; border: 1px solid rgba(126,149,178,.16); border-radius: 16px; padding: 8px; background: rgba(255,255,255,.96); box-shadow: 0 22px 60px rgba(16,36,59,.18); backdrop-filter: blur(16px); }
.ops-nav { display: grid; gap: 8px; }
.ops-nav button { display: flex; align-items: center; gap: 10px; min-height: 46px; border: 0; border-radius: 15px; padding: 0 14px; color: #445a72; background: transparent; cursor: pointer; font-size: .93rem; font-weight: 800; text-align: left; transition: background 180ms ease, color 180ms ease, transform 180ms ease, box-shadow 180ms ease; }
.ops-nav button.active, .ops-nav button:hover { color: var(--navy); background: rgba(255,255,255,.82); box-shadow: 0 12px 30px rgba(35,72,111,.08); transform: translateX(3px); }
.ops-main { min-width: 0; }
.ops-topbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-radius: 28px; padding: 24px; }
.ops-topbar h1 { margin-bottom: 8px; color: var(--navy); font-size: clamp(2rem, 4vw, 3.35rem); line-height: 1; letter-spacing: 0; }
.ops-topbar p:last-child { max-width: 740px; margin-bottom: 0; color: #53647a; line-height: 1.6; }
.ops-topbar-search { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; border: 1px solid rgba(89,112,138,.18); border-radius: 15px; padding: 0 14px; color: #5f7187; background: rgba(255,255,255,.72); font-size: .9rem; font-weight: 750; white-space: nowrap; }
.ops-counter-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
.ops-counter { min-height: 104px; border-radius: 22px; padding: 18px; }
.ops-counter span { display: block; min-height: 34px; color: #5d7088; font-size: .82rem; font-weight: 850; line-height: 1.35; }
.ops-counter strong { display: block; margin-top: 8px; color: var(--navy); font-size: 2rem; line-height: 1; }
.assignment-workspace { overflow: hidden; border-radius: 28px; }
.wide-mode { grid-template-columns: 1fr !important; gap: 0; padding-inline: 8px; }
.wide-mode .ops-sidebar { display: none; }
.wide-mode .ops-main { max-width: none; }
.wide-mode .ops-topbar { position: sticky; top: 8px; z-index: 6; }
.wide-mode .assignment-workspace { border-radius: 18px; }
.wide-mode .sheet-toolbar, .wide-mode .sheet-view-controls, .wide-mode .sheet-controls, .wide-mode .date-filter-bar { padding-left: 12px; padding-right: 12px; }
.sheet-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid rgba(126,149,178,.18); padding: 20px 22px; }
.sheet-toolbar h2 { margin-bottom: 0; color: var(--navy); font-size: 1.55rem; letter-spacing: 0; }
.compact-action { min-height: 44px; border-radius: 15px; padding: 0 16px; }
.sheet-view-controls { position: sticky; top: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; border-bottom: 1px solid rgba(126,149,178,.14); padding: 12px 22px; background: rgba(247,251,255,.9); backdrop-filter: blur(14px); }
.sheet-view-controls button { min-height: 38px; border: 1px solid rgba(89,112,138,.18); border-radius: 999px; padding: 0 13px; color: #40566e; background: rgba(255,255,255,.82); cursor: pointer; font-weight: 850; }
.sheet-view-controls button.active { color: #07506a; border-color: rgba(12,154,191,.28); background: #e6f8fc; }
.sheet-view-controls label { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; color: #60748b; font-size: .73rem; font-weight: 850; text-transform: uppercase; }
.sheet-view-controls select { min-height: 38px; border: 1px solid rgba(89,112,138,.18); border-radius: 999px; padding: 0 12px; color: var(--navy); background: rgba(255,255,255,.86); font-weight: 850; }
.sheet-controls { display: grid; grid-template-columns: minmax(260px, 1.4fr) repeat(5, minmax(150px, 1fr)); gap: 12px; padding: 16px 22px; background: rgba(245,249,253,.68); }
.sheet-controls label { display: grid; gap: 6px; }
.sheet-controls span { color: #60748b; font-size: .73rem; font-weight: 850; text-transform: uppercase; }
.sheet-controls input, .sheet-controls select { width: 100%; min-height: 42px; border: 1px solid rgba(89,112,138,.18); border-radius: 13px; padding: 0 12px; color: var(--text); background: rgba(255,255,255,.86); outline: 0; }
.spreadsheet-wrap { max-height: 66vh; overflow: auto; background: rgba(255,255,255,.54); }
.assignment-table { width: 100%; border-collapse: separate; border-spacing: 0; color: var(--text); font-size: .88rem; }
.assignment-table th { position: sticky; top: 0; z-index: 3; border-bottom: 1px solid rgba(126,149,178,.28); border-right: 1px solid rgba(126,149,178,.16); background: linear-gradient(180deg, rgba(238,246,252,.98), rgba(226,240,249,.98)); text-align: left; }
.assignment-table th button { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 44px; border: 0; padding: 0 10px; color: #41566f; background: transparent; cursor: pointer; font-size: .76rem; font-weight: 850; text-align: left; text-transform: uppercase; }
.assignment-table td { border-bottom: 1px solid rgba(126,149,178,.16); border-right: 1px solid rgba(126,149,178,.14); padding: 0; background: rgba(255,255,255,.68); vertical-align: middle; }
.assignment-table tbody tr:hover td { background: rgba(237,248,252,.86); }
.assignment-table input, .assignment-table select, .readonly-cell { display: flex; align-items: center; width: 100%; min-height: 42px; border: 1px solid transparent; padding: 0 10px; color: #10243b; background: transparent; outline: 0; font-size: .86rem; }
.assignment-table input:focus, .assignment-table select:focus { border-color: rgba(12,154,191,.55); box-shadow: inset 0 0 0 1px rgba(12,154,191,.28), 0 0 0 2px rgba(12,154,191,.08); background: #fff; }
.density-compact .assignment-table input, .density-compact .assignment-table select, .density-compact .readonly-cell { min-height: 34px; font-size: .8rem; }
.density-spreadsheet .assignment-table input, .density-spreadsheet .assignment-table select, .density-spreadsheet .readonly-cell { min-height: 30px; padding-inline: 7px; font-size: .78rem; }
.density-spreadsheet .assignment-table th button { min-height: 34px; font-size: .7rem; }
.assignment-table select { appearance: none; cursor: pointer; }
.readonly-cell { color: #6a7b8f; font-weight: 850; justify-content: center; }
.sheet-badge { width: calc(100% - 12px) !important; min-height: 30px !important; margin: 6px; border-radius: 999px !important; padding: 0 12px !important; font-size: .76rem !important; font-weight: 850; text-align: center; }
.low, .no-query, .query-solved, .resolved, .approved, .completed, .loaded, .reviewed, .active, .editable, .approved-without-error { color: #1d6b4f !important; background: #e4f8ef !important; }
.medium, .assigned, .updated, .loaded-as-new, .admin, .ops-manager, .qc, .hr, .clarification-received, .in-qc, .in-review, .na { color: #315c9f !important; background: #e7f0ff !important; }
.high, .wip, .client-guest, .inactive, .read-only, .view-only, .in-progress, .sent-to-qc, .waiting-kt-response, .waiting-qc, .approved-with-error-correction { color: #8a5b12 !important; background: #fff3d8 !important; }
.urgent, .pending, .super-admin, .loader, .suspended, .not-to-work, .query-pending, .re-qc-needed, .rejected, .qc-error, .query-raised, .returned-by-qc, .sent-back-to-loader, .query-required { color: #9c2d2d !important; background: #ffe5e5 !important; }
.url-cell { display: flex; align-items: center; }
.url-cell input { min-width: 0; }
.url-cell a { display: grid; width: 34px; min-width: 34px; height: 34px; place-items: center; color: #456176; }
.sheet-actions-head { position: sticky !important; right: 0; z-index: 4 !important; min-width: 128px; }
.sheet-actions { position: sticky; right: 0; z-index: 2; min-width: 128px; padding: 0 8px !important; background: rgba(250,253,255,.96) !important; white-space: nowrap; }
.sheet-actions button { display: inline-grid; width: 32px; height: 32px; margin: 0 2px; place-items: center; border: 1px solid rgba(89,112,138,.16); border-radius: 10px; color: #4f647c; background: rgba(255,255,255,.82); cursor: pointer; }
.sheet-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid rgba(126,149,178,.18); padding: 14px 22px; color: #5f7187; font-size: .9rem; font-weight: 750; }
.pagination-controls { display: flex; align-items: center; gap: 10px; }
.pagination-controls button { min-height: 36px; border: 1px solid rgba(89,112,138,.18); border-radius: 12px; padding: 0 12px; color: #40566e; background: rgba(255,255,255,.84); cursor: pointer; font-weight: 800; }
.pagination-controls button:disabled { cursor: not-allowed; opacity: .45; }
.drawer-backdrop { position: fixed; inset: 0; z-index: var(--z-overlay); display: flex; justify-content: flex-end; background: rgba(7,21,38,.22); backdrop-filter: blur(6px); animation: fadeIn 180ms ease both; }
.task-drawer { position: relative; z-index: var(--z-drawer); display: flex; width: min(65vw, 980px); max-width: calc(100vw - 18px); height: 100vh; max-height: 100vh; flex-direction: column; overflow: auto; border-radius: 22px 0 0 22px; padding: 0 24px 24px; animation: drawerIn 260ms cubic-bezier(.22,1,.36,1) both; overscroll-behavior: contain; }
.drawer-header { position: sticky; top: 0; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; border-bottom: 1px solid rgba(126,149,178,.14); margin: 0 -24px 18px; padding: 22px 24px 16px; background: rgba(247,251,255,.96); backdrop-filter: blur(18px); }
.drawer-header h2 { margin-bottom: 8px; color: var(--navy); font-size: 2rem; line-height: 1.05; letter-spacing: 0; }
.drawer-header span { color: #5f7187; font-weight: 750; }
.drawer-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 20px; }
.drawer-actions button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; border: 1px solid rgba(89,112,138,.16); border-radius: 14px; color: var(--navy); background: rgba(255,255,255,.82); cursor: pointer; font-weight: 850; }
.drawer-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.drawer-detail { border: 1px solid rgba(126,149,178,.16); border-radius: 16px; padding: 13px; background: rgba(255,255,255,.62); }
.drawer-detail span { display: block; margin-bottom: 7px; color: #6a7b8f; font-size: .74rem; font-weight: 850; text-transform: uppercase; }
.drawer-detail strong { display: block; color: var(--navy); font-size: .94rem; line-height: 1.45; overflow-wrap: anywhere; }
.auto-detail-box { border: 1px solid rgba(126,149,178,.16); border-radius: 18px; margin-bottom: 16px; padding: 12px; background: rgba(255,255,255,.62); }
.auto-detail-box summary { cursor: pointer; color: var(--navy); font-weight: 900; }
.auto-detail-box .drawer-detail-grid { margin-top: 12px; }
.query-actions { min-width: 360px; white-space: normal; }
.query-actions button { display: inline-flex; width: auto; min-width: 0; height: 32px; margin: 2px; padding: 0 9px; gap: 5px; font-size: .72rem; font-weight: 850; }
.query-tabs { justify-content: flex-start; }
.ops-placeholder { margin-top: 18px; border-radius: 28px; padding: 28px; }
.ops-placeholder h2 { margin-bottom: 10px; color: var(--navy); font-size: 2rem; letter-spacing: 0; }
.ops-placeholder p:last-child { max-width: 680px; margin-bottom: 0; color: #53647a; line-height: 1.7; }
.module-error { width: min(720px, calc(100% - 40px)); margin: 12vh auto; border-radius: 28px; padding: 32px; }
.module-error h1 { margin-bottom: 12px; color: var(--navy); font-size: clamp(2rem, 4vw, 3rem); line-height: 1; }
.module-error p { max-width: 560px; color: #53647a; font-weight: 750; line-height: 1.55; }
.workspace-selector { display: inline-flex; margin-top: 18px; border-radius: 20px; padding: 14px; }
.workspace-selector label { display: flex; align-items: center; gap: 12px; color: #60748b; font-size: .78rem; font-weight: 850; text-transform: uppercase; }
.workspace-selector select { min-width: 190px; min-height: 42px; border: 1px solid rgba(89,112,138,.18); border-radius: 13px; padding: 0 12px; color: var(--navy); background: rgba(255,255,255,.88); font-weight: 850; }
.workspace-controls { grid-template-columns: minmax(260px, 1.4fr) repeat(4, minmax(150px, 1fr)); }
.readonly-cell.left { justify-content: flex-start; text-align: left; }
.drawer-edit-grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin-bottom: 18px; }
.drawer-edit-grid label { display: grid; gap: 7px; color: #6a7b8f; font-size: .74rem; font-weight: 850; text-transform: uppercase; }
.drawer-edit-grid input, .drawer-edit-grid textarea { width: 100%; min-height: 44px; border: 1px solid rgba(89,112,138,.18); border-radius: 14px; padding: 10px 12px; color: var(--navy); background: rgba(255,255,255,.82); outline: 0; resize: vertical; }
.drawer-edit-grid textarea { min-height: 92px; }
.ops-toast { position: fixed; top: 22px; right: 22px; z-index: 20; max-width: min(420px, calc(100% - 44px)); border: 1px solid rgba(255,255,255,.72); border-radius: 18px; padding: 14px 16px; color: #082033; background: rgba(255,255,255,.92); box-shadow: 0 22px 60px rgba(16,36,59,.18); backdrop-filter: blur(18px); font-weight: 850; animation: fadeIn 180ms ease both; }
.sheet-action-bar { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.secondary-action { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border: 1px solid rgba(89,112,138,.18); border-radius: 15px; padding: 0 14px; color: var(--navy); background: rgba(255,255,255,.82); cursor: pointer; font-weight: 850; transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease; }
.secondary-action:hover { transform: translateY(-1px); background: #fff; box-shadow: 0 14px 34px rgba(35,72,111,.1); }
.secondary-action.muted { color: #61748b; }
.date-filter-bar { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; border-top: 1px solid rgba(126,149,178,.14); padding: 14px 22px; background: rgba(255,255,255,.52); }
.date-filter-bar label { display: grid; gap: 6px; }
.date-filter-bar span { color: #60748b; font-size: .73rem; font-weight: 850; text-transform: uppercase; }
.date-filter-bar input { min-height: 40px; border: 1px solid rgba(89,112,138,.18); border-radius: 13px; padding: 0 12px; color: var(--navy); background: rgba(255,255,255,.86); }
.date-filter-bar button { min-height: 40px; border: 1px solid rgba(89,112,138,.18); border-radius: 999px; padding: 0 13px; color: #40566e; background: rgba(255,255,255,.78); cursor: pointer; font-weight: 850; }
.date-filter-bar button.active { color: #07506a; border-color: rgba(12,154,191,.28); background: #e6f8fc; }
.wide-drawer { width: min(65vw, 980px); }
.bulk-drawer { width: min(1500px, calc(100% - 32px)); }
.bulk-drawer { animation-duration: 140ms; }
.bulk-drawer .spreadsheet-wrap { background: rgba(255,255,255,.88); }
.bulk-drawer .assignment-table td { background: rgba(255,255,255,.94); }
.bulk-drawer .assignment-table input, .bulk-drawer .assignment-table select { border-color: rgba(89,112,138,.16); border-radius: 10px; background: rgba(255,255,255,.96); }
.bulk-drawer .sheet-actions-head { position: sticky !important; right: auto; min-width: 104px; }
.bulk-drawer .sheet-actions { position: static; min-width: 104px; background: rgba(255,255,255,.94) !important; }
.bulk-drawer .sheet-actions button { width: auto; min-width: 38px; }
.assignment-table td.cell-error { background: rgba(255,229,229,.88) !important; box-shadow: inset 0 0 0 1px rgba(156,45,45,.35); }
.task-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 20px; }
.task-form-grid label, .import-options label { display: grid; gap: 7px; color: #60748b; font-size: .74rem; font-weight: 850; text-transform: uppercase; }
.task-form-grid input, .task-form-grid select, .task-form-grid textarea, .import-options select { width: 100%; min-height: 44px; border: 1px solid rgba(89,112,138,.18); border-radius: 14px; padding: 0 12px; color: var(--navy); background: rgba(255,255,255,.84); outline: 0; }
.task-form-grid textarea { min-height: 96px; padding: 12px; resize: vertical; }
.task-form-grid label.has-error input, .task-form-grid label.has-error select { border-color: rgba(156,45,45,.55); box-shadow: 0 0 0 3px rgba(156,45,45,.08); }
.task-form-grid em { color: #9c2d2d; font-style: normal; text-transform: none; }
.phone-input-row { display: grid; grid-template-columns: minmax(128px, .42fr) minmax(0, 1fr); gap: 8px; }
.offer-phone-field select, .offer-phone-field input { min-height: 44px; }
.offer-address-section { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; border: 1px solid rgba(126,149,178,.14); border-radius: 18px; padding: 14px; background: rgba(247,251,255,.58); }
.offer-address-section legend { padding: 0 7px; color: #40566e; font-size: .76rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.offer-address-section label { margin: 0; }
.offer-address-section label:first-of-type { grid-column: 1 / -1; }
.offer-address-section input, .offer-address-section select { min-height: 44px; }
.offer-address-section.has-error { border-color: rgba(156,45,45,.35); }
.modal-footer { position: sticky; bottom: -24px; z-index: 2; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; border-top: 1px solid rgba(126,149,178,.16); margin: 18px -24px -24px; padding: 16px 24px; background: rgba(247,251,255,.96); backdrop-filter: blur(18px); }
.bulk-grid { max-height: 58vh; border: 1px solid rgba(126,149,178,.16); border-radius: 18px; }
.validation-summary, .import-summary { margin-top: 14px; border: 1px solid rgba(156,45,45,.18); border-radius: 16px; padding: 12px 14px; color: #7a2630; background: rgba(255,229,229,.58); font-weight: 750; }
.validation-summary p, .import-summary p { margin: 4px 0; }
.validation-summary.warning { border-color: rgba(138,91,18,.2); color: #8a5b12; background: rgba(255,243,216,.76); }
.import-summary { border-color: rgba(29,107,79,.18); color: #1d6b4f; background: rgba(228,248,239,.72); }
.import-options { margin-bottom: 14px; }
.master-intro { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 22px; padding: 24px; }
.master-intro h2 { margin: 4px 0 8px; color: var(--navy); font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1; }
.master-intro p { max-width: 760px; color: #5d7188; font-weight: 720; line-height: 1.55; }
.master-pill { white-space: nowrap; border: 1px solid rgba(12,154,191,.18); border-radius: 999px; padding: 10px 14px; color: #07506a; background: #e6f8fc; font-weight: 850; }
.settings-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); gap: 18px; margin-top: 18px; }
.settings-card { border-radius: 26px; padding: 22px; }
.settings-card-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.settings-card-head h2 { margin: 4px 0 0; color: var(--navy); font-size: 1.7rem; letter-spacing: 0; }
.profile-photo-placeholder { display: grid; width: 72px; height: 72px; min-width: 72px; place-items: center; border: 1px solid rgba(126,149,178,.18); border-radius: 22px; color: #07506a; background: rgba(230,248,252,.86); font-size: 1.8rem; font-weight: 900; overflow: hidden; }
.profile-photo-placeholder img { width: 100%; height: 100%; object-fit: cover; }
.access-list { display: flex; flex-wrap: wrap; gap: 10px; }
.access-list span { border-radius: 999px; padding: 10px 13px; font-weight: 850; }
.access-enabled { color: #1d6b4f; background: #e4f8ef; }
.access-disabled { color: #8a5b12; background: #fff3d8; }
.activity-list { display: grid; gap: 10px; }
.activity-list div { display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid rgba(126,149,178,.14); border-radius: 16px; padding: 12px 14px; background: rgba(255,255,255,.62); }
.activity-list span { color: #60748b; font-size: .78rem; font-weight: 850; text-transform: uppercase; }
.activity-list strong { color: var(--navy); text-align: right; }
.report-controls { grid-template-columns: minmax(260px, 1.4fr) repeat(4, minmax(150px, 1fr)); }
.report-card-grid { padding: 18px 22px 0; }
.report-insights { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, .9fr); gap: 16px; padding: 18px 22px; }
.report-insights h2 { margin: 4px 0 12px; color: var(--navy); font-size: 1.55rem; }
.report-insights ul { margin: 0; padding-left: 18px; color: #53647a; font-weight: 750; line-height: 1.65; }
.report-insights pre { max-height: 320px; overflow: auto; white-space: pre-wrap; color: #10243b; font: 750 .86rem/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.access-badge-stack { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.master-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.master-card, .master-country-section { padding: 20px; }
.master-card-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.master-card-head h3 { color: var(--navy); font-size: 1.05rem; }
.master-card-head span { display: inline-grid; place-items: center; min-width: 38px; height: 34px; border-radius: 999px; color: #07506a; background: #e6f8fc; font-weight: 900; }
.master-list { display: flex; flex-wrap: wrap; gap: 8px; }
.master-list span { border: 1px solid rgba(89,112,138,.14); border-radius: 999px; padding: 8px 10px; color: #40566e; background: rgba(255,255,255,.78); font-size: .82rem; font-weight: 820; }
.master-edit-button { width: 100%; margin-top: 14px; }
.master-edit-list { display: grid; gap: 12px; }
.master-edit-list label { display: grid; gap: 7px; color: #60748b; font-size: .74rem; font-weight: 850; text-transform: uppercase; }
.inline-edit-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.inline-edit-row input { width: 100%; min-height: 44px; border: 1px solid rgba(89,112,138,.18); border-radius: 14px; padding: 0 12px; color: var(--navy); background: rgba(255,255,255,.84); outline: 0; }
.inline-edit-row button { min-height: 44px; border: 1px solid rgba(89,112,138,.18); border-radius: 14px; padding: 0 12px; color: #6a3340; background: rgba(255,245,245,.84); cursor: pointer; font-weight: 850; }
.inline-edit-row button:disabled { cursor: not-allowed; opacity: .44; }
.access-controls { grid-template-columns: minmax(280px, 1.6fr) repeat(2, minmax(170px, 1fr)); }
.credentials-panel { display: grid; grid-template-columns: minmax(260px, .9fr) minmax(0, 1.35fr) auto; align-items: center; gap: 18px; margin: 16px 0; padding: 20px 22px; }
.credentials-panel h2 { margin: 2px 0 6px; color: var(--navy); font-size: 1.22rem; }
.credentials-panel p { max-width: 560px; color: #5f7288; font-weight: 720; line-height: 1.55; }
.credentials-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.credentials-grid span { display: grid; gap: 4px; border: 1px solid rgba(90,118,148,.14); border-radius: 14px; padding: 11px 12px; background: rgba(255,255,255,.72); }
.credentials-grid strong { color: #60748b; font-size: .68rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.credentials-grid em { color: var(--navy); font-style: normal; font-weight: 850; overflow-wrap: anywhere; }
.access-drawer { max-width: min(1120px, calc(100vw - 24px)); }
.access-password-actions { justify-content: flex-start; margin: 14px 0 6px; }
.checkbox-card { grid-column: span 2; display: flex !important; align-items: center; gap: 12px !important; min-height: 58px; border: 1px solid rgba(89,112,138,.16); border-radius: 16px; padding: 10px 12px; background: rgba(255,255,255,.7); text-transform: none !important; }
.checkbox-card input { width: 18px; height: 18px; accent-color: #2f80ed; }
.checkbox-card span { display: grid; gap: 2px; }
.checkbox-card strong { color: var(--navy); font-size: .9rem; }
.checkbox-card em { color: #6a7e94; font-style: normal; font-size: .76rem; text-transform: none; }
.access-matrix-section { display: grid; gap: 14px; margin-top: 18px; border: 1px solid rgba(89,112,138,.14); border-radius: 18px; padding: 16px; background: rgba(245,250,255,.62); }
.access-matrix-section h3 { color: var(--navy); font-size: 1rem; }
.access-matrix-section > div > span, .access-matrix-section em { color: #6b7f94; font-size: .78rem; font-style: normal; font-weight: 760; }
.portal-access-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.portal-access-card { display: flex; align-items: center; gap: 10px; min-height: 48px; border: 1px solid rgba(89,112,138,.15); border-radius: 14px; padding: 0 12px; background: rgba(255,255,255,.76); color: #455c75; font-weight: 880; }
.portal-access-card.active { border-color: rgba(47,128,237,.35); color: #0b4b89; background: rgba(230,244,255,.86); box-shadow: 0 12px 28px rgba(47,128,237,.08); }
.portal-access-card input, .permission-row input { accent-color: #2f80ed; }
.module-permission-stack { display: grid; gap: 14px; }
.permission-portal { border: 1px solid rgba(89,112,138,.14); border-radius: 16px; overflow: hidden; background: rgba(255,255,255,.72); }
.permission-portal header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 14px; background: rgba(235,244,253,.72); }
.permission-portal header strong { color: var(--navy); }
.permission-portal header span { color: #60748b; font-size: .78rem; font-weight: 850; }
.permission-table { min-width: 760px; }
.permission-row { display: grid; grid-template-columns: minmax(180px, 1fr) repeat(6, minmax(78px, .42fr)); align-items: center; gap: 8px; border-top: 1px solid rgba(89,112,138,.11); padding: 10px 12px; }
.permission-row.permission-head { color: #60748b; font-size: .68rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; background: rgba(255,255,255,.42); }
.permission-row strong { color: #253a53; font-size: .84rem; }
.permission-row label { display: inline-flex; align-items: center; justify-content: center; gap: 6px; color: #50677f; font-size: .72rem; font-weight: 820; }
.permission-row label span { display: none; }
.warning { border-color: rgba(138,91,18,.18); color: #8a5b12; background: rgba(255,243,216,.74); }
.country-master-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.country-master-grid article { border: 1px solid rgba(126,149,178,.15); border-radius: 18px; padding: 16px; background: rgba(255,255,255,.58); }
.country-master-grid h4 { margin-bottom: 8px; color: var(--navy); }
.country-master-grid p { color: #5d7188; font-size: .9rem; font-weight: 720; line-height: 1.65; }
@media (max-width: 720px) { .task-form-grid { grid-template-columns: 1fr; } .sheet-action-bar, .date-filter-bar { justify-content: stretch; } .sheet-action-bar button, .date-filter-bar button { width: 100%; } .sheet-actions { min-width: 190px; } .sheet-actions button { display: inline-flex; width: auto; min-width: 42px; padding: 0 9px; gap: 5px; } .mini-action-label { display: inline; font-size: .68rem; font-weight: 850; } .credentials-panel, .credentials-grid, .portal-access-grid, .offer-address-section, .phone-input-row { grid-template-columns: 1fr; } .checkbox-card, .offer-address-section, .offer-address-section label:first-of-type { grid-column: auto; } .permission-portal { overflow-x: auto; } }
.sidebar-nav button { display: flex; align-items: center; justify-content: space-between; min-height: 44px; border-radius: 15px; padding: 0 13px; color: #445a72; font-size: .92rem; font-weight: 800; transition: background 180ms ease, color 180ms ease, transform 180ms ease; text-align: left; }
.sidebar-nav button:hover { color: var(--navy); background: rgba(255,255,255,.72); transform: translateX(3px); }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes drawerIn { from { transform: translateX(24px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@media (max-width: 1180px) { .ops-counter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .sheet-controls { grid-template-columns: repeat(3, minmax(0, 1fr)); } .sheet-search { grid-column: span 3; } .master-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 980px) { .ops-shell { grid-template-columns: 1fr; } .ops-sidebar { position: relative; top: 0; height: auto; } .ops-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .ops-topbar, .sheet-toolbar, .sheet-footer, .master-intro { align-items: stretch; flex-direction: column; } .ops-counter-grid, .sheet-controls, .drawer-actions, .drawer-detail-grid, .ops-nav, .master-grid, .country-master-grid, .settings-grid, .report-insights { grid-template-columns: 1fr; } .sheet-search { grid-column: auto; } .task-drawer { width: 100vw; max-width: 100vw; border-radius: 0; } .topbar-profile { min-width: 0; } .topbar-profile .profile-menu { left: 0; right: auto; } }

/* Professional Ops control-center shell */
:root {
  --app-bg: #f3f7fb;
  --panel: rgba(255, 255, 255, 0.86);
  --panel-strong: rgba(255, 255, 255, 0.96);
  --soft-line: rgba(92, 116, 145, 0.18);
}

:root[data-theme="dark"] {
  --app-bg: #081321;
  --navy: #eff6ff;
  --text: #dce8f6;
  --muted: #96a8bd;
  --line: rgba(164, 186, 211, 0.18);
  --soft-line: rgba(164, 186, 211, 0.16);
  --shadow: 0 26px 80px rgba(0, 0, 0, 0.42);
  --panel: rgba(14, 28, 45, 0.84);
  --panel-strong: rgba(16, 32, 51, 0.96);
  background: var(--app-bg);
}

:root[data-theme="dark"] html,
:root[data-theme="dark"] body { background: var(--app-bg); color: var(--text); }
:root[data-theme="dark"] .animated-background {
  background:
    radial-gradient(circle at 16% 14%, rgba(12, 154, 191, 0.2), transparent 30%),
    radial-gradient(circle at 78% 22%, rgba(93, 120, 255, 0.16), transparent 34%),
    linear-gradient(135deg, #081321 0%, #0e1d31 52%, #07101d 100%);
}
:root[data-theme="dark"] .portal-card,
:root[data-theme="dark"] .glass-panel,
:root[data-theme="dark"] .dashboard-card,
:root[data-theme="dark"] .current-user-card,
:root[data-theme="dark"] .ops-workspace-card,
:root[data-theme="dark"] .profile-menu,
:root[data-theme="dark"] .topbar-profile-button,
:root[data-theme="dark"] .global-search,
:root[data-theme="dark"] .search-box,
:root[data-theme="dark"] .icon-button,
:root[data-theme="dark"] .theme-toggle {
  border-color: var(--soft-line);
  background: linear-gradient(145deg, rgba(19, 37, 58, 0.92), rgba(12, 25, 42, 0.76));
  color: var(--text);
}
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] .readonly-cell,
:root[data-theme="dark"] .assignment-table td {
  border-color: var(--soft-line);
  background: rgba(10, 21, 36, 0.76) !important;
  color: var(--text);
}
:root[data-theme="dark"] .assignment-table th,
:root[data-theme="dark"] .modal-footer { background: rgba(15, 31, 50, 0.96); }

.dashboard-page.ops-page {
  height: 100vh;
  min-height: 100vh;
  overflow: hidden;
  padding: 0;
  background: var(--app-bg);
}

.ops-shell {
  display: block;
  width: 100%;
  height: 100vh;
  margin: 0;
}

.ops-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 42;
  display: flex;
  width: 282px;
  height: 100vh;
  max-height: 100vh;
  flex-direction: column;
  border-radius: 0;
  border-right: 1px solid var(--soft-line);
  padding: 14px;
  overflow: hidden;
  background: var(--panel);
}

.sidebar-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex: 0 0 auto;
}

.sidebar-top .os-lockup { margin-bottom: 12px; }
.sidebar-top .os-lockup img { width: 38px; height: 38px; }
.sidebar-collapse { width: 38px; min-height: 38px; }

.ops-workspace-card {
  flex: 0 0 auto;
  margin-bottom: 12px;
  border-radius: 18px;
  padding: 14px;
}

.ops-nav {
  display: grid;
  flex: 1 1 auto;
  min-height: 0;
  align-content: start;
  gap: 6px;
  overflow-y: auto;
  padding: 4px 0 10px;
}

.ops-nav button {
  min-height: 40px;
  border-radius: 12px;
  padding: 0 12px;
  white-space: nowrap;
}

.sidebar-footer {
  flex: 0 0 auto;
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--soft-line);
  padding-top: 10px;
}

.current-user-card {
  margin: 0;
  border-radius: 16px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.56);
}

.profile-trigger {
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 9px;
}

.profile-trigger .sheet-badge,
.profile-trigger small { grid-column: 2; }

.user-avatar {
  display: inline-grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid rgba(12,154,191,.22);
  border-radius: 999px;
  color: #07506a;
  background: rgba(230,248,252,.9);
  font-size: .78rem;
  font-weight: 900;
}

.user-avatar.small {
  width: 30px;
  height: 30px;
  font-size: .68rem;
}
.user-avatar.image-avatar { object-fit: cover; padding: 0; background: #fff; }

.sidebar-footer-button {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  border-radius: 12px;
  padding: 0 10px;
  color: #445a72;
  font-weight: 850;
}

.ops-main {
  height: 100vh;
  min-width: 0;
  margin-left: 282px;
  overflow-y: auto;
  padding: 0 18px 22px;
}

.ops-topbar {
  position: sticky;
  top: 0;
  z-index: var(--z-app-header);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 72px;
  border-radius: 0 0 20px 20px;
  margin: 0 -18px 14px;
  padding: 12px 18px;
  background: rgba(255,255,255,.9);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 12px 36px rgba(13,43,82,.08);
}

.topbar-left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.ops-topbar h1 {
  margin: 0;
  font-size: clamp(1.55rem, 2.8vw, 2.4rem);
  line-height: 1.05;
}

.ops-topbar p:last-child {
  max-width: 680px;
  margin: 4px 0 0;
  color: var(--muted);
  font-size: .92rem;
  line-height: 1.35;
}

.breadcrumbs {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: .76rem;
  font-weight: 850;
}

.breadcrumbs button { color: #497094; font-weight: 900; }

.ops-header-actions {
  flex-wrap: nowrap;
  justify-content: flex-end;
  min-width: 0;
}

.global-search {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: min(420px, 32vw);
  min-height: 42px;
  border: 1px solid rgba(89,112,138,.18);
  border-radius: 14px;
  padding: 0 12px;
  color: #5f7187;
  background: rgba(255,255,255,.78);
  cursor: pointer;
  font-weight: 780;
}

.global-search span {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}

.global-search kbd {
  border: 1px solid var(--soft-line);
  border-radius: 7px;
  padding: 2px 6px;
  background: rgba(255,255,255,.62);
  color: var(--muted);
  font: 800 .7rem/1 Inter, sans-serif;
}

.autosave-pill,
.theme-toggle {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  border: 1px solid var(--soft-line);
  border-radius: 999px;
  padding: 0 11px;
  color: #40566e;
  background: rgba(255,255,255,.72);
  font-size: .75rem;
  font-weight: 900;
  white-space: nowrap;
}

.theme-toggle { cursor: pointer; }
.icon-button.active { color: #07506a; background: #e6f8fc; }
.notify-dot { position: absolute; width: 8px; height: 8px; margin: -20px 0 0 18px; border-radius: 999px; background: #ef6a3a; }
.mobile-menu-button { display: none; }

.ops-content { min-width: 0; }
.ops-dashboard-intro { padding: 8px 4px 14px; }
.ops-control-grid { grid-template-columns: repeat(3, minmax(220px, 1fr)); gap: 14px; }
.dashboard-card { min-height: 156px; border-radius: 18px; padding: 18px; }
.dashboard-card-top { margin-bottom: 18px; }

.assignment-workspace,
.workspace-table,
.settings-card,
.master-card,
.master-country-section { border-radius: 18px; }

.sheet-toolbar,
.sheet-controls,
.date-filter-bar { padding: 14px 16px; }

.ops-counter-grid {
  grid-template-columns: repeat(6, minmax(128px, 1fr));
  gap: 10px;
  margin: 12px 0;
}

.ops-counter {
  min-height: 76px;
  border-radius: 16px;
  padding: 13px;
}

.ops-counter strong { font-size: 1.55rem; }
.ops-counter span { min-height: auto; font-size: .74rem; }

.spreadsheet-wrap {
  max-height: calc(100vh - 318px);
  overflow: auto;
  scroll-behavior: smooth;
}

.assignment-table th {
  position: sticky;
  top: 0;
  z-index: 12;
}

.assignment-table th:first-child,
.assignment-table td:first-child {
  position: sticky;
  left: 0;
  z-index: 13;
  box-shadow: 1px 0 0 rgba(126,149,178,.16);
}

.assignment-table td:first-child { z-index: 11; background: rgba(255,255,255,.96); }
.assignment-table th button { resize: horizontal; overflow: auto; }
.density-compact .assignment-table td,
.density-compact .assignment-table th { padding-block: 6px; }
.density-spreadsheet .assignment-table td,
.density-spreadsheet .assignment-table th { padding: 4px 8px; font-size: .78rem; }

.full-width-mode .ops-main,
.sidebar-collapsed .ops-main { margin-left: 72px; }
.full-width-mode .ops-topbar { border-radius: 0 0 14px 14px; }
.full-width-mode .spreadsheet-wrap { max-height: calc(100vh - 250px); }

.sheet-badge.status-pending { color: #526173; background: #eef2f6; }
.sheet-badge.status-assigned { color: #3845a8; background: #edf0ff; }
.sheet-badge.status-wip { color: #175ca8; background: #e8f2ff; }
.sheet-badge.status-loaded { color: #04738d; background: #e5f8fb; }
.sheet-badge.status-sent-qc { color: #5a3bb6; background: #f0ecff; }
.sheet-badge.status-error { color: #9c2d2d; background: #ffe7e7; }
.sheet-badge.status-returned { color: #a25318; background: #fff0e5; }
.sheet-badge.status-query { color: #8a5b12; background: #fff3d8; }
.sheet-badge.status-resolved { color: #1d6b4f; background: #e4f8ef; }
.sheet-badge.status-completed { color: #0f7a5b; background: #dff8ed; }
.sheet-badge.priority-urgent { color: #b33122; background: #ffe5df; }
.sheet-badge.priority-high { color: #a25318; background: #fff0e5; }
.sheet-badge.priority-medium { color: #175ca8; background: #e8f2ff; }
.sheet-badge.priority-low { color: #526173; background: #eef2f6; }
.sheet-badge.role-super-admin { color: #07506a; background: #e6f8fc; }

.floating-popover {
  position: fixed;
  top: 70px;
  right: 18px;
  z-index: 80;
  width: min(390px, calc(100vw - 28px));
  border-radius: 18px;
  padding: 12px;
  background: var(--panel-strong);
}

.floating-popover header,
.activity-panel header,
.command-palette header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.notification-popover article,
.activity-panel article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--soft-line);
  border-radius: 14px;
  padding: 10px;
  background: rgba(255,255,255,.56);
}

.notification-popover article + article,
.activity-panel article + article { margin-top: 8px; }
.notification-popover strong,
.activity-panel span { color: var(--navy); font-weight: 900; }
.notification-popover small,
.activity-panel small { display: block; margin-top: 3px; color: var(--muted); font-weight: 760; }
.tiny-action { min-height: 32px; padding-inline: 10px; border-radius: 10px; }

.activity-panel {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 85;
  width: min(420px, calc(100vw - 24px));
  border-radius: 0;
  padding: 18px;
  background: var(--panel-strong);
  box-shadow: -26px 0 70px rgba(16,36,59,.16);
}

.command-backdrop {
  position: fixed;
  inset: 0;
  z-index: 95;
  display: grid;
  align-items: start;
  justify-items: center;
  padding-top: 12vh;
  background: rgba(8, 19, 33, .38);
  backdrop-filter: blur(10px);
}

.command-palette {
  width: min(680px, calc(100vw - 28px));
  border-radius: 22px;
  padding: 14px;
  background: var(--panel-strong);
}

.command-palette header div {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  border: 1px solid var(--soft-line);
  border-radius: 15px;
  padding: 0 12px;
  background: rgba(255,255,255,.72);
}

.command-palette input {
  width: 100%;
  min-height: 46px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
}

.command-list { display: grid; gap: 8px; }
.command-list button {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  border: 1px solid var(--soft-line);
  border-radius: 13px;
  padding: 0 12px;
  color: var(--navy);
  background: rgba(255,255,255,.68);
  cursor: pointer;
  font-weight: 880;
}

@media (max-width: 1180px) {
  .global-search { width: min(300px, 28vw); }
  .autosave-pill { display: none; }
  .ops-counter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .mobile-menu-button { display: inline-flex; }
  .ops-sidebar { transform: translateX(-100%); transition: transform 180ms ease; }
  .ops-shell.sidebar-collapsed .ops-sidebar { transform: translateX(0); }
  .ops-main { margin-left: 0; padding-inline: 12px; }
  .ops-topbar { margin-inline: -12px; padding-inline: 12px; align-items: flex-start; }
  .topbar-left { align-items: flex-start; }
  .ops-header-actions { display: grid; grid-template-columns: 1fr auto auto; width: 100%; }
  .global-search { grid-column: 1 / -1; width: 100%; }
  .topbar-profile { min-width: 0; }
  .ops-control-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .ops-topbar { flex-direction: column; }
  .ops-counter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .theme-toggle { max-width: 96px; overflow: hidden; }
  .dashboard-card { min-height: 130px; }
  .quick-actions { right: 14px; bottom: 14px; }
}

/* Dual enterprise navigation */
.primary-sidebar,
.secondary-sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  z-index: 44;
  display: flex;
  flex-direction: column;
  border-radius: 0;
  overflow: hidden;
}

.primary-sidebar {
  left: 0;
  width: 72px;
  border-right: 1px solid var(--soft-line);
  padding: 12px 9px;
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(234,243,253,.72));
}

.secondary-sidebar {
  left: 72px;
  width: 260px;
  border-right: 1px solid var(--soft-line);
  padding: 14px;
  background: var(--panel);
  transition: transform 180ms ease;
}

:root[data-theme="dark"] .primary-sidebar {
  background: linear-gradient(180deg, rgba(15,30,49,.96), rgba(9,20,34,.86));
}

.primary-brand {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  border: 1px solid var(--soft-line);
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 14px 34px rgba(35,72,111,.1);
}

.primary-brand img {
  width: 34px;
  height: 34px;
  object-fit: contain;
  border-radius: 11px;
  background: #fff;
}

.primary-nav {
  display: grid;
  gap: 8px;
  margin-top: 18px;
}

.primary-nav button,
.primary-collapse {
  position: relative;
  display: grid;
  width: 52px;
  min-height: 48px;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 16px;
  color: #4d637c;
  background: transparent;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.primary-nav button span { display: none; }
.primary-nav button:hover,
.primary-nav button.active,
.primary-collapse:hover {
  color: #07506a;
  border-color: rgba(12,154,191,.2);
  background: rgba(230,248,252,.86);
  transform: translateY(-1px);
}

.primary-collapse {
  margin-top: auto;
}

.secondary-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--soft-line);
  padding-bottom: 12px;
  margin-bottom: 12px;
}

.secondary-head h2 {
  margin: 0;
  color: var(--navy);
  font-size: 1.08rem;
  letter-spacing: 0;
}

.nav-section {
  display: grid;
  gap: 7px;
  margin-bottom: 14px;
}

.modules-section {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding-right: 2px;
}

.nav-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.nav-module-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 14px;
  transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.nav-module-row.active,
.nav-module-row:hover {
  border-color: rgba(12,154,191,.16);
  background: rgba(255,255,255,.76);
  box-shadow: 0 12px 26px rgba(35,72,111,.08);
}

:root[data-theme="dark"] .nav-module-row.active,
:root[data-theme="dark"] .nav-module-row:hover {
  background: rgba(25, 45, 68, .76);
}

.nav-module {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 0 10px;
  color: #40566e;
  font-size: .88rem;
  font-weight: 880;
  text-align: left;
}

.nav-module-row.active .nav-module {
  color: var(--navy);
}

.favorite-toggle {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: 10px;
  color: #8da0b5;
  cursor: pointer;
}

.favorite-toggle.active {
  color: #07506a;
  background: rgba(230,248,252,.86);
}

.recent-section {
  flex: 0 0 auto;
  border-top: 1px solid var(--soft-line);
  padding-top: 12px;
}

.recent-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 36px;
  border-radius: 12px;
  padding: 0 9px;
  color: #52667e;
  text-align: left;
}

.recent-item:hover {
  background: rgba(255,255,255,.68);
}

.recent-item span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .82rem;
  font-weight: 850;
}

.recent-item em {
  color: var(--muted);
  font-size: .67rem;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.secondary-footer {
  flex: 0 0 auto;
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--soft-line);
  padding-top: 10px;
}

.secondary-footer-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}

.secondary-footer .sidebar-footer-button {
  justify-content: center;
  border: 1px solid var(--soft-line);
  background: rgba(255,255,255,.58);
}

.ops-shell .ops-sidebar,
.ops-shell .sidebar-top,
.ops-shell .ops-workspace-card,
.ops-shell .ops-nav,
.ops-shell .sidebar-footer {
  display: none !important;
}

.ops-main {
  margin-left: 332px;
}

.sidebar-collapsed .secondary-sidebar {
  transform: translateX(-100%);
}

.sidebar-collapsed .ops-main {
  margin-left: 72px;
}

.full-width-mode .secondary-sidebar {
  transform: translateX(-100%);
}

.full-width-mode .ops-main {
  margin-left: 72px;
}

.mobile-menu-button {
  display: inline-flex;
}

.topbar-left .mobile-menu-button {
  display: none;
}

@media (max-width: 900px) {
  .primary-sidebar {
    top: auto;
    right: 0;
    bottom: 0;
    width: auto;
    height: 64px;
    flex-direction: row;
    align-items: center;
    border-top: 1px solid var(--soft-line);
    border-right: 0;
    padding: 7px 10px;
  }

  .primary-brand,
  .primary-collapse {
    display: none;
  }

  .primary-nav {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
    margin: 0;
  }

  .primary-nav button {
    width: auto;
    min-height: 48px;
    border-radius: 14px;
  }

  .secondary-sidebar {
    left: 0;
    z-index: 90;
    width: min(300px, calc(100vw - 42px));
    transform: translateX(-100%);
    box-shadow: 28px 0 70px rgba(16,36,59,.18);
  }

  .ops-shell:not(.sidebar-collapsed) .secondary-sidebar {
    transform: translateX(0);
  }

  .ops-main,
  .sidebar-collapsed .ops-main,
  .full-width-mode .ops-main {
    margin-left: 0;
    padding-bottom: 78px;
  }

  .topbar-left .mobile-menu-button {
    display: inline-flex;
  }
}

/* Data-first workspace refinement */
.ops-page .animated-background {
  background: var(--app-bg);
}
.ops-page .mesh-gradient,
.ops-page .bg-block {
  display: none;
}
.ops-page .silver-grid {
  opacity: .28;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.42), transparent 70%);
}

.primary-sidebar,
.secondary-sidebar,
.ops-topbar,
.assignment-workspace,
.dashboard-card,
.workspace-card,
.settings-card,
.master-card {
  box-shadow: none;
}

.primary-sidebar {
  width: 64px;
  padding: 10px 7px;
}

.primary-brand,
.primary-nav button,
.primary-collapse {
  width: 48px;
  min-height: 44px;
  border-radius: 12px;
}

.primary-brand img {
  width: 30px;
  height: 30px;
}

.primary-profile {
  position: relative;
  margin-top: 8px;
}

.primary-profile .topbar-profile {
  min-width: 0;
}

.primary-profile .topbar-profile-button {
  display: grid;
  width: 48px;
  min-height: 44px;
  place-items: center;
  border-radius: 12px;
  padding: 0;
}

.primary-profile .topbar-profile-button > span:not(.user-avatar),
.primary-profile .topbar-profile-button strong {
  display: none;
}

.primary-profile .profile-menu {
  position: absolute;
  left: 56px;
  right: auto;
  bottom: 0;
  top: auto;
}

.secondary-sidebar {
  left: 64px;
  width: 232px;
  padding: 12px;
}

.secondary-head {
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.secondary-head h2 {
  font-size: .98rem;
}

.secondary-head .eyebrow {
  margin-bottom: 4px;
  font-size: .66rem;
}

.nav-section {
  gap: 5px;
  margin-bottom: 12px;
}

.nav-module-row {
  grid-template-columns: minmax(0, 1fr) 28px;
  border-radius: 10px;
}

.nav-module {
  min-height: 34px;
  gap: 8px;
  padding: 0 8px;
  font-size: .8rem;
}

.favorite-toggle {
  width: 24px;
  height: 24px;
  border-radius: 8px;
}

.recent-item {
  min-height: 30px;
  padding-inline: 8px;
}

.secondary-footer .current-user-card,
.secondary-footer-actions {
  display: none;
}

.ops-main {
  margin-left: 296px;
  padding: 0 12px 14px;
  background: rgba(248,250,253,.7);
}

:root[data-theme="dark"] .ops-main {
  background: rgba(8,19,33,.78);
}

.sidebar-collapsed .ops-main,
.full-width-mode .ops-main {
  margin-left: 64px;
}

.sidebar-collapsed .secondary-sidebar,
.full-width-mode .secondary-sidebar {
  transform: translateX(-100%);
}

.ops-topbar {
  min-height: 54px;
  border-radius: 0;
  margin: 0 -12px 8px;
  padding: 7px 12px;
  border-bottom: 1px solid var(--soft-line);
  background: color-mix(in srgb, var(--panel-strong), transparent 4%);
  backdrop-filter: blur(18px);
}

.ops-topbar h1 {
  font-size: 1.05rem;
  font-weight: 900;
}

.breadcrumbs {
  margin-bottom: 1px;
  font-size: .68rem;
}

.global-search {
  width: min(360px, 30vw);
  min-height: 34px;
  border-radius: 10px;
  font-size: .78rem;
}

.autosave-pill,
.theme-toggle {
  min-height: 32px;
  border-radius: 10px;
  font-size: .68rem;
}

.ops-header-actions .icon-button {
  width: 34px;
  min-height: 34px;
  border-radius: 10px;
}

.topbar-profile-button {
  display: grid;
  grid-template-columns: auto;
  min-height: 34px;
  border-radius: 999px;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.ops-header-actions .topbar-profile-button > span:not(.user-avatar),
.ops-header-actions .topbar-profile-button strong {
  display: none;
}

.user-avatar,
.user-avatar.small {
  width: 30px;
  height: 30px;
  font-size: .68rem;
}

.ops-counter-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0;
}

.ops-counter {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  gap: 8px;
  border-radius: 10px;
  padding: 6px 9px;
}

.ops-counter span {
  font-size: .68rem;
  text-transform: uppercase;
}

.ops-counter strong {
  margin: 0;
  font-size: .88rem;
}

.assignment-workspace {
  border-radius: 0;
  border-color: var(--soft-line);
  background: var(--panel-strong);
}

.compact-workbar {
  position: sticky;
  top: 54px;
  z-index: 24;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 8px;
  border-bottom: 1px solid var(--soft-line);
  padding: 8px;
  background: var(--panel-strong);
}

.inline-search {
  margin: 0;
}

.inline-search input {
  min-height: 34px;
  border-radius: 10px;
}

.sheet-action-bar {
  gap: 6px;
}

.icon-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  border: 1px solid var(--soft-line);
  border-radius: 10px;
  padding: 0 10px;
  color: #40566e;
  background: rgba(255,255,255,.72);
  cursor: pointer;
  font-size: .78rem;
  font-weight: 900;
}

.icon-action.primary {
  color: #fff;
  border-color: transparent;
  background: #0b5f7c;
}

.icon-action.active,
.icon-action:hover {
  color: #07506a;
  background: #e6f8fc;
}

.compact-kpi-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-bottom: 1px solid var(--soft-line);
  padding: 6px 8px;
  color: var(--muted);
  font-size: .74rem;
  font-weight: 850;
}

.compact-kpi-strip span {
  border-right: 1px solid var(--soft-line);
  padding: 0 10px;
}

.compact-kpi-strip span:first-child {
  padding-left: 0;
}

.compact-kpi-strip span:last-child {
  border-right: 0;
}

.compact-kpi-strip strong {
  color: var(--navy);
}

.compact-view-controls {
  justify-content: flex-end;
  border-bottom: 1px solid var(--soft-line);
  padding: 6px 8px;
}

.compact-view-controls label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.compact-view-controls select {
  min-height: 30px;
  border-radius: 9px;
}

.sheet-controls,
.date-filter-bar {
  gap: 8px;
  padding: 8px;
  border-bottom: 1px solid var(--soft-line);
}

.sheet-controls label,
.date-filter-bar label {
  gap: 4px;
}

.sheet-controls select,
.date-filter-bar input,
.date-filter-bar button {
  min-height: 32px;
  border-radius: 9px;
  font-size: .78rem;
}

.spreadsheet-wrap {
  max-height: calc(100vh - 270px);
  border-radius: 0;
}

.assignment-table th {
  background: #f4f7fb;
}

.assignment-table th button {
  min-height: 32px;
  font-size: .72rem;
}

.assignment-table td {
  padding: 4px 7px;
  font-size: .78rem;
}

.readonly-cell,
.assignment-table input,
.assignment-table select {
  min-height: 28px;
  border-radius: 7px;
  font-size: .78rem;
}

.sheet-footer {
  min-height: 40px;
  padding: 8px;
}

.quick-actions {
  display: none !important;
}

.notification-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  width: min(380px, calc(100vw - 28px));
  border-radius: 0;
  border-left: 1px solid var(--soft-line);
  padding: 14px;
  background: var(--panel-strong);
}

.notification-drawer header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--soft-line);
  padding-bottom: 12px;
  margin-bottom: 12px;
}

.notification-drawer h3 {
  margin: 0;
  color: var(--navy);
  font-size: 1rem;
}

.notification-drawer article {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  gap: 9px;
  align-items: center;
  border-bottom: 1px solid var(--soft-line);
  padding: 10px 0;
}

.notification-drawer strong {
  display: block;
  color: var(--navy);
  font-size: .88rem;
}

.notification-drawer small {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 760;
}

.workspace-launcher {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  max-width: 980px;
  padding: 8px 0;
}

.workspace-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  border-radius: 12px;
  padding: 14px;
  background: var(--panel-strong);
}

.workspace-card-icon {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid var(--soft-line);
  border-radius: 10px;
  color: #07506a;
  background: rgba(230,248,252,.78);
}

.workspace-card h2 {
  margin: 0 0 5px;
  color: var(--navy);
  font-size: 1rem;
}

.workspace-card p {
  margin: 0;
  color: var(--muted);
  font-size: .84rem;
  line-height: 1.45;
}

.workspace-card button {
  grid-column: 1 / -1;
  justify-self: start;
  min-height: 34px;
  border-radius: 10px;
}

@media (max-width: 900px) {
  .primary-sidebar {
    width: auto;
  }
  .secondary-sidebar {
    left: 0;
  }
  .ops-main,
  .sidebar-collapsed .ops-main,
  .full-width-mode .ops-main {
    margin-left: 0;
  }
  .compact-workbar {
    top: 98px;
    grid-template-columns: 1fr;
  }
  .workspace-launcher {
    grid-template-columns: 1fr;
  }
}

/* UI reset: single clean glass sidebar with the calmer Setzling visual style */
.ops-page .animated-background {
  background:
    radial-gradient(circle at 12% 18%, rgba(47, 128, 237, 0.16), transparent 28%),
    radial-gradient(circle at 82% 22%, rgba(158, 178, 204, 0.16), transparent 30%),
    linear-gradient(135deg, #f9fbff 0%, #eef5fb 42%, #ffffff 100%);
}
.ops-page .mesh-gradient,
.ops-page .bg-block {
  display: block;
}
.ops-page .silver-grid {
  opacity: 1;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.72), transparent 76%);
}

.primary-sidebar,
.secondary-sidebar,
.primary-profile {
  display: none !important;
}

.clean-sidebar {
  position: fixed;
  inset: 18px auto 18px 18px;
  z-index: 44;
  display: flex;
  width: 282px;
  flex-direction: column;
  overflow: hidden;
  border-radius: 24px;
  padding: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.86), rgba(241,247,254,.66));
  box-shadow: 0 24px 70px rgba(16, 36, 59, 0.12);
}

.clean-sidebar .os-lockup {
  margin: 0 0 18px;
  min-height: 46px;
}

.clean-sidebar .os-lockup img {
  width: 42px;
  height: 42px;
  border-radius: 14px;
}

.clean-nav {
  display: grid;
  align-content: start;
  gap: 16px;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding-right: 2px;
}

.clean-nav-section {
  display: grid;
  gap: 6px;
}

.clean-nav-section h3 {
  margin: 0 0 3px;
  color: #6c7f95;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.clean-nav-section button {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 13px;
  padding: 0 11px;
  color: #40566e;
  background: transparent;
  cursor: pointer;
  font-size: .88rem;
  font-weight: 850;
  text-align: left;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.clean-nav-section button:hover,
.clean-nav-section button.active {
  color: #071526;
  border-color: rgba(255,255,255,.72);
  background: rgba(255,255,255,.78);
  transform: translateX(2px);
  box-shadow: 0 12px 28px rgba(35,72,111,.08);
}

.clean-nav-section button svg {
  color: #0c9abf;
}

.clean-sidebar-footer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  flex: 0 0 auto;
  border-top: 1px solid rgba(126,149,178,.16);
  padding-top: 12px;
}

.sidebar-theme,
.clean-sidebar-footer .sidebar-footer-button {
  justify-content: center;
  width: 100%;
  min-height: 38px;
  border: 1px solid rgba(89,112,138,.16);
  border-radius: 13px;
  background: rgba(255,255,255,.66);
}

.ops-main,
.sidebar-collapsed .ops-main,
.full-width-mode .ops-main {
  margin-left: 318px;
  padding: 18px 20px 22px;
  background: transparent;
}

.full-width-mode .clean-sidebar {
  display: none;
}

.full-width-mode .ops-main {
  margin-left: 0;
}

.ops-topbar {
  min-height: 58px;
  border-radius: 22px;
  margin: 0 0 14px;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.68);
  background: linear-gradient(145deg, rgba(255,255,255,.88), rgba(241,247,254,.68));
  box-shadow: 0 18px 48px rgba(16, 36, 59, 0.1);
}

.ops-topbar h1 {
  color: #071526;
  font-size: 1.22rem;
}

.breadcrumbs {
  color: #68778c;
}

.global-search {
  min-height: 38px;
  border-radius: 14px;
  background: rgba(255,255,255,.74);
}

.theme-toggle,
.ops-header-actions .icon-button {
  min-height: 38px;
  border-radius: 14px;
  background: rgba(255,255,255,.72);
}

.topbar-profile .profile-menu {
  right: 0;
  left: auto;
}

.assignment-workspace {
  overflow: hidden;
  border-radius: 22px;
  border-color: rgba(255,255,255,.68);
  background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(241,247,254,.68));
  box-shadow: 0 22px 60px rgba(16, 36, 59, 0.12);
}

.compact-workbar {
  top: 0;
  border-bottom-color: rgba(126,149,178,.15);
  padding: 10px;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(18px);
}

.icon-action {
  border-radius: 13px;
  background: rgba(255,255,255,.76);
}

.icon-action.primary {
  background: linear-gradient(135deg, #071526, #0c9abf);
}

.compact-kpi-strip,
.compact-view-controls,
.sheet-controls,
.date-filter-bar {
  background: rgba(255,255,255,.54);
  border-bottom-color: rgba(126,149,178,.14);
}

.spreadsheet-wrap {
  max-height: calc(100vh - 302px);
}

.assignment-table th {
  background: #eef5fb;
}

.notification-drawer {
  border-radius: 22px 0 0 22px;
  background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(241,247,254,.78));
  box-shadow: -24px 0 70px rgba(16,36,59,.14);
}

:root[data-theme="dark"] .clean-sidebar,
:root[data-theme="dark"] .ops-topbar,
:root[data-theme="dark"] .assignment-workspace,
:root[data-theme="dark"] .notification-drawer {
  border-color: var(--soft-line);
  background: linear-gradient(145deg, rgba(19, 37, 58, 0.92), rgba(12, 25, 42, 0.76));
}

:root[data-theme="dark"] .clean-nav-section button:hover,
:root[data-theme="dark"] .clean-nav-section button.active {
  color: var(--text);
  background: rgba(25, 45, 68, .76);
}

@media (max-width: 900px) {
  .clean-sidebar {
    transform: translateX(-110%);
    transition: transform 180ms ease;
  }
  .ops-shell.sidebar-collapsed .clean-sidebar {
    transform: translateX(0);
  }
  .ops-main,
  .sidebar-collapsed .ops-main,
  .full-width-mode .ops-main {
    margin-left: 0;
    padding: 12px;
  }
  .compact-workbar {
    grid-template-columns: 1fr;
  }
}

/* Assignment Sheet refinement */
.clean-sidebar {
  inset: 14px auto 14px 14px;
  width: 260px;
  border-radius: 22px;
  padding: 14px;
}

.clean-sidebar .os-lockup {
  min-height: 38px;
  margin-bottom: 12px;
  gap: 9px;
  font-size: .98rem;
}

.clean-sidebar .os-lockup img {
  width: 34px;
  height: 34px;
  border-radius: 11px;
}

.clean-nav {
  gap: 11px;
}

.clean-nav-section {
  gap: 4px;
}

.clean-nav-section h3 {
  margin-bottom: 2px;
  font-size: .66rem;
}

.clean-nav-section button {
  min-height: 34px;
  border-radius: 11px;
  padding: 0 9px;
  font-size: .82rem;
}

.clean-sidebar-footer {
  display: none;
}

.ops-main,
.sidebar-collapsed .ops-main {
  margin-left: 288px;
  padding: 14px 16px 18px;
}

.full-width-mode .ops-main {
  margin-left: 0;
}

.ops-topbar {
  min-height: 42px;
  border-radius: 18px;
  margin-bottom: 10px;
  padding: 7px 10px;
}

.topbar-left {
  gap: 9px;
}

.ops-topbar h1 {
  font-size: .98rem;
  line-height: 1.05;
}

.breadcrumbs {
  margin-bottom: 0;
  font-size: .64rem;
}

.global-search {
  width: min(390px, 34vw);
  min-height: 32px;
  border-radius: 11px;
  font-size: .76rem;
}

.global-search kbd {
  padding: 1px 5px;
  font-size: .66rem;
}

.theme-toggle,
.ops-header-actions .icon-button {
  min-height: 32px;
  height: 32px;
  border-radius: 11px;
}

.theme-toggle {
  padding-inline: 10px;
  font-size: .68rem;
}

.notify-button {
  position: relative;
}

.notify-count {
  position: absolute;
  top: -5px;
  right: -5px;
  display: grid;
  min-width: 17px;
  height: 17px;
  place-items: center;
  border: 2px solid rgba(255,255,255,.88);
  border-radius: 999px;
  color: #fff;
  background: #ef6a3a;
  font-size: .62rem;
  font-weight: 900;
}

.notify-dot {
  display: none;
}

.topbar-profile-button {
  min-height: 32px;
}

.user-avatar.small {
  width: 28px;
  height: 28px;
}

.assignment-workspace {
  border-radius: 20px;
}

.compact-workbar {
  top: 0;
  grid-template-columns: minmax(300px, 1fr) auto;
  gap: 8px;
  padding: 8px;
}

.inline-search span {
  display: none;
}

.inline-search input {
  min-height: 32px;
  border-radius: 11px;
  padding-inline: 12px;
}

.sheet-action-bar {
  gap: 5px;
}

.icon-action {
  min-height: 32px;
  border-color: rgba(89,112,138,.12);
  border-radius: 11px;
  padding: 0 9px;
  font-size: .74rem;
  transition: background 150ms ease, color 150ms ease, transform 150ms ease, box-shadow 150ms ease;
}

.icon-action:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(35,72,111,.08);
}

.icon-action.tertiary {
  color: #587089;
  background: rgba(255,255,255,.48);
}

.compact-kpi-strip {
  padding: 5px 8px;
  font-size: .7rem;
}

.compact-kpi-strip span {
  padding: 0 8px;
}

.sheet-controls {
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 7px;
  padding: 7px 8px;
}

.sheet-controls span,
.date-filter-bar span {
  font-size: .64rem;
}

.sheet-controls select,
.sheet-controls input,
.date-filter-bar input,
.date-filter-bar button,
.compact-view-controls select {
  min-height: 30px;
  border-color: rgba(89,112,138,.12);
  border-radius: 9px;
  padding-inline: 9px;
  font-size: .74rem;
}

.advanced-filters {
  border-bottom: 1px solid rgba(126,149,178,.1);
  background: rgba(255,255,255,.42);
}

.advanced-filters summary {
  min-height: 30px;
  padding: 7px 10px;
  color: #587089;
  cursor: pointer;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.date-filter-bar {
  border-top: 1px solid rgba(126,149,178,.1);
  padding: 8px;
}

.spreadsheet-wrap {
  max-height: calc(100vh - 250px);
}

.assignment-table {
  font-size: .78rem;
}

.assignment-table th {
  background: linear-gradient(180deg, rgba(238,246,252,.98), rgba(231,241,249,.98));
}

.assignment-table th button {
  min-height: 28px;
  gap: 6px;
  padding: 0 8px;
  font-size: .66rem;
  letter-spacing: 0;
}

.assignment-table td {
  border-right-color: rgba(126,149,178,.08);
  border-bottom-color: rgba(126,149,178,.1);
}

.assignment-table input,
.assignment-table select,
.readonly-cell {
  min-height: 28px;
  padding-inline: 7px;
  font-size: .76rem;
}

.density-spreadsheet .assignment-table input,
.density-spreadsheet .assignment-table select,
.density-spreadsheet .readonly-cell {
  min-height: 26px;
  font-size: .74rem;
}

.density-spreadsheet .assignment-table th button {
  min-height: 27px;
  font-size: .64rem;
}

.assignment-table tbody tr {
  transition: background 140ms ease;
}

.assignment-table tbody tr:hover td {
  background: rgba(230,248,252,.9);
}

.assignment-table tbody tr:focus-within td {
  background: rgba(216,244,251,.94);
}

.sheet-actions button {
  min-height: 28px;
}

.sheet-footer {
  min-height: 34px;
  padding: 6px 8px;
  font-size: .75rem;
}

@media (max-width: 1180px) {
  .sheet-controls {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .compact-workbar {
    grid-template-columns: 1fr;
  }
}

/* Bulk Add repair: full-screen, crisp, spreadsheet-first drawer */
.drawer-backdrop.bulk-backdrop {
  z-index: 120;
  display: grid;
  place-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(7, 21, 38, .36);
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.bulk-backdrop .bulk-drawer {
  position: relative;
  z-index: 121;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
  width: min(95vw, 1760px);
  height: min(90vh, 980px);
  max-width: none;
  max-height: none;
  overflow: hidden;
  border-radius: 24px;
  padding: 0;
  background: rgba(248, 252, 255, .98);
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 32px 90px rgba(7, 21, 38, .28);
}

.bulk-drawer .bulk-drawer-header {
  position: sticky;
  top: 0;
  z-index: 4;
  margin: 0;
  border-bottom: 1px solid rgba(126,149,178,.18);
  padding: 14px 18px;
  background: rgba(248, 252, 255, .98);
}

.bulk-drawer .bulk-drawer-tools {
  position: sticky;
  top: 0;
  z-index: 3;
  display: grid;
  gap: 8px;
  border-bottom: 1px solid rgba(126,149,178,.14);
  padding: 10px 18px;
  background: rgba(248, 252, 255, .96);
}

.bulk-drawer .import-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  margin: 0;
  padding: 9px 12px;
  border-radius: 14px;
}

.bulk-drawer .import-summary strong,
.bulk-drawer .import-summary p {
  margin: 0;
}

.bulk-drawer .import-options {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
}

.bulk-row-count {
  color: #41566f;
  font-size: .78rem;
  white-space: nowrap;
}

.bulk-drawer .bulk-grid {
  min-height: 0;
  max-height: none;
  height: 100%;
  margin: 0 18px;
  overflow: auto;
  border: 1px solid rgba(126,149,178,.18);
  border-radius: 16px;
  background: #fff;
}

.bulk-drawer .assignment-table {
  width: max-content;
  min-width: 100%;
}

.bulk-drawer .assignment-table th {
  top: 0;
  z-index: 5;
  background: linear-gradient(180deg, rgba(238,246,252,1), rgba(231,241,249,1));
}

.bulk-drawer .assignment-table th:first-child,
.bulk-drawer .assignment-table td:first-child {
  position: sticky;
  left: 0;
  z-index: 6;
}

.bulk-drawer .assignment-table td:first-child {
  z-index: 4;
  background: rgba(255,255,255,.98) !important;
}

.bulk-drawer .assignment-table input,
.bulk-drawer .assignment-table select {
  min-height: 30px;
  border-radius: 6px;
  font-size: .76rem;
}

.bulk-drawer .sheet-actions-head {
  position: sticky !important;
  right: 0;
  z-index: 7 !important;
  min-width: 104px;
}

.bulk-drawer .sheet-actions {
  position: sticky;
  right: 0;
  z-index: 4;
  min-width: 104px;
  background: rgba(250,253,255,.98) !important;
}

.bulk-drawer .bulk-validation {
  max-height: 92px;
  overflow: auto;
  margin: 8px 18px 0;
  padding: 9px 12px;
}

.bulk-drawer .bulk-footer {
  bottom: 0;
  z-index: 4;
  margin: 0;
  padding: 12px 18px;
  background: rgba(248, 252, 255, .98);
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

@media (max-width: 720px) {
  .drawer-backdrop.bulk-backdrop {
    padding: 8px;
  }
  .bulk-backdrop .bulk-drawer {
    width: calc(100vw - 16px);
    height: calc(100vh - 16px);
    border-radius: 18px;
  }
  .bulk-drawer .import-options {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Advanced Ops foundations */
.ops-smart-widgets {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  padding: 8px;
  border-bottom: 1px solid rgba(126,149,178,.1);
}

.ops-smart-widgets article,
.passport-folder-grid article,
.task-intel-grid article {
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 14px;
  padding: 10px;
  background: rgba(255,255,255,.68);
}

.ops-smart-widgets span,
.task-intel-grid span {
  display: block;
  color: #587089;
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.ops-smart-widgets strong,
.task-intel-grid strong {
  display: block;
  margin-top: 3px;
  color: #071526;
  font-size: 1.05rem;
  font-weight: 950;
}

.saved-views-bar,
.bulk-actions-bar,
.workload-panel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  border-bottom: 1px solid rgba(126,149,178,.1);
  padding: 7px 8px;
  background: rgba(255,255,255,.46);
}

.saved-views-bar span,
.bulk-actions-bar strong {
  color: #587089;
  font-size: .7rem;
  font-weight: 950;
  text-transform: uppercase;
}

.saved-views-bar button,
.bulk-actions-bar button {
  min-height: 28px;
  border: 1px solid rgba(126,149,178,.16);
  border-radius: 10px;
  padding: 0 10px;
  color: #41566f;
  background: rgba(255,255,255,.76);
  cursor: pointer;
  font-size: .72rem;
  font-weight: 850;
}

.bulk-actions-bar {
  background: rgba(224,247,252,.72);
}

.workload-panel {
  display: block;
  padding: 0;
}

.workload-panel summary {
  display: flex;
  align-items: center;
  min-height: 34px;
  padding: 0 10px;
  color: #405870;
  cursor: pointer;
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.workload-panel > div {
  display: grid;
  grid-template-columns: repeat(5, minmax(160px, 1fr));
  gap: 8px;
  padding: 0 8px 8px;
}

.workload-panel article {
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 14px;
  padding: 10px;
  background: rgba(255,255,255,.66);
}

.workload-panel article strong,
.workload-panel article span,
.workload-panel article small {
  display: block;
}

.workload-panel article strong {
  color: #071526;
  font-size: .86rem;
}

.workload-panel article span,
.workload-panel article small {
  margin-top: 4px;
  color: #587089;
  font-size: .7rem;
  font-weight: 760;
}

.workload-panel article em {
  display: inline-flex;
  margin-top: 8px;
}

.select-cell {
  min-width: 44px !important;
  width: 44px;
  text-align: center;
}

.select-cell input {
  width: 16px;
  min-height: 16px;
  margin: auto;
}

.task-intel-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

.task-intel-grid small {
  display: block;
  margin-top: 4px;
  color: #657891;
  font-size: .76rem;
  font-weight: 760;
}

.passport-link-card {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid rgba(12,154,191,.16);
  border-radius: 18px;
  margin: 12px 0;
  padding: 12px;
  background: rgba(232,248,252,.72);
}

.passport-link-card h3 {
  margin: 2px 0 4px;
  color: #071526;
}

.passport-link-card p {
  margin: 0;
  color: #587089;
}

.passport-actions,
.passport-match-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.passport-match-list {
  flex-direction: column;
}

.passport-match-list button {
  border: 1px solid rgba(126,149,178,.16);
  border-radius: 14px;
  padding: 11px 12px;
  text-align: left;
  background: rgba(255,255,255,.8);
  cursor: pointer;
}

.passport-match-list span {
  display: block;
  margin-top: 4px;
  color: #587089;
}

.drawer-activity strong {
  line-height: 1.45;
}

.passport-page {
  overflow: hidden;
}

.passport-intelligence {
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 92px);
}

.passport-topbar {
  border-bottom: 1px solid rgba(126,149,178,.12);
}

.passport-layout {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  min-height: 0;
}

.passport-module-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px;
  border-right: 1px solid rgba(126,149,178,.12);
  background: rgba(255,255,255,.28);
}

.passport-module-nav button {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 34px;
  border: 1px solid transparent;
  border-radius: 11px;
  padding: 0 10px;
  color: #425971;
  background: transparent;
  cursor: pointer;
  font-size: .76rem;
  font-weight: 900;
  text-align: left;
}

.passport-module-nav button:hover,
.passport-module-nav button.active {
  border-color: rgba(12,154,191,.22);
  color: #072033;
  background: rgba(224,247,252,.72);
}

.passport-workspace {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}

.passport-summary-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(110px, 1fr));
  gap: 8px;
  padding: 10px;
}

.passport-summary-strip article,
.passport-client-card {
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 14px;
  padding: 10px;
  background: rgba(255,255,255,.66);
}

.passport-summary-strip span,
.passport-panel-title span,
.passport-client-card span,
.passport-client-card small {
  color: #587089;
  font-size: .7rem;
  font-weight: 850;
}

.passport-summary-strip strong {
  display: block;
  margin-top: 3px;
  color: #071526;
  font-size: 1.1rem;
  font-weight: 950;
}

.passport-folder-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 8px;
  padding: 10px;
}

.passport-folder-grid article {
  cursor: pointer;
}

.passport-folder-grid article span {
  display: inline-flex;
  color: #0c9abf;
}

.passport-folder-grid article strong {
  display: block;
  margin-top: 8px;
  color: #071526;
}

.passport-folder-grid article small {
  color: #587089;
  font-weight: 760;
}

.passport-records-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
  padding: 10px;
}

.passport-panel-title,
.passport-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
}

.passport-panel-title {
  justify-content: space-between;
}

.passport-panel-title h3 {
  margin: 0;
  color: #071526;
}

.passport-filter-bar {
  border: 1px solid rgba(126,149,178,.12);
  border-radius: 14px;
  padding: 8px;
  background: rgba(255,255,255,.48);
}

.passport-filter-bar label {
  min-width: 128px;
}

.passport-filter-bar .sheet-search {
  flex: 1 1 260px;
  min-width: 240px;
}

.passport-table-shell {
  overflow: auto;
  border: 1px solid rgba(126,149,178,.12);
  border-radius: 14px;
  max-height: min(52vh, 520px);
  background: rgba(255,255,255,.55);
}

.passport-table thead th {
  position: sticky;
  top: 0;
  z-index: 5;
}

.passport-record-detail {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 10px;
  border: 1px solid rgba(126,149,178,.12);
  border-radius: 14px;
  padding: 10px;
  background: rgba(255,255,255,.58);
}

.passport-record-detail h3,
.passport-client-card h3 {
  margin: 0 0 4px;
  color: #071526;
}

.passport-clients-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 10px;
  padding: 10px;
}

.passport-client-card {
  display: grid;
  gap: 8px;
}

.passport-client-card p {
  margin: 0;
  color: #587089;
}

.storage-plan {
  margin: 0 10px 10px;
}

.passport-actions .secondary-action {
  align-items: flex-start;
  flex-direction: column;
  gap: 2px;
}

.passport-actions small,
.passport-match-list small {
  display: block;
  color: #587089;
  font-size: .68rem;
  font-weight: 800;
}

.passport-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 10px;
}

.passport-tags em {
  border: 1px solid rgba(126,149,178,.16);
  border-radius: 999px;
  padding: 3px 7px;
  color: #587089;
  background: rgba(255,255,255,.72);
  font-size: .68rem;
  font-style: normal;
  font-weight: 850;
}

@media (max-width: 980px) {
  .passport-layout,
  .passport-record-detail {
    grid-template-columns: 1fr;
  }

  .passport-module-nav {
    flex-direction: row;
    overflow-x: auto;
    border-right: 0;
    border-bottom: 1px solid rgba(126,149,178,.12);
  }

  .passport-module-nav button {
    flex: 0 0 auto;
  }

  .passport-summary-strip,
  .passport-clients-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .passport-folder-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .passport-summary-strip,
  .passport-clients-grid,
  .passport-folder-grid {
    grid-template-columns: 1fr;
  }

  .passport-filter-bar label,
  .passport-filter-bar .sheet-search {
    min-width: 100%;
  }
}

.activity-log-page {
  overflow: hidden;
}

.activity-timeline-table {
  display: grid;
  gap: 8px;
  padding: 10px;
}

.activity-timeline-table article {
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(255,255,255,.68);
}

.activity-timeline-table span {
  color: #587089;
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.activity-timeline-table strong {
  display: block;
  margin-top: 4px;
  color: #071526;
  font-size: .9rem;
}

.activity-timeline-table p {
  margin: 4px 0 0;
  color: #587089;
  font-size: .78rem;
  font-weight: 760;
}

/* Client Desk query batch system */
.client-desk-toolbar {
  align-items: center;
}

.client-filter-row {
  border-top: 1px solid rgba(126,149,178,.08);
}

.open-tmt-link,
.mini-link {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border: 1px solid rgba(12,154,191,.18);
  border-radius: 10px;
  padding: 0 10px;
  color: #08799a;
  background: rgba(232,248,252,.75);
  font-size: .72rem;
  font-weight: 900;
  text-decoration: none;
}

.merge-suggestion {
  display: block;
  margin-top: 5px;
  color: #9a6a04;
  font-size: .68rem;
  font-weight: 850;
}

.inline-check {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 7px;
  color: #405870;
  font-size: .76rem;
  font-weight: 850;
}

.inline-check input {
  width: 15px;
  min-height: 15px;
}

.outlook-draft-card {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.outlook-draft-card label {
  display: grid;
  gap: 7px;
}

.outlook-draft-card label span {
  color: #587089;
  font-size: .72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.outlook-draft-card textarea {
  min-height: 72px;
  border: 1px solid rgba(126,149,178,.16);
  border-radius: 14px;
  padding: 12px;
  color: #071526;
  background: rgba(255,255,255,.8);
  font: inherit;
  font-size: .84rem;
  line-height: 1.45;
  resize: vertical;
}

.outlook-draft-card .email-body-textarea {
  min-height: 260px;
}

.active-row td {
  background: rgba(224,247,252,.72) !important;
}

@media (max-width: 1180px) {
  .ops-smart-widgets,
  .workload-panel > div,
  .passport-folder-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .ops-smart-widgets,
  .workload-panel > div,
  .passport-folder-grid,
  .task-intel-grid {
    grid-template-columns: 1fr;
  }
  .passport-link-card {
    flex-direction: column;
  }
}

/* UI stabilization pass: responsive, dense, enterprise polish */
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --sidebar-w: 248px;
  --header-h: 48px;
  --toolbar-h: 46px;
  --control-h: 32px;
}

body {
  overscroll-behavior: none;
}

.dashboard-page.ops-page {
  overflow: hidden !important;
}

.ops-shell,
.ops-main,
.ops-content {
  min-width: 0;
}

.clean-sidebar {
  inset: 12px auto 12px 12px !important;
  width: var(--sidebar-w) !important;
  padding: var(--space-3) !important;
  border-radius: 20px !important;
}

.clean-sidebar .os-lockup {
  min-height: 34px !important;
  margin-bottom: var(--space-3) !important;
  padding: 0 4px;
  gap: 8px !important;
  font-size: .92rem !important;
}

.clean-sidebar .os-lockup img {
  width: 30px !important;
  height: 30px !important;
  border-radius: 10px !important;
}

.clean-nav {
  gap: 10px !important;
  padding-right: 1px !important;
  scrollbar-width: thin;
}

.clean-nav-section {
  gap: 3px !important;
}

.clean-nav-section h3 {
  margin: 0 0 2px !important;
  padding: 0 7px;
  color: #6a7f96;
  font-size: .62rem !important;
  letter-spacing: .04em !important;
}

.clean-nav-section button {
  min-height: 32px !important;
  border-radius: 10px !important;
  padding: 0 9px !important;
  gap: 8px !important;
  font-size: .8rem !important;
  box-shadow: none !important;
}

.clean-nav-section button.active {
  border-color: rgba(12,154,191,.2) !important;
  background: rgba(230,248,252,.88) !important;
  box-shadow: inset 3px 0 0 #0c9abf !important;
  transform: none !important;
}

.clean-nav-section button:hover {
  transform: none !important;
}

.ops-main,
.sidebar-collapsed .ops-main {
  height: 100vh;
  margin-left: calc(var(--sidebar-w) + 28px) !important;
  overflow: auto;
  padding: 12px 14px 16px !important;
}

.full-width-mode .ops-main {
  margin-left: 0 !important;
}

.ops-topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 38 !important;
  display: flex !important;
  min-height: var(--header-h) !important;
  align-items: center !important;
  gap: var(--space-3) !important;
  margin: 0 0 8px !important;
  border-radius: 16px !important;
  padding: 6px 9px !important;
  overflow: visible !important;
}

.topbar-left {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
}

.topbar-left > div {
  min-width: 0;
}

.ops-topbar h1 {
  max-width: 42vw;
  margin: 0 !important;
  overflow: hidden;
  color: var(--navy);
  font-size: .98rem !important;
  font-weight: 950;
  line-height: 1.08;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.breadcrumbs {
  display: flex;
  max-width: 42vw;
  align-items: center;
  gap: 5px;
  overflow: hidden;
  font-size: .62rem !important;
  line-height: 1.1;
  white-space: nowrap;
}

.breadcrumbs button,
.breadcrumbs strong {
  overflow: hidden;
  text-overflow: ellipsis;
}

.topbar-actions,
.ops-header-actions {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 5px !important;
}

.global-search {
  width: clamp(180px, 27vw, 340px) !important;
  min-width: 0 !important;
  min-height: 32px !important;
  border-radius: 10px !important;
  padding: 0 9px !important;
}

.global-search span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.global-search kbd {
  flex: 0 0 auto;
}

.theme-toggle,
.ops-header-actions .icon-button,
.topbar-profile-button {
  min-height: 32px !important;
  height: 32px !important;
  border-radius: 10px !important;
}

.theme-toggle {
  max-width: 86px;
  overflow: hidden;
  padding: 0 8px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.assignment-workspace {
  border-radius: 16px !important;
  overflow: hidden !important;
}

.sheet-toolbar,
.compact-workbar {
  position: sticky !important;
  top: calc(var(--header-h) + 8px) !important;
  z-index: 26 !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 8px !important;
  overflow: visible !important;
}

.sheet-toolbar > div:first-child {
  min-width: 0;
}

.sheet-toolbar h2 {
  margin: 0 !important;
  overflow: hidden;
  font-size: 1rem !important;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sheet-toolbar .eyebrow,
.sheet-toolbar span {
  margin-bottom: 2px;
  overflow: hidden;
  font-size: .62rem !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sheet-action-bar {
  display: flex !important;
  max-width: 100%;
  align-items: center;
  justify-content: flex-end;
  gap: 5px !important;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 1px;
  scrollbar-width: thin;
  white-space: nowrap;
}

.primary-action,
.secondary-action,
.icon-action,
.pagination-controls button,
.date-filter-bar button,
.sheet-view-controls button,
.profile-menu button {
  min-height: var(--control-h) !important;
  border-radius: 10px !important;
  gap: 6px !important;
  line-height: 1 !important;
}

.primary-action,
.secondary-action,
.icon-action {
  flex: 0 0 auto;
  padding: 0 10px !important;
  font-size: .74rem !important;
}

.icon-action svg,
.secondary-action svg,
.primary-action svg {
  flex: 0 0 auto;
}

.compact-kpi-strip {
  display: flex !important;
  min-height: 28px;
  align-items: center;
  gap: 0 !important;
  padding: 4px 8px !important;
  overflow-x: auto;
  overflow-y: hidden;
  font-size: .68rem !important;
  scrollbar-width: thin;
  white-space: nowrap;
}

.compact-kpi-strip span {
  flex: 0 0 auto;
  border-right: 1px solid rgba(126,149,178,.16);
  padding: 0 9px !important;
}

.ops-counter-grid {
  display: flex !important;
  flex-wrap: wrap;
  gap: 6px !important;
  margin: 6px 0 8px !important;
}

.ops-counter {
  min-height: 30px !important;
  border-radius: 10px !important;
  padding: 5px 8px !important;
}

.ops-counter span {
  min-height: 0 !important;
  font-size: .64rem !important;
}

.ops-counter strong {
  margin: 0 !important;
  font-size: .86rem !important;
}

.saved-views-bar {
  display: flex !important;
  min-height: 36px;
  align-items: center;
  gap: 7px !important;
  padding: 5px 8px !important;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}

.saved-views-bar label {
  display: inline-flex;
  min-width: 220px;
  align-items: center;
  gap: 7px;
}

.saved-views-bar label span {
  flex: 0 0 auto;
  color: #587089;
  font-size: .66rem;
  font-weight: 950;
  text-transform: uppercase;
}

.saved-views-bar select {
  min-width: 150px;
  min-height: 30px;
  border: 1px solid rgba(89,112,138,.14);
  border-radius: 9px;
  padding: 0 9px;
  color: var(--text);
  background: rgba(255,255,255,.82);
  font-size: .74rem;
  font-weight: 820;
}

.saved-views-bar button {
  min-height: 30px !important;
  flex: 0 0 auto;
}

.sheet-controls,
.client-filter-row,
.workspace-controls,
.report-controls {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)) !important;
  gap: 6px !important;
  padding: 6px 8px !important;
}

.sheet-controls label,
.date-filter-bar label {
  gap: 3px !important;
  min-width: 0;
}

.sheet-controls span,
.date-filter-bar span {
  overflow: hidden;
  font-size: .6rem !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sheet-controls input,
.sheet-controls select,
.date-filter-bar input,
.date-filter-bar button {
  min-height: 30px !important;
  border-radius: 8px !important;
  padding: 0 8px !important;
  font-size: .72rem !important;
}

.advanced-filters {
  border-bottom: 1px solid rgba(126,149,178,.1);
}

.advanced-filters:not([open]) .date-filter-bar {
  display: none !important;
}

.advanced-filters summary {
  min-height: 28px !important;
  padding: 5px 9px !important;
  font-size: .66rem !important;
}

.date-filter-bar {
  padding: 7px 8px !important;
}

.spreadsheet-wrap {
  max-height: calc(100vh - 232px) !important;
  overflow: auto !important;
  overscroll-behavior: contain;
}

.assignment-table {
  min-width: max-content;
  font-size: .75rem !important;
}

.assignment-table th {
  position: sticky !important;
  top: 0 !important;
  z-index: 12 !important;
  background: linear-gradient(180deg, rgba(244,248,252,.98), rgba(232,242,249,.98)) !important;
  box-shadow: 0 1px 0 rgba(126,149,178,.2);
}

.assignment-table th button {
  min-height: 28px !important;
  padding: 0 7px !important;
  font-size: .62rem !important;
  font-weight: 950 !important;
}

.assignment-table td {
  padding: 0 !important;
  background: rgba(255,255,255,.72) !important;
}

.assignment-table tbody tr:nth-child(even) td {
  background: rgba(247,251,255,.78) !important;
}

.assignment-table tbody tr:hover td,
.assignment-table tbody tr.active-row td {
  background: rgba(229,247,252,.94) !important;
}

.assignment-table tbody tr:focus-within td {
  background: rgba(216,244,251,.96) !important;
}

.assignment-table input,
.assignment-table select,
.readonly-cell {
  min-height: 27px !important;
  padding: 0 7px !important;
  font-size: .72rem !important;
}

.sheet-actions-head {
  min-width: 118px !important;
}

.sheet-actions {
  min-width: 118px !important;
  padding: 0 5px !important;
  background: rgba(250,253,255,.98) !important;
}

.sheet-actions button {
  width: 27px !important;
  height: 27px !important;
  min-height: 27px !important;
  margin: 0 1px !important;
  border-radius: 8px !important;
}

.query-actions {
  min-width: 300px !important;
  white-space: normal !important;
}

.query-actions button,
.query-actions .mini-link {
  min-height: 28px !important;
  width: auto !important;
  padding: 0 8px !important;
  font-size: .68rem !important;
}

.sheet-footer {
  min-height: 34px !important;
  padding: 6px 8px !important;
  font-size: .72rem !important;
}

.pagination-controls {
  gap: 6px !important;
}

.notification-drawer,
.activity-panel {
  max-width: min(380px, calc(100vw - 18px));
}

:root[data-theme="dark"] .assignment-table tbody tr:nth-child(even) td {
  background: rgba(14, 28, 45, .84) !important;
}

:root[data-theme="dark"] .assignment-table tbody tr:hover td,
:root[data-theme="dark"] .assignment-table tbody tr:focus-within td {
  background: rgba(20, 47, 68, .92) !important;
}

:root[data-theme="dark"] .saved-views-bar select {
  border-color: var(--soft-line);
  background: rgba(10, 21, 36, .76);
}

@media (max-width: 1240px) {
  :root { --sidebar-w: 232px; }
  .global-search { width: clamp(160px, 24vw, 300px) !important; }
  .icon-action span { display: none; }
  .icon-action.primary span { display: inline; }
}

@media (max-width: 980px) {
  .clean-sidebar {
    transform: translateX(-112%);
    transition: transform 180ms ease;
  }
  .ops-shell.sidebar-collapsed .clean-sidebar {
    transform: translateX(0);
  }
  .ops-main,
  .sidebar-collapsed .ops-main,
  .full-width-mode .ops-main {
    margin-left: 0 !important;
    padding: 10px !important;
  }
  .ops-topbar {
    flex-wrap: wrap;
    min-height: auto !important;
  }
  .topbar-left {
    flex: 1 1 auto;
  }
  .ops-topbar h1,
  .breadcrumbs {
    max-width: 58vw;
  }
  .topbar-actions {
    flex: 1 1 100%;
    justify-content: stretch !important;
  }
  .global-search {
    flex: 1 1 auto;
    width: auto !important;
  }
  .sheet-toolbar,
  .compact-workbar {
    top: 88px !important;
    grid-template-columns: 1fr !important;
  }
  .sheet-action-bar {
    justify-content: flex-start !important;
  }
  .spreadsheet-wrap {
    max-height: calc(100vh - 286px) !important;
  }
}

@media (max-width: 720px) {
  .ops-main,
  .sidebar-collapsed .ops-main {
    padding: 8px !important;
  }
  .ops-topbar {
    border-radius: 14px !important;
    gap: 7px !important;
  }
  .ops-topbar h1 {
    max-width: 68vw;
    font-size: .92rem !important;
  }
  .breadcrumbs {
    max-width: 68vw;
  }
  .theme-toggle {
    max-width: 54px;
  }
  .theme-toggle::first-letter {
    text-transform: uppercase;
  }
  .topbar-profile {
    min-width: 32px !important;
  }
  .topbar-profile .profile-menu {
    right: 0 !important;
    left: auto !important;
  }
  .sheet-toolbar,
  .compact-workbar {
    top: 92px !important;
  }
  .sheet-action-bar {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    overflow: visible;
  }
  .sheet-action-bar .icon-action,
  .sheet-action-bar .secondary-action,
  .sheet-action-bar .primary-action {
    min-width: 0;
    width: 100%;
    justify-content: center;
    padding: 0 6px !important;
  }
  .sheet-action-bar .icon-action span,
  .sheet-action-bar .secondary-action span,
  .sheet-action-bar .primary-action span {
    display: none;
  }
  .compact-kpi-strip {
    font-size: .64rem !important;
  }
  .saved-views-bar label {
    min-width: 170px;
  }
  .sheet-controls,
  .client-filter-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .spreadsheet-wrap {
    max-height: calc(100vh - 330px) !important;
  }
  .sheet-footer {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  .pagination-controls {
    justify-content: space-between;
  }
}

@media (max-width: 480px) {
  .global-search span {
    max-width: 145px;
  }
  .sheet-action-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .sheet-controls,
  .client-filter-row {
    grid-template-columns: 1fr !important;
  }
  .clean-sidebar {
    inset: 8px !important;
    width: min(260px, calc(100vw - 16px)) !important;
  }
}

/* Global ToastProvider layer */
.toast-viewport {
  position: fixed;
  top: 64px;
  right: 18px;
  z-index: 9999;
  display: grid;
  width: min(420px, calc(100vw - 32px));
  gap: 10px;
  pointer-events: none;
}

.toast-viewport .ops-toast {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  z-index: 9999 !important;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  max-width: none !important;
  min-height: 48px;
  border: 1px solid rgba(255,255,255,.72);
  border-left-width: 4px;
  border-radius: 16px;
  padding: 10px 10px 10px 12px;
  color: #082033;
  background: rgba(255,255,255,.96);
  box-shadow: 0 24px 70px rgba(16,36,59,.22);
  backdrop-filter: blur(18px);
  pointer-events: auto;
  animation: toastIn 180ms ease both;
}

.toast-viewport .ops-toast strong {
  border-radius: 999px;
  padding: 5px 8px;
  font-size: .62rem;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

.toast-viewport .ops-toast span {
  min-width: 0;
  color: #10243b;
  font-size: .82rem;
  font-weight: 850;
  line-height: 1.35;
}

.toast-viewport .ops-toast button {
  display: grid;
  width: 28px;
  height: 28px;
  min-height: 28px;
  place-items: center;
  border: 1px solid rgba(89,112,138,.14);
  border-radius: 9px;
  color: #40566e;
  background: rgba(255,255,255,.72);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
}

.toast-success {
  border-left-color: #23a36f !important;
}

.toast-success strong {
  color: #1d6b4f;
  background: #e4f8ef;
}

.toast-error {
  border-left-color: #d94848 !important;
}

.toast-error strong {
  color: #9c2d2d;
  background: #ffe5e5;
}

.toast-warning {
  border-left-color: #d8951d !important;
}

.toast-warning strong {
  color: #8a5b12;
  background: #fff3d8;
}

.toast-info {
  border-left-color: #0c9abf !important;
}

.toast-info strong {
  color: #07506a;
  background: #e6f8fc;
}

:root[data-theme="dark"] .toast-viewport .ops-toast {
  border-color: rgba(164,186,211,.18);
  background: rgba(16, 32, 51, .96);
  box-shadow: 0 24px 70px rgba(0,0,0,.46);
}

:root[data-theme="dark"] .toast-viewport .ops-toast span {
  color: var(--text);
}

:root[data-theme="dark"] .toast-viewport .ops-toast button {
  color: var(--text);
  background: rgba(25,45,68,.82);
}

@keyframes toastIn {
  from {
    opacity: 0;
    transform: translateY(-8px) scale(.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (max-width: 720px) {
  .toast-viewport {
    top: 12px;
    right: 50%;
    width: min(420px, calc(100vw - 20px));
    transform: translateX(50%);
  }
  .toast-viewport .ops-toast {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .toast-viewport .ops-toast strong {
    display: none;
  }
}

/* Emergency Assignment Sheet cleanup */
.clean-assignment-sheet {
  display: flex;
  height: calc(100vh - var(--header-h) - 42px);
  min-height: 560px;
  flex-direction: column;
  border-radius: 16px !important;
  overflow: hidden !important;
}

.full-width-mode .clean-assignment-sheet {
  height: calc(100vh - var(--header-h) - 22px);
}

.clean-assignment-sheet .compact-workbar {
  position: relative !important;
  top: auto !important;
  z-index: 6 !important;
  flex: 0 0 auto;
  display: grid !important;
  grid-template-columns: minmax(280px, 1fr) auto !important;
  gap: 8px !important;
  padding: 7px 8px !important;
}

.clean-assignment-sheet .inline-search input {
  width: 100%;
  min-height: 32px !important;
}

.clean-assignment-sheet .sheet-action-bar {
  flex-wrap: nowrap !important;
  overflow-x: auto;
  white-space: nowrap;
}

.clean-assignment-sheet .icon-action {
  min-width: max-content;
}

.clean-assignment-sheet .compact-kpi-strip {
  min-height: 26px;
  flex: 0 0 auto;
  border-bottom: 1px solid rgba(126,149,178,.12);
  background: rgba(255,255,255,.42);
}

.clean-assignment-sheet .assignment-filter-panel {
  position: relative;
  top: auto;
  z-index: 5;
  flex: 0 0 auto;
  border-bottom: 1px solid rgba(126,149,178,.12);
  background: rgba(248,252,255,.88);
  backdrop-filter: blur(14px);
}

.clean-assignment-sheet .status-chip-row {
  display: flex;
  align-items: center;
  gap: 5px;
  overflow-x: auto;
  border-bottom: 1px solid rgba(126,149,178,.09);
  padding: 5px 8px;
}

.clean-assignment-sheet .status-chip-row button,
.clean-assignment-sheet .save-view-button,
.clean-assignment-sheet .saved-filter-select {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  gap: 5px;
  border: 1px solid rgba(89,112,138,.14);
  border-radius: 999px;
  padding: 0 10px;
  color: #40566e;
  background: rgba(255,255,255,.74);
  cursor: pointer;
  font-size: .68rem;
  font-weight: 900;
  white-space: nowrap;
}

.clean-assignment-sheet .status-chip-row button:hover,
.clean-assignment-sheet .status-chip-row button.active,
.clean-assignment-sheet .save-view-button:hover,
.clean-assignment-sheet .saved-filter-select:hover {
  border-color: rgba(12,154,191,.28);
  color: #07506a;
  background: rgba(224,247,252,.86);
}

.clean-assignment-sheet .saved-filter-select {
  min-width: 132px;
  padding-right: 24px;
}

.clean-assignment-sheet .save-view-button {
  margin-left: auto;
}

.clean-assignment-sheet .compact-filter-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(122px, 1fr));
  gap: 6px;
  padding: 6px 8px;
}

.clean-assignment-sheet .compact-filter-grid label {
  display: grid;
  gap: 3px;
  margin: 0;
  min-width: 0;
}

.clean-assignment-sheet .compact-filter-grid label span {
  color: #60748b;
  font-size: .58rem;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

.clean-assignment-sheet .compact-filter-grid select,
.clean-assignment-sheet .compact-filter-grid input {
  width: 100%;
  min-height: 28px !important;
  border: 1px solid rgba(89,112,138,.14);
  border-radius: 8px;
  padding: 0 8px;
  color: var(--text);
  background: rgba(255,255,255,.8);
  font-size: .72rem;
  font-weight: 820;
}

.date-control {
  display: grid;
  grid-template-columns: minmax(92px, 1fr) 30px;
  align-items: stretch;
  width: 100%;
}

.date-control .date-display-input {
  border-radius: 8px 0 0 8px !important;
}

.date-control .date-picker-input {
  min-width: 30px !important;
  border-left: 0 !important;
  border-radius: 0 8px 8px 0 !important;
  padding: 0 !important;
  color: transparent !important;
  cursor: pointer;
}

.assignment-table .date-control {
  grid-template-columns: minmax(92px, 1fr) 28px;
}

.assignment-table .date-control input {
  min-height: 26px !important;
}

.clean-assignment-sheet .compact-advanced-filters {
  border-bottom: 0;
  background: transparent;
}

/* HR Offer Letter Generator */
.hr-page .animated-background {
  background:
    radial-gradient(circle at 14% 14%, rgba(110, 143, 183, 0.18), transparent 30%),
    radial-gradient(circle at 86% 20%, rgba(13, 43, 82, 0.09), transparent 32%),
    linear-gradient(135deg, #F7F9FC 0%, #edf3f9 48%, #fffdf9 100%);
}

.hr-page {
  --hr-primary: #0D2B52;
  --hr-secondary: #3B5D8A;
  --hr-bg: #F7F9FC;
  --hr-accent: #6E8FB7;
  --hr-success: #BFD8C2;
  --hr-warning: #E9D5B5;
  --hr-paper: #fffdf8;
  --hr-ink: #0D2B52;
  --hr-muted: #62748b;
}

.hr-page .clean-sidebar,
.hr-page .ops-topbar,
.hr-page .glass-panel {
  border-color: rgba(59,93,138,.16);
}

.hr-page .clean-sidebar {
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(247,249,252,.86)),
    linear-gradient(90deg, rgba(13,43,82,.04), transparent);
  box-shadow: 18px 0 52px rgba(13, 43, 82, .08);
}

.hr-topbar {
  background: rgba(255,255,255,.88);
}

.hr-topbar h1 {
  color: var(--hr-ink);
}

.hr-module-card {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 16px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 18px;
  padding: 14px;
  color: var(--hr-ink);
  background:
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(244,247,251,.88));
  box-shadow: 0 16px 38px rgba(13,43,82,.08);
}

.hr-module-card svg,
.hr-sidebar .clean-nav-section button svg {
  color: var(--hr-secondary);
}

.hr-sidebar .clean-nav-section button:hover,
.hr-sidebar .clean-nav-section button.active {
  border-color: rgba(59,93,138,.26);
  color: var(--hr-ink);
  background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(232,239,247,.9));
}

.hr-module-card strong,
.hr-module-card span {
  display: block;
}

.hr-module-card span {
  margin-top: 3px;
  color: var(--muted);
  font-size: .8rem;
  font-weight: 760;
}

.hr-dashboard-grid {
  margin-top: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hr-page .dashboard-card {
  min-height: 156px;
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(247,249,252,.82));
  box-shadow: 0 20px 52px rgba(13,43,82,.07);
}

.hr-page .dashboard-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 62px rgba(13,43,82,.11);
}

.hr-page .dashboard-icon {
  color: var(--hr-primary);
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(216,226,240,.82));
}

.hr-page .dashboard-card-top {
  margin-bottom: 18px;
}

.hr-page .dashboard-card-top span {
  color: var(--hr-ink);
  font-size: 1.35rem;
}

.hr-page .dashboard-card h3 {
  color: var(--hr-ink);
}

.hr-page .dashboard-card p {
  color: var(--hr-muted);
}

.hr-page .primary-action,
.hr-page .compact-action.primary-action {
  color: #fff;
  background: linear-gradient(135deg, var(--hr-primary), var(--hr-secondary));
  box-shadow: 0 14px 32px rgba(13,43,82,.2);
}

.hr-page .secondary-action {
  border-color: rgba(59,93,138,.2);
  color: var(--hr-primary);
  background: rgba(255,255,255,.82);
}

.hr-hero-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-radius: 28px;
  padding: 22px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(247,249,252,.86)),
    radial-gradient(circle at 88% 14%, rgba(110,143,183,.18), transparent 32%);
  box-shadow: 0 22px 64px rgba(13,43,82,.09);
}

.hr-hero-card h2 {
  margin: 4px 0 8px;
  color: var(--hr-ink);
  font-size: clamp(1.7rem, 3vw, 2.6rem);
}

.hr-hero-card span,
.hr-section-heading span {
  color: var(--hr-muted);
  font-weight: 760;
  line-height: 1.5;
}

.hr-hero-badges,
.hr-doc-preview,
.hr-doc-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hr-hero-badges span,
.hr-doc-preview span,
.hr-doc-chips em {
  border: 1px solid rgba(59,93,138,.16);
  border-radius: 999px;
  padding: 7px 10px;
  color: var(--hr-primary);
  background: rgba(255,255,255,.76);
  font-size: .75rem;
  font-style: normal;
  font-weight: 850;
}

.hr-dashboard-lower {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
  gap: 14px;
  margin-top: 14px;
}

.people-command-center {
  display: grid;
  gap: 14px;
}

.people-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
  gap: 22px;
  overflow: hidden;
  border-radius: 28px;
  padding: 24px;
  background:
    radial-gradient(circle at 88% 14%, rgba(110,143,183,.18), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(247,249,252,.88));
  box-shadow: 0 24px 70px rgba(13,43,82,.1);
}

.people-hero-main {
  display: grid;
  align-content: center;
  gap: 10px;
}

.people-hero-main h2 {
  margin: 0;
  color: var(--hr-ink);
  font-size: clamp(2rem, 4vw, 4.2rem);
  line-height: .95;
  letter-spacing: -0.01em;
}

.people-hero-main span {
  max-width: 760px;
  color: var(--hr-muted);
  font-size: 1rem;
  font-weight: 760;
  line-height: 1.55;
}

.people-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 4px;
}

.people-hero-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-content: stretch;
}

.people-hero-metrics button,
.people-pulse-tile,
.people-section,
.people-health-grid button,
.people-action-list button {
  border: 1px solid rgba(59,93,138,.14);
  background: rgba(255,255,255,.76);
  box-shadow: 0 16px 42px rgba(13,43,82,.06);
}

.people-hero-metrics button {
  display: grid;
  align-content: center;
  min-height: 118px;
  border-radius: 22px;
  padding: 18px;
  text-align: left;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.people-hero-metrics button:hover,
.people-pulse-tile:hover,
.people-person-row:hover,
.people-joiner-row:hover,
.people-action-list button:hover,
.people-health-grid button:hover {
  transform: translateY(-2px);
  border-color: rgba(13,43,82,.28);
  box-shadow: 0 18px 48px rgba(13,43,82,.1);
}

.people-hero-metrics strong {
  color: var(--hr-primary);
  font-size: clamp(1.65rem, 3vw, 2.65rem);
  font-weight: 950;
  line-height: 1;
}

.people-hero-metrics span,
.people-pulse-tile span,
.people-health-grid span {
  color: var(--hr-muted);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.people-pulse-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.people-pulse-tile {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 7px 12px;
  min-height: 104px;
  border-radius: 22px;
  padding: 16px;
  text-align: left;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.people-pulse-tile i {
  display: grid;
  grid-row: span 3;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 15px;
  color: var(--hr-primary);
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(216,226,240,.86));
}

.people-pulse-tile strong {
  color: var(--hr-ink);
  font-size: 1.55rem;
  line-height: 1;
}

.people-pulse-tile small {
  color: var(--hr-muted);
  font-size: .78rem;
  font-weight: 760;
}

.people-command-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  gap: 14px;
}

.people-section {
  display: grid;
  gap: 12px;
  border-radius: 24px;
  padding: 16px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(247,249,252,.82));
}

.people-wide {
  grid-row: span 2;
}

.people-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.people-section-head h3 {
  margin: 2px 0 0;
  color: var(--hr-ink);
  font-size: 1.2rem;
}

.people-section-head .plain-button {
  min-height: 30px;
  border: 1px solid rgba(59,93,138,.16);
  border-radius: 999px;
  padding: 0 10px;
  color: var(--hr-primary);
  background: rgba(255,255,255,.7);
  font-size: .74rem;
  font-weight: 900;
}

.people-joiner-list,
.people-event-list,
.people-action-list,
.people-recognition-list {
  display: grid;
  gap: 8px;
}

.people-person-row,
.people-joiner-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(59,93,138,.12);
  border-radius: 18px;
  padding: 10px;
  color: inherit;
  background: rgba(255,255,255,.62);
  text-align: left;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.people-person-row span,
.people-joiner-row span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.people-person-row strong,
.people-joiner-row strong {
  overflow: hidden;
  color: var(--hr-ink);
  font-size: .9rem;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.people-person-row small,
.people-joiner-row small {
  overflow: hidden;
  color: var(--hr-muted);
  font-size: .75rem;
  font-weight: 760;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.people-person-row em,
.people-joiner-row em {
  border-radius: 999px;
  padding: 5px 8px;
  color: var(--hr-primary);
  background: rgba(216,226,240,.72);
  font-size: .68rem;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}

.people-joiner-row {
  grid-template-columns: auto minmax(0, 1fr) minmax(110px, 180px) auto;
}

.people-joiner-row b,
.people-payroll-bars {
  display: block;
  overflow: hidden;
  height: 8px;
  border-radius: 999px;
  background: rgba(216,226,240,.9);
}

.people-joiner-row b i,
.people-payroll-bars span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--hr-primary), var(--hr-accent));
}

.people-action-list button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 46px;
  border-radius: 16px;
  padding: 10px 12px;
  color: var(--hr-ink);
  font-weight: 880;
}

.people-action-list strong {
  color: var(--hr-primary);
  font-size: 1.1rem;
}

.people-payroll-panel {
  background:
    radial-gradient(circle at 82% 18%, rgba(110,143,183,.2), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(232,239,247,.8));
}

.people-payroll-status {
  display: grid;
  gap: 4px;
}

.people-payroll-status strong {
  color: var(--hr-primary);
  font-size: 2rem;
  line-height: 1;
}

.people-payroll-status span,
.people-empty {
  color: var(--hr-muted);
  font-weight: 780;
}

.people-health-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.people-health-grid button {
  display: grid;
  gap: 4px;
  min-height: 82px;
  border-radius: 18px;
  padding: 12px;
  text-align: left;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.people-health-grid strong {
  color: var(--hr-primary);
  font-size: 1.6rem;
  line-height: 1;
}

.people-empty {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  border: 1px dashed rgba(59,93,138,.22);
  border-radius: 16px;
  padding: 12px;
  background: rgba(255,255,255,.46);
}

.people-recognition .people-person-row {
  background: linear-gradient(135deg, rgba(255,255,255,.8), rgba(247,249,252,.64));
}

.ops-command-dashboard {
  display: grid;
  gap: 14px;
}

.ops-morning-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 20px;
  overflow: hidden;
  border-radius: 28px;
  padding: 26px;
  background:
    radial-gradient(circle at 88% 8%, rgba(141,215,255,.42), transparent 30%),
    radial-gradient(circle at 12% 92%, rgba(255,213,184,.46), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(235,246,255,.84));
  box-shadow: 0 24px 70px rgba(13,43,82,.1);
}

.ops-morning-hero h2 {
  margin: 0 0 10px;
  color: #071526;
  font-size: clamp(2.25rem, 5vw, 5.4rem);
  line-height: .92;
}

.ops-morning-hero span {
  display: block;
  max-width: 780px;
  color: #5f7187;
  font-weight: 780;
  line-height: 1.55;
}

.ops-hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 9px;
}

.ops-color-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.ops-kpi-card {
  position: relative;
  overflow: hidden;
  display: grid;
  align-content: space-between;
  gap: 12px;
  min-height: 128px;
  border: 1px solid rgba(255,255,255,.74);
  border-radius: 22px;
  padding: 16px;
  text-align: left;
  background: var(--kpi-bg, #fff);
  box-shadow: 0 18px 46px rgba(7,21,38,.08);
  transition: transform .16s ease, box-shadow .16s ease;
}

.ops-kpi-card:hover,
.ops-motion-grid article:hover,
.ops-command-panel:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 58px rgba(7,21,38,.12);
}

.ops-kpi-card:after,
.ops-motion-grid article i {
  content: "";
  position: absolute;
  right: -24px;
  bottom: -30px;
  width: 96px;
  height: 96px;
  border-radius: 999px;
  background: rgba(255,255,255,.42);
}

.ops-kpi-card i {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 15px;
  color: #071526;
  background: rgba(255,255,255,.64);
}

.ops-kpi-card strong {
  color: #071526;
  font-size: 2.1rem;
  line-height: 1;
}

.ops-kpi-card span {
  color: #40566e;
  font-size: .76rem;
  font-weight: 950;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.ops-kpi-card.blue { --kpi-bg: linear-gradient(135deg, #d9f0ff, #edf8ff); }
.ops-kpi-card.mint { --kpi-bg: linear-gradient(135deg, #d8f8ea, #f0fff8); }
.ops-kpi-card.lavender { --kpi-bg: linear-gradient(135deg, #eadfff, #f8f4ff); }
.ops-kpi-card.peach { --kpi-bg: linear-gradient(135deg, #ffe1ce, #fff5ee); }
.ops-kpi-card.coral { --kpi-bg: linear-gradient(135deg, #ffd8d8, #fff0f0); }
.ops-kpi-card.yellow { --kpi-bg: linear-gradient(135deg, #fff2b8, #fffbed); }

.ops-command-panel,
.ops-motion-grid article {
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 24px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(247,251,255,.76));
  box-shadow: 0 18px 48px rgba(7,21,38,.08);
  transition: transform .16s ease, box-shadow .16s ease;
}

.ops-command-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.ops-command-panel header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.ops-command-panel header h3 {
  margin: 2px 0 0;
  color: #071526;
  font-size: 1.2rem;
}

.ops-command-panel header strong {
  color: #071526;
  font-size: 1.45rem;
}

.ops-people-grid,
.ops-alert-list,
.ops-feed-list,
.ops-performer-grid,
.ops-client-grid {
  display: grid;
  gap: 8px;
}

.ops-people-grid {
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.ops-person-chip,
.ops-alert-list button,
.ops-feed-list button {
  display: grid;
  align-items: center;
  border: 1px solid rgba(89,112,138,.12);
  border-radius: 16px;
  padding: 10px;
  color: inherit;
  background: rgba(255,255,255,.64);
  text-align: left;
}

.ops-person-chip {
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
}

.ops-person-chip span,
.ops-feed-list button {
  min-width: 0;
}

.ops-person-chip strong,
.ops-alert-list strong,
.ops-feed-list strong,
.ops-performer-grid strong,
.ops-client-grid strong {
  overflow: hidden;
  color: #071526;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ops-person-chip small,
.ops-feed-list small,
.ops-performer-grid small,
.ops-client-grid small {
  color: #60748b;
  font-size: .74rem;
  font-weight: 800;
}

.ops-motion-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.ops-motion-grid article {
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 8px;
  min-height: 116px;
  padding: 16px;
  background:
    radial-gradient(circle at 92% 12%, var(--motion-tone), transparent 38%),
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(247,251,255,.78));
}

.ops-motion-grid span,
.ops-performer-grid span,
.ops-client-grid span {
  color: #60748b;
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.ops-motion-grid strong {
  color: #071526;
  font-size: 1.2rem;
}

.ops-motion-grid small {
  color: #52677f;
  font-weight: 800;
}

.ops-dashboard-grid-alive {
  display: grid;
  grid-template-columns: minmax(300px, .9fr) minmax(360px, 1.2fr);
  gap: 14px;
}

.ops-alert-list button,
.ops-feed-list button {
  gap: 5px;
  cursor: pointer;
}

.ops-feed-list button {
  grid-template-columns: auto minmax(0, 1fr);
}

.ops-feed-list button i {
  grid-row: span 3;
  width: 9px;
  height: 9px;
  margin-top: 5px;
  border-radius: 999px;
  background: #14b8a6;
  box-shadow: 0 0 0 5px rgba(20,184,166,.12);
}

.ops-feed-list span {
  color: #60748b;
  font-size: .7rem;
  font-weight: 850;
}

.ops-performer-grid,
.ops-client-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ops-performer-grid article,
.ops-client-grid article {
  display: grid;
  gap: 6px;
  min-height: 104px;
  border: 1px solid rgba(89,112,138,.12);
  border-radius: 18px;
  padding: 12px;
  background: rgba(255,255,255,.66);
}

.ops-client-grid em {
  width: fit-content;
}

.ops-soft-empty {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 52px;
  border: 1px dashed rgba(89,112,138,.24);
  border-radius: 16px;
  padding: 12px;
  color: #60748b;
  background: rgba(255,255,255,.5);
  font-weight: 850;
}

.hr-document-panel {
  border-radius: 24px;
  padding: 18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(247,249,252,.84));
  box-shadow: 0 20px 52px rgba(13,43,82,.07);
}

.hr-section-heading {
  margin-bottom: 14px;
}

.hr-section-heading.with-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.hr-section-heading h2 {
  margin: 4px 0 6px;
  color: var(--hr-ink);
  font-size: 1.5rem;
}

.hr-letter-type-grid,
.hr-attendance-grid,
.hr-leave-board {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.hr-letter-type-grid article,
.hr-attendance-grid article,
.hr-leave-board article {
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 18px;
  padding: 14px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,253,248,.74));
}

.hr-letter-type-grid article {
  display: grid;
  gap: 6px;
}

.hr-letter-type-grid article.active {
  border-color: rgba(13,43,82,.28);
  background: rgba(232,239,247,.9);
}

.hr-letter-type-grid svg {
  color: var(--hr-secondary);
}

.hr-letter-type-grid strong,
.hr-leave-board strong,
.hr-attendance-grid strong {
  color: var(--hr-ink);
}

.hr-letter-type-grid small,
.hr-leave-board p,
.hr-attendance-grid span {
  color: var(--hr-muted);
  font-weight: 760;
}

.hr-attendance-grid article {
  background: linear-gradient(135deg, rgba(255,255,255,.78), color-mix(in srgb, var(--chip), white 32%));
}

.hr-attendance-grid strong {
  display: block;
  margin-top: 8px;
  font-size: 1.6rem;
}

.hr-calendar-strip,
.hr-people-grid {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.hr-calendar-strip {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.hr-calendar-strip article,
.hr-person-card {
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 20px;
  padding: 14px;
  background: rgba(255,255,255,.8);
}

.hr-calendar-strip b,
.hr-avatar {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 15px;
  color: var(--hr-primary);
  background: linear-gradient(135deg, #fff, #E8EEF6);
  font-weight: 950;
}

.hr-people-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.hr-person-card {
  display: grid;
  gap: 10px;
}

.hr-person-card h3 {
  margin: 0;
  color: var(--hr-ink);
}

.hr-person-card span,
.hr-person-card small,
.hr-person-meta span {
  color: var(--hr-muted);
  font-weight: 760;
}

.hr-person-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.hr-person-meta span {
  border-radius: 12px;
  padding: 8px;
  background: rgba(247,249,252,.9);
  font-size: .72rem;
}

.hr-person-card .plain-button {
  justify-self: flex-start;
  min-height: 28px;
  border: 1px solid rgba(59,93,138,.16);
  border-radius: 999px;
  padding: 0 10px;
  color: var(--hr-primary);
  background: rgba(255,255,255,.78);
  font-size: .74rem;
  font-weight: 900;
}

.hr-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.hr-employee-directory {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.hr-employee-kpi-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 8px;
}

.hr-employee-kpi-strip span {
  display: grid;
  gap: 2px;
  border: 1px solid rgba(59,93,138,.12);
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(255,255,255,.72);
}

.hr-employee-kpi-strip strong {
  color: var(--hr-primary);
  font-size: 1.15rem;
  font-weight: 950;
}

.hr-employee-kpi-strip em {
  color: var(--hr-muted);
  font-size: .72rem;
  font-style: normal;
  font-weight: 850;
}

.hr-directory-toolbar {
  margin: 0;
  padding: 2px 0 0;
}

.hr-directory-wrap {
  max-height: calc(100vh - 320px);
}

.hr-directory-table th {
  font-size: .7rem;
}

.hr-directory-table tr {
  cursor: pointer;
}

.hr-directory-table tr:hover td {
  background: rgba(232,239,247,.42);
}

.hr-mini-avatar,
.hr-avatar.large {
  display: grid;
  place-items: center;
  border: 1px solid rgba(59,93,138,.14);
  color: var(--hr-primary);
  background: linear-gradient(135deg, #fff, #E8EEF6);
  font-weight: 950;
}

.hr-mini-avatar {
  width: 34px;
  height: 34px;
  border-radius: 12px;
}

.hr-avatar.large {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  font-size: 1.2rem;
}

.employee-profile-header .hr-profile-title {
  display: flex;
  align-items: center;
  gap: 14px;
}

.employee-quick-actions {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 12px;
}

.hr-profile-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 14px;
}

.hr-profile-tabs button {
  min-height: 34px;
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 999px;
  padding: 0 12px;
  color: var(--hr-secondary);
  background: rgba(255,255,255,.7);
  cursor: pointer;
  font-weight: 900;
}

.hr-profile-tabs button.active {
  color: #fff;
  border-color: var(--hr-primary);
  background: var(--hr-primary);
  box-shadow: 0 14px 28px rgba(13,43,82,.16);
}

.hr-profile-tab-panel {
  display: grid;
  gap: 14px;
}

.hr-attendance-grid.compact {
  grid-template-columns: repeat(5, minmax(110px, 1fr));
}

.salary-detail-table-wrap {
  overflow: auto;
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 18px;
  background: rgba(255,255,255,.78);
}

.salary-detail-table {
  min-width: 680px;
}

.salary-detail-table th {
  background: rgba(232,239,247,.92);
}

.salary-detail-table input {
  width: 100%;
  min-height: 36px;
  border: 1px solid rgba(59,93,138,.12);
  border-radius: 10px;
  padding: 0 10px;
  color: var(--hr-ink);
  background: rgba(247,249,252,.75);
  font-weight: 850;
}

.salary-section-row td {
  color: var(--hr-primary);
  background: rgba(232,239,247,.7) !important;
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.salary-slip-document {
  width: min(860px, 100%);
  margin: 0 auto;
  border: 1px solid rgba(59,93,138,.16);
  border-radius: 20px;
  padding: 24px;
  color: var(--hr-ink);
  background: linear-gradient(180deg, #fff, #F7F9FC);
  box-shadow: 0 22px 64px rgba(13,43,82,.1);
}

.salary-slip-document > header {
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid rgba(59,93,138,.14);
  padding-bottom: 14px;
  margin-bottom: 16px;
}

.salary-slip-document > header img {
  width: 48px;
  height: 48px;
  object-fit: contain;
  border-radius: 12px;
  background: #fff;
}

.salary-slip-document > header strong,
.salary-slip-net strong {
  display: block;
  color: var(--hr-ink);
  font-size: 1.24rem;
}

.salary-slip-document > header span,
.salary-slip-meta b,
.salary-slip-net span,
.salary-slip-net em,
.salary-slip-document footer small {
  color: var(--hr-muted);
  font-weight: 850;
}

.salary-slip-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-bottom: 16px;
}

.salary-slip-meta span {
  display: grid;
  gap: 4px;
  border: 1px solid rgba(59,93,138,.12);
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(255,255,255,.78);
}

.salary-slip-meta b {
  font-size: .68rem;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.salary-slip-meta em {
  color: var(--hr-ink);
  font-style: normal;
  font-weight: 900;
}

.salary-slip-net {
  display: grid;
  gap: 5px;
  border: 1px solid rgba(13,43,82,.16);
  border-radius: 16px;
  margin-top: 16px;
  padding: 14px;
  background: rgba(232,239,247,.64);
}

.salary-slip-document footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 28px;
}

.salary-slip-document footer div {
  display: grid;
  gap: 5px;
  min-width: 190px;
  text-align: center;
}

.salary-slip-page {
  display: grid;
  gap: 18px;
}

.salary-title {
  margin-top: 6px;
}

.salary-split-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.salary-split-grid h3 {
  margin: 0 0 8px;
  color: var(--hr-ink);
  font-size: .88rem;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.salary-slip-footer.offer-verification-footer {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: end;
  gap: 18px;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid rgba(59,93,138,.16);
}

.salary-slip-footer .offer-signatory-block {
  min-width: 190px;
  margin: 0;
}

.salary-slip-footer .offer-qr {
  display: grid;
  justify-items: center;
  gap: 4px;
  color: var(--hr-muted);
  font-size: .65rem;
  font-weight: 800;
}

.salary-slip-toolbar {
  align-items: end;
}

.compact-control {
  display: grid;
  gap: 4px;
  color: var(--hr-muted);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.compact-control input,
.compact-control select {
  min-height: 38px;
  border: 1px solid rgba(59,93,138,.16);
  border-radius: 12px;
  padding: 0 12px;
  color: var(--hr-ink);
  background: rgba(255,255,255,.82);
  font-size: .86rem;
  font-weight: 800;
  text-transform: none;
  letter-spacing: 0;
}

.salary-slip-table th:first-child,
.salary-slip-table td:first-child {
  width: 42px;
  min-width: 42px;
  text-align: center;
}

@media (max-width: 900px) {
  .salary-split-grid,
  .salary-slip-footer.offer-verification-footer {
    grid-template-columns: 1fr;
  }
}

@media print {
  body:has(.salary-slip-document) * {
    visibility: hidden;
  }

  body:has(.salary-slip-document) .salary-slip-document,
  body:has(.salary-slip-document) .salary-slip-document * {
    visibility: visible;
  }

  body:has(.salary-slip-document) .salary-slip-document {
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    border: 0;
    box-shadow: none;
  }
}

.hr-employee-table {
  margin-top: 14px;
}

.hr-offer-workspace {
  overflow: hidden;
  margin-bottom: 18px;
}

.hr-offer-workspace .sheet-toolbar,
.hr-preview-panel .sheet-toolbar {
  position: static !important;
  z-index: auto !important;
  display: flex !important;
  align-items: center !important;
  padding: 16px 18px !important;
}

.hr-offer-workspace .sheet-toolbar h2,
.hr-preview-panel .sheet-toolbar h2 {
  font-size: 1.22rem !important;
}

.hr-letterhead-upload {
  position: relative;
  overflow: hidden;
}

.hr-letterhead-upload input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.hr-template-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  border: 1px solid rgba(59,93,138,.18);
  border-radius: 13px;
  padding: 0 12px;
  color: var(--hr-primary);
  background: rgba(247,249,252,.92);
  font-size: .78rem;
  font-weight: 900;
  white-space: nowrap;
}

.salary-settings-panel {
  margin-top: 16px;
}

.salary-settings-panel .sheet-toolbar {
  align-items: flex-start !important;
  gap: 16px;
}

.salary-settings-panel .task-form-grid {
  align-items: stretch;
}

.salary-settings-panel .checkbox-card {
  min-height: 74px;
  border: 1px solid rgba(59,93,138,.16);
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(255,255,255,.72);
}

.salary-settings-panel .checkbox-card strong {
  color: var(--hr-ink);
}

.salary-settings-panel .checkbox-card em {
  display: block;
  margin-top: 3px;
  color: var(--hr-muted);
  font-size: .72rem;
  font-style: normal;
  font-weight: 760;
  line-height: 1.35;
}

.salary-preview-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 9px;
  margin: 14px 18px 0;
}

.salary-preview-strip span {
  display: grid;
  gap: 4px;
  min-height: 58px;
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 15px;
  padding: 10px 12px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.9), rgba(247,249,252,.78));
}

.salary-preview-strip strong {
  color: var(--hr-muted);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.salary-preview-strip em {
  color: var(--hr-ink);
  font-size: .94rem;
  font-style: normal;
  font-weight: 950;
}

.salary-breakup-preview {
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 20px;
  margin: 8px 0 4px;
  padding: 14px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(247,249,252,.82)),
    radial-gradient(circle at 100% 0%, rgba(110,143,183,.12), transparent 34%);
}

.salary-breakup-preview .hr-section-heading {
  margin-bottom: 10px;
}

.salary-breakup-preview .hr-section-heading h2 {
  font-size: 1.08rem;
}

.salary-breakup-preview .salary-preview-strip {
  margin: 0;
}

.salary-breakup-preview small {
  display: block;
  margin-top: 10px;
  color: var(--hr-muted);
  font-weight: 820;
}

.salary-breakup-preview.has-error {
  border-color: rgba(184,91,61,.28);
  background:
    linear-gradient(135deg, rgba(255,255,255,.95), rgba(255,248,239,.82));
}

.salary-breakup-preview.has-error small {
  color: #9a4a25;
}

.employee-hub-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  min-height: 220px;
  margin-bottom: 14px;
  border-radius: 24px;
  padding: 24px;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(13,43,82,.96), rgba(59,93,138,.82)),
    url("https://images.unsplash.com/photo-1552664730-d307ca884978?auto=format&fit=crop&w=1600&q=78") center/cover;
  box-shadow: 0 24px 70px rgba(13,43,82,.16);
}

.employee-hub-hero h2 {
  margin: 4px 0 8px;
  color: #fff;
  font-size: clamp(2.2rem, 5vw, 4.9rem);
  line-height: .94;
}

.employee-hub-hero p,
.employee-hub-hero .eyebrow {
  color: rgba(255,255,255,.82);
}

.employee-hub-stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.employee-hub-stat {
  min-height: 116px;
  border-radius: 18px;
  padding: 14px;
  animation: employeeHubFloat 6s ease-in-out infinite;
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.employee-hub-stat:hover {
  transform: translateY(-3px);
  box-shadow: 0 22px 58px rgba(13,43,82,.14);
}

.employee-hub-stat svg {
  color: var(--hr-secondary);
}

.employee-hub-stat strong {
  display: block;
  margin-top: 16px;
  color: var(--hr-primary);
  font-size: 1.55rem;
  font-weight: 950;
}

.employee-hub-stat span {
  color: var(--hr-muted);
  font-size: .72rem;
  font-weight: 900;
}

@keyframes employeeHubFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

.employee-hub-surface {
  display: grid;
  gap: 12px;
  border-radius: 24px;
  padding: 16px;
}

.employee-database-banner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(59,93,138,.16);
  border-radius: 18px;
  padding: 13px 14px;
  background: rgba(255,255,255,.82);
}

.employee-database-banner strong,
.employee-database-banner span {
  display: block;
}

.employee-database-banner strong {
  color: var(--hr-ink);
}

.employee-database-banner span {
  margin-top: 3px;
  color: var(--hr-muted);
  font-size: .78rem;
  font-weight: 800;
  line-height: 1.4;
}

.employee-database-banner.ok {
  border-color: rgba(42,168,118,.24);
  background: rgba(235,250,245,.86);
}

.employee-database-banner.ok svg {
  color: #21835e;
}

.employee-database-banner.loading {
  border-color: rgba(47,128,237,.22);
  background: rgba(235,245,255,.88);
}

.employee-database-banner.loading svg {
  color: #2f80ed;
}

.employee-database-banner.danger {
  border-color: rgba(188,64,75,.28);
  background: rgba(255,239,240,.9);
}

.employee-database-banner.danger svg {
  color: #b8404b;
}

.employee-hub-view-toggle {
  display: grid;
  grid-template-columns: repeat(2, minmax(88px, 1fr));
  gap: 4px;
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 14px;
  padding: 4px;
  background: rgba(232,239,247,.76);
}

.employee-hub-view-toggle button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  border: 0;
  border-radius: 10px;
  color: var(--hr-muted);
  background: transparent;
  cursor: pointer;
  font-weight: 900;
}

.employee-hub-view-toggle button.active {
  color: var(--hr-primary);
  background: #fff;
  box-shadow: 0 10px 24px rgba(13,43,82,.08);
}

.employee-hub-controls {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) repeat(3, minmax(120px, auto)) repeat(3, minmax(130px, auto));
  gap: 8px;
  align-items: center;
}

.employee-hub-controls select,
.employee-hub-controls label:not(.sheet-search) {
  min-height: 40px;
  border: 1px solid rgba(59,93,138,.16);
  border-radius: 13px;
  padding: 0 10px;
  color: var(--hr-primary);
  background: rgba(255,255,255,.82);
  font-size: .78rem;
  font-weight: 900;
}

.employee-hub-controls label:not(.sheet-search) {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.employee-hub-count {
  display: flex;
  align-items: baseline;
  gap: 7px;
  color: var(--hr-muted);
  font-weight: 850;
}

.employee-hub-count strong {
  color: var(--hr-primary);
  font-size: 1.35rem;
}

.employee-hub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(285px, 1fr));
  gap: 12px;
}

.employee-hub-card {
  display: grid;
  gap: 14px;
  min-height: 282px;
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 20px;
  padding: 16px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.94), rgba(247,249,252,.84));
  box-shadow: 0 18px 46px rgba(13,43,82,.07);
  transition: transform 170ms ease, box-shadow 170ms ease, border-color 170ms ease;
}

.employee-hub-card:hover {
  border-color: rgba(13,43,82,.26);
  transform: translateY(-4px);
  box-shadow: 0 24px 64px rgba(13,43,82,.13);
}

.employee-hub-person {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  text-align: left;
}

.employee-hub-person strong,
.employee-hub-person em {
  display: block;
}

.employee-hub-person strong {
  color: var(--hr-ink);
  font-size: 1.04rem;
}

.employee-hub-person em {
  margin-top: 4px;
  color: var(--hr-muted);
  font-size: .78rem;
  font-style: normal;
  font-weight: 800;
}

.employee-hub-card-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.employee-hub-card-meta span {
  display: grid;
  gap: 4px;
  min-height: 58px;
  border-radius: 14px;
  padding: 9px;
  background: rgba(247,249,252,.92);
}

.employee-hub-card-meta em {
  color: var(--hr-muted);
  font-size: .65rem;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.employee-hub-card-meta strong {
  color: var(--hr-ink);
  font-size: .82rem;
}

.employee-hub-card-meta .sheet-badge {
  justify-self: start;
}

.employee-hub-progress {
  display: grid;
  gap: 6px;
}

.employee-hub-progress > span {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(59,93,138,.12);
}

.employee-hub-progress b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2aa876, #2f80ed);
}

.employee-hub-progress strong {
  color: var(--hr-muted);
  font-size: .72rem;
}

.employee-hub-quick-actions {
  display: grid;
  grid-template-columns: repeat(6, minmax(34px, 1fr));
  gap: 6px;
  opacity: .86;
  transform: translateY(3px);
  transition: opacity 170ms ease, transform 170ms ease;
}

.employee-hub-card:hover .employee-hub-quick-actions {
  opacity: 1;
  transform: translateY(0);
}

.hr-page .employee-hub-hero,
.hr-page .employee-hub-stats,
.hr-page .employee-hub-surface,
.hr-page .new-joiners-band,
.hr-page .employee-hub-grid,
.hr-page .hr-directory-wrap {
  position: relative;
  top: auto;
  margin-top: 0;
  transform: none;
}

.hr-page .employee-hub-hero {
  min-height: 176px;
  margin: 0 0 12px;
}

.hr-page .employee-hub-stats {
  margin: 0 0 12px;
}

.hr-page .employee-hub-stat {
  animation: none;
}

.hr-page .employee-hub-surface {
  overflow: visible;
  isolation: isolate;
}

.hr-page .employee-database-banner,
.hr-page .hr-directory-toolbar,
.hr-page .employee-quick-filter-row,
.hr-page .employee-hub-controls {
  position: relative;
  z-index: 2;
}

.hr-page .employee-quick-filter-row,
.hr-page .employee-hub-controls {
  background: rgba(255,255,255,.92);
}

.hr-page .employee-quick-filter-row {
  position: sticky;
  top: 86px;
  z-index: 90;
  border: 1px solid rgba(59,93,138,.12);
  border-radius: 16px;
  padding: 8px;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 12px 30px rgba(13,43,82,.07);
}

.hr-page .employee-hub-controls {
  position: sticky;
  top: 140px;
  z-index: 89;
  border: 1px solid rgba(59,93,138,.12);
  border-radius: 18px;
  padding: 10px;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 14px 34px rgba(13,43,82,.06);
}

.hr-page .new-joiners-band,
.hr-page .employee-hub-count,
.hr-page .employee-hub-grid,
.hr-page .hr-directory-wrap {
  z-index: 1;
}

.hr-page .employee-hub-grid,
.hr-page .hr-directory-wrap {
  margin-top: 2px;
}

.hr-page .hr-directory-wrap {
  max-height: none;
  overflow: auto;
}

.employee-document-upload-zone {
  display: grid;
  justify-items: center;
  gap: 6px;
  min-height: 104px;
  border: 1px dashed rgba(59,93,138,.28);
  border-radius: 18px;
  padding: 18px;
  color: var(--hr-primary);
  background: rgba(247,249,252,.72);
}

.employee-document-upload-zone span {
  color: var(--hr-muted);
  font-size: .76rem;
  font-weight: 800;
}

.employee-document-tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.employee-document-tile-grid article {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 18px;
  padding: 14px;
  background: rgba(255,255,255,.82);
}

.employee-document-tile-grid span,
.employee-document-tile-grid small {
  color: var(--hr-muted);
  font-weight: 850;
}

.employee-document-tile-grid span {
  font-size: .7rem;
  text-transform: uppercase;
}

.employee-document-tile-grid strong {
  color: var(--hr-ink);
}

.employee-document-tile-grid div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.employee-document-tile-grid .secondary-action {
  min-height: 30px;
  border-radius: 10px;
  padding: 0 9px;
  font-size: .68rem;
}

.employee-smart-links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.employee-smart-links article {
  display: grid;
  gap: 7px;
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 16px;
  padding: 12px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(247,249,252,.78));
}

.employee-smart-links span {
  color: var(--hr-muted);
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.employee-smart-links strong {
  min-height: 22px;
  color: var(--hr-ink);
  font-size: .86rem;
  overflow-wrap: anywhere;
}

.employee-smart-links .secondary-action {
  min-height: 30px;
  border-radius: 10px;
  padding: 0 9px;
  font-size: .68rem;
}

@media (max-width: 1180px) {
  .employee-hub-stats,
  .employee-hub-controls,
  .employee-smart-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hr-dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hr-dashboard-lower {
    grid-template-columns: 1fr;
  }

  .hr-employee-kpi-strip,
  .hr-attendance-grid.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .employee-quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .employee-hub-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .employee-hub-stats,
  .employee-hub-controls,
  .employee-hub-card-meta,
  .employee-smart-links {
    grid-template-columns: 1fr;
  }

  .employee-hub-quick-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .hr-hero-card,
  .hr-section-heading.with-action {
    align-items: flex-start;
    flex-direction: column;
  }

  .hr-dashboard-grid,
  .hr-people-grid,
  .hr-employee-kpi-strip,
  .hr-attendance-grid.compact,
  .employee-quick-actions {
    grid-template-columns: 1fr;
  }
}

.hr-offer-controls {
  grid-template-columns: minmax(260px, 1fr) minmax(220px, auto);
}

.hr-store-note {
  display: grid;
  align-content: center;
  min-height: 44px;
  border: 1px solid rgba(89,112,138,.14);
  border-radius: 14px;
  padding: 8px 13px;
  color: #40566e;
  background: rgba(255,255,255,.72);
}

.hr-store-note strong,
.hr-store-note span {
  display: block;
}

.hr-store-note strong {
  color: var(--navy);
  font-size: .86rem;
}

.hr-store-note span {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 820;
}

.hr-table-wrap {
  max-height: 50vh;
}

.hr-offer-table th {
  white-space: nowrap;
}

.hr-offer-table .readonly-cell {
  min-height: 48px;
}

.hr-offer-table .readonly-cell small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: .7rem;
}

.hr-actions {
  min-width: 176px;
}

.selected-row td {
  background: rgba(230, 244, 255, .88) !important;
}

.hr-preview-panel {
  overflow: auto;
  border-radius: 18px;
  padding-bottom: 24px;
}

.offer-document {
  position: relative;
  width: min(794px, calc(100% - 28px));
  margin: 22px auto 0;
  padding: 0;
  overflow: visible;
  color: #17243a;
  background: transparent;
  box-shadow: 0 28px 80px rgba(16, 36, 59, 0.16);
  font: 500 11.5px/1.48 Georgia, "Times New Roman", serif;
}

.offer-document::before {
  display: none;
}

.offer-page {
  position: relative;
  width: 210mm;
  min-height: 297mm;
  padding: 14mm 20mm 31mm 31mm;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(122, 142, 166, .18);
  box-shadow: 0 20px 58px rgba(16,36,59,.13);
}

.offer-page::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  display: block;
  width: 10mm;
  content: "";
  background: linear-gradient(180deg, #071f3b 0%, #123b63 58%, #9bbad0 100%);
  opacity: 1;
}

.offer-letterhead-bg {
  display: none !important;
}

.offer-document > * {
  position: relative;
  z-index: 1;
}

.offer-page > * {
  position: relative;
  z-index: 1;
}

.annexure-page {
  margin-top: 24px;
  break-before: page;
  page-break-before: always;
}

.offer-letter-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 18px;
  margin-bottom: 16px;
  border-bottom: 1px solid rgba(15, 35, 61, .13);
  padding-bottom: 10px;
}

.offer-doc-identity {
  display: grid;
  gap: 4px;
  align-items: start;
  color: #6c7d91;
  font-family: Inter, Arial, sans-serif;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.offer-doc-identity small {
  color: #8a98a9;
  font-size: 8px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: none;
}

.offer-top-logo {
  width: 82px;
  height: auto;
  object-fit: contain;
}

.offer-company-contact {
  display: grid;
  gap: 3px;
  justify-items: end;
  color: #60748b;
  font-family: Inter, Arial, sans-serif;
  font-size: 8px;
  font-weight: 800;
  line-height: 1.35;
}

.offer-meta-box {
  display: none;
}

.offer-meta-box span {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 6px;
}

.offer-meta-box strong {
  color: #64758b;
  font-weight: 900;
  text-transform: uppercase;
}

.offer-watermark {
  position: absolute;
  top: 48%;
  left: 50%;
  z-index: 0 !important;
  color: rgba(15, 35, 61, .03);
  font: 900 30px/1 Inter, Arial, sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  transform: translate(-50%, -50%) rotate(-24deg);
  white-space: nowrap;
  pointer-events: none;
}

.offer-document-title {
  display: grid;
  gap: 2px;
  margin: 0 0 12px;
  color: #071a33;
  font-family: Inter, Arial, sans-serif;
}

.offer-document-title span {
  font-size: 20px;
  font-weight: 820;
  letter-spacing: .01em;
}

.offer-document-title small {
  color: #60748b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.offer-auth-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: -12px 0 18px;
  border: 1px solid rgba(93,116,143,.18);
  border-radius: 8px;
  padding: 6px 8px;
  color: #53677f;
  background: #f8fbff;
  font-family: Inter, Arial, sans-serif;
  font-size: 9px;
}

.offer-auth-line strong,
.offer-auth-line em {
  color: #102a47;
  font-style: normal;
  font-weight: 900;
}

.offer-verification-footer {
  position: absolute;
  right: 18mm;
  bottom: 11mm;
  left: 31mm;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr) auto;
  align-items: end;
  gap: 12px;
  border-top: 1px solid rgba(93, 116, 143, .16);
  padding-top: 7px;
  color: #66788e;
  font-family: Inter, Arial, sans-serif;
  font-size: 7.5px;
}

.offer-footer-contact,
.offer-footer-verify {
  display: grid;
  gap: 2px;
}

.offer-footer-contact {
  grid-template-columns: repeat(3, minmax(0, max-content));
  gap: 12px;
  align-items: center;
}

.offer-footer-verify {
  justify-items: end;
  min-width: 0;
}

.offer-footer-verify span {
  color: #243a55;
  font-weight: 900;
}

.offer-footer-verify small {
  max-width: 210px;
  overflow: hidden;
  color: #7c8da0;
  font-size: 7px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.offer-verification-footer strong,
.offer-verification-footer span {
  display: block;
}

.offer-verification-footer strong {
  color: #243a55;
  font-size: 9px;
}

.offer-qr {
  display: grid;
  width: 38px;
  height: 38px;
  min-width: 38px;
  place-items: center;
  border: 1px solid rgba(93,116,143,.22);
  background: #fff;
}

.offer-qr svg {
  width: 100%;
  height: 100%;
}

.verify-card .drawer-detail-grid {
  margin: 20px 0;
}

.offer-date {
  margin: 4px 0 12px;
  text-align: right;
  color: #17243a;
  font-weight: 700;
}

.offer-document address {
  margin-bottom: 13px;
  color: #17243a;
  font-style: normal;
}

.offer-document h2 {
  margin: 0 0 11px;
  color: #071a33;
  font: 800 15px/1.24 Inter, Arial, sans-serif;
}

.offer-document h3 {
  margin: 12px 0 6px;
  color: #08264a;
  font: 800 11px/1.25 Inter, Arial, sans-serif;
  text-transform: uppercase;
}

.offer-document p {
  margin: 0 0 6px;
}

.offer-document table {
  width: 100%;
  margin: 7px 0 10px;
  border-collapse: collapse;
  font-family: Inter, Arial, sans-serif;
  font-size: 10.5px;
}

.offer-document th,
.offer-document td {
  border: 1px solid rgba(94, 113, 133, .38);
  padding: 7px 9px;
  text-align: left;
  vertical-align: middle;
}

.offer-document th {
  width: 42%;
  color: #1e293b !important;
  background: #eef4fb !important;
  font: 900 11px/1.25 Inter, Arial, sans-serif;
}

.salary-annexure-table thead th {
  color: #1e293b !important;
  background: #eef4fb !important;
  border-color: rgba(94, 113, 133, .42) !important;
  font: 900 11.5px/1.25 Inter, Arial, sans-serif;
  padding: 8px 10px;
}

.offer-signatory-block {
  position: relative;
  display: grid;
  justify-items: start;
  gap: 4px;
  width: 230px;
  margin-top: 18px;
  color: #17243a;
  font-family: Inter, Arial, sans-serif;
  font-size: 10px;
}

.offer-signatory-block strong {
  color: #071a33;
  font-weight: 900;
}

.offer-signatory-block b {
  color: #071a33;
  font-size: 11px;
}

.offer-signatory-block span {
  color: #65788e;
  font-weight: 800;
}

.signature-line {
  display: block;
  width: 150px;
  height: 28px;
  border-bottom: 1px solid rgba(15,35,61,.44);
}

.offer-signature-image {
  max-width: 150px;
  max-height: 42px;
  object-fit: contain;
}

.offer-seal-image {
  position: absolute;
  left: 156px;
  top: 18px;
  max-width: 50px;
  max-height: 50px;
  object-fit: contain;
  opacity: .88;
}

.offer-candidate-acceptance {
  margin-top: 22px;
}

.offer-candidate-acceptance div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 34px;
  margin-top: 34px;
}

.offer-candidate-acceptance div span {
  border-top: 1px solid rgba(15,35,61,.38);
  padding-top: 7px;
  color: #65788e;
  font-family: Inter, Arial, sans-serif;
  font-size: 10px;
  font-weight: 800;
}

.annexure-note {
  color: #4f6278;
  font-family: Inter, Arial, sans-serif;
  font-size: 10px;
}

.hr-letter-drawer .offer-document {
  width: 100%;
  min-height: auto;
  margin-top: 0;
  box-shadow: 0 18px 52px rgba(16,36,59,.12);
}

.print-frame {
  position: fixed;
  width: 0;
  height: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
}

.print-offer-body {
  margin: 0;
  background: #fff;
}

.print-offer-body .offer-document {
  width: 210mm;
  margin: 0 auto;
  box-shadow: none;
}

.print-offer-body .offer-page {
  width: 210mm;
  min-height: 297mm;
  page-break-after: auto;
  break-after: auto;
}

.print-offer-body .offer-page + .offer-page {
  margin-top: 0;
  page-break-before: always;
  break-before: page;
}

@page {
  size: A4;
  margin: 0;
}

@media print {
  html,
  body,
  .print-offer-body {
    width: 210mm;
    min-height: 297mm;
    background: #fff !important;
  }

  body:not(.print-offer-body) > *:not(.print-frame) {
    display: none !important;
  }

  .print-offer-body .offer-document {
    width: 210mm;
    margin: 0;
    padding: 0;
    box-shadow: none !important;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .print-offer-body .offer-page {
    width: 210mm;
    height: 297mm;
    min-height: 297mm;
    max-height: 297mm;
    overflow: hidden;
    padding: 12mm 18mm 24mm 29mm;
    box-shadow: none !important;
    border: 0 !important;
    page-break-after: auto !important;
    page-break-before: auto !important;
    break-after: auto !important;
    break-before: auto !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .print-offer-body .offer-page + .offer-page {
    margin-top: 0 !important;
    page-break-before: always !important;
    break-before: page !important;
  }

  .print-offer-body .offer-letter-header {
    margin-bottom: 12px;
    padding-bottom: 8px;
  }

  .print-offer-body .offer-document-title {
    margin-bottom: 9px;
  }

  .print-offer-body .offer-document h2 {
    margin-bottom: 8px;
    font-size: 14px;
  }

  .print-offer-body .offer-document h3 {
    margin: 9px 0 5px;
  }

  .print-offer-body .offer-document p {
    margin-bottom: 4px;
  }

  .print-offer-body .offer-document table {
    margin: 5px 0 8px;
    font-size: 9.6px;
  }

  .print-offer-body .offer-document th,
  .print-offer-body .offer-document td {
    padding: 5px 8px;
  }

  .print-offer-body .offer-verification-footer {
    right: 18mm;
    bottom: 8mm;
    left: 29mm;
  }
}

@media (max-width: 980px) {
  .hr-offer-controls {
    grid-template-columns: 1fr;
  }

  .offer-document {
    min-height: 0;
  }

  .offer-page {
    width: 100%;
    min-height: 0;
    padding: 42px 40px 112px 74px;
    min-height: 900px;
  }
}

@media (max-width: 720px) {
  .hr-actions {
    min-width: 220px;
  }

  .offer-signatures {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

.clean-assignment-sheet .compact-advanced-filters summary {
  width: max-content;
  min-height: 24px !important;
  margin: 0 8px 4px;
  border: 1px solid rgba(89,112,138,.12);
  border-radius: 999px;
  padding: 4px 10px !important;
  background: rgba(255,255,255,.62);
}

.clean-assignment-sheet .date-filter-grid {
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  padding-top: 0;
}

.clean-assignment-sheet .compact-filter-action {
  min-height: 28px !important;
  align-self: end;
  border-radius: 8px !important;
  padding: 0 9px !important;
  font-size: .7rem !important;
  font-weight: 900 !important;
}

.clean-assignment-sheet .compact-date-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 0 8px 6px !important;
}

.clean-assignment-sheet .compact-date-presets button {
  min-height: 24px;
  border-radius: 999px;
  font-size: .66rem;
}

.clean-assignment-sheet .bulk-actions-bar {
  flex: 0 0 auto;
  padding: 5px 8px !important;
}

.clean-assignment-sheet .clean-filter-drawer {
  flex: 0 0 auto;
  border-bottom: 1px solid rgba(126,149,178,.12);
  background: rgba(255,255,255,.36);
}

.clean-assignment-sheet .clean-filter-drawer summary {
  min-height: 28px !important;
  padding: 5px 9px !important;
  color: #587089;
  cursor: pointer;
  font-size: .66rem !important;
  font-weight: 950;
  text-transform: uppercase;
}

.clean-assignment-sheet .clean-filter-drawer .sheet-controls {
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)) !important;
  padding: 6px 8px !important;
}

.clean-assignment-sheet .clean-filter-drawer .date-filter-bar {
  padding: 0 8px 7px !important;
}

.clean-assignment-sheet .spreadsheet-wrap {
  flex: 1 1 auto;
  height: auto;
  max-height: none !important;
  min-height: 0;
  overflow: auto !important;
  overscroll-behavior: contain;
}

.clean-assignment-sheet .assignment-table-scroll {
  flex: 1 1 auto;
  height: calc(100vh - 258px);
  min-height: 0;
  overflow: hidden;
}

.clean-assignment-sheet .assignment-table-scroll .spreadsheet-wrap {
  width: 100%;
  height: 100%;
  max-height: none !important;
  overflow: auto !important;
}

.clean-assignment-sheet .assignment-table th {
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  background: linear-gradient(180deg, rgba(244,248,252,.99), rgba(232,242,249,.99)) !important;
  transform: none !important;
}

.clean-assignment-sheet .assignment-table th button {
  min-height: 27px !important;
}

.clean-assignment-sheet .assignment-table input,
.clean-assignment-sheet .assignment-table select,
.clean-assignment-sheet .readonly-cell {
  min-height: 26px !important;
}

.clean-assignment-sheet .virtual-spacer-row td {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.clean-assignment-sheet .assignment-table tbody tr:not(.virtual-spacer-row) {
  height: 38px;
}

.clean-assignment-sheet .sheet-footer {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 6px 8px !important;
}

.page-size-select {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-right: 6px;
  color: #587089;
  font-size: .72rem;
  font-weight: 850;
}

.page-size-select select {
  min-height: 28px;
  border: 1px solid rgba(126,149,178,.16);
  border-radius: 9px;
  padding: 0 8px;
  background: rgba(255,255,255,.78);
  color: #071526;
  font-weight: 850;
}

.dev-test-action {
  min-height: 28px;
  border: 1px dashed rgba(12,154,191,.35);
  border-radius: 9px;
  padding: 0 8px;
  color: #07506a;
  background: rgba(232,248,252,.72);
  cursor: pointer;
  font-size: .68rem;
  font-weight: 900;
}

@media (max-width: 980px) {
  .clean-assignment-sheet .assignment-table-scroll {
    height: calc(100vh - 312px);
  }
}

.autosave-chip {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 999px;
  padding: 0 10px;
  color: #587089;
  background: rgba(255,255,255,.66);
  font-size: .7rem;
  font-weight: 850;
  white-space: nowrap;
}

.clean-assignment-sheet .ops-smart-widgets,
.clean-assignment-sheet .workload-panel,
.clean-assignment-sheet .saved-views-bar {
  display: none !important;
}

@media (max-width: 980px) {
  .clean-assignment-sheet {
    height: calc(100vh - 112px);
    min-height: 520px;
  }
  .clean-assignment-sheet .compact-workbar {
    top: auto !important;
    grid-template-columns: 1fr !important;
  }
  .clean-assignment-sheet .assignment-filter-panel {
    top: auto;
  }
  .clean-assignment-sheet .compact-filter-grid,
  .clean-assignment-sheet .date-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .clean-assignment-sheet .save-view-button {
    margin-left: 0;
  }
}

@media (max-width: 720px) {
  .clean-assignment-sheet {
    height: calc(100vh - 118px);
    min-height: 500px;
  }
  .clean-assignment-sheet .sheet-action-bar {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow: visible;
  }
  .clean-assignment-sheet .icon-action {
    min-width: 0;
  }
  .clean-assignment-sheet .assignment-filter-panel {
    position: relative;
  }
  .clean-assignment-sheet .compact-filter-grid,
  .clean-assignment-sheet .date-filter-grid {
    grid-template-columns: 1fr;
  }
}

/* Loader Workspace cleanup aligned to Assignment Sheet */
.loader-workspace {
  display: flex;
  min-height: calc(100vh - 78px);
  flex-direction: column;
}

.loader-workspace .loader-workspace-meta {
  display: flex;
  min-height: 36px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid rgba(126,149,178,.12);
  padding: 6px 8px;
  color: #587089;
  background: rgba(255,255,255,.46);
  font-size: .72rem;
  font-weight: 850;
}

.loader-workspace .loader-workspace-meta > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.loader-workspace .loader-workspace-meta label {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
}

.loader-workspace .loader-workspace-meta label span {
  color: #60748b;
  font-size: .62rem;
  font-weight: 950;
  text-transform: uppercase;
}

.loader-workspace .loader-workspace-meta select {
  min-height: 30px;
  border: 1px solid rgba(89,112,138,.14);
  border-radius: 9px;
  padding: 0 9px;
  color: var(--text);
  background: rgba(255,255,255,.82);
  font-size: .74rem;
  font-weight: 820;
}

.loader-workspace .compact-kpi-strip {
  min-height: 28px;
}

.loader-workspace .workspace-controls {
  grid-template-columns: minmax(220px, 1.4fr) repeat(4, minmax(126px, 1fr)) !important;
}

.loader-workspace .spreadsheet-wrap {
  flex: 1 1 auto;
  max-height: none !important;
  min-height: 0;
}

.loader-workspace .sheet-actions {
  width: 176px !important;
  min-width: 176px !important;
  max-width: 176px !important;
  z-index: 16 !important;
  border-left: 1px solid rgba(126,149,178,.22);
  box-shadow: -12px 0 22px rgba(125, 150, 180, .12);
}

.loader-workspace .sheet-actions-head {
  width: 176px !important;
  min-width: 176px !important;
  max-width: 176px !important;
  z-index: 24 !important;
  border-left: 1px solid rgba(126,149,178,.22);
  box-shadow: -12px 0 22px rgba(125, 150, 180, .14);
  text-align: center;
}

.loader-workspace .sheet-actions-head button {
  justify-content: center;
  overflow: hidden;
  text-overflow: ellipsis;
}

.loader-workspace .sheet-actions .tooltip-button {
  width: 29px !important;
  height: 29px !important;
  margin: 0 1px !important;
}

.loader-workspace .assignment-table th:not(.sheet-actions-head),
.loader-workspace .assignment-table td:not(.sheet-actions) {
  overflow: hidden;
}

.workspace-empty-state {
  display: grid;
  min-height: 220px;
  place-items: center;
  align-content: center;
  gap: 8px;
  color: #587089;
  background: rgba(247,251,255,.72);
  text-align: center;
}

.workspace-empty-state svg {
  color: #0c9abf;
}

.workspace-empty-state strong {
  color: #071526;
  font-size: .95rem;
}

.workspace-empty-state span {
  font-size: .8rem;
  font-weight: 760;
}

:root[data-theme="dark"] .loader-workspace .loader-workspace-meta,
:root[data-theme="dark"] .workspace-empty-state {
  background: rgba(14, 28, 45, .78);
}

:root[data-theme="dark"] .workspace-empty-state strong {
  color: var(--text);
}

@media (max-width: 980px) {
  .loader-workspace {
    min-height: calc(100vh - 112px);
  }
  .loader-workspace .workspace-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .loader-workspace {
    min-height: calc(100vh - 118px);
  }
  .loader-workspace .loader-workspace-meta {
    align-items: stretch;
    flex-direction: column;
  }
  .loader-workspace .loader-workspace-meta label,
  .loader-workspace .loader-workspace-meta select {
    width: 100%;
  }
  .loader-workspace .workspace-controls {
    grid-template-columns: 1fr !important;
  }
}

/* QC Workspace cleanup aligned to the table-first workspace pattern */
.qc-workspace {
  display: flex;
  min-height: calc(100vh - 78px);
  flex-direction: column;
}

.qc-workspace .qc-review-header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid rgba(126,149,178,.12);
  padding: 7px 10px;
  background: rgba(255,255,255,.48);
}

.qc-workspace .qc-review-title {
  min-width: 0;
}

.qc-workspace .mini-breadcrumb {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #667d94;
  font-size: .62rem;
  font-weight: 900;
  line-height: 1.1;
}

.qc-workspace .mini-breadcrumb strong {
  color: #294059;
}

.qc-workspace .qc-review-title h2 {
  margin: 3px 0 2px;
  color: #071526;
  font-size: 1.02rem;
  font-weight: 950;
  line-height: 1.05;
}

.qc-workspace .qc-review-title p {
  max-width: 640px;
  margin: 0;
  overflow: hidden;
  color: #5b7088;
  font-size: .73rem;
  font-weight: 820;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qc-workspace .qc-selector-panel {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}

.qc-workspace .qc-selector-panel label {
  display: grid;
  gap: 3px;
  min-width: 160px;
  max-width: 180px;
}

.qc-workspace .qc-selector-panel label span {
  color: #60748b;
  font-size: .58rem;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

.qc-workspace .qc-selector-panel select {
  width: 100%;
  min-height: 30px;
  border: 1px solid rgba(89,112,138,.14);
  border-radius: 9px;
  padding: 0 9px;
  color: var(--text);
  background: rgba(255,255,255,.82);
  font-size: .74rem;
  font-weight: 850;
}

.qc-workspace .qc-workspace-meta strong {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  border: 1px solid rgba(89,112,138,.12);
  border-radius: 999px;
  padding: 0 10px;
  color: #0a192b;
  background: rgba(255,255,255,.7);
  font-size: .7rem;
  font-weight: 900;
}

.qc-workspace .workspace-controls {
  grid-template-columns: minmax(220px, 1.35fr) repeat(5, minmax(126px, 1fr)) !important;
  align-items: end;
  gap: 7px !important;
}

.qc-workspace .spreadsheet-wrap {
  flex: 1 1 auto;
  max-height: none !important;
  min-height: 0;
  min-height: 320px;
}

.qc-workspace .sheet-actions,
.qc-workspace .sheet-actions-head {
  min-width: 204px !important;
  width: 204px !important;
  max-width: 204px !important;
}

.qc-workspace .sheet-actions-head {
  position: sticky !important;
  right: 0;
  background: linear-gradient(180deg, rgba(244,248,252,.99), rgba(232,242,249,.99)) !important;
  box-shadow: -1px 0 0 rgba(126,149,178,.18), 0 1px 0 rgba(126,149,178,.2);
}

.qc-workspace .sheet-actions-head button {
  justify-content: center !important;
  min-height: 28px !important;
  overflow: hidden;
  padding: 0 8px !important;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qc-workspace .assignment-table th button {
  overflow: hidden;
  justify-content: flex-start !important;
  gap: 6px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qc-workspace .sheet-actions {
  position: sticky;
  right: 0;
  z-index: 8;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  box-shadow: -1px 0 0 rgba(126,149,178,.14);
}

.qc-workspace .assignment-table th:not(.sheet-actions-head) button {
  max-width: 100%;
}

.qc-workspace .assignment-table th:not(.sheet-actions-head) {
  overflow: hidden;
}

.qc-workspace .sheet-actions .tooltip-button {
  flex: 0 0 auto;
}

.qc-workspace .compact-kpi-strip {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: center;
  gap: 0;
  min-height: 30px;
  padding: 0;
}

.qc-workspace .compact-kpi-strip span {
  display: flex;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  border-right: 1px solid rgba(126,149,178,.12);
  padding: 0 8px;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

.qc-workspace .compact-kpi-strip span:last-child {
  border-right: 0;
}

.qc-workspace .workspace-empty-row td {
  border-right: 0 !important;
  background: rgba(247,251,255,.7) !important;
}

.qc-workspace .workspace-empty-state {
  min-height: 260px;
  width: min(720px, calc(100vw - 80px));
  margin: 0 auto;
  border: 1px dashed rgba(126,149,178,.22);
  border-radius: 16px;
  background: rgba(255,255,255,.48);
}

.qc-workspace .open-tmt-link,
.task-drawer .open-tmt-link,
.drawer-detail a {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(12,154,191,.18);
  border-radius: 999px;
  padding: 0 9px;
  color: #087f9b;
  background: rgba(224,247,252,.72);
  font-size: .68rem;
  font-weight: 950;
  text-decoration: none;
  white-space: nowrap;
}

.qc-drawer-tabs {
  display: grid;
  gap: 12px;
  padding: 0 18px 18px;
}

.qc-drawer-tabs section {
  border: 1px solid rgba(126,149,178,.14);
  border-radius: 16px;
  padding: 12px;
  background: rgba(255,255,255,.55);
}

.qc-drawer-tabs .drawer-detail-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.qc-drawer-tabs .activity-list {
  display: grid;
  gap: 8px;
}

.qc-drawer-tabs .activity-list > div {
  display: grid;
  gap: 3px;
  border: 1px solid rgba(126,149,178,.1);
  border-radius: 12px;
  padding: 8px 10px;
  background: rgba(247,251,255,.68);
}

.qc-drawer-tabs .activity-list span {
  color: #65798f;
  font-size: .65rem;
  font-weight: 900;
  text-transform: uppercase;
}

.qc-drawer-tabs .activity-list strong {
  color: #0a192b;
  font-size: .78rem;
  font-weight: 820;
}

:root[data-theme="dark"] .qc-workspace .qc-workspace-meta strong,
:root[data-theme="dark"] .qc-workspace .qc-review-header,
:root[data-theme="dark"] .qc-drawer-tabs section,
:root[data-theme="dark"] .qc-drawer-tabs .activity-list > div {
  color: var(--text);
  background: rgba(14, 28, 45, .78);
}

:root[data-theme="dark"] .qc-workspace .qc-review-title h2,
:root[data-theme="dark"] .qc-workspace .mini-breadcrumb strong {
  color: var(--text);
}

:root[data-theme="dark"] .qc-drawer-tabs .activity-list strong {
  color: var(--text);
}

@media (max-width: 980px) {
  .qc-workspace {
    min-height: calc(100vh - 112px);
  }
  .qc-workspace .qc-review-header {
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
  }
  .qc-workspace .qc-review-title p {
    white-space: normal;
  }
  .qc-workspace .qc-selector-panel {
    justify-content: flex-start;
  }
  .qc-workspace .qc-selector-panel label {
    max-width: 220px;
  }
  .qc-workspace .compact-kpi-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .qc-workspace .workspace-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .qc-drawer-tabs .drawer-detail-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .qc-workspace {
    min-height: calc(100vh - 118px);
  }
  .qc-workspace .compact-kpi-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .qc-workspace .compact-kpi-strip span {
    justify-content: flex-start;
    padding-left: 10px;
  }
  .qc-workspace .qc-selector-panel label {
    width: 100%;
    max-width: none;
  }
  .qc-workspace .workspace-controls {
    grid-template-columns: 1fr !important;
  }
  .qc-workspace .workspace-empty-state {
    width: calc(100vw - 48px);
  }
}

/* Passport is a main Setzling OS module, separate from the Ops Portal shell. */
.passport-main-module {
  --passport-sidebar-width: 276px;
}

.passport-shell {
  display: block;
  width: 100%;
  height: 100vh;
  margin: 0;
}

.passport-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 42;
  display: flex;
  width: var(--passport-sidebar-width);
  height: 100vh;
  max-height: 100vh;
  flex-direction: column;
  gap: 12px;
  border-radius: 0;
  border-right: 1px solid var(--soft-line);
  padding: 14px;
  overflow: hidden;
  background: var(--panel);
}

.passport-sidebar .os-lockup {
  min-height: 42px;
  margin: 0;
}

.passport-sidebar .os-lockup img {
  width: 34px;
  height: 34px;
}

.passport-module-card {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(93, 120, 255, .16);
  border-radius: 16px;
  padding: 12px;
  color: var(--navy);
  background: linear-gradient(135deg, rgba(255,255,255,.82), rgba(232,239,255,.58));
  box-shadow: 0 16px 40px rgba(48, 72, 122, .08);
}

.passport-module-card svg {
  color: #5d78ff;
}

.passport-module-card strong,
.passport-module-card span {
  display: block;
}

.passport-module-card strong {
  font-size: .92rem;
}

.passport-module-card span {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 780;
}

.passport-sidebar-nav {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  border-right: 0;
  border-radius: 16px;
  background: rgba(255,255,255,.36);
}

.passport-home-link {
  flex: 0 0 auto;
  justify-content: flex-start;
  min-height: 38px;
  border-top: 1px solid var(--soft-line);
  border-radius: 12px;
  padding-top: 12px;
  color: #496179;
  font-weight: 900;
}

.passport-main {
  height: 100vh;
  min-width: 0;
  margin-left: var(--passport-sidebar-width);
  overflow-y: auto;
  padding: 0 18px 22px;
}

.passport-module-header h1 {
  font-size: clamp(1.55rem, 2.7vw, 2.35rem);
}

.passport-module-header p {
  max-width: 760px;
}

.passport-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.passport-main .passport-page {
  min-height: calc(100vh - 108px);
}

.passport-main .passport-intelligence {
  min-height: calc(100vh - 108px);
}

.passport-main .passport-workspace {
  padding: 0;
}

@media (max-width: 980px) {
  .passport-sidebar {
    position: relative;
    width: auto;
    height: auto;
    max-height: none;
    border-radius: 0 0 22px 22px;
  }
  .passport-shell {
    display: grid;
    height: auto;
    min-height: 100vh;
  }
  .passport-main {
    height: auto;
    min-height: 100vh;
    margin-left: 0;
  }
  .passport-sidebar-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }
}

@media (max-width: 720px) {
  .passport-sidebar-nav {
    grid-template-columns: 1fr;
  }
  .passport-main {
    padding-inline: 12px;
  }
  .passport-module-header {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Emergency Passport vault redesign: isolated from Ops layout. */
.passport-main-module {
  background:
    radial-gradient(circle at 18% 12%, rgba(93,120,255,.14), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(12,154,191,.12), transparent 30%),
    var(--app-bg);
}

.passport-main-module .passport-sidebar {
  border-right-color: rgba(24, 40, 78, .12);
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(235,244,252,.78));
  box-shadow: 18px 0 50px rgba(18, 42, 74, .08);
}

.passport-main-module .passport-module-card {
  border-color: rgba(93,120,255,.24);
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(229,234,255,.74));
}

.passport-main-module .passport-module-nav,
.passport-main-module .passport-sidebar-nav {
  gap: 5px;
  border: 0;
  background: transparent;
}

.passport-main-module .passport-module-nav button {
  min-height: 38px;
  border-radius: 12px;
  color: #40546d;
  font-size: .76rem;
}

.passport-main-module .passport-module-nav button:hover,
.passport-main-module .passport-module-nav button.active {
  border-color: rgba(93,120,255,.28);
  color: #081a33;
  background: linear-gradient(135deg, rgba(232,248,252,.86), rgba(236,239,255,.9));
  box-shadow: 0 10px 24px rgba(68, 95, 150, .08);
}

.passport-main-module .passport-module-header {
  padding-block: 10px;
  border-bottom: 1px solid rgba(126,149,178,.12);
  background: rgba(255,255,255,.86);
}

.passport-main-module .passport-module-header h1 {
  color: #06172e;
  font-size: clamp(1.38rem, 2.2vw, 2rem);
}

.passport-main-module .passport-module-header p {
  margin-top: 3px;
  color: #60748b;
  font-size: .82rem;
}

.passport-header-search {
  cursor: text;
}

.passport-header-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  color: var(--text);
  background: transparent;
  font: inherit;
  font-weight: 760;
  outline: 0;
}

.passport-vault {
  display: flex;
  min-height: calc(100vh - 96px);
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 20px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 22px 70px rgba(20, 44, 76, .08);
}

.passport-vault-toolbar {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid rgba(126,149,178,.12);
  padding: 10px 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(247,251,255,.84));
}

.passport-vault-search {
  display: flex;
  flex: 1 1 420px;
  max-width: 620px;
  min-height: 36px;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(89,112,138,.16);
  border-radius: 12px;
  padding: 0 10px;
  color: #60748b;
  background: rgba(255,255,255,.88);
}

.passport-vault-search input {
  width: 100%;
  border: 0;
  color: var(--text);
  background: transparent;
  font-weight: 760;
  outline: 0;
}

.passport-vault .passport-workspace {
  flex: 1 1 auto;
  overflow: auto;
  padding: 12px;
}

.passport-vault-dashboard {
  display: grid;
  gap: 12px;
}

.passport-vault .passport-summary-strip {
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 10px;
  padding: 0;
}

.passport-vault .passport-summary-strip article {
  min-height: 72px;
  border-color: rgba(93,120,255,.12);
  border-radius: 14px;
  padding: 12px;
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(238,246,252,.78));
}

.passport-vault .passport-summary-strip strong {
  color: #071526;
  font-size: 1.28rem;
}

.passport-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(280px, 3fr);
  gap: 12px;
  align-items: start;
}

.passport-dashboard-side {
  display: grid;
  gap: 12px;
}

.passport-vault-card,
.passport-vault-panel {
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 16px;
  padding: 12px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 18px 46px rgba(24, 50, 83, .06);
}

.passport-vault-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.passport-vault .passport-panel-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.passport-vault .passport-panel-title h3 {
  margin: 0;
  color: #071526;
  font-size: 1rem;
}

.passport-vault .passport-panel-title span {
  display: block;
  margin-top: 2px;
  color: #60748b;
  font-size: .72rem;
}

.passport-quick-actions,
.passport-type-list,
.passport-upload-list {
  display: grid;
  gap: 7px;
}

.passport-quick-actions button,
.passport-upload-list button {
  display: flex;
  min-height: 38px;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 11px;
  padding: 0 10px;
  color: #253b56;
  background: rgba(247,251,255,.82);
  cursor: pointer;
  font-weight: 850;
  text-align: left;
}

.passport-upload-list button {
  display: grid;
  align-items: center;
  padding-block: 8px;
}

.passport-upload-list span,
.muted-copy {
  color: #60748b;
  font-size: .72rem;
  font-weight: 760;
}

.passport-type-list span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid rgba(126,149,178,.12);
  border-radius: 10px;
  padding: 7px 9px;
  background: rgba(247,251,255,.7);
}

.passport-type-list em {
  color: #50677f;
  font-size: .74rem;
  font-style: normal;
  font-weight: 850;
}

.passport-type-list strong {
  color: #172a45;
}

.passport-vault .passport-folder-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  padding: 0;
}

.passport-vault .passport-folder-grid article {
  min-height: 104px;
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 15px;
  padding: 14px;
  background: linear-gradient(135deg, rgba(255,255,255,.9), rgba(241,245,255,.7));
  box-shadow: 0 14px 36px rgba(24, 50, 83, .05);
  transition: transform 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.passport-vault .passport-folder-grid article:hover {
  border-color: rgba(93,120,255,.24);
  box-shadow: 0 18px 44px rgba(68, 95, 150, .1);
  transform: translateY(-2px);
}

.passport-vault .passport-folder-grid article span {
  color: #5d78ff;
}

.passport-filter-bar {
  display: grid;
  grid-template-columns: minmax(240px, 1.6fr) repeat(auto-fit, minmax(128px, 1fr));
  align-items: end;
  border-color: rgba(126,149,178,.13);
  background: rgba(247,251,255,.72);
}

.passport-table-shell {
  max-height: none;
  border-color: rgba(126,149,178,.13);
  border-radius: 14px;
  background: rgba(255,255,255,.72);
}

.passport-vault .passport-table th {
  z-index: 14;
  background: linear-gradient(180deg, rgba(247,251,255,.98), rgba(232,240,250,.98)) !important;
}

.passport-vault .passport-table th button {
  min-height: 34px !important;
  color: #40546d;
  font-size: .66rem !important;
}

.passport-vault .passport-table tr {
  cursor: pointer;
}

.passport-vault .passport-table td {
  background: rgba(255,255,255,.76) !important;
}

.passport-vault .passport-table tbody tr:hover td {
  background: rgba(237,245,255,.94) !important;
}

.passport-actions-cell,
.passport-vault .sheet-actions {
  width: 220px !important;
  min-width: 220px !important;
  max-width: 260px !important;
  border-left: 1px solid rgba(126,149,178,.18);
}

.kensington-hub {
  display: grid;
  gap: 18px;
  color: #132238;
  background:
    radial-gradient(circle at 8% 4%, rgba(47,128,237,.14), transparent 24%),
    radial-gradient(circle at 86% 8%, rgba(139,92,246,.12), transparent 26%),
    linear-gradient(180deg, rgba(248,251,255,.92), rgba(238,247,251,.62) 42%, rgba(255,255,255,.86));
}
.kensington-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 24px; min-height: 430px; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; padding: clamp(28px, 5vw, 58px); color: #fff; background: linear-gradient(135deg, rgba(7,21,38,.94), rgba(31,95,184,.66)), url("https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1600&q=78") center/cover; box-shadow: 0 24px 70px rgba(7,21,38,.13); overflow: hidden; }
.kensington-hero:after { content: ""; position: absolute; right: 36px; bottom: 26px; width: min(220px, 32vw); height: 4px; border-radius: 999px; background: linear-gradient(90deg, #2f80ed, #14b8a6, #f59e0b); opacity: .78; }
.kensington-hero h2 { margin: 4px 0 16px; color: #fff; font-size: clamp(42px, 7vw, 82px); line-height: .98; letter-spacing: 0; }
.kensington-hero span, .kensington-hero .eyebrow { color: rgba(255,255,255,.84); }
.kensington-hero > div:first-child { position: relative; z-index: 1; max-width: 780px; }
.kensington-hero-metrics { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(118px, 1fr)); gap: 12px; }
.kensington-hero-metrics span { display: grid; gap: 8px; min-height: 122px; border: 1px solid rgba(255,255,255,.22); border-radius: 8px; padding: 16px; background: rgba(255,255,255,.14); color: #fff; font-size: .76rem; font-weight: 900; backdrop-filter: blur(12px); }
.kensington-hero-metrics strong { font-size: clamp(28px, 3vw, 40px); line-height: 1; }
.kensington-search-band { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; padding: 14px; background: rgba(255,255,255,.78); box-shadow: 0 16px 42px rgba(7,21,38,.08); }
.kensington-search-band label { display: flex; align-items: center; gap: 10px; min-height: 48px; border: 1px solid rgba(91,112,139,.18); border-radius: 8px; padding: 0 14px; background: rgba(255,255,255,.9); color: #5c6d83; }
.kensington-search-band input { width: 100%; border: 0; outline: 0; color: #071526; background: transparent; font-weight: 850; }
.kensington-search-band span { color: #5c6d83; font-size: .82rem; font-weight: 900; }
.client-sop-search { margin: 14px 0; }
.client-sop-academy-layout { margin-top: 18px; }
.kensington-import-banner { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: center; border: 1px solid rgba(20,184,166,.26); border-radius: 8px; padding: 16px 18px; color: #07506a; background: linear-gradient(135deg, rgba(222,252,244,.92), rgba(244,247,255,.94)); box-shadow: 0 16px 42px rgba(7,21,38,.08); }
.kensington-import-banner strong { color: #071526; font-size: 1.06rem; }
.kensington-import-banner span { color: #40536b; font-weight: 850; }
.kensington-story-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.kensington-module-grid article { position: relative; overflow: hidden; display: grid; gap: 10px; min-height: 192px; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; padding: 20px; background: rgba(255,255,255,.82); box-shadow: 0 20px 54px rgba(7,21,38,.09); cursor: pointer; transform-style: preserve-3d; animation: kensingtonRise 560ms ease both; animation-delay: var(--delay, 0ms); transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease, background 260ms ease; }
.kensington-module-grid article:hover { transform: perspective(900px) rotateX(2deg) rotateY(-3deg) translateY(-5px); border-color: rgba(47,128,237,.34); box-shadow: 0 26px 70px rgba(47,128,237,.17), 0 0 0 1px rgba(255,255,255,.72) inset; }
.kensington-module-grid article:after { content: ""; position: absolute; right: -45px; bottom: -45px; width: 150px; height: 150px; border-radius: 50%; background: var(--glow, #2f80ed); opacity: .16; }
.kensington-module-grid article.active { border-color: color-mix(in srgb, var(--glow, #2f80ed), white 38%); background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(246,250,255,.82)); }
.kensington-module-grid article.is-muted { opacity: .42; }
.kensington-module-grid span { display: grid; position: relative; z-index: 1; width: 46px; height: 46px; place-items: center; border-radius: 8px; color: #fff; background: var(--glow, #2f80ed); box-shadow: 0 12px 26px rgba(7,21,38,.12); }
.kensington-module-grid strong { position: relative; z-index: 1; color: #071526; font-size: 1.08rem; }
.kensington-module-grid small { position: relative; z-index: 1; color: #4d5f77; font-weight: 760; line-height: 1.55; }
.kensington-module-grid em { position: relative; z-index: 1; color: #5c6d83; font-size: .75rem; font-style: normal; font-weight: 950; letter-spacing: .05em; text-transform: uppercase; }
.kensington-article-band { display: grid; gap: 18px; border-radius: 8px; padding: clamp(20px, 3vw, 34px); background: linear-gradient(135deg, rgba(7,21,38,.03), rgba(47,128,237,.06)); }
.kensington-article-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.kensington-article-card { position: relative; overflow: hidden; display: grid; gap: 10px; min-height: 236px; border: 1px solid rgba(255,255,255,.68); border-radius: 8px; padding: 18px; color: #071526; background: rgba(255,255,255,.88); box-shadow: 0 18px 48px rgba(7,21,38,.08); cursor: pointer; text-align: left; animation: kensingtonRise 520ms ease both; animation-delay: var(--delay, 0ms); transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease; }
.kensington-article-card:hover { transform: perspective(900px) rotateX(1.5deg) rotateY(-2deg) translateY(-4px); border-color: rgba(20,184,166,.36); box-shadow: 0 24px 64px rgba(20,184,166,.14); }
.kensington-article-card:after { content: ""; position: absolute; right: 16px; top: 16px; width: 34px; height: 34px; border-radius: 8px; background: linear-gradient(135deg, rgba(47,128,237,.18), rgba(20,184,166,.22)); animation: iconFloat 2.8s ease-in-out infinite; }
.kensington-article-card span { width: fit-content; border-radius: 999px; padding: 5px 9px; color: #07506a; background: rgba(222,252,244,.92); font-size: .72rem; font-weight: 950; text-transform: uppercase; }
.kensington-article-card strong { padding-right: 42px; font-size: 1.08rem; line-height: 1.25; }
.kensington-article-card small { color: #4d5f77; line-height: 1.55; font-weight: 760; }
.kensington-article-card em { color: #5c6d83; font-size: .74rem; font-style: normal; font-weight: 900; }
.kensington-tag-list { display: flex; flex-wrap: wrap; gap: 6px; }
.kensington-tag-list span { width: auto; border-radius: 999px; padding: 4px 8px; color: #245fc7; background: rgba(244,247,255,.92); font-size: .68rem; font-weight: 900; text-transform: none; }
.kensington-article-drawer { width: min(920px, 94vw); }
.kensington-article-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; border: 1px solid rgba(91,112,139,.12); border-radius: 8px; margin-bottom: 14px; padding: 12px; background: rgba(247,250,255,.8); }
.kensington-article-meta span { display: grid; gap: 4px; color: #5c6d83; font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.kensington-article-meta strong { color: #071526; font-size: .86rem; text-transform: none; }
.kensington-article-section { display: grid; gap: 10px; border-bottom: 1px solid rgba(91,112,139,.1); padding: 14px 0; }
.kensington-article-section p:not(.eyebrow) { color: #40536b; line-height: 1.66; font-weight: 760; }
.kensington-article-section ol { display: grid; gap: 9px; margin: 0 0 0 20px; color: #071526; line-height: 1.58; font-weight: 800; }
.kensington-article-two-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 14px 0; }
.kensington-article-two-col > div { border: 1px solid rgba(91,112,139,.12); border-radius: 8px; padding: 14px; background: rgba(255,255,255,.78); }
.kensington-article-two-col ul { display: grid; gap: 8px; margin: 8px 0 0 18px; color: #40536b; line-height: 1.55; font-weight: 760; }
.kensington-learning-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); gap: 18px; align-items: start; }
.kensington-sop-page { display: grid; gap: 18px; min-width: 0; }
.kensington-sop-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 300px); gap: 28px; align-items: end; min-height: 520px; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; padding: clamp(28px, 5vw, 58px); color: #fff; background-size: cover; background-position: center; box-shadow: 0 24px 70px rgba(7,21,38,.13); }
.kensington-sop-hero h2 { margin: 0 0 16px; color: #fff; font-size: clamp(38px, 6vw, 74px); line-height: .98; }
.kensington-sop-hero p:not(.eyebrow) { max-width: 720px; color: rgba(255,255,255,.86); font-size: clamp(17px, 2vw, 23px); line-height: 1.48; }
.kensington-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.kensington-hero-card { display: grid; gap: 12px; border: 1px solid rgba(255,255,255,.26); border-radius: 8px; padding: 18px; background: rgba(255,255,255,.14); backdrop-filter: blur(14px); }
.kensington-hero-card span { display: grid; gap: 4px; color: rgba(255,255,255,.78); font-size: .78rem; font-weight: 900; }
.kensington-hero-card strong { color: #fff; font-size: 1.2rem; }
.kensington-progress-band { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; padding: 16px; background: rgba(255,255,255,.82); box-shadow: 0 16px 42px rgba(7,21,38,.08); }
.kensington-progress-band div:not(.kensington-progress-track) { display: grid; gap: 3px; }
.kensington-progress-band strong { color: #071526; }
.kensington-progress-band span { color: #5c6d83; font-size: .72rem; font-weight: 950; text-transform: uppercase; }
.kensington-progress-track { height: 36px; overflow: hidden; border-radius: 7px; background: rgba(226,235,245,.95); box-shadow: inset 0 1px 0 rgba(255,255,255,.85); }
.kensington-progress-track i { display: block; height: 100%; border-radius: 7px; background: linear-gradient(90deg, var(--sop-accent, #2f80ed), #14b8a6); transition: width 900ms cubic-bezier(.2,.9,.2,1); }
.kensington-band { display: grid; gap: 18px; padding: clamp(28px, 4vw, 52px) 0; }
.kensington-band.alt { border-radius: 8px; padding-inline: clamp(14px, 2vw, 24px); background: linear-gradient(135deg, rgba(7,21,38,.03), rgba(47,128,237,.06)), radial-gradient(circle at 18% 40%, rgba(20,184,166,.12), transparent 28%); }
.kensington-section-head { display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1fr); gap: 28px; align-items: end; }
.kensington-section-head h3 { margin: 0; color: #071526; font-size: clamp(28px, 4vw, 48px); line-height: 1.03; }
.kensington-section-head p { color: #4d5f77; line-height: 1.68; font-weight: 760; }
.kensington-flow { display: grid; gap: 16px; }
.kensington-flow-step { display: grid; grid-template-columns: minmax(0, .82fr) minmax(280px, 1fr); gap: 18px; align-items: stretch; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; padding: 18px; background: rgba(255,255,255,.82); box-shadow: 0 20px 54px rgba(7,21,38,.09); animation: kensingtonRise 560ms ease both; animation-delay: var(--delay, 0ms); transform-style: preserve-3d; transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease; }
.kensington-flow-step:hover { transform: perspective(900px) rotateX(1.5deg) rotateY(-2deg) translateY(-4px); border-color: rgba(47,128,237,.34); box-shadow: 0 26px 70px rgba(47,128,237,.15); }
.kensington-flow-step.done { border-color: color-mix(in srgb, var(--sop-accent, #2f80ed), white 30%); }
.flow-copy { display: grid; align-content: center; gap: 10px; }
.flow-copy span { color: var(--sop-accent, #2f80ed); font-size: .76rem; font-weight: 950; letter-spacing: .1em; text-transform: uppercase; }
.flow-copy h4 { margin: 0; color: #071526; font-size: clamp(22px, 3vw, 32px); }
.flow-copy p { color: #4d5f77; line-height: 1.68; font-weight: 760; }
.kensington-screen { overflow: hidden; min-height: 250px; border: 1px solid rgba(91,112,139,.18); border-radius: 8px; background: #fff; box-shadow: 0 16px 42px rgba(7,21,38,.08); }
.kensington-screen-top { display: flex; align-items: center; gap: 7px; min-height: 38px; border-bottom: 1px solid rgba(91,112,139,.14); padding: 0 12px; background: rgba(246,250,255,.96); }
.kensington-screen-top span { width: 9px; height: 9px; border-radius: 999px; background: var(--tone, #2f80ed); opacity: .72; }
.kensington-screen-top strong { margin-left: auto; color: #5c6d83; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.kensington-screen-body { display: grid; gap: 12px; padding: 18px; }
.screen-line { width: 68%; height: 12px; border-radius: 999px; background: rgba(91,112,139,.16); }
.screen-line.wide { width: 92%; height: 18px; background: linear-gradient(90deg, color-mix(in srgb, var(--tone, #2f80ed), white 20%), rgba(20,184,166,.42)); }
.screen-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.screen-grid span { min-height: 58px; border-radius: 8px; background: rgba(226,235,245,.72); }
.kensington-screen-body p { margin: 4px 0 0; color: #40536b; font-weight: 850; line-height: 1.45; }
.kensington-accordion-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.kensington-accordion-grid details { border: 1px solid rgba(255,255,255,.62); border-radius: 8px; padding: 18px; background: rgba(255,255,255,.82); box-shadow: 0 16px 42px rgba(7,21,38,.08); }
.kensington-accordion-grid summary { cursor: pointer; color: #071526; font-size: 1.05rem; font-weight: 950; }
.kensington-accordion-grid ul { display: grid; gap: 10px; margin: 14px 0 0; padding-left: 18px; color: #4d5f77; line-height: 1.58; font-weight: 760; }
.kensington-quiz-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.kensington-quiz-card { display: grid; gap: 10px; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; padding: 20px; background: rgba(255,255,255,.82); box-shadow: 0 16px 42px rgba(7,21,38,.08); }
.kensington-quiz-card h4 { color: #071526; font-size: 1.08rem; }
.kensington-quiz-card button { min-height: 42px; border: 1px solid rgba(91,112,139,.18); border-radius: 8px; padding: 9px 12px; color: #40536b; background: rgba(255,255,255,.9); cursor: pointer; text-align: left; font-weight: 850; }
.kensington-quiz-card button.correct { color: #07506a; border-color: rgba(20,184,166,.36); background: rgba(222,252,244,.86); }
.kensington-quiz-card button.wrong { color: #8a2336; border-color: rgba(244,63,94,.32); background: rgba(255,235,240,.82); }
.kensington-quiz-card span { color: #5c6d83; font-size: .8rem; font-weight: 900; }
.kensington-ai-dock { position: sticky; top: 88px; display: grid; grid-template-rows: auto auto minmax(220px, auto) auto; max-height: calc(100vh - 110px); overflow: auto; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; background: rgba(255,255,255,.86); box-shadow: 0 20px 54px rgba(7,21,38,.09); backdrop-filter: blur(14px); }
.kensington-ai-dock header { padding: 18px; border-bottom: 1px solid rgba(91,112,139,.14); }
.kensington-ai-dock h3 { margin: 0 0 6px; color: #071526; font-size: 1.28rem; }
.kensington-ai-dock header span { color: #5c6d83; font-weight: 820; }
.kensington-samples { display: flex; flex-wrap: wrap; gap: 7px; padding: 12px 18px; border-bottom: 1px solid rgba(91,112,139,.1); }
.kensington-samples button { min-height: 32px; border: 1px solid rgba(47,128,237,.16); border-radius: 999px; padding: 0 11px; color: #245fc7; background: rgba(244,247,255,.88); cursor: pointer; font-size: .75rem; font-weight: 850; }
.kensington-chat-log { display: grid; align-content: start; gap: 12px; overflow-y: auto; padding: 18px; }
.kensington-chat-log.mini { max-height: 420px; }
.kensington-message { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; }
.kensington-message.user { grid-template-columns: minmax(0, 1fr) 34px; }
.kensington-message.user .kensington-message-avatar { grid-column: 2; }
.kensington-message.user .kensington-message-body { grid-column: 1; grid-row: 1; justify-self: end; max-width: 720px; background: #071526; color: #fff; }
.kensington-message-avatar { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 8px; color: #2f80ed; background: rgba(47,128,237,.12); font-weight: 950; }
.kensington-message-body { max-width: 820px; border: 1px solid rgba(91,112,139,.12); border-radius: 8px; padding: 13px 14px; background: rgba(247,250,255,.92); }
.kensington-message-body ol { display: grid; gap: 7px; margin: 0 0 12px 18px; padding: 0; color: #071526; font-weight: 780; line-height: 1.5; }
.kensington-user-question { margin-bottom: 8px; color: #2f80ed; font-weight: 900; }
.kensington-source-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: 7px; align-items: center; border-top: 1px solid rgba(91,112,139,.12); padding-top: 10px; }
.kensington-source-meta span { display: grid; gap: 2px; color: #5c6d83; font-size: .68rem; font-weight: 820; }
.kensington-source-meta strong { color: #071526; font-size: .76rem; }
.kensington-chat-input { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; border-top: 1px solid rgba(91,112,139,.12); padding: 14px 18px; background: rgba(255,255,255,.92); }
.kensington-chat-input input { min-height: 46px; border: 1px solid rgba(91,112,139,.18); border-radius: 8px; padding: 0 14px; color: #071526; background: #fff; font-weight: 800; }
.kensington-source-strip { display: grid; gap: 16px; border-radius: 8px; padding: clamp(22px, 3vw, 34px); background: linear-gradient(135deg, rgba(7,21,38,.03), rgba(47,128,237,.06)); }
.kensington-source-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.kensington-source-row { display: grid; gap: 7px; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; padding: 14px; color: #071526; background: rgba(255,255,255,.82); box-shadow: 0 16px 42px rgba(7,21,38,.08); cursor: pointer; text-align: left; transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease; }
.kensington-source-row:hover { transform: translateY(-3px); border-color: rgba(47,128,237,.28); box-shadow: 0 22px 48px rgba(47,128,237,.12); }
.kensington-source-row span, .kensington-source-row em { color: #5c6d83; font-size: .76rem; font-style: normal; font-weight: 850; }
@keyframes kensingtonRise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }

.passport-ai-page { display: grid; gap: 16px; }
.passport-ai-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px; align-items: end; min-height: 280px; border-radius: 8px; padding: clamp(24px, 4vw, 44px); color: #fff; background: linear-gradient(135deg, rgba(7,21,38,.96), rgba(31,95,184,.72)), url("https://images.unsplash.com/photo-1553877522-43269d4ea984?auto=format&fit=crop&w=1500&q=78") center/cover; box-shadow: 0 24px 70px rgba(7,21,38,.13); overflow: hidden; }
.passport-ai-hero h2 { margin: 4px 0 12px; color: #fff; font-size: clamp(42px, 7vw, 78px); line-height: .98; }
.passport-ai-hero p:not(.eyebrow) { max-width: 760px; color: rgba(255,255,255,.84); font-size: clamp(16px, 2vw, 21px); line-height: 1.55; }
.passport-ai-hero .eyebrow { color: rgba(255,255,255,.78); }
.passport-ai-hero-metrics { display: grid; grid-template-columns: repeat(3, minmax(105px, 1fr)); gap: 10px; }
.passport-ai-hero-metrics span { display: grid; gap: 6px; min-height: 104px; border: 1px solid rgba(255,255,255,.24); border-radius: 8px; padding: 14px; background: rgba(255,255,255,.14); color: rgba(255,255,255,.78); font-size: .74rem; font-weight: 900; backdrop-filter: blur(14px); }
.passport-ai-hero-metrics strong { color: #fff; font-size: 2rem; line-height: 1; }
.passport-ai-shell { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr) minmax(280px, 360px); gap: 14px; align-items: start; }
.passport-ai-side, .passport-ai-chat, .passport-ai-admin { border-radius: 8px; border: 1px solid rgba(255,255,255,.62); background: rgba(255,255,255,.84); box-shadow: 0 20px 54px rgba(7,21,38,.09); }
.passport-ai-side { position: sticky; top: 86px; display: grid; gap: 14px; padding: 14px; }
.passport-ai-search { display: flex; align-items: center; gap: 9px; min-height: 44px; border: 1px solid rgba(91,112,139,.16); border-radius: 8px; padding: 0 12px; color: #5c6d83; background: rgba(255,255,255,.9); }
.passport-ai-search input { width: 100%; border: 0; outline: 0; color: #071526; background: transparent; font-weight: 820; }
.passport-ai-categories, .passport-ai-suggestions { display: grid; gap: 7px; }
.passport-ai-categories button, .passport-ai-suggestions button { min-height: 36px; border: 1px solid rgba(91,112,139,.14); border-radius: 8px; padding: 8px 10px; color: #40536b; background: rgba(255,255,255,.82); cursor: pointer; text-align: left; font-size: .82rem; font-weight: 850; transition: transform 180ms ease, border-color 180ms ease, background 180ms ease; }
.passport-ai-categories button:hover, .passport-ai-suggestions button:hover { transform: translateY(-2px); border-color: rgba(47,128,237,.28); background: rgba(244,247,255,.94); }
.passport-ai-categories button.active { color: #07506a; border-color: rgba(20,184,166,.36); background: rgba(222,252,244,.84); }
.passport-ai-suggestions strong { color: #071526; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.passport-ai-chat { display: grid; grid-template-rows: auto minmax(560px, 1fr) auto; overflow: hidden; min-height: 760px; }
.passport-ai-chat header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgba(91,112,139,.12); padding: 16px 18px; }
.passport-ai-chat h3 { margin: 0; color: #071526; font-size: 1.35rem; }
.passport-ai-log { display: grid; align-content: start; gap: 14px; overflow-y: auto; padding: 18px; }
.passport-ai-message { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; }
.passport-ai-message.user { grid-template-columns: minmax(0, 1fr) 36px; }
.passport-ai-message.user .passport-ai-avatar { grid-column: 2; }
.passport-ai-message.user .passport-ai-bubble { grid-column: 1; grid-row: 1; justify-self: end; max-width: 740px; color: #fff; background: #071526; }
.passport-ai-avatar { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 8px; color: #2f80ed; background: rgba(47,128,237,.12); font-weight: 950; }
.passport-ai-bubble { max-width: 860px; border: 1px solid rgba(91,112,139,.12); border-radius: 8px; padding: 14px; background: rgba(247,250,255,.94); }
.passport-ai-bubble p { margin-bottom: 0; line-height: 1.55; font-weight: 760; }
.passport-ai-bubble ol { display: grid; gap: 8px; margin: 0 0 12px 18px; padding: 0; color: #071526; font-weight: 780; line-height: 1.55; }
.passport-ai-question { margin-bottom: 10px !important; color: #2f80ed; font-weight: 950 !important; }
.passport-ai-warning { display: grid; gap: 6px; border: 1px solid rgba(245,158,11,.24); border-radius: 8px; margin: 12px 0; padding: 10px; color: #7a4c08; background: rgba(255,247,225,.86); font-size: .82rem; font-weight: 820; }
.passport-ai-warning strong { color: #6d4204; }
.passport-ai-source-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto auto; gap: 7px; align-items: center; border-top: 1px solid rgba(91,112,139,.12); padding-top: 10px; }
.passport-ai-source-meta.warning { grid-template-columns: minmax(0, 1fr) auto; color: #8a2336; }
.passport-ai-source-meta span { display: grid; gap: 2px; color: #5c6d83; font-size: .68rem; font-weight: 850; }
.passport-ai-source-meta strong { color: #071526; font-size: .76rem; }
.warning-action { color: #7a4c08 !important; border-color: rgba(245,158,11,.28) !important; background: rgba(255,247,225,.88) !important; }
.passport-ai-admin-actions { margin-top: 10px; }
.passport-ai-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; border-top: 1px solid rgba(91,112,139,.12); padding: 14px 18px; background: rgba(255,255,255,.94); }
.passport-ai-form input { min-height: 48px; border: 1px solid rgba(91,112,139,.18); border-radius: 8px; padding: 0 14px; color: #071526; background: #fff; font-weight: 840; }
.passport-ai-admin { position: sticky; top: 86px; display: grid; gap: 14px; max-height: calc(100vh - 108px); overflow: auto; padding: 14px; }
.passport-ai-admin header h3 { margin: 0; color: #071526; }
.passport-ai-admin-grid { display: grid; gap: 9px; border: 1px solid rgba(91,112,139,.12); border-radius: 8px; padding: 12px; background: rgba(247,250,255,.72); }
.passport-ai-admin-grid label { display: grid; gap: 5px; color: #5c6d83; font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.passport-ai-admin-grid input, .passport-ai-admin-grid select, .passport-ai-admin-grid textarea { min-height: 40px; border: 1px solid rgba(91,112,139,.16); border-radius: 8px; padding: 9px 10px; color: #071526; background: #fff; font-weight: 800; text-transform: none; }
.passport-ai-admin-grid textarea { min-height: 94px; resize: vertical; }
.passport-ai-admin section { display: grid; gap: 8px; }
.passport-ai-admin h4 { margin: 0; color: #071526; font-size: .95rem; }
.passport-ai-admin article { display: grid; gap: 5px; border: 1px solid rgba(91,112,139,.12); border-radius: 8px; padding: 10px; background: rgba(255,255,255,.72); }
.passport-ai-admin article strong { color: #071526; font-size: .84rem; }
.passport-ai-admin article span, .passport-ai-admin p { color: #5c6d83; font-size: .76rem; font-weight: 800; }
.passport-ai-source-drawer { width: min(720px, 94vw); }

@media (max-width: 1240px) {
  .passport-ai-shell { grid-template-columns: 1fr; }
  .passport-ai-side, .passport-ai-admin { position: relative; top: 0; max-height: none; }
  .passport-ai-categories { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .passport-ai-suggestions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .passport-ai-hero,
  .passport-ai-hero-metrics,
  .passport-ai-categories,
  .passport-ai-suggestions,
  .passport-ai-source-meta,
  .passport-ai-form { grid-template-columns: 1fr; }
  .passport-ai-chat { min-height: 620px; }
  .passport-ai-message,
  .passport-ai-message.user { grid-template-columns: 1fr; }
  .passport-ai-message.user .passport-ai-avatar,
  .passport-ai-message.user .passport-ai-bubble { grid-column: auto; grid-row: auto; }
  .passport-ai-avatar { display: none; }
  .passport-ai-bubble,
  .passport-ai-message.user .passport-ai-bubble { max-width: 100%; justify-self: stretch; }
}

@media (max-width: 1180px) {
  .kensington-story-grid,
  .kensington-article-grid,
  .kensington-source-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kensington-learning-layout,
  .kensington-sop-hero,
  .kensington-flow-step { grid-template-columns: 1fr; }
  .kensington-ai-dock { position: relative; top: 0; max-height: none; }
  .kensington-source-meta,
  .kensington-accordion-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .kensington-hero,
  .kensington-import-banner,
  .kensington-search-band,
  .kensington-section-head,
  .kensington-story-grid,
  .kensington-article-grid,
  .kensington-source-grid,
  .kensington-article-meta,
  .kensington-article-two-col,
  .kensington-source-meta,
  .kensington-chat-input,
  .kensington-accordion-grid,
  .kensington-quiz-grid,
  .kensington-progress-band { grid-template-columns: 1fr; }
  .kensington-hero { min-height: 0; }
  .kensington-hero-metrics { grid-template-columns: 1fr; }
  .kensington-sop-hero { min-height: 0; }
  .kensington-message,
  .kensington-message.user { grid-template-columns: 1fr; }
  .kensington-message.user .kensington-message-avatar,
  .kensington-message.user .kensington-message-body { grid-column: auto; grid-row: auto; }
  .kensington-message-avatar { display: none; }
  .kensington-message-body,
  .kensington-message.user .kensington-message-body { max-width: 100%; justify-self: stretch; }
}

.passport-record-drawer {
  width: min(620px, 94vw);
}

.client-knowledge-cards article {
  cursor: pointer;
}

.client-library-hero,
.client-workspace-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: end;
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 8px;
  padding: clamp(22px, 3vw, 36px);
  color: #fff;
  background: linear-gradient(135deg, rgba(7,21,38,.96), rgba(31,95,184,.76)), url("https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1600&q=78") center/cover;
  box-shadow: 0 24px 70px rgba(7,21,38,.13);
}
.client-library-hero h2,
.client-workspace-hero h2 { margin: 0 0 10px; color: #fff; font-size: clamp(34px, 5vw, 64px); line-height: 1; }
.client-library-hero span,
.client-workspace-hero span,
.client-library-hero .eyebrow,
.client-workspace-hero .eyebrow { color: rgba(255,255,255,.82); }
.client-library-hero aside { display: grid; gap: 4px; min-width: 170px; border: 1px solid rgba(255,255,255,.24); border-radius: 8px; padding: 16px; background: rgba(255,255,255,.14); backdrop-filter: blur(14px); }
.client-library-hero aside strong { color: #fff; font-size: 2.2rem; line-height: 1; }

.client-workspace-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.client-workspace-card {
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 16px;
  min-height: 280px;
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 8px;
  padding: 22px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 20px 54px rgba(7,21,38,.09);
  cursor: pointer;
  transition: transform 260ms ease, border-color 260ms ease, box-shadow 260ms ease;
}
.client-workspace-card:hover {
  transform: perspective(900px) rotateX(2deg) rotateY(-3deg) translateY(-5px);
  border-color: color-mix(in srgb, var(--client-accent, #2f80ed), white 50%);
  box-shadow: 0 28px 72px color-mix(in srgb, var(--client-accent, #2f80ed), transparent 82%);
}
.client-workspace-card:after {
  content: "";
  position: absolute;
  right: -52px;
  bottom: -52px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: var(--client-accent, #2f80ed);
  opacity: .16;
}
.client-workspace-icon {
  display: grid;
  position: relative;
  z-index: 1;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 8px;
  color: #fff;
  background: var(--client-accent, #2f80ed);
  box-shadow: 0 16px 34px color-mix(in srgb, var(--client-accent, #2f80ed), transparent 70%);
}
.client-workspace-card strong { position: relative; z-index: 1; display: block; color: #071526; font-size: 1.35rem; }
.client-workspace-card small { position: relative; z-index: 1; display: block; margin-top: 8px; color: #4d5f77; line-height: 1.55; font-weight: 780; }
.client-workspace-card footer { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 7px; align-self: end; }
.client-workspace-card em {
  border-radius: 999px;
  padding: 6px 9px;
  color: #245fc7;
  background: rgba(244,247,255,.92);
  font-size: .72rem;
  font-style: normal;
  font-weight: 900;
}

.client-kb-workspace {
  display: grid;
  gap: 16px;
}

.client-kb-header {
  align-items: flex-start !important;
}

.client-kb-header .passport-quick-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.client-kb-strip {
  display: grid;
}

.client-kb-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 14px;
  padding: 6px;
  background: rgba(255,255,255,.7);
}

.client-kb-tabs button {
  flex: 0 0 auto;
  min-height: 32px;
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 0 10px;
  color: #4a5f78;
  background: transparent;
  cursor: pointer;
  font-size: .72rem;
  font-weight: 860;
}

.client-kb-tabs button.active,
.client-kb-tabs button:hover {
  border-color: rgba(13,43,82,.14);
  color: #0d2b52;
  background: rgba(232,240,250,.92);
}

.client-kb-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.client-learning-section { display: grid; gap: 16px; }
.client-section-head {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1fr);
  gap: 18px;
  align-items: end;
}
.client-section-head h3 { margin: 0; color: #071526; font-size: clamp(28px, 4vw, 46px); line-height: 1.04; }
.client-section-head p { color: #4d5f77; line-height: 1.65; font-weight: 760; }
.client-learning-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.client-learning-card {
  position: relative;
  overflow: hidden;
  display: grid;
  align-content: start;
  gap: 12px;
  min-height: 248px;
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 8px;
  padding: 18px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 18px 48px rgba(7,21,38,.08);
  transition: transform 240ms ease, box-shadow 240ms ease, border-color 240ms ease;
}
.client-learning-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--client-card-accent, #2f80ed), white 50%);
  box-shadow: 0 24px 64px color-mix(in srgb, var(--client-card-accent, #2f80ed), transparent 84%);
}
.client-learning-card:after {
  content: "";
  position: absolute;
  right: -44px;
  top: -44px;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: var(--client-card-accent, #2f80ed);
  opacity: .14;
}
.client-learning-card > span {
  display: grid;
  position: relative;
  z-index: 1;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 8px;
  color: #fff;
  background: var(--client-card-accent, #2f80ed);
}
.client-learning-card strong { position: relative; z-index: 1; display: block; color: #071526; font-size: 1.06rem; }
.client-learning-card p { position: relative; z-index: 1; margin: 7px 0 0; color: #4d5f77; line-height: 1.55; font-weight: 760; }
.client-learning-card footer { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 6px; }
.client-learning-card em {
  border-radius: 999px;
  padding: 5px 8px;
  color: #07506a;
  background: rgba(222,252,244,.82);
  font-size: .68rem;
  font-style: normal;
  font-weight: 900;
}
.client-learning-card .compact-action,
.client-learning-card .secondary-action,
.client-learning-card .primary-action { position: relative; z-index: 1; width: fit-content; }
.client-card-details {
  position: relative;
  z-index: 1;
  border: 1px solid rgba(91,112,139,.12);
  border-radius: 8px;
  padding: 10px;
  background: rgba(247,250,255,.78);
}
.client-card-details summary { cursor: pointer; color: #071526; font-weight: 900; }
.client-card-details div { display: grid; gap: 8px; margin-top: 10px; }
.client-card-details p { margin: 0; font-size: .78rem; }

.sop-preview {
  max-height: 62vh;
  overflow: auto;
  margin: 0;
  border: 1px solid rgba(126,149,178,.13);
  border-radius: 14px;
  padding: 16px;
  color: #142236;
  background: rgba(255,255,255,.82);
  font-family: ui-serif, Georgia, serif;
  font-size: .9rem;
  line-height: 1.65;
  white-space: pre-wrap;
}

.sop-share-card {
  max-width: 920px;
  margin: 0 auto;
}

@media (max-width: 980px) {
  .client-library-hero,
  .client-workspace-hero,
  .client-section-head {
    grid-template-columns: 1fr;
  }

  .client-workspace-card-grid,
  .client-learning-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .client-kb-grid {
    grid-template-columns: 1fr;
  }

  .client-kb-header {
    display: grid !important;
  }

  .client-kb-header .passport-quick-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  .client-library-hero,
  .client-workspace-hero {
    padding: 22px;
  }

  .client-library-hero h2,
  .client-workspace-hero h2,
  .client-section-head h3 {
    font-size: 30px;
  }

  .client-library-hero aside {
    min-width: 0;
  }

  .client-workspace-card-grid,
  .client-learning-grid {
    grid-template-columns: 1fr;
  }
}

.passport-drawer-tabs {
  display: grid;
  gap: 12px;
}

.passport-drawer-tabs section {
  border: 1px solid rgba(126,149,178,.12);
  border-radius: 14px;
  padding: 12px;
  background: rgba(255,255,255,.68);
}

.passport-notes {
  margin: 0;
  color: #50677f;
  line-height: 1.55;
}

.hr-settings-panel {
  padding: 18px 22px 22px;
}

.hr-signatory-tools {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
  margin: 8px 0 14px;
}

.hr-signatory-tools label {
  display: grid;
  gap: 6px;
  width: min(420px, 100%);
  color: #667a93;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.hr-signatory-tools select {
  min-height: 42px;
  border: 1px solid rgba(105,130,160,.22);
  border-radius: 12px;
  padding: 0 12px;
  background: rgba(255,255,255,.82);
  color: #10213a;
  font-weight: 800;
}

.hr-signatory-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.secondary-action.danger {
  border-color: rgba(180,54,72,.25);
  color: #9f2638;
}

.hr-signatory-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.hr-signatory-card {
  min-height: 74px;
  border: 1px solid rgba(105,130,160,.16);
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(255,255,255,.6);
  color: #10213a;
  text-align: left;
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.hr-signatory-card:hover,
.hr-signatory-card.active {
  transform: translateY(-1px);
  border-color: rgba(21,117,157,.42);
  box-shadow: 0 12px 28px rgba(24,52,84,.10);
}

.hr-signatory-card strong,
.hr-signatory-card span,
.hr-signatory-card em {
  display: block;
}

.hr-signatory-card strong {
  font-size: 14px;
}

.hr-signatory-card span {
  margin-top: 4px;
  color: #637895;
  font-size: 12px;
  font-weight: 800;
}

.hr-signatory-card em {
  width: fit-content;
  margin-top: 8px;
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(13,43,82,.08);
  color: #0d2b52;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.hr-signatory-preview {
  margin-top: 16px;
  border: 1px solid rgba(126,149,178,.14);
  border-radius: 16px;
  padding: 18px;
  background: rgba(255,255,255,.72);
}

.hr-signatory-preview div {
  position: relative;
  display: grid;
  gap: 6px;
  width: 260px;
  color: #17243a;
}

.hr-signatory-preview img {
  max-width: 150px;
  max-height: 48px;
  object-fit: contain;
}

.hr-signatory-preview img.seal {
  position: absolute;
  left: 164px;
  top: 24px;
  max-width: 54px;
  max-height: 54px;
}

.hr-signatory-preview span {
  width: 150px;
  height: 34px;
  border-bottom: 1px solid rgba(15,35,61,.38);
}

.hr-signatory-preview b {
  color: #071a33;
}

.hr-signatory-preview em {
  color: #60748b;
  font-style: normal;
  font-weight: 800;
}

.hr-settings-panel {
  width: min(1180px, 100%);
  margin-inline: auto;
  padding: 22px 26px 0;
}

.hr-settings-card {
  overflow: hidden;
}

.hr-settings-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(13,43,82,.10);
}

.hr-settings-section-head h2 {
  margin: 0 0 6px;
  color: #0d2b52;
  font-size: 1.18rem;
  line-height: 1.18;
  letter-spacing: 0;
}

.hr-settings-section-head span {
  display: block;
  max-width: 620px;
  color: #60748b;
  font-size: .92rem;
  font-weight: 720;
  line-height: 1.45;
}

.hr-signatory-tools {
  margin: 0 0 14px;
}

.hr-signatory-tools select {
  min-height: 44px;
  border-color: rgba(13,43,82,.16);
  background: rgba(255,255,255,.78);
}

.hr-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 18px;
  margin-top: 12px;
}

.hr-settings-grid label {
  gap: 7px;
  margin: 0;
}

.hr-settings-grid label span {
  color: #6b7d93;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .055em;
  line-height: 1.1;
  text-transform: uppercase;
}

.hr-settings-grid input,
.hr-settings-grid select,
.hr-settings-grid textarea {
  min-height: 46px;
  border: 1px solid rgba(13,43,82,.16);
  border-radius: 14px;
  padding: 0 14px;
  color: #12243b;
  background: rgba(255,255,255,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
  font-weight: 820;
}

.hr-settings-grid input[type="file"] {
  display: flex;
  align-items: center;
  padding: 10px 14px;
}

.hr-document-preview-card {
  margin-top: 22px;
  border-color: rgba(13,43,82,.12);
  border-radius: 18px;
  padding: 22px 24px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.88), rgba(247,249,252,.72)),
    radial-gradient(circle at 92% 18%, rgba(110,143,183,.12), transparent 30%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.78);
}

.hr-document-preview-card div {
  gap: 7px;
  width: min(360px, 100%);
}

.hr-document-preview-card span {
  width: 210px;
  height: 38px;
  border-bottom-color: rgba(13,43,82,.42);
}

.hr-settings-footer {
  bottom: 0;
  align-items: center;
  justify-content: space-between;
  margin-top: 22px;
}

.hr-settings-footer > span {
  color: #60748b;
  font-size: .86rem;
  font-weight: 760;
}

.hr-settings-footer > div {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

@media (max-width: 860px) {
  .hr-settings-panel {
    padding: 18px 16px 0;
  }

  .hr-settings-section-head,
  .hr-signatory-tools,
  .hr-settings-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .hr-settings-grid {
    grid-template-columns: 1fr;
  }

  .hr-signatory-actions,
  .hr-settings-footer > div {
    justify-content: flex-start;
  }
}

:root[data-theme="dark"] .passport-vault,
:root[data-theme="dark"] .passport-vault-card,
:root[data-theme="dark"] .passport-vault-panel,
:root[data-theme="dark"] .passport-drawer-tabs section {
  background: rgba(14, 28, 45, .82);
}

@media (max-width: 1100px) {
  .passport-dashboard-grid {
    grid-template-columns: 1fr;
  }
  .passport-vault .passport-summary-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .passport-vault-toolbar,
  .passport-vault .passport-panel-title {
    align-items: stretch;
    flex-direction: column;
  }
  .passport-vault .passport-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* HR documents must remain print-white regardless of OS theme or cached dark portal styles. */
.offer-document,
:root[data-theme="dark"] .offer-document {
  color: #17243a !important;
  background: transparent !important;
}

.offer-page,
:root[data-theme="dark"] .offer-page,
.print-offer-body .offer-page {
  color: #17243a !important;
  background: #fff !important;
  border-color: rgba(122, 142, 166, .18) !important;
}

.offer-document h2,
.offer-document h3,
.offer-document address,
.offer-document p,
.offer-document td,
.offer-document-title,
.offer-document-title span,
.offer-signatory-block,
.offer-signatory-block strong,
.offer-signatory-block b,
:root[data-theme="dark"] .offer-document h2,
:root[data-theme="dark"] .offer-document h3,
:root[data-theme="dark"] .offer-document address,
:root[data-theme="dark"] .offer-document p,
:root[data-theme="dark"] .offer-document td,
:root[data-theme="dark"] .offer-document-title,
:root[data-theme="dark"] .offer-document-title span,
:root[data-theme="dark"] .offer-signatory-block,
:root[data-theme="dark"] .offer-signatory-block strong,
:root[data-theme="dark"] .offer-signatory-block b {
  color: #17243a !important;
}

.offer-document th,
.salary-annexure-table thead th,
:root[data-theme="dark"] .offer-document th,
:root[data-theme="dark"] .salary-annexure-table thead th {
  color: #1e293b !important;
  background: #eef4fb !important;
  border-color: rgba(94, 113, 133, .42) !important;
  font-weight: 900 !important;
}

.offer-letterhead-bg {
  display: none !important;
}

.offer-watermark,
:root[data-theme="dark"] .offer-watermark {
  color: rgba(15, 35, 61, .03) !important;
}

/* Global drawer layer: every HR/Ops/Passport/Admin drawer opens above app chrome. */
body:has(.drawer-backdrop) {
  overflow: hidden;
}

.clean-sidebar,
.passport-sidebar,
.primary-sidebar,
.secondary-sidebar,
.ops-sidebar {
  z-index: var(--z-sidebar) !important;
}

.ops-topbar,
.passport-module-header {
  z-index: var(--z-app-header) !important;
}

.sheet-view-controls,
.assignment-filter-panel,
.assignment-table th,
.sheet-actions-head,
.clean-assignment-sheet .assignment-table th {
  z-index: var(--z-sticky) !important;
}

.drawer-backdrop,
.drawer-backdrop.bulk-backdrop,
.passport-drawer-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: var(--z-overlay) !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: stretch !important;
  background: rgba(7,21,38,.28) !important;
  backdrop-filter: blur(8px) !important;
}

.task-drawer,
.bulk-drawer,
.passport-record-drawer,
.access-drawer,
.hr-letter-drawer {
  position: relative !important;
  z-index: var(--z-drawer) !important;
  display: flex !important;
  width: min(65vw, 980px) !important;
  max-width: calc(100vw - 18px) !important;
  height: 100vh !important;
  max-height: 100vh !important;
  flex-direction: column !important;
  overflow: auto !important;
  border-radius: 22px 0 0 22px !important;
  padding-top: 0 !important;
  overscroll-behavior: contain;
}

.drawer-header,
.bulk-drawer .bulk-drawer-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 3 !important;
  border-bottom: 1px solid rgba(126,149,178,.14) !important;
  margin: 0 -24px 18px !important;
  padding: 22px 24px 16px !important;
  background: rgba(247,251,255,.97) !important;
  backdrop-filter: blur(18px) !important;
}

.modal-footer,
.bulk-footer {
  z-index: 3 !important;
  background: rgba(247,251,255,.97) !important;
}

.toast-viewport,
.toast-viewport .ops-toast,
.ops-toast {
  z-index: var(--z-toast) !important;
}

.data-mode-banner,
.data-mode-chip {
  position: sticky;
  top: 10px;
  z-index: calc(var(--z-app-header) + 2);
  display: flex;
  align-items: center;
  gap: 10px;
  width: min(980px, calc(100vw - 36px));
  margin: 10px auto 0;
  padding: 9px 12px;
  border: 1px solid rgba(13,43,82,.12);
  color: #0d2b52;
  font-size: 12px;
  line-height: 1.35;
}

.data-mode-banner strong,
.data-mode-chip {
  font-weight: 800;
}

.data-mode-banner span,
.data-mode-chip span {
  color: #60748b;
  font-weight: 700;
}

.data-mode-banner button {
  margin-left: auto;
  color: #0d2b52;
  font-weight: 800;
}

.data-mode-chip {
  width: max-content;
  margin: 8px 14px 0 auto;
  border-radius: 999px;
  background: rgba(236,252,243,.86);
  color: #1f6b44;
}

.data-mode-chip.failed {
  background: rgba(255, 241, 242, .92);
  border-color: rgba(185, 28, 28, .2);
  color: #991b1b;
}

.data-mode-chip.live {
  border-color: rgba(31, 107, 68, .18);
}

.live-status-mini {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  border: 1px solid rgba(89,112,138,.14);
  border-radius: 999px;
  padding: 0 10px;
  color: #2f6f4f;
  background: rgba(255,255,255,.72);
  font-size: .72rem;
  font-weight: 900;
  white-space: nowrap;
}

.live-status-mini i {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #29a36a;
  box-shadow: 0 0 0 4px rgba(41,163,106,.12);
}

.live-status-mini em {
  color: #647890;
  font-style: normal;
  font-weight: 850;
}

.live-status-mini.failed {
  color: #9b2932;
}

.live-status-mini.failed i {
  background: #d84b54;
  box-shadow: 0 0 0 4px rgba(216,75,84,.12);
}

.setzling-loader {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  gap: 10px;
  width: min(360px, calc(100vw - 36px));
  margin: auto;
  padding: 34px;
  text-align: center;
}

.setzling-loader img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  border-radius: 16px;
  background: #fff;
}

.setzling-loader strong {
  color: #071526;
  font-size: 1.2rem;
}

.setzling-loader span {
  color: #60748b;
  font-weight: 800;
}

.loader-line {
  position: relative;
  width: 170px;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(90,118,148,.12);
}

.loader-line i {
  position: absolute;
  inset: 0 auto 0 0;
  width: 42%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0d2b52, #0c9abf);
  animation: loaderSlide 1s ease-in-out infinite;
}

@keyframes loaderSlide {
  0% { transform: translateX(-110%); }
  100% { transform: translateX(260%); }
}

.hr-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
  padding: 14px;
}

.ops-command-center {
  display: grid;
  gap: 16px;
}

.command-center-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: end;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 8px;
  padding: clamp(22px, 3vw, 34px);
  color: #fff;
  background:
    linear-gradient(135deg, rgba(7,21,38,.96), rgba(13,78,115,.82)),
    url("https://images.unsplash.com/photo-1551288049-bebda4e38f71?auto=format&fit=crop&w=1600&q=78") center/cover;
  box-shadow: 0 24px 70px rgba(7,21,38,.13);
}

.command-center-hero h2 {
  margin: 0 0 8px;
  color: #fff;
  font-size: clamp(34px, 5vw, 64px);
  line-height: 1;
}

.command-center-hero span,
.command-center-hero .eyebrow {
  color: rgba(255,255,255,.82);
}

.command-kpi-strip,
.command-center-grid {
  display: grid;
  gap: 12px;
}

.command-kpi-strip {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.command-kpi-strip article,
.command-panel,
.command-task-card {
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 8px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 18px 48px rgba(7,21,38,.08);
}

.command-kpi-strip article {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 104px;
  padding: 17px;
}

.command-kpi-strip article:after {
  content: "";
  position: absolute;
  inset: auto -36px -42px auto;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: var(--command-accent, #2f80ed);
  opacity: .14;
}

.command-kpi-strip article > span {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 8px;
  color: #fff;
  background: var(--command-accent, #2f80ed);
}

.command-kpi-strip small,
.command-panel span,
.command-task-card em,
.command-task-card small {
  color: #60748b;
  font-size: .72rem;
  font-weight: 900;
}

.command-kpi-strip strong {
  display: block;
  margin-top: 4px;
  color: #071526;
  font-size: 2.05rem;
  line-height: 1;
}

.command-center-grid {
  grid-template-columns: minmax(320px, 1.25fr) minmax(240px, .8fr) minmax(280px, .95fr) minmax(240px, .8fr);
  align-items: stretch;
}

.command-workload-stack,
.command-panel {
  display: grid;
  gap: 10px;
}

.command-panel {
  align-content: start;
  padding: 16px;
}

.command-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.command-panel header strong {
  color: #071526;
}

.workload-bars article,
.smart-alerts-panel article,
.activity-feed-panel article,
.productivity-panel article {
  display: grid;
  gap: 7px;
  border: 1px solid rgba(89,112,138,.12);
  border-radius: 8px;
  padding: 10px;
  background: rgba(247,250,255,.78);
}

.smart-alerts-panel article,
.activity-feed-panel article {
  cursor: pointer;
}

.workload-bars article strong,
.smart-alerts-panel article strong,
.activity-feed-panel article strong,
.productivity-panel article strong {
  color: #071526;
}

.workload-bars article > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.workload-meter {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(96,116,139,.14);
}

.workload-meter i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2f80ed, #14b8a6);
}

.command-filter-bar {
  border: 1px solid rgba(126,149,178,.12);
  border-radius: 8px;
  background: rgba(255,255,255,.76);
}

.view-mode-toggle {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.view-mode-toggle button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  border: 1px solid rgba(89,112,138,.18);
  border-radius: 999px;
  padding: 0 12px;
  color: #40566e;
  background: rgba(255,255,255,.82);
  cursor: pointer;
  font-weight: 850;
}

.view-mode-toggle button.active {
  color: #07506a;
  border-color: rgba(12,154,191,.28);
  background: #e6f8fc;
}

.assignment-kanban-board {
  display: grid;
  grid-template-columns: repeat(5, minmax(240px, 1fr));
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.kanban-lane {
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: 360px;
  border: 1px solid rgba(126,149,178,.12);
  border-radius: 8px;
  padding: 12px;
  background: rgba(244,248,253,.72);
}

.kanban-lane header {
  display: flex;
  justify-content: space-between;
  color: #071526;
}

.assignment-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.command-task-card {
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 10px;
  min-height: 188px;
  padding: 15px;
  cursor: pointer;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.command-task-card:hover {
  transform: translateY(-3px);
  border-color: rgba(47,128,237,.28);
  box-shadow: 0 22px 56px rgba(47,128,237,.11);
}

.command-task-card header,
.command-task-card footer,
.command-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  justify-content: space-between;
}

.command-task-card strong {
  color: #071526;
  line-height: 1.25;
}

.command-task-card p {
  margin: 0;
  color: #4d5f77;
  font-weight: 760;
  line-height: 1.45;
}

.command-card-meta span {
  border-radius: 999px;
  padding: 5px 8px;
  background: rgba(232,240,250,.82);
  color: #40566e;
  font-size: .68rem;
  font-weight: 900;
}

.task-context-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.task-context-grid article {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(126,149,178,.14);
  border-radius: 8px;
  padding: 13px;
  background: rgba(255,255,255,.68);
}

.task-context-grid strong {
  color: #071526;
}

.task-context-grid span {
  color: #60748b;
  font-weight: 760;
  line-height: 1.45;
}

@media (max-width: 1280px) {
  .command-kpi-strip,
  .command-center-grid,
  .assignment-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .command-workload-stack {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .command-center-hero,
  .command-kpi-strip,
  .command-center-grid,
  .command-workload-stack,
  .assignment-card-grid,
  .task-context-grid {
    grid-template-columns: 1fr;
  }

  .command-center-hero h2 {
    font-size: 32px;
  }

  .assignment-kanban-board {
    grid-template-columns: repeat(5, minmax(260px, 82vw));
  }
}

.command-list button small {
  margin-left: auto;
  color: #6d8198;
  font-size: .68rem;
  font-weight: 850;
}

.access-api-debug {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  width: fit-content;
  margin: 0 0 12px;
  padding: 8px 12px;
  border: 1px solid rgba(104, 132, 164, .2);
  border-radius: 999px;
  background: rgba(255, 255, 255, .7);
  color: #50667f;
  font-size: .78rem;
  font-weight: 850;
}

.performance-module {
  display: grid;
  gap: 12px;
}

.performance-widgets {
  margin: 0;
}

.performance-grid,
.performance-ledger-panel {
  display: grid;
  gap: 14px;
}

.performance-module .passport-table-shell,
.performance-ledger-panel .passport-table-shell {
  max-height: none;
}

.fnf-performance-settlement {
  margin-top: 18px;
  break-inside: avoid;
}

.fnf-performance-settlement h3,
.performance-annexure h2,
.performance-annexure h3 {
  color: #0d2b52;
}

.annexure-note {
  color: #445973;
  font-weight: 700;
  line-height: 1.55;
}

@media (max-width: 900px) {
  .task-drawer,
  .bulk-drawer,
  .passport-record-drawer,
  .access-drawer,
  .hr-letter-drawer {
    width: 100vw !important;
    max-width: 100vw !important;
    border-radius: 0 !important;
  }
}


.api-status-panel {
  display: grid;
  gap: 14px;
}

.settings-card-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.api-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.api-status-chip {
  display: grid;
  gap: 5px;
  border: 1px solid rgba(89,112,138,.14);
  border-radius: 8px;
  padding: 12px;
  background: rgba(247,250,255,.78);
}

.api-status-chip strong { color: #071526; }
.api-status-chip em { width: fit-content; border-radius: 999px; padding: 4px 8px; color: #6b4b13; background: rgba(255,243,216,.84); font-size: .68rem; font-style: normal; font-weight: 900; }
.api-status-chip.ok em { color: #0f6b4f; background: rgba(222,248,237,.9); }
.api-status-chip.failed em { color: #9b2932; background: rgba(255,231,231,.9); }
.api-status-chip small, .api-status-last { color: #60748b; font-weight: 760; line-height: 1.45; }

@media (max-width: 900px) {
  .settings-card-head,
  .api-status-grid { grid-template-columns: 1fr; }
  .settings-card-head { display: grid; }
}


.passport-intel-dashboard {
  display: grid;
  gap: 18px;
}

.passport-intel-hero {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 22px;
  align-items: end;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 8px;
  padding: clamp(24px, 3.2vw, 40px);
  color: #fff;
  background: linear-gradient(135deg, rgba(7,21,38,.96), rgba(25,86,145,.78)), url("https://images.unsplash.com/photo-1558494949-ef010cbdcc31?auto=format&fit=crop&w=1600&q=78") center/cover;
  box-shadow: 0 26px 74px rgba(7,21,38,.14);
}

.passport-intel-hero h2 {
  margin: 0 0 10px;
  color: #fff;
  font-size: clamp(38px, 5vw, 70px);
  line-height: .96;
}

.passport-intel-hero span,
.passport-intel-hero .eyebrow { color: rgba(255,255,255,.82); }

.passport-intel-search {
  display: flex;
  align-items: center;
  gap: 10px;
  width: min(760px, 100%);
  min-height: 54px;
  margin-top: 22px;
  border: 1px solid rgba(255,255,255,.26);
  border-radius: 8px;
  padding: 0 16px;
  color: #fff;
  background: rgba(255,255,255,.14);
  backdrop-filter: blur(16px);
}

.passport-intel-search input {
  width: 100%;
  border: 0;
  outline: 0;
  color: #fff;
  background: transparent;
  font-weight: 800;
}

.passport-intel-search input::placeholder { color: rgba(255,255,255,.7); }

.passport-intel-hero aside {
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 1fr));
  gap: 10px;
  min-width: 280px;
}

.passport-intel-hero aside strong,
.passport-intel-hero aside span {
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.13);
  backdrop-filter: blur(14px);
}

.passport-intel-hero aside strong {
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  padding: 14px 14px 0;
  color: #fff;
  font-size: 2rem;
}

.passport-intel-hero aside span {
  border-top: 0;
  border-radius: 0 0 8px 8px;
  padding: 0 14px 14px;
  font-size: .74rem;
  font-weight: 900;
}

.passport-intel-section,
.passport-intel-panel {
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 8px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 18px 48px rgba(7,21,38,.08);
}

.passport-intel-section {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.passport-intel-heading,
.passport-intel-panel header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.passport-intel-heading h3 {
  margin: 0;
  color: #071526;
  font-size: 1.55rem;
}

.passport-client-intel-grid,
.passport-intel-grid {
  display: grid;
  gap: 14px;
}

.passport-client-intel-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.passport-client-intel-grid article {
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 12px;
  min-height: 210px;
  border: 1px solid rgba(126,149,178,.12);
  border-radius: 8px;
  padding: 18px;
  background: rgba(247,250,255,.78);
  cursor: pointer;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.passport-client-intel-grid article:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--client-accent, #2f80ed), white 45%);
  box-shadow: 0 24px 64px color-mix(in srgb, var(--client-accent, #2f80ed), transparent 84%);
}

.passport-client-intel-grid article > span {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 8px;
  color: #fff;
  background: var(--client-accent, #2f80ed);
}

.passport-client-intel-grid strong,
.passport-intel-panel strong { color: #071526; }
.passport-client-intel-grid p,
.passport-intel-panel p { color: #4d5f77; font-weight: 760; line-height: 1.55; }
.passport-client-intel-grid footer { display: flex; flex-wrap: wrap; gap: 7px; align-self: end; }
.passport-client-intel-grid em,
.most-viewed-panel em { border-radius: 999px; padding: 5px 8px; color: #07506a; background: rgba(222,252,244,.82); font-size: .68rem; font-style: normal; font-weight: 900; }

.passport-intel-grid {
  grid-template-columns: minmax(320px, 1.25fr) minmax(260px, .85fr) minmax(260px, .9fr);
  align-items: start;
}

.passport-intel-panel {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 16px;
}

.knowledge-feed-panel { grid-row: span 2; }

.knowledge-feed-panel button,
.most-viewed-panel button,
.passport-ai-mini-prompts button {
  display: grid;
  gap: 5px;
  border: 1px solid rgba(89,112,138,.12);
  border-radius: 8px;
  padding: 11px;
  background: rgba(247,250,255,.78);
  cursor: pointer;
  text-align: left;
}

.knowledge-feed-panel span,
.knowledge-feed-panel small,
.most-viewed-panel span,
.passport-intel-panel header p,
.graph-summary-panel em {
  color: #60748b;
  font-size: .72rem;
  font-weight: 850;
}

.knowledge-health-panel div {
  display: grid;
  gap: 4px;
  border: 1px solid rgba(89,112,138,.12);
  border-radius: 8px;
  padding: 11px;
  background: rgba(247,250,255,.78);
}

.knowledge-health-panel div strong {
  font-size: 1.65rem;
  line-height: 1;
}

.trending-panel div,
.passport-ai-mini-prompts,
.graph-summary-panel div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.trending-panel button {
  border: 1px solid rgba(47,128,237,.16);
  border-radius: 999px;
  padding: 8px 10px;
  color: #0b4b89;
  background: rgba(230,244,255,.82);
  cursor: pointer;
  font-weight: 900;
}

.graph-summary-panel span {
  display: grid;
  min-width: 94px;
  border: 1px solid rgba(89,112,138,.12);
  border-radius: 8px;
  padding: 11px;
  background: rgba(247,250,255,.78);
}

.graph-summary-panel span strong { font-size: 1.45rem; }

@media (max-width: 1180px) {
  .passport-intel-hero,
  .passport-client-intel-grid,
  .passport-intel-grid { grid-template-columns: 1fr; }
  .passport-intel-hero aside { min-width: 0; }
}


/* Premium Employee Hub HRMS upgrade */
.premium-hrms-hero {
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(7,21,38,.94), rgba(47,128,237,.54)),
    url("https://images.unsplash.com/photo-1556761175-b413da4baf72?auto=format&fit=crop&w=1600&q=78") center/cover;
}

.premium-health-strip .employee-hub-stat { border-radius: 8px; }
.premium-employee-surface { border-radius: 8px; }

.employee-quick-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.employee-quick-filter-row button {
  min-height: 38px;
  border: 1px solid rgba(59,93,138,.16);
  border-radius: 999px;
  padding: 0 14px;
  color: #40566e;
  background: rgba(255,255,255,.78);
  cursor: pointer;
  font-weight: 900;
}

.employee-quick-filter-row button.active {
  color: #fff;
  border-color: transparent;
  background: #0d2b52;
  box-shadow: 0 14px 34px rgba(13,43,82,.16);
}

.premium-employee-card {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  border-color: color-mix(in srgb, var(--role-accent), white 72%);
}

.premium-employee-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: var(--role-accent);
}

.employee-photo-avatar {
  border: 2px solid color-mix(in srgb, var(--role-accent), white 68%);
  color: #fff;
  background: var(--role-accent);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.employee-photo-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 180ms ease;
}

.employee-hub-person:hover .employee-photo-avatar,
.hr-profile-title:hover .employee-photo-avatar {
  transform: scale(1.08);
  box-shadow: 0 18px 40px color-mix(in srgb, var(--role-accent), transparent 74%);
}

.employee-photo-avatar.xl { width: 112px; height: 112px; min-width: 112px; font-size: 2.4rem; }
.employee-photo-avatar.id { width: 116px; height: 116px; min-width: 116px; border-radius: 22px; font-size: 2.4rem; }

.employee-role-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.employee-role-strip > span {
  border-radius: 999px;
  padding: 5px 10px;
  color: #fff;
  background: var(--role-accent);
  font-size: .7rem;
  font-weight: 950;
}

.employee-health-mini {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  min-height: 92px;
}

.employee-health-mini span {
  position: relative;
  overflow: hidden;
  display: grid;
  align-content: end;
  gap: 3px;
  border-radius: 8px;
  padding: 8px;
  background: rgba(239,245,251,.92);
}

.employee-health-mini b {
  position: absolute;
  inset: auto 0 0;
  background: color-mix(in srgb, var(--role-accent), white 52%);
  opacity: .38;
}

.employee-health-mini em,
.employee-health-mini strong {
  position: relative;
  z-index: 1;
}

.employee-health-mini em {
  color: #60748b;
  font-size: .58rem;
  font-style: normal;
  font-weight: 950;
  text-transform: uppercase;
}

.employee-health-mini strong {
  color: #071526;
  font-size: .78rem;
}

.employee-hover-actions {
  grid-template-columns: repeat(7, minmax(34px, 1fr));
}

.employee-hover-actions .tooltip-button {
  min-width: 0;
}

.new-joiners-band {
  display: grid;
  grid-template-columns: minmax(180px, .28fr) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(59,93,138,.14);
  border-radius: 8px;
  padding: 13px;
  background: rgba(247,250,255,.86);
}

.new-joiners-band strong { color: #071526; }
.new-joiners-band > div:last-child { display: flex; flex-wrap: wrap; gap: 8px; }
.new-joiners-band button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  border: 1px solid rgba(59,93,138,.13);
  border-radius: 8px;
  padding: 6px 10px;
  background: #fff;
  cursor: pointer;
  font-weight: 900;
}
.new-joiners-band button span { display: grid; color: #071526; }
.new-joiners-band button em { color: #60748b; font-size: .68rem; font-style: normal; }

/* Employee Hub scroll stabilization: one clean sticky header, filters below it, content below filters. */
.hr-page .ops-topbar {
  z-index: var(--z-app-header) !important;
  min-height: 72px;
  background: rgba(255,255,255,.9) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.hr-page .employee-hub-hero,
.hr-page .employee-hub-stats,
.hr-page .employee-hub-surface,
.hr-page .new-joiners-band,
.hr-page .employee-hub-grid,
.hr-page .hr-directory-wrap {
  position: relative;
  top: auto !important;
  margin-top: 0;
  transform: none !important;
}

.hr-page .employee-hub-hero {
  min-height: 176px;
  margin-bottom: 12px;
}

.hr-page .employee-hub-stats {
  margin-bottom: 12px;
}

.hr-page .employee-hub-stat {
  animation: none !important;
}

.hr-page .employee-hub-surface {
  overflow: visible;
  isolation: isolate;
}

.hr-page .employee-quick-filter-row,
.hr-page .employee-hub-controls {
  position: sticky;
  border: 1px solid rgba(59,93,138,.12);
  background: rgba(255,255,255,.93);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.hr-page .employee-quick-filter-row {
  top: 96px;
  z-index: 90;
  border-radius: 16px;
  padding: 8px;
  box-shadow: 0 12px 30px rgba(13,43,82,.07);
}

.hr-page .employee-hub-controls {
  top: 150px;
  z-index: 89;
  border-radius: 18px;
  padding: 10px;
  box-shadow: 0 14px 34px rgba(13,43,82,.06);
}

.hr-page .new-joiners-band,
.hr-page .employee-hub-count,
.hr-page .employee-hub-grid,
.hr-page .hr-directory-wrap {
  z-index: 1;
}

.hr-page .employee-hub-grid,
.hr-page .hr-directory-wrap {
  margin-top: 2px;
}

.hr-page .hr-directory-wrap {
  max-height: none;
  overflow: auto;
}

.profile-photo-upload-zone {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  border: 1px dashed rgba(59,93,138,.28);
  border-radius: 8px;
  padding: 16px;
  background: rgba(247,250,255,.88);
}

.profile-photo-upload-zone.dragging {
  border-color: #2f80ed;
  background: rgba(230,244,255,.96);
}

.profile-photo-upload-zone input {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}

.profile-photo-upload-zone > div {
  display: flex;
  align-items: center;
  gap: 14px;
}

.profile-photo-upload-zone strong,
.profile-photo-upload-zone em {
  display: block;
}

.profile-photo-upload-zone em {
  color: #60748b;
  font-style: normal;
  font-weight: 780;
}

.employee-health-widget-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

.employee-health-widget-grid article {
  display: grid;
  gap: 7px;
  border: 1px solid rgba(59,93,138,.13);
  border-radius: 8px;
  padding: 12px;
  background: rgba(255,255,255,.86);
}

.employee-health-widget-grid span { color: #60748b; font-size: .68rem; font-weight: 950; text-transform: uppercase; }
.employee-health-widget-grid strong { color: #071526; font-size: 1.2rem; }
.employee-health-widget-grid b { height: 7px; overflow: hidden; border-radius: 999px; background: rgba(59,93,138,.12); }
.employee-health-widget-grid i { display: block; height: 100%; border-radius: inherit; background: #2f80ed; }

.employee-photo-crop-drawer { max-width: 520px; }
.photo-crop-preview {
  display: grid;
  justify-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.photo-crop-preview div {
  width: 240px;
  height: 240px;
  overflow: hidden;
  border: 1px solid rgba(59,93,138,.18);
  border-radius: 28px;
  background: #eef6fc;
}
.photo-crop-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.photo-crop-preview p { color: #60748b; font-weight: 800; }

.salary-center-panel,
.employee-id-card-stage,
.employee-vault-panel {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(59,93,138,.13);
  border-radius: 8px;
  padding: 14px;
  background: rgba(247,250,255,.8);
}

.salary-history-timeline,
.employee-lifecycle-timeline,
.employee-vault-grid {
  display: grid;
  gap: 10px;
}

.salary-history-timeline article,
.employee-lifecycle-timeline article,
.employee-vault-grid article {
  display: grid;
  gap: 5px;
  border: 1px solid rgba(59,93,138,.12);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.salary-history-timeline span,
.employee-lifecycle-timeline span {
  color: #60748b;
  font-size: .68rem;
  font-weight: 950;
  text-transform: uppercase;
}

.salary-history-timeline strong,
.employee-lifecycle-timeline strong,
.employee-vault-grid strong { color: #071526; }

.salary-history-timeline em,
.employee-lifecycle-timeline em,
.employee-lifecycle-timeline p,
.employee-vault-grid span { color: #60748b; font-style: normal; font-weight: 780; }

.id-card-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  margin-bottom: 10px;
}

.employee-id-card-stage {
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  background: linear-gradient(135deg, #eef6fc, #fff);
}

.employee-id-card {
  position: relative;
  overflow: hidden;
  min-height: 390px;
  border-radius: 18px;
  padding: 22px;
  color: #fff;
  background: linear-gradient(145deg, #071526, #195691);
  box-shadow: 0 22px 58px rgba(7,21,38,.16);
}

.employee-id-card::after {
  content: "";
  position: absolute;
  width: 190px;
  height: 190px;
  right: -70px;
  top: -70px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
}

.employee-id-card header,
.employee-id-card footer {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.employee-id-card h3 {
  position: relative;
  z-index: 1;
  margin: 14px 0 4px;
  color: #fff;
  font-size: 1.55rem;
}

.employee-id-card p,
.employee-id-card span,
.employee-id-card footer {
  position: relative;
  z-index: 1;
  color: rgba(255,255,255,.78);
  font-weight: 820;
}

.employee-id-photo {
  position: relative;
  z-index: 1;
  margin-top: 24px;
}

.employee-id-card-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px 12px;
  margin-top: 18px;
}

.employee-id-card-grid span {
  font-size: .68rem;
  text-transform: uppercase;
}

.employee-id-card-grid strong {
  color: #fff;
  overflow-wrap: anywhere;
}

.employee-id-back {
  color: #071526;
  background: linear-gradient(145deg, #ffffff, #eaf3fb);
}

.employee-id-back h3,
.employee-id-back strong { color: #071526; }
.employee-id-back span,
.employee-id-back footer { color: #60748b; }

.employee-qr {
  position: absolute;
  right: 22px;
  bottom: 22px;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  width: 84px;
  height: 84px;
  border: 8px solid #fff;
  background: #fff;
}

.employee-qr i {
  background: #dbe8f4;
}

.employee-qr i.on {
  background: #071526;
}

.danger-action {
  color: #8b1e2d !important;
  border-color: rgba(184,64,75,.26) !important;
  background: rgba(255,239,240,.88) !important;
}

@media print {
  body:has(.employee-id-card-stage) .dashboard-shell,
  body:has(.employee-id-card-stage) .ops-shell,
  body:has(.employee-id-card-stage) .sidebar,
  body:has(.employee-id-card-stage) .ops-topbar {
    display: block !important;
  }
  .drawer-backdrop { position: static !important; background: #fff !important; }
  .task-drawer { width: 100% !important; max-width: none !important; box-shadow: none !important; }
  .drawer-header, .drawer-actions, .hr-profile-tabs, .modal-footer, .id-card-actions { display: none !important; }
  .employee-id-card-stage { grid-template-columns: repeat(2, 1fr) !important; break-inside: avoid; }
}

@media (max-width: 1180px) {
  .ops-morning-hero,
  .ops-dashboard-grid-alive {
    grid-template-columns: 1fr;
  }

  .ops-color-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ops-motion-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .people-hero,
  .people-command-layout {
    grid-template-columns: 1fr;
  }

  .people-pulse-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .employee-health-widget-grid,
  .employee-id-card-stage,
  .new-joiners-band {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .ops-morning-hero {
    padding: 18px;
  }

  .ops-hero-actions {
    justify-content: flex-start;
  }

  .ops-color-kpis,
  .ops-motion-grid,
  .ops-performer-grid,
  .ops-client-grid {
    grid-template-columns: 1fr;
  }

  .people-hero {
    padding: 18px;
  }

  .people-hero-metrics,
  .people-pulse-grid,
  .people-health-grid {
    grid-template-columns: 1fr;
  }

  .people-joiner-row {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .people-joiner-row b,
  .people-joiner-row em {
    grid-column: 1 / -1;
  }

  .people-section-head {
    align-items: stretch;
    flex-direction: column;
  }

  .employee-health-mini,
  .employee-health-widget-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .employee-hover-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .profile-photo-upload-zone {
    grid-template-columns: 1fr;
  }
}

/* Ops Dashboard uses the app shell's inner panel as the only scroll surface. */
.ops-dashboard-main {
  height: 100vh !important;
  max-height: 100vh !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  padding-bottom: 44px !important;
  scroll-padding-top: 76px;
}

.ops-dashboard-main .ops-content {
  min-height: auto !important;
  overflow: visible !important;
  padding-bottom: 72px;
}

.ops-dashboard-main .ops-command-dashboard {
  min-height: max-content;
  padding-bottom: 72px;
}

.ops-dashboard-main .ops-topbar {
  position: sticky;
  top: 0;
  z-index: 120;
}

/* Reports Command Center */
.reports-command-center {
  display: grid;
  gap: 14px;
  padding-bottom: 58px;
}

.reports-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-radius: 22px;
  padding: 18px 20px;
  background:
    radial-gradient(circle at 12% 18%, rgba(12, 154, 191, .22), transparent 34%),
    radial-gradient(circle at 78% 12%, rgba(150, 128, 255, .18), transparent 34%),
    rgba(255,255,255,.78);
}

.reports-hero h2,
.report-section-head h2 {
  margin: 2px 0 4px;
  color: var(--navy);
  font-size: clamp(1.25rem, 2vw, 2rem);
  letter-spacing: 0;
}

.reports-hero span,
.report-section-head span {
  color: #62778e;
  font-weight: 780;
}

.report-executive-grid,
.report-quick-grid,
.report-analytics-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.report-metric-card,
.report-quick-card,
.report-chart-card,
.scheduled-report-list article,
.recent-report-list article,
.insight-stack article {
  border: 1px solid rgba(126,149,178,.14);
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 16px 40px rgba(13,43,82,.07);
}

.report-metric-card {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 112px;
  padding: 16px;
  overflow: hidden;
}

.report-metric-card > span,
.report-quick-card > span {
  display: grid;
  width: 42px;
  height: 42px;
  min-width: 42px;
  place-items: center;
  border-radius: 15px;
  color: #0d2b52;
  background: rgba(255,255,255,.72);
}

.report-metric-card em,
.report-quick-card em,
.scheduled-report-list em,
.recent-report-list span,
.insight-stack span {
  color: #61768e;
  font-style: normal;
  font-size: .76rem;
  font-weight: 860;
}

.report-metric-card strong {
  display: block;
  margin: 3px 0;
  color: var(--navy);
  font-size: 2rem;
  line-height: 1;
}

.report-metric-card small {
  color: #6e8094;
  font-weight: 780;
}

.report-metric-card.blue,
.report-quick-card.blue { background: linear-gradient(135deg, rgba(218,239,255,.92), rgba(255,255,255,.82)); }
.report-metric-card.mint,
.report-quick-card.mint { background: linear-gradient(135deg, rgba(219,248,237,.94), rgba(255,255,255,.84)); }
.report-metric-card.lavender,
.report-quick-card.lavender { background: linear-gradient(135deg, rgba(232,229,255,.94), rgba(255,255,255,.84)); }
.report-metric-card.peach,
.report-quick-card.peach { background: linear-gradient(135deg, rgba(255,236,218,.94), rgba(255,255,255,.84)); }
.report-metric-card.coral,
.report-quick-card.coral { background: linear-gradient(135deg, rgba(255,224,224,.94), rgba(255,255,255,.84)); }
.report-metric-card.yellow,
.report-quick-card.yellow { background: linear-gradient(135deg, rgba(255,246,198,.94), rgba(255,255,255,.84)); }

.report-section {
  border-radius: 22px;
  padding: 16px;
}

.report-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.report-section-head.compact {
  margin-bottom: 8px;
}

.report-section-head.compact h3 {
  margin: 0;
  color: var(--navy);
  font-size: 1.35rem;
}

.report-quick-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.report-quick-card {
  display: grid;
  min-height: 138px;
  gap: 9px;
  padding: 14px;
  text-align: left;
  cursor: pointer;
  transition: transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease;
}

.report-quick-card:hover,
.report-quick-card.active {
  border-color: rgba(12,154,191,.34);
  box-shadow: 0 22px 50px rgba(12,154,191,.14);
  transform: translateY(-2px);
}

.report-quick-card strong,
.scheduled-report-list strong,
.recent-report-list strong,
.insight-stack strong {
  color: var(--navy);
  font-size: .98rem;
}

.report-command-grid,
.report-bottom-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, .75fr);
  gap: 14px;
}

.command-builder {
  border: 1px solid rgba(126,149,178,.12);
  border-radius: 16px;
  background: rgba(247,251,255,.58);
}

.insight-stack,
.scheduled-report-list,
.recent-report-list {
  display: grid;
  gap: 9px;
}

.insight-stack article,
.scheduled-report-list article,
.recent-report-list article {
  display: grid;
  gap: 3px;
  padding: 12px;
}

.recent-report-list article {
  grid-template-columns: minmax(82px, .45fr) minmax(0, 1fr) auto;
  align-items: center;
}

.report-chart-card {
  display: grid;
  gap: 8px;
  min-height: 205px;
  padding: 14px;
}

.report-bars {
  display: grid;
  gap: 8px;
}

.report-bars span {
  display: grid;
  grid-template-columns: minmax(74px, .45fr) minmax(0, 1fr) 42px;
  align-items: center;
  gap: 9px;
  color: #4d637b;
  font-size: .76rem;
  font-weight: 850;
}

.report-bars i {
  display: block;
  height: 9px;
  border-radius: 999px;
  background: linear-gradient(90deg, #0c9abf, #8db5ff);
  width: var(--bar);
}

.report-bars em {
  color: var(--navy);
  font-style: normal;
  text-align: right;
}

.generated-report-preview .report-insights {
  padding: 0 0 14px;
}

.generated-report-preview .spreadsheet-wrap {
  border-radius: 18px;
}

.report-export-actions {
  justify-content: flex-end;
}

@media (max-width: 1180px) {
  .report-executive-grid,
  .report-analytics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .report-command-grid,
  .report-bottom-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .reports-hero,
  .report-section-head {
    align-items: stretch;
    flex-direction: column;
  }

  .report-executive-grid,
  .report-quick-grid,
  .report-analytics-grid {
    grid-template-columns: 1fr;
  }
}