/* ═══════════════════════════════════════════════════════════════════
   NATIVE SCHEDULER — Builder grid + Add/Edit modal
   Reuses the shared design tokens from styles.css (--rr-cyan, --rr-pink,
   --rr-yellow, --rr-text-muted, --rr-border). Keep scheduler-only rules
   here so styles.css stays lean (mirrors the checklist-module pattern).
   ═══════════════════════════════════════════════════════════════════ */

/* ---------- Builder grid ---------- */
.sched-builder { padding: 0; overflow: hidden; }
.sched-grid-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sched-grid { width: 100%; border-collapse: collapse; min-width: 760px; }
.sched-grid th {
  position: sticky; top: 0;
  background: var(--work-surface-2, rgba(20,2,30,.92));
  backdrop-filter: blur(6px);
  font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--rr-text-muted); text-align: left;
  padding: 10px 10px; border-bottom: 1px solid var(--rr-border);
  white-space: nowrap;
}
.sched-grid th.sched-staff-h { left: 0; z-index: 2; min-width: 120px; }
.sched-daynum { font-size: 15px; color: var(--rr-text); font-weight: 700; letter-spacing: 0; margin-top: 2px; }
.sched-grid td {
  vertical-align: top; padding: 6px 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  border-right: 1px solid rgba(255, 255, 255, 0.04);
}
.sched-grid td.sched-staff {
  position: sticky; left: 0; z-index: 1;
  background: var(--work-surface-2, rgba(15,1,22,.96));
  min-width: 120px;
}
.sched-staff b { font-size: 13px; }
.sched-role { font-size: 10.5px; color: var(--rr-text-muted); margin-top: 2px; }
.sched-cell { min-width: 96px; }

/* shift chip inside a cell */
.sched-chip {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  padding: 4px 7px; margin-bottom: 4px; border-radius: 7px;
  font-size: 11.5px; font-weight: 600; line-height: 1.2;
  border: 1px solid transparent;
}
.sched-chip.pub   { background: rgba(43, 255, 149, 0.12); color: #2BFF95; border-color: rgba(43, 255, 149, 0.35); }
.sched-chip.draft { background: rgba(88, 249, 244, 0.12); color: var(--rr-cyan); border-color: rgba(88, 249, 244, 0.30); border-style: dashed; }
.sched-chip-t { white-space: nowrap; }
.sched-chip-x { display: inline-flex; gap: 4px; opacity: 0.65; }
.sched-chip-x a { cursor: pointer; text-decoration: none; font-size: 11px; }
.sched-chip-x a:hover { opacity: 1; }
.sched-chip:hover .sched-chip-x { opacity: 1; }

.sched-add {
  width: 100%; text-align: center; cursor: pointer;
  background: transparent; color: var(--rr-text-muted);
  border: 1px dashed var(--rr-border); border-radius: 7px;
  padding: 5px 6px; font-size: 11px; font-family: inherit;
  transition: all 0.15s ease;
}
.sched-add:hover { border-color: var(--rr-cyan); color: var(--rr-cyan); }
.sched-add.sm { padding: 3px 6px; font-size: 10.5px; opacity: 0.7; }

/* ---------- Add / Edit modal ---------- */
.sm-backdrop {
  position: fixed; inset: 0; z-index: 998;
  background: rgba(8, 0, 14, 0.66); backdrop-filter: blur(3px);
}
.sm-modal {
  position: fixed; z-index: 999;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: min(420px, calc(100vw - 32px));
  max-height: calc(100vh - 48px); overflow-y: auto;
  background: var(--ng-sheen), var(--ng-tint-overlay);   /* NEON GLASS overlay (Phase 2) */
  -webkit-backdrop-filter: blur(var(--ng-blur-overlay)) saturate(var(--ng-sat));
  backdrop-filter: blur(var(--ng-blur-overlay)) saturate(var(--ng-sat));
  border: 1px solid var(--rr-border-cyan);               /* cyan accent wins over the glass edge */
  border-radius: 16px; padding: 20px 22px;
  box-shadow: inset 0 1px 0 var(--ng-edge-spec), inset 0 0 0 1px var(--ng-edge-cyan), var(--ng-shadow-overlay);
}
.sm-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.sm-h h3 { margin: 0; font-size: 18px; }
.sm-x { cursor: pointer; color: var(--rr-text-muted); font-size: 16px; text-decoration: none; line-height: 1; }
.sm-x:hover { color: var(--rr-pink); }
.sm-l { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rr-text-muted); margin: 12px 0 5px; }
.sm-input {
  width: 100%; box-sizing: border-box;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--rr-border);
  color: #fff; padding: 9px 11px; border-radius: 9px;
  font-family: inherit; font-size: 14px;
}
.sm-input:focus { outline: none; border-color: var(--rr-cyan); }
.sm-row { display: flex; gap: 12px; }
.sm-row > div { flex: 1; }
.sm-hours { margin-top: 10px; font-size: 12.5px; min-height: 18px; }
.sm-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; }
.sm-actions .btn { min-width: 96px; }

