/* DIVA People Portal / Staff Rota V378 – presentation only.
   Reuses the original, unchanged official logo and warehouse photograph.
   Scope all styling to employee mode or HR rota modal to protect other modules. */
:root { --v378-navy:#091826; --v378-ink:#172739; --v378-gold:#e7bb56; --v378-cyan:#7dc9db; }

/* 1: Cinema-grade employee login without blocking or delaying real authentication */
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell { perspective:1200px; }
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-card {
  border:1px solid rgba(243,205,126,.56);
  box-shadow:0 36px 110px rgba(0,7,16,.52),0 0 0 1px rgba(253,229,166,.12) inset;
  isolation:isolate;
  animation:v378-card-enter .85s cubic-bezier(.19,1,.22,1) both;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-card::before {
  transform-origin:center; animation:v378-hero-pan 30s ease-in-out infinite alternate;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-v377 {
  overflow:hidden; position:relative; isolation:isolate;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-v377::before {
  content:"";position:absolute;inset:-100% -120% auto auto;width:88%;height:240%;
  background:linear-gradient(100deg,transparent,rgba(251,217,146,.11),transparent);
  transform:rotate(-15deg);animation:v378-beam 12s ease-in-out infinite;pointer-events:none;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-v377::after {
  content:"";position:absolute;right:-105px;bottom:-155px;width:380px;height:380px;
  border:1px solid rgba(242,204,119,.25);border-radius:50%;
  box-shadow:0 0 0 32px rgba(242,204,119,.045),0 0 0 75px rgba(242,204,119,.03);
  animation:v378-orbit 9s ease-in-out infinite alternate;pointer-events:none;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-v377 > * {position:relative;z-index:1;}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-brand,
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-tagline-v377,
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-title-v377,
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-copy-v377,
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377,
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-badges-v377 {
  animation:v378-rise .72s cubic-bezier(.2,.8,.2,1) both;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-brand { animation-delay:.08s; }
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-tagline-v377 { animation-delay:.19s; }
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-title-v377 { animation-delay:.26s; }
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-copy-v377 { animation-delay:.34s; }
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377 { animation-delay:.42s; }
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-badges-v377 { animation-delay:.49s; }
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-v377 {animation:v378-panel-enter .9s cubic-bezier(.2,.8,.2,1) .15s both;}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-v377::before {
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(243,246,251,.975));
  box-shadow:0 22px 55px rgba(1,9,20,.23),0 0 0 1px rgba(255,255,255,.6) inset;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-head-v377 {border-bottom:1px solid #e2e7ec;margin-bottom:16px;}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-head-v377 .employee-login-kicker {
  color:#956719;letter-spacing:.17em;font-weight:900;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-head-v377 h2 {letter-spacing:-.045em;}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .hr-v374-portal-welcome {
  color:#7e5c23;border-color:rgba(176,129,38,.23);line-height:1.7;
}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .hr-v374-portal-welcome i {background:#be8a26;}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .employee-login-note {background:#fff8ea;color:#76551b;border-color:#edd9aa;}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .hrfield label {letter-spacing:.015em;}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .employee-v378-password-control {position:relative;}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin #hrPortalPassword {padding-right:89px!important;}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .employee-v378-password-toggle {
  position:absolute;top:50%;right:7px;transform:translateY(-50%);border:0;
  border-radius:9px;min-width:66px;min-height:39px;background:#f2f4f8;color:#24354b;
  cursor:pointer;font:800 12px/1.2 inherit;letter-spacing:.01em;
}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .employee-v378-password-toggle:focus-visible {
  outline:3px solid #c49b46;outline-offset:2px;
}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin #hrPortalLoginBtn {
  position:relative;overflow:hidden;transition:transform .17s ease,box-shadow .17s ease,filter .17s ease;
  background:linear-gradient(125deg,#ffdf91,#edbc51 45%,#c58519);color:#16191f;
  box-shadow:0 13px 31px rgba(157,108,20,.29);
}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin #hrPortalLoginBtn::after {
  content:"";pointer-events:none;position:absolute;inset:-60% auto -60% -65%;width:50%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg);animation:v378-button-sheen 5.8s ease-in-out 1s infinite;
}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin #hrPortalLoginBtn:hover {transform:translateY(-2px);box-shadow:0 17px 34px rgba(157,108,20,.38);}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin #hrPortalLoginBtn:active {transform:translateY(0);}
body.employee-mode.employee-standalone #hrrota #hrPortalLoginMsg {color:#9b2c27!important;}

/* 2: Cinematic, consistent employee workspace after login */
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard {gap:16px;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-v269 {
  border:1px solid rgba(247,211,121,.58);border-radius:24px;
  background:linear-gradient(112deg,#091421 0%,#133047 67%,#193c57 100%);
  box-shadow:0 21px 54px rgba(10,30,48,.2);overflow:hidden;isolation:isolate;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-v269::after {
  content:"";position:absolute;pointer-events:none;z-index:0;right:-60px;top:-100px;width:330px;height:330px;
  border:1px solid rgba(243,205,120,.28);border-radius:50%;
  box-shadow:0 0 0 37px rgba(239,202,116,.055),0 0 0 77px rgba(239,202,116,.035);
  animation:v378-orbit 12s ease-in-out infinite alternate;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-v269 > * {position:relative;z-index:2;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-avatar-v269 {
  border:1px solid #fff4c9;box-shadow:0 6px 22px rgba(0,0,0,.25),0 0 0 5px rgba(232,187,89,.13);
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-main h2 {letter-spacing:-.04em;line-height:1.15;color:#fff;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-eyebrow {color:#f3d78e;letter-spacing:.17em;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-idline {gap:7px 9px;flex-wrap:wrap;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-action-btn {
  color:#edf4fb;border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.09);
  transition:transform .15s ease,background .15s ease,border-color .15s ease;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-action-btn:hover {transform:translateY(-2px);background:rgba(255,255,255,.2);border-color:rgba(251,214,136,.5);}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-action-btn.hr-v374-employee-refresh {
  background:linear-gradient(125deg,#f7df9e,#e3aa3a)!important;color:#182334!important;border-color:#f9e3af!important;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-action-btn.warn {
  color:#ffe8a6;background:rgba(247,187,61,.12);border-color:rgba(241,186,67,.37);
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-v378-workspace-strip {
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 19px;
  border-radius:18px;background:linear-gradient(110deg,#132739,#193448);border:1px solid rgba(235,195,113,.45);
  box-shadow:0 12px 33px rgba(18,44,68,.14);color:#fff;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-v378-workspace-strip>div {display:grid;gap:5px;min-width:0;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-v378-eyebrow {
  font-size:10px;letter-spacing:.17em;font-weight:900;color:#f2d08a;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-v378-workspace-strip strong {
  font-size:clamp(14px,1.55vw,19px);letter-spacing:-.015em;line-height:1.35;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-v378-today {
  display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;border:1px solid rgba(246,224,168,.29);
  background:rgba(255,255,255,.075);border-radius:999px;padding:10px 14px;
  font-size:11px;letter-spacing:.03em;font-weight:800;color:#deebf4;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-v378-today::before {
  content:"";display:block;width:7px;height:7px;border-radius:100%;background:#43d995;
  box-shadow:0 0 0 4px rgba(52,218,144,.12);
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-mini-help {
  border:1px solid #ebd8ae;background:linear-gradient(100deg,#fff8e9,#fffdf6);color:#715519;
  border-radius:13px;box-shadow:0 4px 15px rgba(139,98,32,.04);
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-stat-card {
  border-radius:18px;background:linear-gradient(165deg,#fff,#f7fafc);border:1px solid #e0e7ef;
  box-shadow:0 9px 26px rgba(8,30,53,.055);transition:transform .16s ease,box-shadow .16s ease;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-stat-card:hover {transform:translateY(-2px);box-shadow:0 13px 33px rgba(9,31,53,.1);}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-stat-card::before {
  background:linear-gradient(90deg,#c38c2e,#f5d58c 72%,#8dc7d4);
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-stat-card strong {color:#102a41;letter-spacing:-.045em;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-card-v269,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard #hrV372LeaderRoster,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard #hrPortalLatePanel {
  border:1px solid #e0e7ef;border-radius:20px;
  background:linear-gradient(180deg,#fff 0%,#f9fbfe 100%);
  box-shadow:0 13px 37px rgba(10,32,52,.065);overflow:hidden;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-card-head {
  border-bottom:1px solid #e7ecf3;padding-bottom:12px;margin-bottom:14px;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-card-kicker {
  color:#b6852a;letter-spacing:.16em;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-card-head h3,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-card-v269 h3 {color:#142a40;letter-spacing:-.025em;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-section-badge {
  color:#645024;background:#fff3d6;border:1px solid #efd9a4;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-day-row-v269 {
  border:1px solid #dfe8f0;border-radius:14px;background:linear-gradient(100deg,#f7fafc,#fff);
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-day-row-v269.today {
  border-color:#d3ad50;background:#fff9ed;box-shadow:inset 4px 0 #d5ac4c,0 5px 14px rgba(180,135,40,.08);
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-shift-pill-v269 {
  border:1px solid rgba(243,208,136,.21);border-radius:11px;background:linear-gradient(112deg,#102b42,#214761);
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-day-state-v269 {border:1px solid #e0e5ed;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-quick-grid button {
  min-height:54px;border:1px solid #d7e2ed;border-radius:12px;background:linear-gradient(130deg,#f6f9fc,#fff);
  color:#193550;box-shadow:0 2px 7px rgba(18,45,72,.035);font-size:12px;
  transition:transform .15s ease,background .15s ease,border-color .15s ease;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-quick-grid button:hover {transform:translateY(-2px);background:#fff9e9;border-color:#d7af5c;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard input,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard select,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard textarea {
  border:1px solid #cfdbe7;border-radius:11px;background:#fff;color:#1a3148;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard input:focus,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard select:focus,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard textarea:focus {
  border-color:#c39c4a;outline:3px solid rgba(207,164,70,.15);outline-offset:0;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-week-control {
  border:1px solid #dce5ed;background:#f6f9fc;border-radius:12px;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-week-control button {
  border-radius:9px;color:#172b40;font-weight:900;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard #hrPortalAvailabilityCard,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard #hrPortalLeaveCard,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard #hrPortalMeetingCard,
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard #hrPortalChatPanel {scroll-margin-top:18px;}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard #hrPortalChatMessages {
  background:linear-gradient(180deg,#f5f8fb,#f9fbfc);border-color:#dce4ec;border-radius:13px;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .hrbubble.hr {
  background:linear-gradient(112deg,#162d43,#264b65);border:1px solid #37536b;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .hrbubble.employee {
  background:#fff;border:1px solid #e0e7ef;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-primary-btn.compact {
  min-height:44px;border-radius:11px;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-secondary-btn {
  min-height:44px;background:#1d3449;border-radius:11px;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-today-shift-v269 {
  border-radius:13px;background:linear-gradient(125deg,#112e47,#1a475f);
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-info-strip {
  background:#f2f7fc;border:1px solid #dce6f0;border-radius:12px;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard #hrV372LeaderRoster {
  background:linear-gradient(150deg,#f7fbff,#fff9ea);border-color:#dcc58f;
}
body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-theme-banner.show {
  border-radius:12px;box-shadow:0 7px 20px rgba(18,39,58,.07);
}

/* 3: Responsive, native-dialog staff roster bottom sheet for phones */
.hr-v376-roster-modal {
  border-radius:23px;border:1px solid #d5b46c;
  box-shadow:0 35px 110px rgba(2,9,20,.35);overflow:hidden;
  animation:v378-dialog-pop .24s cubic-bezier(.2,.8,.2,1) both;
}
.hr-v376-roster-modal::backdrop {background:rgba(6,15,27,.74);backdrop-filter:blur(7px);}
.hr-v378-sheet-handle {display:none;}
.hr-v376-modal-header {background:linear-gradient(125deg,#0d1d2c,#17374f 75%,#1d4058);border-bottom:1px solid rgba(235,191,102,.35);}
.hr-v376-modal-header .hr-v376-eyebrow {letter-spacing:.16em;color:#f5d48b;}
.hr-v376-modal-tools {background:#f6f8fb;}
.hr-v376-modal-tools input:focus {outline:3px solid rgba(207,165,69,.15);border-color:#c59b44;}
.hr-v376-roster-group h3 {background:linear-gradient(100deg,#edf4fa,#f8fbfd);color:#18334c;}
.hr-v376-roster-person {min-height:51px;}
.hr-v376-person-time {border:1px solid #d1e3f1;}
.hr-v376-roster-modal [data-v376-close]:focus-visible {outline:3px solid #e8bf61;outline-offset:3px;}

/* Tablets */
@media(max-width:900px) {
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-v269 {padding:22px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-main-grid-v269,
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-bottom-grid-v269 {grid-template-columns:1fr;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-actions {width:100%;justify-content:flex-start;}
}

/* Small-screen typography, tap targets and no nested sideways page scrolling */
@media(max-width:680px) {
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-card {border-radius:23px;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-v377 {animation-delay:.1s;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377 {
    grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;
  }
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377 article {
    border-radius:11px;padding:10px 8px;min-width:0;
  }
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377 article strong {font-size:11px;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377 article span {font-size:10px;line-height:1.4;}
  body.employee-mode.employee-standalone #hrrota #hrPortalLogin #hrPortalLoginBtn {min-height:51px;width:100%;}
  body.employee-mode.employee-standalone #hrrota #hrPortalLogin input {font-size:16px!important;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-v269 {padding:18px 15px;border-radius:19px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-main {display:flex;gap:12px;align-items:center;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-main>div:last-child {margin-top:0;min-width:0;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-main h2 {font-size:23px;overflow-wrap:anywhere;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-avatar-v269 {flex:0 0 53px;width:53px;height:53px;border-radius:14px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-actions {
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px;margin-top:12px;overflow:visible;padding:0;
  }
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-action-btn {
    width:100%;min-width:0;min-height:46px;white-space:normal;text-align:center;padding:8px 7px;font-size:12px;
  }
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-v378-workspace-strip {padding:14px;flex-wrap:wrap;gap:11px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-v378-today {padding:7px 12px;font-size:10px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-overview-grid-v269 {grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-stat-card {padding:13px 12px;min-width:0;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-stat-card strong {font-size:23px;overflow-wrap:anywhere;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-card-v269 {padding:14px 12px;border-radius:15px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-card-head {gap:8px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-day-row-v269 {grid-template-columns:50px minmax(0,1fr);padding:10px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-quick-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-quick-grid button {font-size:12px;padding:11px 9px;min-height:54px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .hrchatcompose {display:grid;grid-template-columns:1fr;gap:8px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .hrchatcompose textarea {min-width:0;width:100%;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .hrchatcompose button {width:100%;min-height:44px;}
  #hrrota .hr-v373-shift-pair {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;}
  #hrrota .hr-v373-shift-pair>.hr-v376-shift-button {min-width:0;min-height:145px;padding:8px 6px;border-radius:11px;}
  #hrrota .hr-v376-view-staff {padding:8px 2px!important;white-space:normal;}
  /* Sheet fills mobile width, keeps header and search visible, scrolls ONLY the people list. */
  dialog.hr-v376-roster-modal {
    position:fixed!important;inset:auto 0 0 0!important;margin:0!important;padding:0!important;
    width:100vw!important;max-width:none!important;max-height:91dvh!important;
    border-width:1px 0 0!important;border-radius:25px 25px 0 0!important;
    box-shadow:0 -22px 80px rgba(1,8,18,.4)!important;
    animation:v378-sheet-up .32s cubic-bezier(.17,.84,.29,1) both!important;
  }
  .hr-v376-roster-modal .hr-v376-modal-shell {max-height:91dvh;min-height:min(48dvh,390px);}
  .hr-v378-sheet-handle {display:flex;align-items:center;justify-content:center;flex:0 0 25px;background:#0d1e2d;touch-action:pan-y;cursor:grab;}
  .hr-v378-sheet-handle span {display:block;width:54px;height:5px;border-radius:999px;background:#7995aa;}
  .hr-v376-modal-header {padding:12px 16px 15px;gap:10px;flex:0 0 auto;}
  .hr-v376-modal-header h2 {font-size:17px;margin:4px 0 5px;line-height:1.3;overflow-wrap:anywhere;}
  .hr-v376-modal-header p {font-size:11px;}
  .hr-v376-modal-header .hr-v376-close {flex:0 0 40px;width:40px;height:40px;font-size:26px;}
  .hr-v376-modal-tools {padding:11px 15px 9px;grid-template-columns:1fr;gap:6px;flex:0 0 auto;}
  .hr-v376-modal-tools label {font-size:11px;}
  .hr-v376-modal-tools input {grid-column:1;min-height:46px;font-size:16px;}
  .hr-v376-modal-tools #hrV376RosterCount {grid-column:1;grid-row:auto;}
  .hr-v376-modal-roster {padding:4px 13px 12px;min-height:70px;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;flex:1;}
  .hr-v376-roster-group {margin:10px 0 13px;}
  .hr-v376-roster-group h3 {padding:10px 12px;border-radius:10px;font-size:13px;}
  .hr-v376-roster-person {padding:11px 7px;gap:9px;}
  .hr-v376-person-identity strong {font-size:13px;}
  .hr-v376-person-time {font-size:11px;padding:7px 8px;}
  .hr-v376-modal-shell footer {padding:9px 14px calc(10px + env(safe-area-inset-bottom));font-size:10px;line-height:1.45;flex:0 0 auto;}
}
@media(max-width:365px){
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-hero-actions {grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard .employee-quick-grid {grid-template-columns:1fr;}
  #hrrota .hr-v373-shift-pair>.hr-v376-shift-button {padding:7px 5px;}
}

/* Motion is purely decorative, never blocks the sign-in form or content. */
@keyframes v378-card-enter {from{opacity:0;transform:translateY(25px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes v378-rise {from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes v378-panel-enter {from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:translateX(0)}}
@keyframes v378-hero-pan {from{transform:scale(1.02) translateX(-1%)}to{transform:scale(1.09) translateX(2%)}}
@keyframes v378-beam {0%,30%{transform:translateX(-220%) rotate(-15deg);opacity:0}43%,53%{opacity:.55}70%,100%{transform:translateX(200%) rotate(-15deg);opacity:0}}
@keyframes v378-orbit {from{transform:scale(.95) translate(-8px,6px);opacity:.45}to{transform:scale(1.06) translate(9px,-7px);opacity:.95}}
@keyframes v378-button-sheen {0%,25%{left:-65%;opacity:0}37%{opacity:.85}55%,100%{left:140%;opacity:0}}
@keyframes v378-dialog-pop {from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes v378-sheet-up {from{transform:translateY(102%);opacity:.65}to{transform:translateY(0);opacity:1}}
@media(prefers-reduced-motion:reduce){
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell *,
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell *::before,
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell *::after,
  body.employee-mode.employee-standalone #hrrota #hrPortalDashboard *::after,
  .hr-v376-roster-modal {animation:none!important;transition:none!important;}
}

/* Compatibility: V374 included a !important 710px login-card limit. Override it
   explicitly so the new cinematic split layout has usable space on desktop. */
body.employee-mode.employee-standalone #hrrota .hrwrap {
  max-width:1280px!important;width:min(1280px,100%)!important;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-card {
  max-width:1180px!important;width:min(1180px,100%)!important;padding:0!important;
  background:#0b1828!important;border-radius:28px!important;box-sizing:border-box!important;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-card::before {
  z-index:0!important;inset:0!important;opacity:.96;
  background:linear-gradient(105deg,rgba(6,17,28,.88),rgba(7,20,33,.5) 45%,rgba(4,13,24,.96)),url('/assets/diva-warehouse-sunset-v37118.webp') center/cover!important;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-card::after {z-index:0!important;}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-layout-v377 {
  position:relative;z-index:2;grid-template-columns:minmax(0,1.05fr) minmax(395px,.95fr);width:100%;
}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-v377 {min-width:0;}
body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-head-v377 .employee-login-kicker {
  color:#92651c!important;
}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .hrfield label {
  color:#26364b!important;
}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .employee-login-note {
  color:#74531a!important;background:#fff7e5!important;
}
body.employee-mode.employee-standalone #hrrota #hrPortalLogin .employee-login-msg {
  color:#8e2c25!important;
}
@media(max-width:960px){
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-layout-v377 {
    grid-template-columns:minmax(0,1fr);min-height:0;
  }
}
@media(max-width:680px){
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell.employee-login-shell {
    display:block!important;min-height:0!important;padding:0 0 24px!important;
  }
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-card {
    border-radius:21px!important;
  }
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-v377 {padding-top:18px;}
  body.employee-mode.employee-standalone #hrrota #hrPortalLogin .hr-v374-portal-welcome {font-size:9px;}
}

/* Standalone mobile portal must grow with its content. Legacy app shells used
   100dvh fixed heights, which clipped long login/dashboard screens. */
@media(max-width:760px){
  html:has(body.employee-mode.employee-standalone) {height:auto!important;min-height:100%!important;overflow-y:auto!important;}
  body.employee-mode.employee-standalone {height:auto!important;min-height:100dvh!important;overflow-y:auto!important;overflow-x:hidden!important;}
  body.employee-mode.employee-standalone .shell,
  body.employee-mode.employee-standalone .main,
  body.employee-mode.employee-standalone .stage {height:auto!important;min-height:100dvh!important;overflow:visible!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-layout-v377 {display:flex!important;flex-direction:column!important;min-height:0!important;height:auto!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-v377 {height:auto!important;min-height:0!important;flex:0 0 auto!important;overflow:visible!important;justify-content:flex-start!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-v377 {height:auto!important;min-height:0!important;flex:0 0 auto!important;}
}
@media(max-width:680px){
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-v377 {gap:10px!important;padding:16px 17px 20px!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-brand {margin:0!important;gap:11px!important;align-items:center!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-brand h2 {font-size:21px!important;line-height:1.14!important;margin:3px 0 0!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-brand p {display:none!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-title-v377 {font-size:23px!important;line-height:1.17!important;margin-top:5px!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-cinema-copy-v377 {display:none!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377 {display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin-top:1px!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377 article {padding:9px 7px!important;border-radius:10px!important;min-height:36px;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377 article strong {font-size:10px!important;margin:0!important;line-height:1.25!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-feature-grid-v377 article span {display:none!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-badges-v377 {display:none!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-head-v377 {padding:16px 13px 12px!important;margin-bottom:9px!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-head-v377 h2 {font-size:22px!important;}
  body.employee-mode.employee-standalone #hrrota #hrEmployeeLoginShell .employee-login-panel-head-v377 p {font-size:12px!important;}
  body.employee-mode.employee-standalone #hrrota #hrPortalLogin .hr-v374-portal-welcome {padding:7px 0!important;margin:0 0 8px!important;line-height:1.4!important;}
  body.employee-mode.employee-standalone #hrrota #hrPortalLogin .employee-login-note {font-size:11px!important;padding:9px!important;}
  body.employee-mode.employee-standalone #hrrota #hrPortalLogin .employee-login-form {margin:12px 0!important;gap:10px!important;}
  body.employee-mode.employee-standalone #hrrota #hrPortalLogin input {min-height:47px!important;}
}