:root {
  color-scheme: light;
  --ink: #182033;
  --muted: #7f889b;
  --purple: #6c4cff;
  --purple-soft: #f0edff;
  --navy: #11182a;
  --line: #e7e9f1;
  --canvas: #f6f7fb;
  --green: #16855a;
  --red: #d94750;
  --orange: #d7782e;
  --shadow: 0 12px 32px rgba(17, 24, 42, 0.08);
}

/* One portal navigation, with the finance workspace using the available width. */
.portal-nav-label { margin:22px 12px 8px; font-size:10px; font-weight:800; letter-spacing:.1em; color:#8c94a3; }
.sidebar .nav { overflow-y:auto; min-height:0; }
.portal-finance { height:calc(100dvh - 104px); min-height:460px; }
.portal-finance iframe { display:block; border:0; width:100%; height:100%; background:#f4f6f8; }
.finance-workspace-fullscreen,
.finance-workspace-fullscreen body { overflow:hidden; }
.finance-workspace-fullscreen .app-shell { display:block; height:100dvh; min-height:100dvh; }
.finance-workspace-fullscreen .sidebar,
.finance-workspace-fullscreen .topbar { display:none!important; }
.finance-workspace-fullscreen .app-main { position:fixed; inset:0; z-index:1000; min-width:0; padding:0!important; }
.finance-workspace-fullscreen #view-root,
.finance-workspace-fullscreen .portal-finance { width:100vw; height:100dvh!important; min-height:0; }
.finance-workspace-fullscreen .portal-finance iframe { position:fixed; inset:0; z-index:1001; width:100vw; height:100dvh; }
.app-main:has(.portal-finance) .top-actions .calendar-sync-button,
.app-main:has(.portal-finance) .top-actions .search-field { display:none; }
@media(max-width:760px) {
  .portal-finance { height:calc(100dvh - 150px); }
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--canvas); }
body {
  margin: 0;
  color: var(--ink);
  background: var(--canvas);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
}
button, input, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; }
.hidden { display: none !important; }