@media (max-width: 640px) {
  .sm-modal { padding: 18px 16px; }
  .sm-input { font-size: 16px; } /* avoid iOS zoom on focus */
}

/* ═══════════════════════════════════════════════════════════════════
   v2 ADDITIONS — coverage hints, labor footer, shift-request badges
   ═══════════════════════════════════════════════════════════════════ */

/* ---------- forecast coverage hint row (Builder <tfoot>) ---------- */
.sched-cov-row td { border-top: 1px solid var(--rr-border); }
.sched-cov-row td.sched-staff { background: var(--work-surface-2, rgba(15,1,22,.96)); }
.cov-hint {
  font-size: 10.5px; line-height: 1.3; font-weight: 600;
  padding: 4px 6px; border-radius: 6px; text-align: center;
  border: 1px solid transparent; white-space: nowrap;
}
.cov-gap { font-weight: 500; opacity: 0.85; }
.cov-neutral { color: var(--rr-text-muted); background: rgba(255, 255, 255, 0.03); }
.cov-ok   { color: #2BFF95; background: rgba(43, 255, 149, 0.10); border-color: rgba(43, 255, 149, 0.28); }
.cov-low  { color: var(--rr-yellow); background: rgba(255, 209, 102, 0.10); border-color: rgba(255, 209, 102, 0.28); }
.cov-crit { color: var(--rr-pink); background: rgba(255, 92, 168, 0.12); border-color: rgba(255, 92, 168, 0.32); }
.cov-demo {
  font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--rr-yellow); border: 1px solid rgba(255, 209, 102, 0.4);
  border-radius: 4px; padding: 1px 4px; margin-left: 6px; vertical-align: middle;
}