.boot-screen, .login-screen, .pending-screen {
  min-height: 100vh;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 18px;
  padding: 28px;
  text-align: center;
  background:
    radial-gradient(circle at 20% 10%, rgba(108,76,255,.16), transparent 30%),
    linear-gradient(150deg, #11182a, #1b2540 70%, #2d3560);
  color: white;
}
.boot-screen p { color: #c9d0de; }
.login-card, .pending-card {
  width: min(460px, 100%);
  padding: 38px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  background: rgba(255,255,255,.07);
  box-shadow: 0 28px 80px rgba(0,0,0,.25);
  backdrop-filter: blur(12px);
}
.login-card .brand-logo, .pending-card .brand-logo { margin-bottom: 24px; }
.login-card h1, .pending-card h1 { margin: 0; font-size: 1.7rem; }
.login-card p, .pending-card p { color: #b9c1d2; line-height: 1.6; margin: 10px 0 26px; }
.google-button {
  width: 100%; border: 0; border-radius: 10px; padding: 13px 16px;
  background: white; color: #293146; font-weight: 750;
  display: flex; gap: 11px; align-items: center; justify-content: center;
}
.google-g { font: 800 1.15rem Arial; color: #4285f4; }

.login-screen.motion-home {
  position: relative;
  display: block;
  min-height: 100vh;
  overflow: hidden;
  isolation: isolate;
  padding: 0;
  text-align: left;
  background: #000;
  color: #fff;
  font-family: "Mazzard H", "Helvetica Neue", Arial, sans-serif;
}
.motion-canvas,
.motion-grid,
.motion-spotlight,
.motion-beam,
.motion-ring,
.motion-rule {
  position: absolute;
  pointer-events: none;
}
.motion-canvas {
  inset: 0;
  z-index: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 80% 16%, rgba(204,204,204,.18), transparent 28%),
    linear-gradient(132deg, #000 0%, #171717 46%, #3c3c3b 100%);
}
.motion-grid {
  inset: -80px;
  opacity: .24;
  background-image:
    linear-gradient(rgba(255,255,255,.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.09) 1px, transparent 1px);
  background-size: 74px 74px;
  animation: cowshed-grid-shift 22s linear infinite;
}
.motion-spotlight {
  width: 620px;
  height: 620px;
  border-radius: 50%;
  filter: blur(2px);
}
.motion-spotlight-a {
  top: -360px;
  left: 38%;
  background: radial-gradient(circle, rgba(255,255,255,.2), rgba(204,204,204,.04) 42%, transparent 68%);
  animation: cowshed-spot-a 13s ease-in-out infinite alternate;
}
.motion-spotlight-b {
  right: -360px;
  bottom: -420px;
  background: radial-gradient(circle, rgba(255,255,255,.15), transparent 68%);
  animation: cowshed-spot-b 17s ease-in-out infinite alternate;
}
.motion-beam {
  top: -38%;
  width: 30%;
  height: 175%;
  transform: rotate(17deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
}
.motion-beam-a {
  left: -34%;
  animation: cowshed-beam-a 12s cubic-bezier(.45, 0, .55, 1) infinite;
}
.motion-beam-b {
  right: -46%;
  opacity: .6;
  animation: cowshed-beam-b 19s cubic-bezier(.45, 0, .55, 1) infinite;
}
.motion-ring {
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
}
.motion-ring-a {
  width: 420px;
  height: 420px;
  right: 4%;
  top: 15%;
  box-shadow: 0 0 0 52px rgba(255,255,255,.025), 0 0 0 104px rgba(255,255,255,.018);
  animation: cowshed-ring-a 16s ease-in-out infinite alternate;
}
.motion-ring-b {
  width: 220px;
  height: 220px;
  right: 19%;
  top: 31%;
  border-color: rgba(255,255,255,.26);
  animation: cowshed-ring-b 11s ease-in-out infinite alternate;
}
.motion-rule {
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
}
.motion-rule-a {
  top: 28%;
  animation: cowshed-rule-a 14s ease-in-out infinite alternate;
}
.motion-rule-b {
  bottom: 22%;
  opacity: .55;
  animation: cowshed-rule-b 18s ease-in-out infinite alternate;
}
.motion-home-copy {
  position: relative;
  z-index: 2;
  display: flex;
  min-height: 100vh;
  width: min(520px, calc(100% - 96px));
  margin-left: clamp(34px, 8vw, 92px);
  padding: 90px 0;
  flex-direction: column;
  justify-content: center;
}
.motion-logo-plate {
  width: min(280px, 76vw);
  padding: 16px 18px;
  background: #fff;
}
.motion-logo-plate img {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}
.motion-kicker {
  margin: 34px 0 12px;
  color: #ccc;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.motion-home h1 {
  max-width: 480px;
  margin: 0;
  color: #fff;
  font-size: clamp(42px, 7vw, 72px);
  font-weight: 500;
  line-height: .98;
  letter-spacing: -.045em;
}
.motion-intro {
  max-width: 455px;
  margin: 24px 0 28px;
  color: #ccc;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.45;
}
.motion-google-button {
  width: fit-content;
  min-height: 48px;
  padding: 0 20px;
  border-radius: 0;
  color: #000;
  font-size: 15px;
  font-weight: 500;
}
.motion-google-button .google-g { color: #3c3c3b; }
.motion-access-note {
  max-width: 420px;
  margin: 15px 0 0;
  color: rgba(255,255,255,.62);
  font-size: 13px;
  line-height: 1.45;
}
.motion-corner-note {
  position: absolute;
  z-index: 2;
  right: 24px;
  bottom: 22px;
  color: rgba(255,255,255,.62);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.motion-home button:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}
@keyframes cowshed-grid-shift {
  to { transform: translate3d(74px, 74px, 0); }
}
@keyframes cowshed-spot-a {
  from { transform: translate3d(-80px, -28px, 0) scale(.9); }
  to { transform: translate3d(165px, 110px, 0) scale(1.15); }
}
@keyframes cowshed-spot-b {
  from { transform: translate3d(0, 0, 0) scale(.82); }
  to { transform: translate3d(-210px, -90px, 0) scale(1.2); }
}
@keyframes cowshed-beam-a {
  0%, 8% { transform: translateX(0) rotate(17deg); }
  58%, 100% { transform: translateX(510%) rotate(17deg); }
}
@keyframes cowshed-beam-b {
  0%, 22% { transform: translateX(0) rotate(17deg); }
  78%, 100% { transform: translateX(-500%) rotate(17deg); }
}
@keyframes cowshed-ring-a {
  from { transform: translate3d(60px, -26px, 0) scale(.92); }
  to { transform: translate3d(-38px, 36px, 0) scale(1.08); }
}
@keyframes cowshed-ring-b {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-88px, 46px, 0); }
}
@keyframes cowshed-rule-a {
  from { transform: translateY(-52px); opacity: .25; }
  to { transform: translateY(76px); opacity: .8; }
}
@keyframes cowshed-rule-b {
  from { transform: translateY(40px); }
  to { transform: translateY(-66px); }
}

.brandmark {
  width: 38px; height: 38px; border-radius: 11px; background: #7054ff;
  color: white; display: grid; place-items: center; font-weight: 850; font-size: 1.15rem;
}
.brandmark.large { width: 54px; height: 54px; border-radius: 16px; font-size: 1.5rem; }
.brand-logo {
  display: block;
  width: min(168px, 100%);
  height: auto;
  filter: invert(1);
}
.brand-logo-centred {
  width: min(240px, 72vw);
  margin-inline: auto;
}
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 232px minmax(0, 1fr); }
.sidebar {
  background: var(--navy); color: #aeb6c8; padding: 26px 16px 18px;
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
}
.brand { display: flex; align-items: center; min-height: 44px; padding: 0 10px 30px; color: white; }
.brand-copy { display: flex; flex-direction: column; }
.brand-copy strong { font-size: 1rem; }
.brand-copy span { margin-top: 2px; color: #8d96aa; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; }
.nav { display: grid; gap: 5px; }
.nav button, .settings-button {
  width: 100%; border: 0; border-radius: 9px; padding: 11px 12px; background: transparent;
  color: inherit; display: flex; align-items: center; gap: 12px; text-align: left; font-weight: 650; font-size: .88rem;
}
.nav button:hover, .nav button.active, .settings-button:hover { background: #262f45; color: white; }
.nav-icon { width: 22px; text-align: center; font-size: .96rem; opacity: .9; }
.nav-badge { margin-left: auto; min-width: 22px; border-radius: 20px; padding: 2px 6px; background: var(--purple); color: white; text-align: center; font-size: .68rem; }
.nav-badge.alert { background: #d97706; }
.finance-alert-frame { display: none; }
.side-bottom { margin-top: auto; }
.profile { border-top: 1px solid #2a3348; margin-top: 14px; padding: 19px 6px 2px; display: grid; grid-template-columns: 38px 1fr; align-items: center; gap: 9px; }
.profile-copy { min-width: 0; display: flex; flex-direction: column; }
.profile-copy strong { overflow: hidden; color: white; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.profile-copy span { margin-top: 3px; color: #8992a6; font-size: .68rem; text-transform: capitalize; }
.avatar {
  width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center;
  flex: none; background: #ece8ff; color: #5c41dd; font-weight: 800; font-size: .75rem;
}
.avatar.dark { background: #343e54; color: white; }
.app-main { min-width: 0; }
.topbar {
  min-height: 88px; padding: 18px 34px; background: white; border-bottom: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
}
.eyebrow { margin: 0 0 4px; color: #8992a5; font-size: .67rem; letter-spacing: .16em; font-weight: 800; }
.topbar h1 { margin: 0; font-size: 1.52rem; }
.top-actions { display: flex; align-items: center; gap: 10px; }
.calendar-sync-button { min-height: 40px; padding: 0 12px; border: 1px solid #e0e3ec; border-radius: 9px; display: inline-flex; align-items: center; gap: 7px; background: white; color: #687188; font-size: .75rem; }
.calendar-sync-button.connected { border-color: #bfe5d2; background: #eefaf4; color: #137651; }
.calendar-sync-button span { font-size: .9rem; }
.calendar-sync-button strong { white-space: nowrap; }
.company-holiday-panel { margin-bottom: 18px; padding: 18px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 14px 18px; }
.company-holiday-panel > div:first-child { display: flex; align-items: center; gap: 12px; min-width: 0; }
.company-holiday-panel h3 { margin: 0 0 3px; color: var(--navy); font-size: .95rem; }
.company-holiday-panel p { margin: 0; color: var(--muted); font-size: .8rem; }
.company-holiday-icon { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border-radius: 10px; background: #eefaf4; color: #137651; font-size: 1rem; }
.unmatched-holidays { grid-column: 1 / -1; padding-top: 13px; border-top: 1px solid var(--line); display: grid; gap: 6px; }
.unmatched-holidays > strong { color: #9c6110; font-size: .78rem; }
.unmatched-holidays > span { color: var(--muted); font-size: .75rem; }
.unmatched-holidays > div { display: flex; flex-wrap: wrap; gap: 6px; }
.unmatched-holidays em { padding: 5px 8px; border-radius: 999px; background: #fff7e8; color: #88530c; font-size: .7rem; font-style: normal; }
.search-field { width: 250px; height: 40px; border: 1px solid var(--line); border-radius: 9px; display: flex; align-items: center; gap: 8px; padding: 0 12px; color: #9098a9; }
.search-field input { width: 100%; border: 0; outline: 0; font-size: .84rem; }
.icon-button { width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 9px; background: white; color: #667087; }
.content { max-width: 1500px; padding: 28px 34px 50px; }
.section-head, .toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.section-head h2 { margin: 0; font-size: 1.08rem; }
.section-head p { margin: 6px 0 0; color: var(--muted); font-size: .82rem; }
.actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.button {
  border: 0; border-radius: 9px; padding: 10px 15px; display: inline-flex; align-items: center;
  justify-content: center; gap: 7px; font-weight: 750; font-size: .8rem; text-decoration: none;
}
.button.primary { background: var(--purple); color: white; box-shadow: 0 5px 15px rgba(108,76,255,.2); }
.button.secondary { background: white; color: #40495c; border: 1px solid var(--line); }
.button.dark { background: #172033; color: white; }
.button.danger { background: #fff0f1; color: var(--red); }
.button:disabled { opacity: .5; cursor: not-allowed; }
.week-nav { display: flex; align-items: center; gap: 10px; }
.week-label { min-width: 190px; text-align: center; display: flex; flex-direction: column; }
.week-label strong { font-size: .9rem; }
.week-label span { margin-top: 3px; color: var(--muted); font-size: .75rem; }
.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 18px; }
.metric-grid.four { grid-template-columns: repeat(4, 1fr); }
.metric { position: relative; overflow: hidden; padding: 19px 20px; background: white; border: 1px solid var(--line); border-radius: 13px; }
.metric-action { width: 100%; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.metric-action:hover { transform: translateY(-1px); border-color: #d9d4ff; box-shadow: 0 8px 22px rgba(17,24,42,.08); }
.metric-action:focus-visible { outline: 3px solid rgba(108,76,255,.3); outline-offset: 2px; }
.metric-action > em { position: absolute; top: 50%; right: 17px; color: #8b93a4; font-size: 1.4rem; font-style: normal; transform: translateY(-50%); }
.metric-action.has-alert { border-color: #f3c5c8; background: #fffafb; }
.metric::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--purple); }
.metric.green::before { background: #19a974; }
.metric.navy::before { background: #172033; }
.metric.red::before { background: #ec5c5c; }
.metric > span { color: #788196; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.metric > strong { display: block; margin: 8px 0 4px; font-size: 1.72rem; }
.metric p { margin: 0; color: #8b93a4; font-size: .75rem; }
.progress { height: 5px; margin-top: 14px; overflow: hidden; border-radius: 10px; background: #edf0f5; }
.progress i { display: block; height: 100%; border-radius: inherit; background: var(--purple); }
.panel { background: white; border: 1px solid var(--line); border-radius: 13px; padding: 20px; }
.panel-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.panel-title h2 { margin: 0; font-size: 1rem; }
.panel-title p { margin: 5px 0 0; color: var(--muted); font-size: .78rem; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: .82rem; }
th { padding: 11px 10px; border-bottom: 1px solid var(--line); color: #8c94a6; font-size: .68rem; text-align: left; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }
td { padding: 13px 10px; border-bottom: 1px solid #eef0f5; }
th:not(:first-child), td:not(:first-child) { text-align: center; }
.row-title { display: flex; align-items: center; gap: 10px; min-width: 210px; text-align: left; }
.row-title > span:last-child { display: flex; flex-direction: column; gap: 3px; }
.row-title small { color: #8c94a6; }
.dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.hours-input { width: 54px; height: 36px; padding: 4px; border: 1px solid #dfe2eb; border-radius: 7px; text-align: center; outline: 0; }
.hours-input:focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(108,76,255,.12); }
.total-row td { background: #f8f9fc; font-weight: 750; }
.over { color: var(--red); }
.status { display: inline-flex; border-radius: 20px; padding: 5px 8px; background: var(--purple-soft); color: #6548da; font-size: .66rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.status.ok { background: #e1f7eb; color: var(--green); }
.status.warn { background: #ffeaeb; color: var(--red); }
.status.freelance { background: #fff0dd; color: #a66112; }
.status.non-billable { background: #eceef3; color: #6f7789; }
.empty { padding: 36px 20px; text-align: center; color: var(--muted); }
.empty h3 { margin: 0 0 8px; color: var(--ink); font-size: 1rem; }
.empty p { margin: 0 auto 18px; max-width: 480px; font-size: .82rem; line-height: 1.5; }
.project-list { display: grid; gap: 14px; }
.project-card { padding: 20px; background: white; border: 1px solid var(--line); border-radius: 14px; }
.project-card.open { border-color: #d9d4ff; box-shadow: var(--shadow); }
.project-summary { display: grid; grid-template-columns: 46px minmax(180px,1.2fr) 90px minmax(180px,.8fr) 170px; align-items: center; gap: 16px; }
.staff-project-summary { display: grid; grid-template-columns: 46px minmax(200px,1fr) 90px 130px; align-items: center; gap: 16px; }
.project-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; color: white; font-weight: 900; }
.project-name h3 { margin: 0 0 5px; font-size: 1rem; }
.project-reference { display: inline-flex; margin-right: 8px; padding: 3px 7px; border-radius: 6px; background: #ece8ff; color: #5c43cb; font-size: .72rem; font-weight: 900; letter-spacing: .04em; vertical-align: 1px; }
.project-name p { margin: 0; color: var(--muted); font-size: .75rem; }
.shoot-date-chip { display: inline-flex; margin-left: 6px; padding: 3px 7px; border-radius: 20px; background: #fff0dd; color: #9a5d12; font-size: .65rem; font-weight: 850; vertical-align: middle; }
.resource-health { display: inline-flex; margin-left: 6px; padding: 3px 7px; border-radius: 20px; font-size: .65rem; font-weight: 850; vertical-align: middle; }
.resource-health.covered, .resource-gap-total.covered { background: #e1f7eb; color: #138a5f; }
.resource-health.needs-cover, .resource-gap-total.needs-cover { background: #ffeaeb; color: #b63742; }
.project-totals { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; }
.project-totals div { display: flex; flex-direction: column; gap: 5px; }
.project-totals span { color: var(--muted); font-size: .66rem; text-transform: uppercase; }
.project-totals strong { font-size: .95rem; }
.project-actions { display: grid; gap: 7px; }
.episodes { margin: 20px -20px -20px; padding: 18px 20px 16px; border-top: 1px solid #eceef4; border-radius: 0 0 14px 14px; background: #fafbfe; }
.project-shoot-summary { margin-bottom: 20px; padding: 14px; border: 1px solid #f0d7b7; border-radius: 11px; background: #fffaf3; }
.project-shoot-summary .subhead { margin-top: 0; }
.shoot-period-list { display: flex; flex-wrap: wrap; gap: 8px; }
.shoot-period { min-width: 190px; padding: 9px 11px; border: 1px solid #f0dfc8; border-radius: 9px; display: flex; align-items: center; gap: 9px; background: white; }
.shoot-period > span, .shoot-period-number { width: 26px; height: 26px; flex: none; border-radius: 8px; display: grid; place-items: center; background: #1b2234; color: white; font-size: .68rem; font-weight: 850; }
.shoot-period > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.shoot-period strong { font-size: .75rem; }
.shoot-period small { color: var(--muted); font-size: .67rem; }
.project-resource-summary { margin-bottom: 20px; padding: 14px; border: 1px solid #dedaf8; border-radius: 11px; background: #f8f7ff; }
.resource-gap-total { padding: 5px 9px; border-radius: 20px; font-size: .7rem; font-weight: 850; white-space: nowrap; }
.project-resource-grid { display: grid; overflow: hidden; border: 1px solid #e3e0f7; border-radius: 9px; background: white; }
.project-resource-row { display: grid; grid-template-columns: minmax(180px,1fr) 105px 105px 90px; align-items: center; gap: 12px; min-height: 54px; padding: 9px 12px; border-bottom: 1px solid #eef0f5; font-size: .75rem; }
.project-resource-row:last-child { border-bottom: 0; }
.project-resource-row > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.project-resource-row > div span { overflow: hidden; color: var(--muted); font-size: .69rem; text-overflow: ellipsis; white-space: nowrap; }
.project-resource-row > span, .project-resource-row > strong { text-align: right; }
.project-resource-row.has-gap { background: #fff8f8; }
.project-resource-row.has-gap > strong { color: var(--red); }
.project-resource-row.is-covered > strong { color: #138a5f; }
.subhead { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 6px 0 12px; }
.subhead > div { display: flex; flex-direction: column; gap: 4px; }
.subhead strong { font-size: .84rem; }
.subhead span { color: var(--muted); font-size: .72rem; }
.episode-table, .support-list { overflow: hidden; background: white; border: 1px solid #e9ebf2; border-radius: 10px; }
.episode-row { display: grid; grid-template-columns: 1.5fr .55fr .75fr 90px; align-items: center; gap: 12px; padding: 12px 15px; border-bottom: 1px solid #eef0f5; font-size: .78rem; }
.episode-row.manager-episode-row { grid-template-columns: 1.5fr .65fr 90px; }
.episode-row:last-child { border-bottom: 0; }
.episode-row.headings { padding-top: 9px; padding-bottom: 9px; background: #f6f7fb; color: var(--muted); font-size: .65rem; text-transform: uppercase; }
.episode-name { display: flex; align-items: center; gap: 9px; }
.episode-stripe { width: 6px; height: 28px; border-radius: 5px; }
.support-list { padding: 0 14px; }
.support-row { display: grid; grid-template-columns: 38px minmax(150px,1fr) 100px 110px 110px; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid #eef0f5; font-size: .75rem; }
.support-row:last-child { border-bottom: 0; }
.support-person { display: flex; flex-direction: column; gap: 3px; }
.support-person span { color: var(--muted); font-size: .68rem; }
.staff-project-details { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 20px; }
.staff-project-section { min-width: 0; }
.staff-episode-list, .staff-team-list { overflow: hidden; border: 1px solid #e9ebf2; border-radius: 10px; background: white; }
.staff-episode-list > div { min-height: 50px; padding: 10px 13px; display: grid; grid-template-columns: 6px minmax(0,1fr) auto; align-items: center; gap: 10px; border-bottom: 1px solid #eef0f5; }
.staff-episode-list > div:last-child, .staff-team-row:last-child { border-bottom: 0; }
.staff-team-row { min-height: 58px; padding: 9px 13px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #eef0f5; }
.staff-team-row > div:last-child { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.staff-team-row span { overflow: hidden; color: var(--muted); font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.capacity-alert-list { display: grid; gap: 12px; }
.capacity-alert-person { overflow: hidden; border: 1px solid #f0d4d7; border-radius: 12px; background: #fffafb; }
.capacity-alert-person-head { padding: 12px 14px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #f3dfe1; }
.capacity-alert-person-head > div:last-child { display: flex; flex-direction: column; gap: 3px; }
.capacity-alert-person-head span { color: var(--red); font-size: .72rem; font-weight: 750; }
.capacity-alert-day { padding: 12px 14px; display: grid; grid-template-columns: minmax(180px,1fr) auto; align-items: start; gap: 8px 14px; border-bottom: 1px solid #f3e5e6; }
.capacity-alert-day:last-child { border-bottom: 0; }
.capacity-alert-day > div:first-child { display: flex; flex-direction: column; gap: 3px; }
.capacity-alert-day > div:first-child span { color: var(--muted); font-size: .72rem; }
.capacity-alert-projects { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 7px; }
.capacity-alert-projects > span { padding: 5px 8px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid #e6e8ef; border-radius: 20px; background: white; color: #515a6d; font-size: .7rem; }
.capacity-alert-projects i { width: 7px; height: 7px; border-radius: 50%; }
.cost-report-title { display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 14px; padding: 20px; margin-bottom: 18px; background: white; border: 1px solid var(--line); border-radius: 14px; }
.cost-report-title h2 { margin: 2px 0 4px; font-size: 1.35rem; }
.cost-report-title p { margin: 0; color: var(--muted); font-size: .78rem; }
.cost-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 18px; }
.cost-person-row { display: grid; grid-template-columns: 38px minmax(150px,1fr) 72px 72px 95px 95px; align-items: center; gap: 12px; padding: 13px 0; border-bottom: 1px solid #eef0f5; font-size: .8rem; }
.cost-person-row > span, .cost-person-row > strong { text-align: right; }
.cost-person-head { padding: 8px 0; color: var(--muted); font-size: .64rem; font-weight: 800; text-transform: uppercase; }
.cost-person-head > span:nth-child(2) { text-align: left; }
.cost-person { display: flex; flex-direction: column; gap: 3px; }
.cost-person span { color: var(--muted); font-size: .7rem; }
.episode-cost { padding: 13px 0; border-bottom: 1px solid #eef0f5; }
.episode-cost:last-child { border-bottom: 0; }
.episode-cost > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.episode-cost small { display: block; margin-top: 4px; color: var(--muted); }
.dashboard-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; }
.capacity-row { margin: 18px 0; }
.capacity-label { display: flex; justify-content: space-between; font-size: .78rem; }
.timeline-content { max-width: none; }
.timeline-range { align-items: flex-start; }
.timeline-toolbar { align-items: flex-end; }
.timeline-controls, .timeline-toolbar-controls { display: flex; align-items: flex-end; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.timeline-focus, .timeline-date-controls label { display: flex; flex-direction: column; gap: 5px; color: var(--muted); font-size: .875rem; font-weight: 750; }
.timeline-focus select, .timeline-date-controls input {
  height: 38px;
  min-width: 150px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--ink);
  font-size: .875rem;
  outline: 0;
}
.timeline-focus select:focus, .timeline-date-controls input:focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(108,76,255,.1); }
.timeline-date-controls { display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; }
.timeline-date-controls .button { min-height: 38px; }
.timeline-date-controls .link-button { min-height: 38px; padding: 0 5px; }
.planning-tray {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
  padding: 13px 15px;
  border: 1px solid #dfdcf7;
  border-radius: 12px;
  background: #f7f5ff;
}
.planning-title { min-width: 0; max-width: 110px; }
.planning-title strong { font-size: .875rem; }
.planning-title:has(#timeline-project-search) { max-width: none; }
#timeline-project-search { display: block; width: min(10rem,100%); margin-top: 6px; padding: 6px 8px; border: 1px solid #ded9ff; border-radius: 7px; font-size: .8rem; }
.planning-chips [hidden] { display: none !important; }
.planning-chips [data-timeline-project-empty] { align-self: center; color: var(--muted); }

.planning-chips { display: flex; flex-wrap: wrap; gap: 7px; min-width: 0; max-height: 92px; overflow: auto; padding: 2px 1px 5px; scrollbar-width: thin; }
.planning-chip {
  display: inline-flex;
  min-height: 36px;
  flex: none;
  align-items: center;
  gap: 7px;
  padding: 0 11px;
  border: 1px solid #ded9ff;
  border-radius: 8px;
  background: white;
  color: #3f4658;
  font-size: .875rem;
  font-weight: 750;
  cursor: grab;
}
.planning-chip:active { cursor: grabbing; }
.planning-chip i { width: 8px; height: 8px; flex: none; border-radius: 50%; }
.planning-chip:hover, .planning-chip.selected { border-color: var(--purple); background: var(--purple-soft); color: #5e47c7; }
.planning-add { white-space: nowrap; }
.team-selection-prompt { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; padding: 13px 15px; border: 1px dashed #cfc9f7; border-radius: 12px; background: #faf9ff; }
.team-selection-prompt strong { font-size: .875rem; }
.team-selection-prompt span { color: var(--muted); font-size: .75rem; }
.team-availability-summary { display: grid; grid-template-columns: minmax(160px,1.3fr) repeat(4,minmax(105px,.7fr)); gap: 1px; margin-bottom: 14px; overflow: hidden; border: 1px solid #dedaf8; border-radius: 12px; background: #dedaf8; }
.team-availability-summary > div { display: flex; min-height: 64px; flex-direction: column; justify-content: center; gap: 5px; padding: 10px 14px; background: white; }
.team-availability-summary span { color: var(--muted); font-size: .75rem; font-weight: 700; }
.team-availability-summary strong { font-size: 1rem; }
.team-availability-summary small { color: var(--muted); font-size: .68rem; }
.team-availability-summary .available { background: #ecfbf3; }
.team-availability-summary .available strong { color: #138a5f; }
.timeline-panel { overflow: hidden; padding: 0; }
.timeline-scroll { max-height: calc(100vh - 208px); overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.timeline-scroll:focus-visible { outline: 3px solid rgba(108,76,255,.35); outline-offset: -3px; }
.timeline-grid { display: grid; width: max-content; min-width: 100%; }
.timeline-grid > div { min-height: 76px; padding: 10px; border-right: 1px solid #eef0f5; border-bottom: 1px solid #eef0f5; }
.timeline-week-head { position: sticky; z-index: 5; top: 0; }
.timeline-week-head > div { min-height: 38px; padding: 10px 12px; background: #f0edff; color: #6548da; font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.timeline-week-head > .current-week { background: #6c4cff; color: white; }
.timeline-head { position: sticky; z-index: 4; top: 38px; }
.timeline-head > div { min-height: 42px; padding: 12px; background: #f7f8fb; color: var(--muted); font-size: .68rem; text-transform: uppercase; }
.timeline-head > .weekend { background: #e8e8e8; color: #6f7784; }
.timeline-sticky, .timeline-label { position: sticky; z-index: 3; left: 0; box-shadow: 10px 0 18px -18px rgba(17,24,42,.55); }
.timeline-week-head > .timeline-sticky, .timeline-head > .timeline-sticky { z-index: 7; }
.timeline-label { display: flex; align-items: center; gap: 9px; background: white; }
.timeline-label span { display: flex; flex-direction: column; gap: 3px; }
.timeline-label small { color: var(--muted); }
.timeline-day-cell { position: relative; display: grid; align-content: start; gap: 6px; background: white; transition: background .15s, box-shadow .15s; }
.timeline-day-cell.weekend { background: #f0f0f0; box-shadow: inset 0 0 0 1px rgba(17,24,42,.02); }
.timeline-day-cell.weekend.drop-ready { background: #e9e5fa; }
.timeline-day-cell.weekend.drag-over { background: #ded6ff; }
.timeline-day-cell[data-allocation-drop] { cursor: cell; }
.timeline-day-cell.drop-ready { background: #fbfaff; }
.timeline-day-cell.resize-preview { background: #f7f4ff; box-shadow: inset 0 -3px 0 rgba(108,76,255,.42); }
.timeline-day-cell.drag-over { background: #f0edff; box-shadow: inset 0 0 0 2px var(--purple); }
.timeline-day-cell.overbooked { background: #fff8f8; }
.timeline-day-cell.holiday-day { background: repeating-linear-gradient(135deg,#f3f4f7,#f3f4f7 8px,#eceef2 8px,#eceef2 16px); }
.timeline-day-cell.holiday-day.drop-ready { background: repeating-linear-gradient(135deg,#f3f4f7,#f3f4f7 8px,#eceef2 8px,#eceef2 16px); box-shadow: none; cursor: not-allowed; }
.timeline-day-cell.partial-holiday-day { background: repeating-linear-gradient(135deg,#fafbfc,#fafbfc 10px,#f1f3f6 10px,#f1f3f6 16px); }
.timeline-day-cell.partial-holiday-day.drop-ready { cursor: copy; box-shadow: inset 0 0 0 2px rgba(108,76,255,.22); }
.holiday-block { min-height: 44px; padding: 8px 9px; border: 1px solid #d7dae2; border-radius: 7px; display: flex; flex-direction: column; gap: 3px; background: rgba(255,255,255,.86); color: #596173; }
.holiday-block strong { font-size: .72rem; }
.holiday-block small { color: #858c9b; font-size: .66rem; }
.holiday-block-button { width: 100%; font: inherit; text-align: left; cursor: pointer; }
.holiday-block-button:hover { border-color: #9ea5b2; background: white; }
.holiday-block-button:focus-visible { outline: 3px solid rgba(115,123,139,.28); outline-offset: 1px; }
.manual-holiday-block { border-left: 3px solid #737b8b; }
.allocation { position: relative; min-height: 56px; padding: 9px; border-left: 3px solid var(--purple); border-radius: 7px; background: var(--purple-soft); display: flex; flex-direction: column; gap: 4px; font-size: .72rem; }
.allocation small { color: var(--muted); }
.planned-allocation { box-shadow: inset 0 0 0 1px rgba(108,76,255,.12); }
.allocation-button { width: 100%; border-top: 0; border-right: 0; border-bottom: 0; text-align: left; cursor: grab; transition: opacity .15s, transform .15s, filter .15s, box-shadow .15s; }
.allocation-button:active { cursor: grabbing; }
.allocation-button strong, .allocation-button small { padding-right: 18px; }
.allocation-button:hover { filter: saturate(1.2); box-shadow: inset 0 0 0 1px rgba(108,76,255,.35); }
.allocation-button.dragging { opacity: .45; transform: scale(.97); }
.allocation-button.resizing { opacity: .72; }
.timeline-joined-row .timeline-booking-bar { z-index: 2; align-self: start; width: auto; min-width: 0; height: 58px; margin-left: 10px; margin-right: 10px; overflow: visible; }
.timeline-booking-bar strong,.timeline-booking-bar small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.timeline-booking-bar.allocation-button.dragging { transform: none; }
.timeline-booking-bar .allocation-resize-handle { right: 0; width: 16px; }
.timeline-booking-bar:focus-visible { outline: 3px solid var(--purple); outline-offset: 2px; }
.timeline-booking-bar.allocation-button { touch-action: none; user-select: none; -webkit-user-drag: none; transition: none; }
.timeline-booking-bar.pointer-editing { opacity: 1; transform: none; filter: none; cursor: grabbing; box-shadow: inset 0 0 0 2px var(--purple); }
.timeline-booking-bar[data-saving="true"] { cursor: progress; }
.timeline-booking-bar .allocation-resize-handle { touch-action: none; -webkit-user-drag: none; }
.allocation-drag-handle { position: absolute; top: 8px; right: 7px; color: #766f90; font-size: .65rem; letter-spacing: -2px; opacity: .72; }
.resizable-allocation .allocation-drag-handle { right: 14px; }
.allocation-resize-handle { position: absolute; z-index: 2; top: 0; right: -5px; display: block; width: 13px; height: 100%; cursor: ew-resize; }
.allocation-resize-handle::after { content: ""; position: absolute; top: 10px; right: 4px; bottom: 10px; width: 3px; border-radius: 3px; background: #6c4cff; opacity: .72; }
.allocation-resize-handle:hover::after { width: 4px; opacity: 1; }
.capacity-warning { color: var(--red); font-size: .65rem; font-weight: 800; text-transform: uppercase; }
.availability-badge { align-self: end; margin-top: auto; padding-top: 2px; color: var(--muted); font-size: .7rem; font-weight: 800; }
.free-availability { color: #138a5f; }
.partial-availability { color: #9a670f; }
.full-availability, .over-availability { color: var(--red); }
.weekend-availability { color: #7d8492; }
.holiday-availability { color: #596173; }
.view-switch { display: flex; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: white; }
.view-switch button { border: 0; border-radius: 7px; padding: 7px 10px; background: transparent; color: var(--muted); font-size: .74rem; }
.view-switch button.active { background: var(--purple-soft); color: #5e47c7; font-weight: 750; }
.privacy-note { margin: 12px 0 0; color: var(--muted); font-size: .74rem; }
.link-button { border: 0; padding: 0; background: transparent; color: #6548da; font-weight: 750; font-size: .76rem; }
.row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.danger-link { color: var(--red); }
.delete-summary { display: grid; gap: 6px; padding: 16px; border: 1px solid #ffdadd; border-radius: 10px; background: #fff7f7; }
.delete-summary span { color: var(--muted); font-size: .8rem; }
.project-admin-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; padding-top: 16px; border-top: 1px solid #e4e6ed; }
.project-admin-actions > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.project-admin-actions strong { font-size: .78rem; }
.project-admin-actions span { color: var(--muted); font-size: .72rem; line-height: 1.4; }
.project-admin-actions .button { flex: none; }
.project-delete-confirm { margin-top: 16px; }
.calendar-status { display: inline-flex; align-items: center; gap: 6px; }
.calendar-status small { color: var(--muted); font-size: .66rem; white-space: nowrap; }
.holiday-timesheet-cell { background: #f1f2f5; }
.holiday-total { color: #697184; font-size: .7rem; text-transform: uppercase; }
.shoot-date-editor { display: grid; gap: 9px; }
.shoot-period-editor-row { display: grid; grid-template-columns: 28px minmax(160px,1.4fr) 1fr 1fr auto; align-items: end; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: #f8f9fc; }
.shoot-period-editor-row .link-button { min-height: 42px; padding: 0 5px; }
.add-shoot-period { margin-top: 10px; }
.allocation-total { min-height: 42px; justify-content: center; padding: 8px 11px; border-radius: 8px; background: #f6f7fb; }
.allocation-total strong { font-size: .95rem; }
.allocation-days-field { margin-top: 2px; }
.allocation-days-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.allocation-days-head > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.allocation-days-head span { font-size: .78rem; font-weight: 800; }
.allocation-days-head small { color: var(--muted); font-size: .72rem; line-height: 1.35; }
.allocation-days-head .link-button { flex: none; padding-bottom: 2px; }
.allocation-days { display: grid; grid-template-columns: repeat(auto-fit,minmax(118px,1fr)); gap: 8px; max-height: 232px; overflow-y: auto; padding: 10px; border: 1px solid #e2e4ec; border-radius: 10px; background: #f8f9fc; }
.allocation-day { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; border: 1px solid #e3e5ed; border-radius: 9px; background: white; }
.allocation-day.holiday-allocation-day { border-color: #d7dae2; background: #eceef2; }
.allocation-day.holiday-allocation-day input { color: #8c93a1; background: #e4e6eb; }
.allocation-day > span:first-child { display: flex; flex-direction: column; gap: 1px; }
.allocation-day strong { font-size: .76rem; }
.allocation-day small { color: var(--muted); font-size: .66rem; }
.allocation-day-input { position: relative; width: 61px; flex: none; }
.field .allocation-day-input input { height: 34px; padding: 0 20px 0 8px; text-align: right; font-size: .78rem; font-weight: 750; }
.allocation-day-input em { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); color: var(--muted); font-size: .67rem; font-style: normal; pointer-events: none; }
.allocation-delete { margin-right: auto; }
.back-button { margin-bottom: 18px; }
dialog { width: min(620px, calc(100% - 28px)); max-height: calc(100vh - 40px); padding: 0; border: 0; border-radius: 16px; box-shadow: 0 30px 90px rgba(17,24,42,.25); }
.resource-planner-dialog { width: min(1120px, calc(100% - 28px)); }
dialog::backdrop { background: rgba(17,24,42,.55); backdrop-filter: blur(3px); }
.dialog-card { padding: 24px; overflow-y: auto; }
.dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.dialog-head h2 { margin: 0; font-size: 1.15rem; }
.dialog-head p { margin: 5px 0 0; color: var(--muted); font-size: .78rem; }
.dialog-close { border: 0; background: transparent; color: var(--muted); font-size: 1.25rem; }
.form-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field.full { grid-column: 1 / -1; }
.field label, .field > span { font-size: .75rem; font-weight: 750; }
.field input, .field select { width: 100%; height: 42px; padding: 0 11px; border: 1px solid #dfe2eb; border-radius: 8px; background: white; color: var(--ink); outline: 0; }
.field input:focus, .field select:focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(108,76,255,.1); }
.dialog-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 22px; }
.resource-plan-options { margin-bottom: 14px; }
.resource-plan-switch, .resource-plan-option-note { display: flex; align-items: center; gap: 11px; padding: 12px 14px; border: 1px solid #dedaf8; border-radius: 11px; background: #f8f7ff; }
.resource-plan-switch { cursor: pointer; }
.resource-plan-switch input { width: 18px; height: 18px; flex: none; accent-color: var(--purple); }
.resource-plan-switch > span, .resource-plan-option-note { min-width: 0; }
.resource-plan-switch > span, .resource-plan-option-note { flex-direction: column; align-items: flex-start; gap: 3px; }
.resource-plan-switch strong, .resource-plan-option-note strong { font-size: .82rem; }
.resource-plan-switch small, .resource-plan-option-note span { color: var(--muted); font-size: .73rem; line-height: 1.4; }
.resource-stage-list { display: grid; gap: 10px; }
.resource-stage { display: grid; grid-template-columns: 180px minmax(150px,1.3fr) minmax(125px,1fr) minmax(125px,1fr) 145px; align-items: end; gap: 10px; padding: 14px; border: 1px solid #e4e1f7; border-radius: 12px; background: #faf9ff; }
.resource-stage-title { display: flex; align-items: center; gap: 10px; align-self: center; }
.resource-stage-title > div, .resource-candidate-person, .resource-candidate-hours { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.resource-stage-title small, .resource-candidate-person span, .resource-candidate-hours span, .resource-result-head span, .resource-no-candidates span { color: var(--muted); font-size: .75rem; }
.resource-stage-number { display: grid; width: 34px; height: 34px; flex: none; place-items: center; border-radius: 9px; background: var(--purple); color: white; font-size: .72rem; font-weight: 850; }
.resource-availability-results { display: grid; gap: 16px; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.resource-gap-overview { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; overflow: hidden; border: 1px solid #dedaf8; border-radius: 12px; background: #dedaf8; }
.resource-gap-overview > div { display: flex; min-height: 70px; flex-direction: column; justify-content: center; gap: 5px; padding: 11px 14px; background: white; }
.resource-gap-overview span, .resource-coverage-strip span { color: var(--muted); font-size: .68rem; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.resource-gap-overview strong { font-size: 1.18rem; }
.resource-gap-overview .selected { background: #effaf4; }
.resource-gap-overview .selected strong { color: #138a5f; }
.resource-gap-overview .gap { background: #fff1f2; }
.resource-gap-overview .gap strong { color: var(--red); }
.resource-result-stage { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; }
.resource-result-stage.has-resource-gap { border-color: #efc9cd; }
.resource-result-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; background: #f6f7fb; }
.resource-result-head > div { display: flex; flex-direction: column; gap: 4px; }
.resource-gap-pill { display: inline-flex; flex: none; padding: 5px 9px; border-radius: 20px; font-size: .68rem; font-weight: 850; }
.resource-gap-pill.pending { background: #ece8ff; color: #5c41dd; }
.resource-gap-pill.covered { background: #e1f7eb; color: #138a5f; }
.resource-gap-pill.partial { background: #fff0dd; color: #9a670f; }
.resource-gap-pill.missing { background: #ffeaeb; color: var(--red); }
.resource-coverage-strip { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: #e9ebf2; }
.resource-coverage-strip > div { display: flex; min-height: 58px; flex-direction: column; justify-content: center; gap: 4px; padding: 9px 14px; background: white; }
.resource-coverage-strip > div:nth-child(n+2) { text-align: right; }
.resource-coverage-strip .gap { background: #fff8f8; }
.resource-coverage-strip .gap strong { color: var(--red); }
.resource-coverage-bar { height: 5px; background: #f0dadd; }
.resource-coverage-bar i { display: block; height: 100%; border-radius: 0 5px 5px 0; background: #19a974; transition: width .2s ease; }
.resource-candidate-list { display: grid; padding: 0 14px; }
.resource-candidate { display: grid; grid-template-columns: 22px 38px minmax(190px,1.2fr) minmax(150px,.8fr) auto; align-items: center; gap: 10px; min-height: 68px; padding: 10px 0; border-bottom: 1px solid #eef0f5; cursor: pointer; }
.resource-candidate:last-child { border-bottom: 0; }
.resource-candidate input { width: 17px; height: 17px; accent-color: var(--purple); }
.resource-candidate-person span, .resource-candidate-hours span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.resource-candidate-hours { text-align: right; }
.resource-candidate.is-available:hover { background: #f2fbf6; }
.resource-candidate.is-partial:hover { background: #fffbf0; }
.resource-candidate.is-unavailable { opacity: .72; }
.resource-no-candidates { display: flex; flex-direction: column; gap: 5px; padding: 18px 0; text-align: center; }
.resource-planner-actions { position: sticky; z-index: 3; bottom: -24px; margin: 22px -24px -24px; padding: 14px 24px; border-top: 1px solid var(--line); background: rgba(255,255,255,.96); backdrop-filter: blur(8px); }
.toast { position: fixed; z-index: 30; right: 24px; bottom: 24px; max-width: 380px; padding: 12px 15px; border-radius: 10px; background: #172033; color: white; box-shadow: var(--shadow); font-size: .8rem; opacity: 0; pointer-events: none; transform: translateY(8px); transition: .2s; }
.toast.show { opacity: 1; transform: translateY(0); }
.toast.error { background: #9f2630; }

@media (max-width: 1080px) {
  .project-summary { grid-template-columns: 46px 1fr 90px 160px; }
  .project-actions { grid-column: 2 / -1; grid-template-columns: repeat(2,1fr); }
  .cost-grid { grid-template-columns: 1fr; }
  .metric-grid.four { grid-template-columns: repeat(2,1fr); }
  .resource-stage { grid-template-columns: 170px repeat(2,minmax(140px,1fr)); }
  .resource-stage-title { grid-row: span 2; }
}
@media (max-width: 860px) {
  .staff-project-details { grid-template-columns: 1fr; }
  .timeline-toolbar { align-items: flex-start; }
  .timeline-controls, .timeline-toolbar-controls { width: 100%; justify-content: flex-start; }
  .planning-tray { grid-template-columns: 1fr auto; }
  .planning-title { grid-column: 1 / -1; }
  .team-availability-summary { grid-template-columns: repeat(3,1fr); }
  .team-availability-summary > div:first-child { grid-column: span 2; }
  .app-shell { grid-template-columns: 74px minmax(0,1fr); }
  .sidebar { padding: 22px 9px; }
  .brand { padding: 0 8px 28px; }
  .brand-copy, .nav button span:not(.nav-icon):not(.nav-badge), .settings-button span, .profile-copy { display: none; }
  .nav button, .settings-button { justify-content: center; padding: 11px 8px; }
  .profile { grid-template-columns: 1fr; justify-items: center; }
  .search-field { display: none; }
  .metric-grid { grid-template-columns: repeat(2,1fr); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .project-resource-grid { overflow-x: auto; }
  .project-resource-row { min-width: 620px; }
  .resource-gap-overview, .resource-coverage-strip { grid-template-columns: repeat(2,1fr); }
  .resource-stage { grid-template-columns: repeat(2,1fr); }
  .resource-stage-title { grid-column: 1 / -1; grid-row: auto; }
  .resource-candidate { grid-template-columns: 22px 38px minmax(150px,1fr) auto; }
  .resource-candidate-hours { grid-column: 3 / -1; text-align: left; }
}
@media (max-width: 620px) {
  .timeline-date-controls { display: grid; width: 100%; grid-template-columns: 1fr 1fr; }
  .timeline-date-controls .button { align-self: end; }
  .timeline-focus { width: 100%; }
  .timeline-focus select { width: 100%; }
  .planning-tray { grid-template-columns: 1fr; }
  .planning-title, .planning-chips, .planning-add { width: 100%; }
  .planning-title { grid-column: auto; }
  .team-selection-prompt { align-items: flex-start; flex-direction: column; }
  .team-availability-summary { grid-template-columns: repeat(2,1fr); }
  .team-availability-summary > div:first-child { grid-column: span 2; }
  .timeline-scroll { max-height: calc(100vh - 290px); }
  .motion-home-copy {
    width: calc(100% - 48px);
    margin-left: 24px;
    padding: 90px 0 64px;
  }
  .motion-logo-plate { width: 228px; padding: 13px 15px; }
  .motion-kicker { margin-top: 28px; }
  .motion-home h1 { font-size: 44px; }
  .motion-intro { font-size: 16px; }
  .motion-corner-note { display: none; }
  .motion-ring-a { right: -230px; }
  .app-shell { display: block; }
  .sidebar { z-index: 10; position: fixed; inset: auto 0 0; width: 100%; height: 66px; padding: 7px 8px; display: block; }
  .brand, .side-bottom { display: none; }
  .nav { display: flex; justify-content: space-around; }
  .nav button { width: auto; min-width: 45px; }
  .nav button:nth-child(n+5) { display: none; }
  .nav-badge { display: none; }
  .nav button[data-view="Holiday"] { position: relative; }
  .nav .holiday-alert { display: block; position: absolute; top: 0; right: -4px; margin: 0; font-style: normal; }
  .app-main { padding-bottom: 66px; }
  .topbar { min-height: 76px; padding: 15px 18px; }
  .topbar h1 { font-size: 1.3rem; }
  .calendar-sync-button { width: 40px; padding: 0; justify-content: center; }
  .calendar-sync-button strong { display: none; }
  .content { padding: 20px 16px 38px; }
  .company-holiday-panel { grid-template-columns: 1fr; align-items: stretch; }
  .company-holiday-panel .button { width: 100%; }
  .section-head, .toolbar { align-items: flex-start; flex-direction: column; }
  .actions { width: 100%; }
  .actions .button { flex: 1; }
  .metric-grid, .metric-grid.four { grid-template-columns: 1fr; }
  .project-summary { grid-template-columns: 42px 1fr; }
  .project-summary > .status, .project-totals { display: none; }
  .staff-project-summary { grid-template-columns: 42px 1fr; }
  .staff-project-summary > .status { display: none; }
  .staff-project-summary > .button { grid-column: 1 / -1; }
  .project-actions { grid-column: 1 / -1; }
  .project-admin-actions { align-items: stretch; flex-direction: column; }
  .project-admin-actions .button { width: 100%; }
  .support-row { min-width: 660px; }
  .support-list { overflow-x: auto; }
  .episode-row { min-width: 560px; }
  .episode-table { overflow-x: auto; }
  .cost-report-title { grid-template-columns: 42px 1fr; }
  .cost-report-title > .status { display: none; }
  .cost-person-row { min-width: 610px; }
  .panel.cost-people { overflow-x: auto; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  .allocation-days-head { align-items: flex-start; flex-direction: column; gap: 8px; }
  .allocation-days { grid-template-columns: 1fr; }
  .shoot-period-editor-row { grid-template-columns: 28px 1fr; align-items: center; }
  .shoot-period-editor-row .field, .shoot-period-editor-row .link-button { grid-column: 2; }
  .shoot-period-editor-row .link-button { min-height: auto; justify-self: start; }
  .resource-stage { grid-template-columns: 1fr; }
  .resource-stage-title { grid-column: auto; }
  .resource-gap-overview, .resource-coverage-strip { grid-template-columns: 1fr 1fr; }
  .resource-result-head { align-items: flex-start; flex-direction: column; }
  .resource-candidate { grid-template-columns: 22px 34px 1fr; }
  .resource-candidate > .status { grid-column: 3; justify-self: start; }
  .resource-candidate-hours { grid-column: 3; }
  .resource-planner-actions { flex-wrap: wrap; }
  .resource-planner-actions .button { flex: 1; }
  .login-card, .pending-card { padding: 28px 22px; }
}

@media (prefers-reduced-motion: reduce) {
  .motion-canvas *,
  .motion-canvas { animation: none !important; }
}

/* Month overview: one compact column per calendar day. */
.timeline-month .timeline-grid{width:100%}
.timeline-month .timeline-grid>div{padding:4px 2px;min-width:0}
.timeline-month .timeline-grid>.timeline-label{padding:10px;min-height:76px}
.timeline-month .timeline-label .avatar{display:none}
.timeline-month .timeline-label strong{font-size:.8rem;overflow-wrap:anywhere}
.timeline-month .timeline-label small{font-size:.65rem}
.timeline-month .timeline-week-head>div{min-height:38px;display:flex;align-items:center;justify-content:center;font-size:.6rem;overflow:hidden}
.timeline-month .timeline-head>div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:.6rem}
.timeline-month .timeline-head b{font-size:.75rem}
.timeline-month .timeline-day-cell{gap:3px}
.timeline-month .allocation{padding:3px 2px;min-width:0;max-width:100%;min-height:20px;border-radius:3px}
.timeline-month .allocation strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.6rem}
.timeline-month .allocation small,.timeline-month .allocation-drag-handle,.timeline-month .allocation-resize-handle{display:none}
.month-cell-status{text-align:center;font-size:.58rem;color:var(--muted);overflow:hidden}
.timeline-month .overbooked .month-cell-status{color:#ba3333;font-weight:800}

.timeline-month .holiday-block{padding:2px;overflow:hidden;min-width:0}.timeline-month .holiday-block strong{display:block;overflow:hidden;text-overflow:ellipsis;font-size:.55rem}.timeline-month .holiday-block small{display:none}

/* Personal menu ordering: preserve the current page while moving only links. */
.sidebar .nav button[data-view]{cursor:grab}
.sidebar .nav button[data-view]:active{cursor:grabbing}
.sidebar .nav .nav-item-label{flex:1;min-width:0}
.sidebar .nav .menu-dragging{opacity:.5}
.sidebar .nav .menu-drop-before{box-shadow:inset 0 3px 0 #f4e548}
.sidebar .nav .menu-drop-after{box-shadow:inset 0 -3px 0 #f4e548}
.sidebar .nav button[data-view]:focus-visible{outline:2px solid #f4e548;outline-offset:1px}
.archived-projects { margin-top:24px; padding:20px; }
.archived-projects > summary { cursor:pointer; font-weight:700; font-size:18px; }
.archived-projects > p { color:var(--muted); margin:14px 0; }
.my-week-planner{flex-wrap:wrap;margin-bottom:14px}
.my-week-planner .planning-title small{display:block;max-width:240px;margin-top:5px;color:#788397;font-size:12px}
.my-week-planner .planning-chips{max-height:150px;overflow:auto;flex:1;min-width:240px}
.my-week-planner [hidden]{display:none!important}
.my-week-planner input{padding:10px;border:1px solid #dce0eb;border-radius:8px}
.my-week-period{display:inline-flex;border:1px solid #dce0eb;border-radius:9px;padding:3px;background:#fff;gap:3px}.my-week-period button{border:0;border-radius:6px;padding:8px 16px;background:transparent;color:#59667d;font:inherit;font-size:13px;font-weight:600;cursor:pointer}.my-week-period button[aria-pressed=true]{background:#ede8fc;color:#6745d7}.my-week-period button:focus-visible{outline:2px solid #7954df;outline-offset:2px}
.my-week-toolbar,.my-week-month-toolbar{flex-wrap:wrap}.my-week-month-toolbar .week-label{min-width:160px}.my-week-month-panel{overflow:hidden}.my-week-month-scroll{overflow:auto}.my-week-month-grid{display:grid;grid-template-columns:repeat(7,minmax(135px,1fr));min-width:945px;border-top:1px solid #e8eaf2}.my-week-month-heading{padding:12px 14px;background:#f5f6fc;color:#59667d;font-size:12px;font-weight:700;text-transform:uppercase;border-right:1px solid #e8eaf2}.my-week-month-day{min-height:140px;padding:10px;display:flex;flex-direction:column;align-items:stretch;gap:7px;border-right:1px solid #e8eaf2;border-bottom:1px solid #e8eaf2;background:#fff}.my-week-month-day.outside-month{background:#f8f9fc}.my-week-month-day.outside-month .my-week-month-date{color:#929aad}.my-week-month-day.is-today{background:#f9f7ff;box-shadow:inset 0 0 0 2px #b7a5ef}.my-week-month-date{align-self:flex-start;min-width:29px;min-height:29px;background:transparent;border:0;border-radius:6px;text-align:left;padding:4px 7px;color:#303c51;font:inherit;font-size:13px;font-weight:700;cursor:pointer}.my-week-month-date[aria-current=date]{background:#7552d8;color:#fff}.my-week-month-date:hover{background:#ede8fc;color:#6745d7}.my-week-month-booking{border:1px solid color-mix(in srgb,var(--project-colour) 25%,white);border-left:3px solid var(--project-colour);border-radius:7px;background:color-mix(in srgb,var(--project-colour) 8%,white);padding:9px;text-align:left;display:flex;flex-direction:column;gap:5px;cursor:pointer;font:inherit;color:#303c51;overflow-wrap:anywhere}.my-week-month-booking:hover{background:color-mix(in srgb,var(--project-colour) 17%,white)}.my-week-month-booking strong{font-size:12px;line-height:1.4}.my-week-month-booking span,.my-week-month-booking small{font-size:11px;color:#59667d;line-height:1.4}.my-week-month-leave{font-size:11px;background:#fff1e8;color:#915b35;padding:5px 7px;border-radius:5px}.my-week-draft-note{font-size:13px;background:#fff7e7;border:1px solid #ead9b6;padding:12px 16px;border-radius:8px;margin-bottom:18px}

/* My Week: one column per day, with editable project durations. */
.my-week-panel{min-width:0}
.my-week-columns-scroll{overflow:auto;max-height:78vh;scrollbar-gutter:stable}
.my-week-columns{display:grid;grid-template-columns:repeat(var(--week-days),190px);gap:12px;align-items:stretch;padding:2px 2px 14px}
.my-week-column{min-width:0;background:#f7f8fc;border:1px solid #e2e5ef;border-radius:13px;display:flex;flex-direction:column;position:relative}
.my-week-column-month{display:block;font-size:10px;font-weight:650;color:#68758b;margin-bottom:8px}
.my-week-column.is-week-start{border-left:3px solid #b7a5ef}
.my-week-columns-scroll:focus-visible{outline:2px solid #7954df;outline-offset:3px}
.my-week-column.is-today{border-color:#b6a2f5;background:#f6f3ff}
.my-week-column.drag-over{outline:2px solid #7954df;outline-offset:-2px;background:#ede6ff}
.my-week-column-head{position:sticky;top:0;z-index:2;padding:15px 12px;background:#f7f8fc;border-radius:13px 13px 0 0;border-bottom:1px solid #e2e5ef}
.is-today>.my-week-column-head{background:#eee8ff}
.my-week-column.is-weekend{background:#e9ecf1;border-color:#d1d6df}
.my-week-column.is-weekend>.my-week-column-head{background:#e0e4eb;border-color:#cbd1dd}
.my-week-column.is-weekend .my-week-day-empty{background:#e5e8ee;border-color:#c6ccd7;color:#647087}
.my-week-weekend-label{display:block;font-size:10px;font-weight:650;color:#616c80;margin:-9px 0 12px}
.my-week-month-heading.is-weekend,.my-week-month-day.is-weekend{background:#e9ecf1}
.my-week-column-date{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:18px;color:#54617b}
.my-week-column-date strong{display:flex;align-items:center;gap:8px;font-size:13px;text-transform:uppercase;letter-spacing:.02em}
.my-week-column-date b{font-size:22px;letter-spacing:-.04em;color:#263047}
.my-week-column-date>span{font-size:10px;font-weight:700;color:#6745d7;background:#fff;padding:4px 7px;border-radius:5px}
.my-week-column-leave{display:block;color:#8e6335;font-size:11px;margin:-10px 0 10px}
.my-week-load-title{display:flex;flex-direction:column;gap:7px;margin-bottom:10px}
.my-week-load-title>strong{font-size:23px;line-height:1;font-weight:750;letter-spacing:-.04em;color:#273149}
.my-week-load-title strong small{font-size:13px;font-weight:500;letter-spacing:0;color:#7a8498}
.my-week-load-title>span{font-size:11px;color:#65718a;font-weight:600}
.my-week-load-title>.is-full{color:#25785b}
.my-week-load-title>.is-overtime{color:#b35913}
.my-week-load-bar{height:12px;border-radius:4px;background:#e4e7f0;display:flex;overflow:hidden;position:relative;gap:1px}
.my-week-load-bar i{display:block;flex-shrink:1;min-width:0;height:100%}
.my-week-load-bar.is-overtime{outline:2px solid #e4a459;outline-offset:2px}
.my-week-load-bar b{position:absolute;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 0 1px #b35913}
.my-week-day-stack{padding:10px;display:flex;flex-direction:column;gap:10px;min-height:356px;flex:1}
.my-week-day-empty{min-height:320px;border:1px dashed #d8ddea;border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;text-align:center;color:#7a859b;padding:12px}
.my-week-day-empty span{font-size:13px;font-weight:600}.my-week-day-empty small{font-size:11px;line-height:1.5}
.my-week-day-card{box-sizing:border-box;min-height:148px;flex-shrink:0;position:relative;border:1px solid color-mix(in srgb,var(--project-colour) 30%,white);border-left:4px solid var(--project-colour);background:color-mix(in srgb,var(--project-colour) 9%,white);border-radius:10px;padding:12px 10px 30px;display:flex;flex-direction:column;gap:8px;box-shadow:0 2px 3px #27314906}
.my-week-card-title{position:relative;display:block;width:100%;border:0;background:transparent;color:inherit;font:inherit;text-align:left;padding:0 20px 0 0;cursor:pointer;border-radius:3px}
.my-week-card-title:hover strong{text-decoration:underline}.my-week-card-title:focus-visible{outline:2px solid var(--project-colour);outline-offset:4px}
.my-week-card-options{position:absolute;right:0;top:0;font-size:10px;color:#647087;letter-spacing:1px}
.my-week-card-title strong{font-size:12px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.my-week-card-title small{display:block;font-size:10px;color:#647087;margin-top:4px}
.my-week-card-meta{display:flex;flex-wrap:wrap;gap:5px;color:#637087;font-size:10px}.my-week-card-meta span{font-weight:650}.my-week-card-meta small{font-size:10px}
.my-week-card-hours{display:flex;align-items:center;gap:7px;margin-top:auto;font-size:11px;color:#647087}
.my-week-card-hours .hours-input{width:66px;padding:7px 8px;font-size:15px;font-weight:650;height:34px;background:#fff;border-color:color-mix(in srgb,var(--project-colour) 25%,white)}
.my-week-hours-resize{position:absolute;bottom:0;left:0;right:0;min-height:25px;display:flex;align-items:center;justify-content:center;gap:6px;cursor:ns-resize;touch-action:none;user-select:none;border-top:1px solid color-mix(in srgb,var(--project-colour) 18%,white);background:color-mix(in srgb,var(--project-colour) 13%,white);border-radius:0 0 9px 6px;color:#65537f}
.my-week-hours-resize i{width:18px;height:5px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;opacity:.6}.my-week-hours-resize span{font-size:9px;font-weight:600}
.my-week-hours-resize:hover,.my-week-hours-resize:focus-visible{background:color-mix(in srgb,var(--project-colour) 23%,white);outline:2px solid var(--project-colour);outline-offset:-2px}
.my-week-day-card.is-resizing{box-shadow:0 4px 18px #6745d72b;z-index:1}.my-week-day-card.is-zero{background:#fff;border-style:dashed}
.my-week-add-day{margin:0 10px 10px;padding:10px;border:1px dashed #c9c3dc;border-radius:8px;background:#fff;color:#6c51a9;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.my-week-add-day:hover{background:#eee8ff}
@media(max-width:620px){.my-week-columns{grid-template-columns:repeat(var(--week-days),230px)}.my-week-panel .panel-title{align-items:flex-start;gap:10px}.my-week-panel .panel-title .status{display:none}}

.timeline-sync-note{font-size:12px;color:#67738b;line-height:1.5;margin:-4px 0 18px}
.my-week-save{display:flex;align-items:center;gap:10px;font-size:12px;color:#67738b;min-height:36px}
.my-week-save[data-week-save-state="saved"]{color:#267754}
.my-week-save[data-week-save-state="error"]{color:#b43e45}

.holiday-pilot-note{display:flex;gap:18px;align-items:flex-start;padding:16px 20px;margin-bottom:22px;border:1px solid #d8cdee;background:#f4effc;border-radius:12px;color:#655080;font-size:13px;line-height:1.6}.holiday-pilot-note strong{white-space:nowrap;color:#6745b0}.holiday-person-picker{display:flex;align-items:center;gap:12px;margin:20px 0 15px}.holiday-person-picker label{font-size:13px;font-weight:650}.holiday-person-picker select,.holiday-content .panel-title select{padding:10px 12px;border:1px solid #dce0eb;border-radius:8px;background:#fff;max-width:100%;font:inherit;font-size:13px}.holiday-content .metric strong small{font-size:14px;color:#798398;font-weight:500}.holiday-allowance-note{font-size:12px;color:#748095;line-height:1.6;margin:0 0 24px}.holiday-requests{display:flex;flex-direction:column;gap:14px}.holiday-request{border:1px solid #e4e6ef;border-radius:10px;padding:18px}.holiday-request-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.holiday-request-heading>div{display:flex;flex-direction:column;gap:7px}.holiday-request-heading>div>strong{font-size:15px}.holiday-request-heading>div>span,.holiday-request p{font-size:12px;color:#68738a;line-height:1.6}.holiday-request .row-actions{margin:14px 0 4px;flex-wrap:wrap;gap:10px}.holiday-history{font-size:11px;color:#778298;margin-top:14px}.holiday-history summary{cursor:pointer}.holiday-error{padding:14px;border:1px solid #e8bac1;background:#fff2f4;color:#ae394c;border-radius:8px}.holiday-request-preview{padding:12px 14px;background:#f4f1fb;border-radius:8px;color:#655180;font-size:13px;line-height:1.6}.holiday-content .toolbar{flex-wrap:wrap;gap:12px}@media(max-width:620px){.holiday-pilot-note{flex-direction:column;gap:5px}.holiday-request-heading{flex-direction:column}.holiday-person-picker{align-items:flex-start;flex-direction:column}.holiday-content .metric-grid{grid-template-columns:1fr}}
.my-week-save button[hidden]{display:none}
.overview-toolbar{flex-wrap:wrap;gap:14px}
.overview-toolbar .week-nav{flex-wrap:wrap}
.overview-guidance{margin:-2px 0 18px;color:var(--muted);font-size:.78rem;line-height:1.5}
.support-row.overview-person{min-width:0;grid-template-columns:38px minmax(0,1fr) auto}
.overview-person .link-button{align-self:flex-start;padding:3px 0;font-size:.72rem}
.support-person .overview-over{color:var(--red);font-weight:700}
.capacity-period-note{padding:0 14px;color:var(--muted);font-size:.78rem}
/* Tentative resource bookings stay distinct from confirmed projects. */
.potential-projects{margin:0 0 18px;padding:16px 20px;background:#fffaf0;border:1px dashed #bf8a36;border-radius:14px;color:#413522}
.potential-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}
.potential-projects p{margin:5px 0 0;font-size:13px;line-height:1.5;color:#75664e}
.potential-heading .button{flex-shrink:0}
.potential-projects details{margin-top:12px}
.potential-projects summary{cursor:pointer;font-size:13px;font-weight:700}
.potential-list{margin-top:10px}
.potential-row{display:flex;gap:16px;align-items:center;padding:12px 0;border-top:1px solid #e8dcc6}
.potential-row>div:first-child{flex:1;min-width:0}
.potential-row strong,.potential-row small{display:block;overflow-wrap:anywhere}
.potential-row small{color:#75664e;margin-top:3px}
.potential-status{background:#f7e8bf;color:#765210}
.potential-allocation{border-top:1px dashed #b0781b!important;border-right:1px dashed #b0781b!important;border-bottom:1px dashed #b0781b!important}
@media(max-width:700px){.potential-heading,.potential-row{flex-wrap:wrap}.potential-heading .button{width:100%}.potential-row .row-actions{width:100%}}

.holiday-tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin:0 0 24px;padding-bottom:12px;flex-wrap:wrap}.holiday-tabs button{border:0;background:transparent;padding:10px 16px;border-radius:8px;font:inherit;font-size:14px;font-weight:650;color:var(--muted);cursor:pointer}.holiday-tabs button[aria-pressed=true]{background:#eee8ff;color:#6745b0}.holiday-tabs button span{display:inline-block;background:#6745b0;color:#fff;border-radius:12px;padding:1px 7px;margin-left:8px;font-size:11px}.sickness-heading{margin-bottom:20px}.sickness-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.sickness-policy{margin-top:22px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:18px 22px;font-size:13px;line-height:1.65;color:var(--muted)}.sickness-policy summary,.sickness-history>summary,.sickness-evidence summary{font-weight:650;color:var(--navy);cursor:pointer}.sickness-policy>div{padding-top:12px}.sickness-policy p{margin:8px 0}.sickness-people{display:flex;flex-direction:column}.sickness-person-row{display:grid;grid-template-columns:minmax(150px,1fr) 80px minmax(170px,1.2fr) 16px;align-items:center;gap:18px;padding:18px 8px;width:100%;border:0;border-top:1px solid var(--line);background:transparent;color:var(--navy);text-align:left;font:inherit;cursor:pointer}.sickness-person-row:hover{background:#f8f6fd}.sickness-person-row>span{display:flex;flex-direction:column;gap:5px}.sickness-person-row small{color:var(--muted);font-size:12px;line-height:1.5}.sickness-person-row strong{font-size:14px}.sickness-days strong{font-size:24px}.sickness-trigger-label.is-trigger{color:#aa6422}.sickness-back{margin-bottom:16px}.sickness-total{color:var(--muted);font-size:13px;white-space:nowrap}.sickness-total strong{font-size:36px;color:var(--navy);margin-right:5px}.sickness-progress{height:9px;background:#edf0f6;border-radius:20px;overflow:hidden;margin-top:12px}.sickness-progress i{display:block;height:100%;background:#7957cd;border-radius:20px}.sickness-thresholds{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:14px 0}.sickness-thresholds>div{border:1px solid var(--line);border-radius:8px;padding:12px 8px;color:var(--muted);display:flex;flex-direction:column;gap:5px}.sickness-thresholds span{font-size:11px}.sickness-thresholds strong{font-size:14px}.sickness-thresholds .reached{background:#f2edf9;border-color:#e3d8f4;color:#6745b0}.sickness-thresholds .current{border-color:#8059c7;box-shadow:inset 0 -3px #8059c7}.sickness-person-detail>.muted{font-size:12px}.sickness-review-card{display:flex;justify-content:space-between;gap:22px;align-items:center;padding:18px;background:#fff9f0;border:1px solid #ecd8b9;border-radius:10px;margin-top:22px}.sickness-review-card h3{font-size:17px;margin:4px 0 8px}.sickness-review-card p{font-size:13px;line-height:1.6;color:#786647;margin:6px 0}.sickness-review-card .button{flex-shrink:0}.sickness-no-trigger{font-size:13px;color:var(--muted);margin:20px 0 0}.sickness-return-panel,.sickness-evidence,.sickness-history{margin-top:20px}.sickness-return-row,.sickness-checkins>div{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 0;border-top:1px solid var(--line)}.sickness-return-row>div,.sickness-checkins>div>span{display:flex;flex-direction:column;gap:6px;font-size:14px}.sickness-return-row span,.sickness-checkins small{font-size:12px;color:var(--muted)}.sickness-return-row .button{flex-shrink:0}.sickness-checkins{margin-top:20px}.sickness-checkins h3{font-size:14px}.sickness-evidence p{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--muted)}.sickness-history article{padding:16px 0;border-top:1px solid var(--line);margin-top:16px}.sickness-history h3{font-size:15px}.sickness-history p,.sickness-history details{font-size:12px;line-height:1.65;color:var(--muted)}.sickness-note{white-space:pre-wrap;overflow-wrap:anywhere}.sickness-person-row:focus-visible,.holiday-tabs button:focus-visible{outline:2px solid #8059c7;outline-offset:2px}@media(max-width:900px){.sickness-metrics{grid-template-columns:1fr}.sickness-person-row{grid-template-columns:minmax(0,1fr) 60px 14px}.sickness-person-row>span:nth-child(3){grid-column:1/3;grid-row:2}.sickness-person-row>span:last-child{grid-column:3;grid-row:1}.sickness-review-card{align-items:flex-start;flex-direction:column}.sickness-thresholds{gap:4px}.sickness-thresholds>div{padding:8px 5px}}@media(max-width:620px){.sickness-return-row{align-items:flex-start;flex-direction:column}.sickness-person-detail .panel-title{align-items:flex-start;flex-direction:column}.sickness-total strong{font-size:28px}.sickness-evidence p{flex-direction:column}.sickness-thresholds{grid-template-columns:repeat(3,minmax(0,1fr))}}

.holiday-review-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.holiday-review-toolbar label{font-size:13px}.holiday-review-toolbar select{padding:8px;border:1px solid #dce0eb;border-radius:8px;font:inherit}.holiday-review-key{font-size:12px;line-height:1.6;color:#68738a}.holiday-review-warning{background:#fff4df;border:1px solid #ebd29a;padding:12px;border-radius:8px;font-size:13px;color:#815a12}.holiday-review-scroll{overflow:auto;max-height:60vh;border:1px solid #dce0eb;border-radius:10px}.holiday-review-table{width:100%;min-width:1100px;border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:12px}.holiday-review-table th,.holiday-review-table td{padding:10px;vertical-align:top;border-right:1px solid #e6e8ef;border-bottom:1px solid #e6e8ef}.holiday-review-table thead th{position:sticky;top:0;background:#f3f4fa;z-index:2}.holiday-review-table th:first-child{width:150px;position:sticky;left:0;background:#fff;z-index:1}.holiday-review-table thead th:first-child{z-index:3;background:#f3f4fa}.holiday-review-table th small{display:block;margin-top:6px;font-weight:500;color:#6c4cff}.holiday-review-table .weekend{background:#f0f0f0}.holiday-review-table .requested-date{background:#f3edff;box-shadow:inset 0 3px #8c63d7}.holiday-review-project{background:#fff;border:1px solid #e1e2ed;border-left:3px solid #6c4cff;border-radius:6px;padding:8px;margin:7px 0}.holiday-review-project strong,.holiday-review-project small{display:block;line-height:1.5;overflow-wrap:anywhere}.holiday-review-leave{padding:7px;margin-bottom:6px;background:#e9eef4;color:#46536c;border-radius:6px;font-size:11px}.holiday-review-leave.requested{background:#ded0fa;color:#51307d;font-weight:650}.holiday-review-leave.pending{background:#fff0cf;color:#785815}.holiday-review-capacity{display:block;margin-top:10px;color:#50785c;font-weight:650}.holiday-review-capacity.over{color:#ae394c}

.holiday-calendar-filters{display:flex;gap:16px;flex-wrap:wrap;align-items:end;margin:20px 0 12px}.holiday-calendar-filters label{display:grid;gap:6px;font-size:13px;font-weight:600}.holiday-calendar-filters select,.holiday-content input[type=month]{font:inherit;font-size:13px;padding:9px 12px;border:1px solid #dce0eb;border-radius:8px;background:#fff}.holiday-calendar-key{font-size:12px;color:#68738a;line-height:1.6}.holiday-company-calendar{overflow:auto;border:1px solid #e1e3ed;border-radius:12px}.holiday-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(120px,1fr));min-width:840px}.holiday-calendar-weekdays{background:#f3f4fa}.holiday-calendar-weekdays strong{padding:13px;font-size:12px;color:#68738a}.holiday-calendar-day{min-height:140px;padding:10px;border-top:1px solid #e1e3ed;border-right:1px solid #e1e3ed;background:#fff}.holiday-calendar-day.weekend{background:#f1f2f5}.holiday-calendar-day.outside{background:#f8f8fb;color:#9299aa}.holiday-calendar-day.today{box-shadow:inset 0 0 0 2px #6c4cff}.holiday-calendar-date{display:flex;justify-content:space-between;gap:5px;align-items:center;font-weight:700;font-size:13px;margin-bottom:10px}.holiday-calendar-date span{font-size:10px;font-weight:500;color:#68738a}.holiday-calendar-booking{border-left:3px solid #8662c5;background:#f1ebfb;color:#513c72;border-radius:6px;padding:7px 8px;margin-top:6px;overflow-wrap:anywhere}.holiday-calendar-booking.birthday{border-color:#c19524;background:#fbf3df;color:#70571d}.holiday-calendar-booking strong{display:block;font-size:11px;line-height:1.4}.holiday-calendar-booking small{display:block;font-size:10px;margin-top:3px;line-height:1.4}

/* Accessible, independently collapsible workspace menus. */
.sidebar .nav{display:block}
.nav-section{margin:8px 0 16px}
.sidebar .nav .nav-group-toggle{padding:10px 9px;font-size:11px;letter-spacing:.065em;text-transform:uppercase;color:#aeb6c8;gap:5px}
.nav-group-name{flex:1}
.nav-chevron{font-size:17px;line-height:1;transition:transform .15s}
.nav-group-toggle[aria-expanded="false"] .nav-chevron{transform:rotate(-90deg)}
.sidebar .nav .nav-group-toggle.contains-active{color:#fff}
.nav-group-items{display:grid;gap:4px}
.nav-group-items[hidden]{display:none!important}
.sidebar .nav .nav-group-items button{padding-left:15px}
.sidebar .nav-group-toggle:focus-visible{outline:2px solid #f4e548;outline-offset:1px}
@media(min-width:621px) and (max-width:860px){
 .app-shell{grid-template-columns:190px minmax(0,1fr)}
 .sidebar .nav button .nav-item-label,.sidebar .nav button .nav-group-name,.sidebar .nav button .nav-chevron{display:block}
 .sidebar .nav button{justify-content:flex-start;gap:6px;font-size:12px}
 .sidebar .nav .nav-group-toggle{font-size:10px}
}
@media(max-width:620px){
 .sidebar{height:auto;max-height:48dvh;padding:5px 8px;overflow-y:auto}
 .sidebar .nav{display:flex;align-items:flex-start;justify-content:flex-start;gap:5px;overflow:visible}
 .nav-section{margin:0;flex:1;min-width:0}
 .sidebar .nav .nav-group-toggle{width:100%;min-width:0;padding:8px 3px;display:flex;flex-direction:column;font-size:8px;gap:2px;text-align:center}
 .sidebar .nav button .nav-group-name,.sidebar .nav button .nav-chevron{display:block}
 .sidebar .nav .nav-group-items button{display:flex;width:100%;min-width:0;padding:8px 3px;justify-content:center}
 .sidebar .nav .nav-group-items button:nth-child(n+5){display:flex}
 .sidebar .nav .nav-group-items .nav-item-label{display:block;font-size:9px;text-align:center;overflow-wrap:anywhere}
 .sidebar .nav .nav-group-items .nav-icon{display:none}
 .app-main{padding-bottom:180px}
}

.people-department-filter{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;margin:20px 0 16px}.people-department-filter label{display:grid;gap:7px;font-size:13px;font-weight:650;color:#435067}.people-department-filter select{min-width:240px;min-height:42px;border:1px solid #d5dce7;border-radius:9px;background:#fff;color:#243247;padding:9px 34px 9px 12px;font:inherit}.people-department-filter select:focus-visible{outline:3px solid #c6b5e4;outline-offset:2px}.people-department-filter>span{font-size:13px;color:#647084;padding-bottom:12px}@media(max-width:560px){.people-department-filter label,.people-department-filter select{width:100%}}

.sidebar .nav .nav-group-toggle .nav-group-alert{display:inline-flex;flex:none;align-items:center;justify-content:center;min-width:23px;min-height:23px;margin:0 3px;padding:2px 6px;background:#fce5bd;color:#723b05;font-size:11px;font-style:normal;font-weight:800;letter-spacing:0;line-height:1.2;text-transform:none;border:1px solid #e7b96c}

.people-staff-section{margin:18px 0;border:1px solid #dce0eb;border-radius:12px;background:#fff;overflow:hidden}.people-staff-section>summary{display:flex;align-items:center;gap:12px;padding:18px 20px;font-size:16px;font-weight:750;color:#242b40;cursor:pointer;list-style:none}.people-staff-section>summary::-webkit-details-marker{display:none}.people-staff-section>summary:before{content:'▸';font-size:17px;color:#5f6278}.people-staff-section[open]>summary:before{content:'▾'}.people-staff-section>summary:focus-visible{outline:2px solid #6c4cff;outline-offset:-3px}.people-staff-count{margin-left:auto;background:#eeebf8;color:#4e3d7c;border-radius:20px;min-width:28px;padding:3px 9px;text-align:center;font-size:12px}.people-staff-section .panel{border:0;border-radius:0;box-shadow:none;margin:0}.people-staff-section .staff-delete-button{color:#a52d3d;border-color:#e6bdc5;background:#fff5f6;white-space:nowrap}


.my-week-admin-description{display:flex;flex-direction:column;gap:5px;font-size:11px;color:#475569}.my-week-admin-description textarea{width:100%;min-height:80px;resize:vertical;font:inherit;line-height:1.5;padding:7px;background:#fff;border:1px solid #cbd5e1;border-radius:6px}

.my-week-work-type{text-align:left;font-size:11px;line-height:1.4;white-space:normal;overflow-wrap:anywhere;flex-shrink:0}

/* Personal total sits outside the scrolling menu and counts its leaf alerts. */
.sidebar .brand{padding-bottom:16px}
.sidebar-alert-summary{display:flex;align-items:center;gap:9px;flex-shrink:0;margin:0 2px 20px;padding:12px;border:1px solid #41495e;border-radius:12px;color:#c3c9d6;background:#ffffff06;font-size:.82rem}
.personal-alert-icon{flex-shrink:0}
.personal-alert-label{flex:1;font-weight:600}
.sidebar-alert-summary strong{display:grid;place-items:center;min-width:26px;height:26px;padding:0 6px;border-radius:8px;background:#ffffff15;color:#dce0e9;font-size:.85rem;font-variant-numeric:tabular-nums}
.sidebar-alert-summary.has-alerts{border-color:#f4e54855;color:#fff;background:#f4e5480c}
.sidebar-alert-summary.has-alerts .personal-alert-icon{color:#f4e548}
.sidebar-alert-summary.has-alerts strong{background:#f4e548;color:#20263b}
@media(max-width:620px){.sidebar-alert-summary{display:none}}

.directory-notice{margin:16px 24px;padding:14px 16px;background:#fff8e7;border:1px solid #ead9a8;border-radius:10px;color:#68501c;font-size:13px;line-height:1.6;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.directory-notice button{flex-shrink:0}

.holiday-calendar-connections{padding:24px;margin-bottom:24px}.holiday-calendar-connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.holiday-calendar-connections h3{margin:12px 0}.holiday-calendar-connections p{line-height:1.65;color:#526174}.holiday-google-setup{margin-top:22px;border-top:1px solid #dde3ed;padding-top:18px}.holiday-google-setup summary{cursor:pointer;font-weight:650}.holiday-google-setup li{margin:12px 0;line-height:1.6}.holiday-google-setup code{overflow-wrap:anywhere}.holiday-google-setup form{display:grid;gap:14px;max-width:680px}.holiday-google-setup label{display:grid;gap:7px}.holiday-google-setup input{padding:10px;border:1px solid #ccd4e0;border-radius:7px}.holiday-calendar-connections a.button{display:inline-flex;text-decoration:none}@media(max-width:760px){.holiday-calendar-connection-grid{grid-template-columns:1fr}}

/* The portal welcome uses the Collective website's own type and monochrome identity. */
@font-face{font-family:CollectiveBold;src:url('/fonts/MazzardHBold.woff2') format('woff2');font-display:swap}
@font-face{font-family:CollectiveRegular;src:url('/fonts/MazzardHRegular.woff2') format('woff2');font-display:swap}
.collective-welcome{min-height:100svh;display:flex;flex-direction:column;background:#000;color:#fff;font-family:CollectiveRegular,Arial,sans-serif;padding:0 clamp(24px,6.6vw,100px)}
.collective-welcome-header{min-height:112px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #ffffff2b}
.collective-welcome-header img{display:block;width:230px;max-width:50vw;height:auto;filter:invert(1)}
.collective-welcome-header p{font-size:14px;margin:0;color:#c8c8c8}
.collective-welcome-hero{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:75px 0 85px}
.collective-welcome-eyebrow{font-size:13px;letter-spacing:.15em;text-transform:uppercase;margin:0 0 30px;color:#d4d4d4}
.collective-welcome h1{font-family:CollectiveBold,Arial,sans-serif;font-size:clamp(48px,7.6vw,112px);font-weight:400;line-height:1.02;letter-spacing:-.045em;max-width:1200px;margin:0 0 45px;color:#fff}
.collective-welcome h1 span{font-size:.8em}
.collective-welcome-google{width:fit-content;font-weight:400;display:flex;align-items:center;justify-content:center;gap:16px;min-height:58px;background:#fff;color:#000;border:1px solid #fff;border-radius:4px;padding:15px 25px;font-family:CollectiveBold,Arial,sans-serif;font-size:17px;box-shadow:none}
.collective-welcome-google:hover{background:#e7e7e7}.collective-welcome-google .google-g{color:#000}.collective-welcome-google:focus-visible{outline:3px solid white;outline-offset:5px}
.collective-welcome-access{font-size:14px;line-height:1.5;color:#aaa;margin:24px 0 0;max-width:480px}
.collective-welcome-footer{border-top:1px solid #ffffff2b;display:flex;justify-content:space-between;gap:20px;padding:22px 0;font-size:12px;color:#999}
@media(max-width:600px){.collective-welcome-header{min-height:90px}.collective-welcome-header img{width:180px}.collective-welcome-header p{display:none}.collective-welcome-hero{padding:65px 0}.collective-welcome h1{font-size:clamp(44px,11vw,64px);line-height:1.06;margin-bottom:36px}.collective-welcome-eyebrow{font-size:11px;letter-spacing:.1em}.collective-welcome-access{font-size:13px}.collective-welcome-footer{font-size:10px}}

.collective-welcome h1{font-size:clamp(42px,6.4vw,96px);margin-bottom:30px}.collective-welcome-hero{padding-top:46px;padding-bottom:50px}.collective-welcome .collective-welcome-brand{width:min(350px,70vw);margin:0 0 36px}.collective-welcome-eyebrow{margin-bottom:23px}@media(max-width:600px){.collective-welcome h1{font-size:clamp(36px,9.4vw,58px)}.collective-welcome .collective-welcome-brand{width:min(280px,70vw);margin-bottom:30px}}

.collective-welcome{position:relative;isolation:isolate;overflow:hidden;background:#080808}.collective-welcome>.motion-canvas{z-index:-1}.collective-welcome-header,.collective-welcome-hero,.collective-welcome-footer{position:relative;z-index:1}

/* Keep the animated wordmark aligned with the headline at every screen size. */
.collective-welcome h1{font-size:clamp(36px,6.4vw,96px);width:min(6.8em,100%);white-space:nowrap}
.collective-welcome .collective-welcome-brand{width:clamp(245px,43.52vw,653px);max-width:100%;margin-top:-8px}
@media(max-width:600px){.collective-welcome h1{font-size:clamp(30px,8.5vw,51px)}.collective-welcome .collective-welcome-brand{width:clamp(204px,57.8vw,347px);max-width:100%}}

.collective-welcome h1{font-size:clamp(28px,4.3vw,64px);width:auto;max-width:100%;margin-bottom:26px}@media(max-width:600px){.collective-welcome h1{font-size:clamp(24px,6vw,36px)}}


/* Preview: the company marks drift quietly behind the welcome content. */
.company-background-mark{position:absolute;pointer-events:none;width:clamp(140px,16vw,250px);opacity:.13;will-change:transform;animation:company-background-drift 26s ease-in-out infinite alternate}
.company-background-mark img{display:block;width:100%;height:auto}
.company-background-studios{left:5%;top:23%;transform:rotate(-13deg);animation-duration:31s;--float-x:32px;--float-y:-35px;--float-turn:9deg}
.company-background-social{right:7%;top:10%;width:clamp(130px,14vw,220px);opacity:.12;animation-duration:27s;animation-delay:-9s;--float-x:-35px;--float-y:32px;--float-turn:-12deg}
.company-background-creators{left:12%;bottom:2%;width:clamp(130px,15vw,225px);opacity:.1;animation-duration:29s;animation-delay:-15s;--float-x:38px;--float-y:-25px;--float-turn:12deg}
.company-background-ventures{right:9%;bottom:2%;width:clamp(150px,17vw,260px);opacity:.18;animation-duration:33s;animation-delay:-19s;--float-x:-30px;--float-y:-40px;--float-turn:-9deg}
.company-background-ventures img{filter:brightness(2.8)}
@keyframes company-background-drift{from{transform:translate(0,0) rotate(-7deg)}to{transform:translate(var(--float-x),var(--float-y)) rotate(var(--float-turn))}}
@media(max-width:700px){.company-background-mark{width:125px;opacity:.09}.company-background-studios{left:-55px;top:18%}.company-background-social{right:-40px;top:12%;width:140px}.company-background-creators{left:-25px;bottom:10%;width:145px}.company-background-ventures{right:-50px;bottom:6%;width:170px;opacity:.12}}
@media(prefers-reduced-motion:reduce){.company-background-mark{animation:none;will-change:auto}}

/* Prominent, shared People navigation. */
.people-view-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:20px 28px 24px;padding:0}
.people-view-tabs .people-view-card{display:flex;align-items:center;gap:14px;min-height:100px;width:100%;padding:20px;text-align:left;cursor:pointer;background:#fff;border:1px solid #dce3e2;border-radius:14px;color:#3c3c3b;box-shadow:0 3px 12px #253b3510;transition:border-color .18s,box-shadow .18s,transform .18s}
.people-view-tabs .people-view-card:hover{border-color:#509f92;box-shadow:0 6px 20px #253b351a;transform:translateY(-2px)}
.people-view-tabs .people-view-card.active{border:2px solid #3c3c3b;padding:19px;background:#f1f5f3;box-shadow:0 3px 12px #253b3512}
.people-view-tabs .people-view-card:focus-visible{outline:3px solid #54b0a2;outline-offset:3px}
.people-view-icon{display:grid;place-items:center;flex-shrink:0;width:48px;height:48px;border-radius:12px;background:#e7f2ef;color:#287f70}
.people-view-card.active .people-view-icon{background:#3c3c3b;color:#fff}
.people-view-copy{min-width:0;flex:1}.people-view-copy strong{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:18px;line-height:1.3;font-weight:750}.people-view-copy small{display:block;font-size:12px;line-height:1.5;color:#63736f;margin-top:6px;font-weight:400}.people-view-arrow{font-size:19px;color:#397c70}.people-profile-needed{font-size:10px;font-style:normal;white-space:nowrap;border-radius:20px;padding:3px 7px;background:#fff0d9;color:#91571e}.people-view-card.needs-attention .people-view-copy small{color:#8c5b25}
@media(max-width:1100px){.people-view-tabs{gap:10px;margin:16px}.people-view-tabs .people-view-card{padding:14px;gap:10px}.people-view-tabs .people-view-card.active{padding:13px}.people-view-icon{width:38px;height:38px}.people-view-copy strong{font-size:16px}.people-view-arrow{display:none}}
@media(max-width:720px){.people-view-tabs{grid-template-columns:1fr;margin:14px}.people-view-tabs .people-view-card{min-height:78px}.people-view-copy small{margin-top:3px}.people-view-arrow{display:block}}

.shoot-google-panel{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin:12px 0 22px;padding:20px 24px;background:#fdf0f5;border:1px solid #ecd5df;border-radius:16px}.shoot-google-panel>div:first-child{flex:1;min-width:240px}.shoot-google-panel strong{font-size:16px}.shoot-google-panel p{margin:8px 0;line-height:1.55}.shoot-google-panel small{color:#67738c}.shoot-google-issues,.shoot-google-settings{width:100%}.shoot-google-panel summary{cursor:pointer;font-weight:650;padding:8px 0}.shoot-google-settings form{display:flex;gap:12px;flex-wrap:wrap;align-items:end}.shoot-google-settings label{display:grid;gap:6px;flex:1;min-width:220px}.shoot-google-settings input{width:100%;padding:10px;border:1px solid #c7ccd7;border-radius:8px}.shoot-google-issues p{padding:10px 12px;background:white;border-radius:8px}

.holiday-balances{margin:24px 0}.holiday-balances-scroll{overflow-x:auto}.holiday-balances table{width:100%;border-collapse:collapse;min-width:900px}.holiday-balances th{font-size:13px;color:#525b65;text-align:left;line-height:1.45;padding:16px 14px;background:#f5f7f8;border-bottom:2px solid #e3e7ea}.holiday-balances td{padding:16px 14px;border-bottom:1px solid #e8ebee;vertical-align:middle;font-variant-numeric:tabular-nums}.holiday-balances tr.selected{background:#edf8f5}.holiday-balances td small{display:block;margin-top:5px;color:#6a7483;font-size:12px;line-height:1.45}.holiday-balances .link-button{text-align:left;font-weight:700;line-height:1.4}.holiday-balances .status{white-space:normal;line-height:1.3}.holiday-balances .panel-title p{line-height:1.5;max-width:70ch}

/* Approved People navigation icon. */
.sidebar .nav .nav-icon.people-contact-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;border-radius:10px;background:#3d4944;color:#98d9c9;opacity:1}.people-contact-icon svg{width:23px;height:23px}.sidebar .nav button.active .people-contact-icon{background:#70d5bc;color:#203b32}@media(max-width:620px){.sidebar .nav .nav-group-items .people-contact-icon{display:none}}

/* Approved Expenses wallet, paired with People. */
.sidebar .nav .nav-icon.expenses-wallet-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;border-radius:10px;background:#3d4944;color:#98d9c9;opacity:1;--wallet-icon-bg:#3d4944}.expenses-wallet-icon svg{width:23px;height:23px}.sidebar .nav button.active .expenses-wallet-icon{background:#70d5bc;color:#203b32;--wallet-icon-bg:#70d5bc}@media(max-width:620px){.sidebar .nav .nav-group-items .expenses-wallet-icon{display:none}}

/* Approved document, celebration, goal and palm icons. */
.sidebar .nav .nav-icon.hr-section-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;border-radius:10px;background:#3d4944;color:#98d9c9;opacity:1}.hr-section-icon svg{width:23px;height:23px}.sidebar .nav button.active .hr-section-icon{background:#70d5bc;color:#203b32}@media(max-width:620px){.sidebar .nav .nav-group-items .hr-section-icon{display:none}}

.hr-section-icon{--wallet-icon-bg:#3d4944}.sidebar .nav button.active .hr-section-icon{--wallet-icon-bg:#70d5bc}

.portal-empty>img{display:block;width:38px;height:38px;object-fit:contain;margin:0 auto 20px;opacity:.55;mix-blend-mode:multiply}

/* Compact Requests & Approvals: people first, booking detail on demand. */
.holiday-request-tools{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:0 0 18px}.holiday-request-tools p{font-size:12px;color:#68738a;margin:0;line-height:1.6}.holiday-person-requests{border:1px solid #e4e6df;border-radius:12px;background:#fff;overflow:hidden}.holiday-person-requests>summary{display:flex;align-items:center;gap:14px;padding:17px 20px;cursor:pointer;list-style:none;background:#f8f9f5}.holiday-person-requests>summary::-webkit-details-marker,.holiday-request-disclosure>summary::-webkit-details-marker{display:none}.holiday-person-requests>summary:before,.holiday-request-disclosure>summary:before{content:'›';font-size:23px;line-height:1;color:#607266;transition:transform .15s;flex-shrink:0}.holiday-person-requests[open]>summary:before,.holiday-request-disclosure[open]>summary:before{transform:rotate(90deg)}.holiday-disclosure-person{display:flex;flex:1;min-width:0;align-items:center;gap:14px;flex-wrap:wrap}.holiday-disclosure-person strong{font-size:14px;color:#30312e}.holiday-disclosure-person small{font-size:12px;color:#727770}.holiday-person-bookings{padding:12px;display:flex;flex-direction:column;gap:8px}.holiday-request.holiday-request-disclosure{padding:0}.holiday-request-disclosure>summary{padding:14px;display:flex;align-items:center;gap:14px;cursor:pointer;list-style:none}.holiday-request-disclosure>summary>div{flex:1}.holiday-request-disclosure>summary>div>strong{font-size:13px}.holiday-request-body{padding:0 18px 18px 48px}.holiday-request-disclosure[open]>summary{background:#f5f8f4}.holiday-person-requests summary:focus-visible,.holiday-request-disclosure summary:focus-visible{outline:3px solid #36b39f;outline-offset:-3px}.holiday-request-body .holiday-history{margin-bottom:0}@media(max-width:620px){.holiday-person-requests>summary{padding:14px;flex-wrap:wrap}.holiday-request-disclosure>summary{flex-direction:row;flex-wrap:wrap}.holiday-request-disclosure>summary .status{margin-left:27px}.holiday-request-body{padding:0 14px 14px}.holiday-request-tools{align-items:flex-start}.holiday-request-tools>button{white-space:nowrap}}

.portal-finance [hidden]{display:none!important}
.portal-finance [data-budget-loading]{padding:20px 24px}
/* Conditional fields in the holiday and TOIL request form. */
#holiday-form [hidden]{display:none!important}
.toil-expiry-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.toil-expiry-card{border:1px solid #dce8e3;background:#f4faf7;border-radius:14px;padding:16px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px}.toil-expiry-card small{display:block;margin-top:6px;color:var(--muted)}.toil-expiry-card p{flex-basis:100%;margin:0;font-size:.8rem}.toil-expiry-card.soon{background:#fff6e9;border-color:#efcc97}.toil-expiry-card.expired{background:#f6f6f4;color:#72766f}.toil-expiry-panel{margin:18px 0}

.shoot-day-reference{display:flex;flex-direction:column;gap:5px;margin:10px 0;padding:10px 12px;border-left:3px solid #ed6d9c;border-radius:8px;background:#fff0f5;color:#36404a;font-size:12px;line-height:1.45}.shoot-day-reference strong{font-size:12px}.shoot-day-reference small{font-size:11px;color:#657080}.timeline-day-cell .shoot-day-reference{padding:6px;font-size:10px}.timeline-day-cell .shoot-day-reference small{font-size:10px}

.timeline-freelancer-tools{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 18px}.timeline-freelancer-tools span{color:#65706c;font-size:14px}.freelance-placeholder{border:1px dashed #8971b0}.freelance-timeline-booking{width:100%;text-align:left;cursor:pointer}.timeline-day-cell[data-timeline-day-person]{cursor:pointer}.timeline-day-cell[data-timeline-day-person]:focus-visible{outline:3px solid #2cb5a3;outline-offset:-3px}.timeline-day-jobs{display:grid;gap:12px;margin:20px 0}.timeline-job-summary{background:#f3f7f5;padding:16px;border-radius:12px;margin:16px 0}.timeline-job-summary p{margin:8px 0}.timeline-freelancer-tools .button{white-space:nowrap}#freelancer-form .checkbox-label{display:flex;gap:10px;align-items:center}#freelancer-form .checkbox-label input{width:auto}

.gift-table { overflow-x:auto; background:#fff; border:1px solid var(--line); border-radius:12px; }
.gift-table table { width:100%; border-collapse:collapse; text-align:left; }
.gift-table th,.gift-table td { padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:top; }
.gift-table th { background:#f6f7fa; }
.gift-table tbody tr:last-child td { border-bottom:0; }
.gift-table td small,.gift-table [data-gift-receipt] { display:block; }
.gift-table td small,.gift-empty { color:var(--muted); }
.gift-table [data-gift-receipt] { text-align:left; overflow-wrap:anywhere; }
.entertainment-gifts [data-gift-status]:empty { display:none; }

/* Form errors stay in the native modal top layer and scroll into view. */
.dialog-form-error{position:relative;padding:14px 16px;margin:0 0 18px;border:1px solid #efb4bf;border-left:4px solid #ae334d;border-radius:10px;background:#fff1f4;color:#8f263e;font-size:.9rem;line-height:1.5;outline:none;white-space:pre-wrap}.dialog-form-error:focus{box-shadow:0 0 0 3px #e35e8930}.dialog-form-error[hidden]{display:none}.dialog-form-warning{background:#fff8e5;border-color:#e8c777;color:#70531c}