/* ---------- per-day labor-cost footer (under the grid) ---------- */
.sched-labor {
  margin-top: 12px; padding: 12px 14px;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--rr-border); border-radius: 12px;
}
.sched-labor-h {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--rr-text-muted); margin-bottom: 10px;
}
.sched-labor-grid {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px;
}
.sched-labor-cell {
  text-align: center; padding: 8px 4px; border-radius: 8px;
  background: rgba(255, 255, 255, 0.02);
}
.sched-labor-cell .sl-day { font-size: 10px; color: var(--rr-text-muted); }
.sched-labor-cell .sl-amt { font-size: 14px; font-weight: 700; color: var(--rr-text); margin: 2px 0; }
.sched-labor-cell .sl-hrs { font-size: 10px; color: var(--rr-text-muted); }
.sched-labor-total {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--rr-border);
  font-size: 12.5px; color: var(--rr-text-muted);
}
.sched-labor-total .sl-total-amt { font-weight: 700; color: var(--rr-cyan); font-size: 14px; }
@media (max-width: 640px) {
  .sched-labor-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- shift swap/drop request controls ---------- */
.sr-link {
  cursor: pointer; font-size: 11px; font-weight: 600; color: var(--rr-cyan);
  text-decoration: none; border-bottom: 1px dashed rgba(88, 249, 244, 0.4);
}
.sr-link:hover { color: #fff; border-bottom-color: var(--rr-cyan); }
.sr-badge {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10.5px; font-weight: 600; padding: 2px 7px; border-radius: 999px;
}
.sr-badge a { cursor: pointer; text-decoration: none; opacity: 0.7; }
.sr-badge a:hover { opacity: 1; }
.sr-pending { color: var(--rr-yellow); background: rgba(255, 209, 102, 0.12); border: 1px solid rgba(255, 209, 102, 0.3); }
.sr-denied  { color: var(--rr-text-muted); background: rgba(255, 255, 255, 0.04); border: 1px solid var(--rr-border); }

/* ═══════════════════════════════════════════════════════════════════
   RR_SCHEDULER — the full week-grid scheduler (replaces 7shifts).
   Namespaced .rrs-* so it never collides with the v1/v2 styles above.
   Brand: dark UI, neon pink (--rr-pink) / cyan (--rr-cyan).
   ═══════════════════════════════════════════════════════════════════ */
.rrs { color: var(--rr-text); }
.rrs-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.rrs-title h2 { margin: 0; font-size: 22px; }
.rrs-sub { font-size: 12.5px; color: var(--rr-text-muted); }

.rrs-tabs { display: flex; gap: 6px; }
.rrs-tab {
  background: rgba(255,255,255,0.04); color: var(--rr-text-muted);
  border: 1px solid var(--rr-border); border-radius: 999px;
  padding: 6px 16px; font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
  transition: all .15s ease;
}
.rrs-tab:hover { color: #fff; border-color: var(--rr-cyan); }
.rrs-tab.on { background: linear-gradient(135deg, rgba(255,92,168,0.18), rgba(88,249,244,0.18)); color: #fff; border-color: var(--rr-cyan); }

/* ---------- toolbar ---------- */
.rrs-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin-bottom: 12px; padding: 10px 12px;
  background: rgba(255,255,255,0.02); border: 1px solid var(--rr-border); border-radius: 12px;
}
.rrs-wknav { display: flex; align-items: center; gap: 6px; }
.rrs-ico {
  background: rgba(255,255,255,0.05); border: 1px solid var(--rr-border); color: var(--rr-text);
  border-radius: 8px; width: 32px; height: 32px; cursor: pointer; font-size: 13px;
}
.rrs-ico:hover { border-color: var(--rr-cyan); color: var(--rr-cyan); }
.rrs-week {
  background: transparent; border: none; color: var(--rr-text); cursor: pointer;
  font-family: inherit; font-size: 14px; font-weight: 700; padding: 6px 10px;
}
.rrs-week:hover { color: var(--rr-cyan); }
.rrs-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.rrs-btn {
  background: rgba(255,255,255,0.05); border: 1px solid var(--rr-border); color: var(--rr-text);
  border-radius: 9px; padding: 7px 13px; font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer;
  transition: all .15s ease;
}
.rrs-btn:hover { border-color: var(--rr-cyan); color: var(--rr-cyan); }
.rrs-sm-btn { padding: 5px 10px; font-size: 11.5px; }
.rrs-save { background: rgba(88,249,244,0.14); color: var(--rr-cyan); border-color: rgba(88,249,244,0.4); }
.rrs-save:hover { background: rgba(88,249,244,0.22); color: #fff; }
.rrs-del { background: rgba(255,92,168,0.12); color: var(--rr-pink); border-color: rgba(255,92,168,0.4); }
.rrs-publish {
  background: linear-gradient(135deg, var(--rr-pink), #ff7ab8); color: var(--work-bg, #14021e); border: none; font-weight: 800;
  box-shadow: 0 0 16px rgba(255,92,168,0.35);
}
.rrs-publish:hover { color: var(--work-bg, #14021e); filter: brightness(1.08); }
.rrs-badge {
  display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px;
  background: var(--work-bg, #14021e); color: var(--rr-pink); border-radius: 999px; font-size: 11px; font-weight: 800; padding: 0 5px; margin-left: 4px;
}
.rrs-group { display: inline-flex; border: 1px solid var(--rr-border); border-radius: 9px; overflow: hidden; }
.rrs-seg { background: transparent; border: none; color: var(--rr-text-muted); padding: 7px 11px; font-family: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.rrs-seg.on { background: rgba(88,249,244,0.16); color: var(--rr-cyan); }

/* ---------- legend ---------- */
.rrs-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 11.5px; color: var(--rr-text-muted); margin-bottom: 8px; align-items: center; }
.rrs-legend span { display: inline-flex; align-items: center; gap: 5px; }
.rrs-chip-demo { display: inline-block; width: 18px; height: 12px; border-radius: 4px; }
.rrs-chip-demo.pub { background: rgba(88,249,244,0.18); border: 1px solid rgba(88,249,244,0.5); }
.rrs-chip-demo.draft { background: transparent; border: 1px dashed rgba(88,249,244,0.6); }
.rrs-warn-legend { color: var(--rr-yellow); }

/* ---------- grid ---------- */
.rrs-gridwrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--rr-border); border-radius: 12px; }
.rrs-grid { width: 100%; border-collapse: collapse; min-width: 880px; }
.rrs-grid th {
  position: sticky; top: 0; z-index: 3;
  background: var(--work-surface-2, rgba(20,2,30,.94)); backdrop-filter: blur(6px);
  font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--rr-text-muted);
  text-align: center; padding: 8px 6px; border-bottom: 1px solid var(--rr-border); white-space: nowrap;
}
.rrs-grid th.rrs-staff-h { left: 0; z-index: 4; text-align: left; min-width: 140px; padding-left: 12px; }
.rrs-grid th.rrs-wk-h { min-width: 64px; }
.rrs-grid th.rrs-today { color: var(--rr-cyan); }
.rrs-daynum { font-size: 16px; color: var(--rr-text); font-weight: 700; }
.rrs-headcount { font-size: 10px; color: var(--rr-text-muted); margin-top: 1px; }
.rrs-grid td {
  vertical-align: top; padding: 5px 6px;
  border-bottom: 1px solid rgba(255,255,255,0.05); border-right: 1px solid rgba(255,255,255,0.04);
}
.rrs-grid td.rrs-staff {
  position: sticky; left: 0; z-index: 1; background: var(--work-surface-2, rgba(15,1,22,.97)); min-width: 140px; padding-left: 12px;
}
.rrs-staff b { font-size: 13px; }
.rrs-staffrole { font-size: 10px; color: var(--rr-text-muted); margin-top: 1px; }
.rrs-owner { font-size: 9px; text-transform: uppercase; letter-spacing: .04em; color: var(--rr-yellow);
  border: 1px solid rgba(255,209,102,0.4); border-radius: 4px; padding: 0 4px; margin-left: 6px; vertical-align: middle; }
.rrs-areahdr td { background: rgba(255,255,255,0.025); padding: 6px 12px; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--rr-text); font-weight: 700; }
.rrs-dot { display: inline-block; width: 9px; height: 9px; border-radius: 999px; margin-right: 7px; vertical-align: middle; }
.rrs-cell { min-width: 104px; }
.rrs-cell-block { background: rgba(255,92,168,0.04); }
.rrs-wk { text-align: center; font-size: 12.5px; font-weight: 700; color: var(--rr-text); white-space: nowrap; }
.rrs-wkcost { font-size: 10px; font-weight: 500; color: var(--rr-text-muted); }

/* shift chip */
.rrs-chip {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  padding: 4px 7px; margin-bottom: 4px; border-radius: 7px;
  font-size: 11px; font-weight: 700; line-height: 1.2; cursor: pointer; transition: filter .12s ease;
}
.rrs-chip:hover { filter: brightness(1.15); }
.rrs-chip-t { white-space: nowrap; }
.rrs-chip-h { font-size: 10px; font-weight: 500; opacity: .8; }
.rrs-warn { color: var(--rr-yellow); margin-left: 3px; }
.rrs-add {
  width: 100%; text-align: center; cursor: pointer; background: transparent; color: var(--rr-text-muted);
  border: 1px dashed var(--rr-border); border-radius: 7px; padding: 3px 6px; font-size: 12px; font-family: inherit; opacity: .55;
  transition: all .15s ease;
}
.rrs-add:hover { border-color: var(--rr-cyan); color: var(--rr-cyan); opacity: 1; }
.rrs-block { font-size: 10.5px; font-weight: 700; color: var(--rr-pink); background: rgba(255,92,168,0.12);
  border: 1px solid rgba(255,92,168,0.35); border-radius: 6px; padding: 3px 6px; margin-bottom: 4px; text-align: center; }
.rrs-pendoff { font-size: 10px; color: var(--rr-yellow); margin-bottom: 4px; text-align: center; opacity: .8; }
.rrs-empty { text-align: center; color: var(--rr-text-muted); padding: 24px; }

/* ---------- labor footer ---------- */
.rrs-labor { margin-top: 14px; padding: 12px 14px; background: rgba(255,255,255,0.02); border: 1px solid var(--rr-border); border-radius: 12px; }
.rrs-labor-h { display: flex; align-items: center; justify-content: space-between; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--rr-text-muted); margin-bottom: 10px; }
.rrs-labor-note { text-transform: none; letter-spacing: 0; font-size: 11px; }
.rrs-labor-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; }
.rrs-lcell { text-align: center; padding: 8px 4px; border-radius: 8px; background: rgba(255,255,255,0.02); border: 1px solid transparent; }
.rrs-lcell.ok { border-color: rgba(43,255,149,0.25); }
.rrs-lcell.low { border-color: rgba(255,209,102,0.28); }
.rrs-lcell.crit { border-color: rgba(255,92,168,0.32); background: rgba(255,92,168,0.06); }
.rrs-lday { font-size: 10px; color: var(--rr-text-muted); }
.rrs-lamt { font-size: 14px; font-weight: 700; color: var(--rr-text); margin: 2px 0; }
.rrs-lhrs { font-size: 10px; color: var(--rr-text-muted); }
.rrs-cap { font-size: 9.5px; color: var(--rr-text-muted); margin-top: 2px; }
.rrs-cap.over { color: var(--rr-pink); font-weight: 700; }
.rrs-labor-tot { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--rr-border); font-size: 12.5px; color: var(--rr-text-muted); }
.rrs-labor-amt { font-weight: 700; color: var(--rr-cyan); font-size: 14px; }
@media (max-width: 640px) { .rrs-labor-grid { grid-template-columns: repeat(4, 1fr); } }

/* ---------- panels (requests / time off) ---------- */
.rrs-panel { margin-top: 14px; padding: 12px 14px; background: rgba(255,255,255,0.02); border: 1px solid var(--rr-border); border-radius: 12px; }
.rrs-panel-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.rrs-panel-h h3 { margin: 0; font-size: 15px; }
.rrs-soft { color: var(--rr-text-muted); font-size: 12px; padding: 4px 0; }
.rrs-soft code { background: rgba(255,255,255,0.06); padding: 1px 5px; border-radius: 4px; font-size: 11px; }
.rrs-data { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.rrs-data th { text-align: left; font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--rr-text-muted); padding: 6px 8px; border-bottom: 1px solid var(--rr-border); }
.rrs-data td { padding: 7px 8px; border-bottom: 1px solid rgba(255,255,255,0.05); vertical-align: middle; }

/* ---------- pills ---------- */
.rrs-pill { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
.rrs-pill.ok { color: #2BFF95; background: rgba(43,255,149,0.12); border: 1px solid rgba(43,255,149,0.3); }
.rrs-pill.draft { color: var(--rr-text-muted); background: rgba(255,255,255,0.05); border: 1px solid var(--rr-border); }
.rrs-pill.pend { color: var(--rr-yellow); background: rgba(255,209,102,0.12); border: 1px solid rgba(255,209,102,0.3); }
.rrs-pill a { cursor: pointer; text-decoration: none; opacity: .7; }
.rrs-pill a:hover { opacity: 1; }
.rrs-link { cursor: pointer; font-size: 11px; font-weight: 600; color: var(--rr-cyan); text-decoration: none; border-bottom: 1px dashed rgba(88,249,244,0.4); }
.rrs-link:hover { color: #fff; }

/* ---------- My Schedule / My Day ---------- */
.rrs-my { display: flex; flex-direction: column; gap: 14px; }
.rrs-myday { background: rgba(255,255,255,0.02); border: 1px solid var(--rr-border); border-radius: 12px; padding: 10px 14px; }
.rrs-myday.is-today { border-color: rgba(88,249,244,0.4); }
.rrs-myhead { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--rr-text-muted); margin-bottom: 8px; }
.rrs-myrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; margin-bottom: 6px; background: rgba(255,255,255,0.02); border-radius: 8px; }
.rrs-myrole { font-size: 11.5px; color: var(--rr-text-muted); margin-top: 2px; }
.rrs-empty-card { color: var(--rr-text-muted); font-size: 13px; padding: 20px; text-align: center; background: rgba(255,255,255,0.02); border: 1px dashed var(--rr-border); border-radius: 12px; }
.rrs-torow { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; font-size: 12.5px; border-bottom: 1px solid rgba(255,255,255,0.05); }
.rrs-torow:last-child { border-bottom: none; }

/* ---------- modal ---------- */
.rrs-backdrop { position: fixed; inset: 0; z-index: 998; background: rgba(8,0,14,0.66); backdrop-filter: blur(3px); }
.rrs-sm { position: fixed; z-index: 999; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: min(440px, calc(100vw - 32px)); max-height: calc(100vh - 48px); overflow-y: auto;
  background: var(--ng-sheen), var(--ng-tint-overlay);   /* NEON GLASS overlay (Phase 2) */
  -webkit-backdrop-filter: blur(var(--ng-blur-overlay)) saturate(var(--ng-sat));
  backdrop-filter: blur(var(--ng-blur-overlay)) saturate(var(--ng-sat));
  border: 1px solid var(--rr-border-cyan, rgba(88,249,244,0.4)); border-radius: 16px; padding: 20px 22px;
  box-shadow: inset 0 1px 0 var(--ng-edge-spec), inset 0 0 0 1px var(--ng-edge-cyan), var(--ng-shadow-overlay); }
.rrs-sm-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.rrs-sm-h h3 { margin: 0; font-size: 18px; }
.rrs-sm-x { cursor: pointer; color: var(--rr-text-muted); font-size: 16px; text-decoration: none; }
.rrs-sm-x:hover { color: var(--rr-pink); }
.rrs-sm-date { font-size: 12.5px; color: var(--rr-text-muted); margin-bottom: 8px; }
.rrs-sm-l { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--rr-text-muted); margin: 12px 0 5px; }
.rrs-sm-i { width: 100%; box-sizing: border-box; background: rgba(255,255,255,0.05); border: 1px solid var(--rr-border); color: #fff; padding: 9px 11px; border-radius: 9px; font-family: inherit; font-size: 14px; }
.rrs-sm-i:focus { outline: none; border-color: var(--rr-cyan); }
.rrs-sm-row { display: flex; gap: 12px; }
.rrs-sm-row > div { flex: 1; }
.rrs-qpwrap { display: flex; flex-wrap: wrap; gap: 6px; }
.rrs-qp { background: rgba(88,249,244,0.08); border: 1px solid rgba(88,249,244,0.3); color: var(--rr-cyan);
  border-radius: 999px; padding: 4px 10px; font-family: inherit; font-size: 11px; font-weight: 600; cursor: pointer; }
.rrs-qp:hover { background: rgba(88,249,244,0.18); color: #fff; }
.rrs-sm-hrs { margin-top: 10px; font-size: 12.5px; color: var(--rr-cyan); min-height: 18px; }
.rrs-sm-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 18px; }
.rrs-note { font-size: 11.5px; color: var(--rr-text-muted); margin-top: 10px; line-height: 1.45; }
@media (max-width: 640px) { .rrs-sm { padding: 18px 16px; } .rrs-sm-i { font-size: 16px; } }

/* ===== Phase 4 Pro — forecast header · labor insights · OT · open shifts ===== */
.rrs-lcell.neu { border-color: transparent; }
.rrs-hd-fc { font-size: 10px; font-weight: 700; color: #2BFF95; margin-top: 2px; }
.rrs-hd-fc.pend { color: var(--rr-yellow); font-weight: 600; }
.rrs-hd-fc.none { color: var(--rr-text-muted); font-weight: 400; }
.rrs-lfc { font-size: 12px; font-weight: 700; color: var(--rr-text); margin-top: 2px; }
.rrs-fc-pend { color: var(--rr-yellow); font-size: 10px; font-weight: 600; }
.rrs-sug { color: var(--rr-text-muted); font-weight: 500; }
.rrs-lpct { font-size: 10px; color: var(--rr-text-muted); margin-top: 2px; }
.rrs-cov { font-size: 10px; font-weight: 700; margin-top: 3px; }
.rrs-cov.under { color: var(--rr-pink); }
.rrs-cov.over { color: var(--rr-yellow); }
.rrs-cov.ok { color: #2BFF95; }
/* OT */
.rrs-wk.rrs-wk-ot { color: var(--rr-pink); }
.rrs-otflag { font-size: 9.5px; font-weight: 700; color: var(--rr-pink); margin-top: 1px; }
/* acknowledged check on a published chip */
.rrs-ack { color: #2BFF95; font-weight: 800; margin-left: 4px; }
/* acknowledge banner (My Schedule) */
.rrs-ackbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px 14px; margin-bottom: 12px; border-radius: 10px;
  background: linear-gradient(90deg, rgba(242,57,247,0.14), rgba(88,249,244,0.10));
  border: 1px solid rgba(88,249,244,0.30); font-size: 13px; color: var(--rr-text); }
/* quick-pick row in the open-shift modal */
.rrs-qprow { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 4px; }

/* ═══════════════════════════════════════════════════════════════════
   PHASE 5 — muted dark-purple "work" theme (Schedule section ONLY)
   Scoped to .rr-work: defines the --work-* palette AND locally re-points
   the GLOBAL neutral tokens (--rr-text/-muted/-border) the .rrs-* rules use.
   Custom properties cascade only to this subtree, so the rest of the app —
   sidebar, dashboard, every other module — is visually unchanged. The brand
   accents (pink/cyan/yellow) stay. styles.css is NOT touched.
   ═══════════════════════════════════════════════════════════════════ */
.rr-work {
  --work-bg:#14111C; --work-surface:#1C1828; --work-surface-2:#251F34; --work-surface-3:#2E2740;
  --work-border:rgba(188,158,255,.10); --work-border-2:rgba(188,158,255,.18);
  --work-text:#F3F1F8; --work-muted:rgba(236,232,246,.56); --work-dim:rgba(236,232,246,.36);
  /* re-point the global neutral tokens the scheduler references (accents stay brand) */
  --rr-text: var(--work-text);
  --rr-text-muted: var(--work-muted);
  --rr-border: var(--work-border);
  /* NEON GLASS Phase 2: the wrapper is this module's in-flow surface */
  background: var(--ng-sheen), var(--ng-tint-card);
  -webkit-backdrop-filter: blur(var(--ng-blur-card)) saturate(var(--ng-sat));
  backdrop-filter: blur(var(--ng-blur-card)) saturate(var(--ng-sat));
  color: var(--work-text);
  border: 1px solid var(--ng-edge-pink);
  box-shadow: inset 0 1px 0 var(--ng-edge-spec), inset 0 0 0 1px var(--ng-edge-cyan),
              var(--ng-shadow), var(--ng-glow);
  border-radius: 16px;
  padding: 16px;
}
/* inner panels/cells stay on their base faint backgrounds (flat — restraint over the
   glass wrapper); the --rr-border re-point above already mutes their borders */
.rr-work .rrs-soft { color: var(--work-dim); }
.rr-work .rrs-data th { color: var(--work-muted); border-color: var(--work-border); }
.rr-work .rrs-data td { border-color: var(--work-border); }
/* ── Option C accents — pink→cyan gradient, no glow ── */
.rr-work .rrs-publish { background: linear-gradient(135deg, var(--rr-pink), var(--rr-cyan)); color: var(--work-bg); border: 0; }
.rr-work .rrs-publish:hover { filter: brightness(1.08); }
.rr-work .rrs-panel-h { border-bottom: 2px solid transparent; border-image: linear-gradient(90deg, var(--rr-pink), var(--rr-cyan)) 1; padding-bottom: 8px; }
.rr-work .rrs-labor-h { border-bottom: 2px solid transparent; border-image: linear-gradient(90deg, var(--rr-pink), var(--rr-cyan)) 1; padding-bottom: 6px; }
.rr-work .rrs-grid th.rrs-today { box-shadow: inset 0 2px 0 0 var(--rr-cyan); }
.rr-work .rrs-ackbar { border: 1px solid transparent; border-image: linear-gradient(90deg, var(--rr-pink), var(--rr-cyan)) 1; }

/* ═══════════════════════════════════════════════════════════════════
   NEON GLASS — no backdrop-filter support → pre-glass opaque surfaces
   (mirrors the fallback block at the end of styles.css)
   ═══════════════════════════════════════════════════════════════════ */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .sm-modal, .rrs-sm { background: rgba(20,4,34,0.97); }
  .rr-work { background: var(--work-bg); }
}