:root {
  /* Brand values come from brand.css (single source); literal fallbacks keep
     the staff app identical if that file is ever absent. */
  --bg:           #0b0b0b;
  --bg-2:         #151515;
  --card:         #181613;
  --line:         rgba(201,168,76,.14);
  --line-strong:  rgba(201,168,76,.28);
  --gold:         var(--brand-gold, #C9A84C);
  --gold-2:       var(--brand-gold-light, #E8D48B);
  --gold-3:       var(--brand-gold-deep, #8a7324);
  --text:         #fff;
  --text-dim:     rgba(255,255,255,.7);
  --text-mute:    rgba(255,255,255,.45);
  --ok:           var(--brand-ok, #22c55e);
  --warn:         var(--brand-warn, #f59e0b);
  --bad:          var(--brand-bad, #ef4444);
  --safe-top:     env(safe-area-inset-top, 0px);
  --safe-bot:     env(safe-area-inset-bottom, 0px);
}
* { box-sizing: border-box; }
html, body {
  margin:0; padding:0; height:100%; overscroll-behavior:none;
  background:var(--bg); color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  touch-action:manipulation;
}
body {
  min-height:100dvh;
  display:flex; justify-content:center;
  background:
    radial-gradient(600px 320px at 100% 0%, rgba(201,168,76,.08), transparent 60%),
    radial-gradient(420px 280px at 0% 120%, rgba(201,168,76,.05), transparent 70%),
    var(--bg);
}
.screen {
  width:100%; max-width:480px; min-height:100dvh;
  display:flex; flex-direction:column;
  padding-top:var(--safe-top); padding-bottom:var(--safe-bot);
}
button { font-family:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent; }
a { color:inherit; text-decoration:none; }

/* ── Login screen ───────────────────────────────────── */
.login {
  display:flex; flex-direction:column; align-items:center;
  justify-content:space-between; padding:28px 22px 20px;
  min-height:100dvh;
}
.login-brand {
  display:flex; flex-direction:column; align-items:center; gap:14px;
  margin-top:30px;
}
.login-brand img { height:54px; filter:drop-shadow(0 0 14px rgba(201,168,76,.25)); }
.login-brand .tag {
  font-size:.65rem; font-weight:800; letter-spacing:.24em;
  text-transform:uppercase; color:var(--gold);
}
.login-brand h1 {
  margin:0; font-size:1.15rem; font-weight:800; color:#fff;
  letter-spacing:.01em;
}
.login-prompt {
  color:var(--text-dim); font-size:.9rem; margin-top:4px;
  text-align:center;
}

.pin-display {
  display:flex; gap:14px; justify-content:center;
  margin:18px 0 10px;
}
.pin-dot {
  width:16px; height:16px; border-radius:50%;
  background:transparent; border:2px solid rgba(201,168,76,.28);
  transition:transform .15s, background .15s, border-color .15s;
}
.pin-dot.active {
  background:linear-gradient(135deg,var(--gold),var(--gold-2));
  border-color:var(--gold);
  transform:scale(1.12);
  box-shadow:0 0 12px rgba(201,168,76,.35);
}
.pin-err {
  min-height:22px; color:#fca5a5; font-size:.78rem; font-weight:600;
  text-align:center; margin-top:4px;
}
.pin-display.shake { animation: pin-shake .45s cubic-bezier(.36,.07,.19,.97); }
@keyframes pin-shake {
  10%, 90% { transform: translateX(-2px); }
  20%, 80% { transform: translateX(3px); }
  30%, 50%, 70% { transform: translateX(-5px); }
  40%, 60% { transform: translateX(5px); }
}

.pin-keys {
  width:100%; max-width:360px;
  display:grid; grid-template-columns:repeat(3, 1fr); gap:10px;
  margin-bottom:10px;
}
.pin-key {
  height:62px; border:1px solid var(--line);
  background:rgba(255,255,255,.03); color:#fff;
  border-radius:16px; font-size:1.15rem; font-weight:700;
  letter-spacing:.04em;
  display:flex; align-items:center; justify-content:center;
  transition:.12s;
}
.pin-key:active { background:rgba(201,168,76,.18); border-color:var(--gold); transform:scale(.97); }
.pin-key.ctrl { color:var(--gold); font-size:1rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }

/* ── App shell ──────────────────────────────────────── */
.app { display:none; flex-direction:column; height:100dvh; }
.app.show { display:flex; }

.app-top {
  flex:0 0 auto;
  padding:14px 18px 12px;
  display:flex; align-items:center; gap:12px;
  background:linear-gradient(180deg, rgba(201,168,76,.06), transparent);
  border-bottom:1px solid var(--line);
}
.app-top img { height:26px; }
.app-top .spacer { flex:1; }
.app-top .who { display:flex; align-items:center; gap:10px; text-align:right; }
.app-top .who .nm { font-size:.9rem; font-weight:700; color:#fff; }
.app-top .who .rl { font-size:.72rem; color:var(--text-mute); font-weight:600; margin-top:1px; }
.app-top .logout {
  width:36px; height:36px; border-radius:11px;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  color:var(--text-dim); display:flex; align-items:center; justify-content:center;
}
.app-top .logout:active { background:rgba(239,68,68,.12); color:#fca5a5; border-color:rgba(239,68,68,.35); }
.notif-badge { position:absolute; top:-5px; right:-5px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:#ef4444; color:#fff; font-size:.65rem; font-weight:800; display:flex; align-items:center; justify-content:center; border:2px solid var(--bg,#0d0d0d); }
.notif-overlay { position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:200; display:none; align-items:flex-start; justify-content:center; }
.notif-overlay.active { display:flex; }
.notif-sheet { width:100%; max-width:520px; max-height:82vh; margin-top:54px; background:#141414; border:1px solid var(--border); border-radius:18px 18px 0 0; display:flex; flex-direction:column; overflow:hidden; }
.notif-head { display:flex; align-items:center; gap:10px; padding:15px 16px; border-bottom:1px solid var(--border); }
.notif-head .ttl { font-weight:800; font-size:1rem; flex:1; color:#fff; }
.notif-readall { background:none; border:none; color:var(--gold-2); font-size:.78rem; font-weight:700; cursor:pointer; }
.notif-x { width:30px; height:30px; border-radius:8px; background:rgba(255,255,255,.06); border:1px solid var(--border); color:var(--text-mute); font-size:1.15rem; line-height:1; cursor:pointer; }
.notif-list { overflow-y:auto; padding:6px 0; }
.notif-empty { padding:40px 20px; text-align:center; color:var(--text-mute); font-size:.9rem; }
.notif-enable { display:flex; align-items:center; justify-content:center; gap:8px; width:calc(100% - 24px); margin:10px 12px; padding:11px; border-radius:10px; background:rgba(201,168,76,.14); border:1px solid rgba(201,168,76,.4); color:var(--gold-2); font-size:.78rem; font-weight:700; cursor:pointer; }
.dl-flash { animation:dlFlash 2.2s ease-out; border-radius:12px; }
@keyframes dlFlash { 0%,20% { box-shadow:0 0 0 2px var(--gold), 0 0 18px rgba(201,168,76,.5); background:rgba(201,168,76,.14); } 100% { box-shadow:none; background:transparent; } }

/* ── Motion & polish ─────────────────────────────────── */
/* Native app feel: kill the grey tap flash, keep momentum scrolling. */
* { -webkit-tap-highlight-color: transparent; }
.tab { scroll-behavior:smooth; }
/* Snappy tap feedback (kept even under reduced motion) */
.app-tabs button, .clock-btn, .mtask-addbtn, .btn-save, .btn-approve, .btn-decline,
.day-chip, .stk-btn, .me-menu-item, .mgr-quick, .notif-item, .task-row, .stk-row, .ts-btn, .ttl-link {
  transition: transform .09s ease, background .16s ease, box-shadow .16s ease, color .16s ease;
}
.app-tabs button:active, .clock-btn:active, .mtask-addbtn:active, .btn-save:active,
.day-chip:active, .stk-btn:active, .me-menu-item:active, .mgr-quick:active, .notif-item:active { transform: scale(.955); }
.app-tabs button.active svg { transform: translateY(-1px) scale(1.1); transition: transform .24s cubic-bezier(.34,1.56,.5,1); }

@media (prefers-reduced-motion: no-preference) {
  /* Tab content entrance */
  .tab.active { animation: ynTabIn .30s cubic-bezier(.22,.61,.36,1); }
  @keyframes ynTabIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }

  /* Card / row / section entrances */
  .tasks-cat, .stk-row, .task-row, .notif-item, .mtask-row, .team-row, .entry, .rota-day,
  .mgr-emp-row, .req-mob-row, .mtask-list, .mgr-section, .today-card, .next-card,
  .tasks-summary, .mgr-quick, .me-menu, .info-group, .me-hero {
    animation: ynRise .34s cubic-bezier(.22,.61,.36,1) both;
  }
  @keyframes ynRise { from { opacity:0; transform:translateY(11px); } to { opacity:1; transform:none; } }
  /* Light stagger for the first rows in a list */
  .tab.active .stk-row:nth-child(2), .tab.active .task-row:nth-child(2) { animation-delay:.03s; }
  .tab.active .stk-row:nth-child(3), .tab.active .task-row:nth-child(3) { animation-delay:.06s; }
  .tab.active .stk-row:nth-child(4), .tab.active .task-row:nth-child(4) { animation-delay:.09s; }
  .tab.active .stk-row:nth-child(5), .tab.active .task-row:nth-child(5) { animation-delay:.12s; }
  .tab.active .stk-row:nth-child(n+6), .tab.active .task-row:nth-child(n+6) { animation-delay:.15s; }
  .tasks-cat:nth-child(3) { animation-delay:.05s; }
  .tasks-cat:nth-child(4) { animation-delay:.10s; }
  .tasks-cat:nth-child(5) { animation-delay:.15s; }

  /* Bottom sheets spring up; notifications panel slides down */
  .sheet-card { animation: ynSheetUp .34s cubic-bezier(.2,.9,.25,1) both; }
  @keyframes ynSheetUp { from { transform:translateY(34px); opacity:.5; } to { transform:none; opacity:1; } }
  .notif-overlay.active .notif-sheet { animation: ynSheetDown .3s cubic-bezier(.2,.9,.25,1) both; }
  @keyframes ynSheetDown { from { transform:translateY(-22px); opacity:.4; } to { transform:none; opacity:1; } }
  .overlay.active .modal, .pop.active { animation: ynZoomIn .22s cubic-bezier(.34,1.4,.5,1) both; }
  @keyframes ynZoomIn { from { opacity:0; transform:scale(.94); } to { opacity:1; transform:none; } }

  /* Micro pops */
  .notif-badge { animation: ynPop .32s cubic-bezier(.3,1.7,.5,1); }
  .task-check svg { animation: ynPop .28s cubic-bezier(.3,1.7,.5,1); }
  @keyframes ynPop { 0% { transform:scale(0); } 60% { transform:scale(1.28); } 100% { transform:scale(1); } }
}

/* Skeleton loaders (first load) — feel faster than a spinner */
.skel-wrap { display:flex; flex-direction:column; gap:12px; padding:4px 2px; }
.skel { background:linear-gradient(90deg, rgba(255,255,255,.05) 25%, rgba(255,255,255,.12) 37%, rgba(255,255,255,.05) 63%); background-size:400% 100%; border-radius:14px; }
.skel-card { height:120px; }
.skel-row { height:54px; }
.skel-row.short { width:62%; }
@media (prefers-reduced-motion: no-preference) {
  .skel { animation: ynSkel 1.3s ease infinite; }
  @keyframes ynSkel { 0% { background-position:100% 0; } 100% { background-position:0 0; } }
}
.notif-item { display:flex; gap:11px; padding:13px 16px; cursor:pointer; border-bottom:1px solid rgba(255,255,255,.04); }
.notif-item:active { background:rgba(255,255,255,.04); }
.notif-item.unread { background:rgba(201,168,76,.06); }
.notif-dot { width:8px; height:8px; border-radius:50%; margin-top:6px; flex-shrink:0; background:transparent; }
.notif-item.unread .notif-dot { background:var(--gold); }
.notif-body { flex:1; min-width:0; }
.notif-title { font-size:.9rem; font-weight:700; color:#fff; }
.notif-sub { font-size:.78rem; color:var(--text-mute); margin-top:2px; }
.notif-time { font-size:.65rem; color:var(--text-mute); opacity:.7; margin-top:3px; }
.notif-del { flex-shrink:0; align-self:flex-start; background:none; border:none; color:var(--text-mute); font-size:1.15rem; line-height:1; padding:0 2px; margin:-2px -4px 0 0; cursor:pointer; opacity:.55; }
.notif-del:active { opacity:1; color:#fca5a5; }
.notif-more { display:block; width:calc(100% - 32px); margin:10px 16px 16px; padding:11px; border-radius:10px; background:rgba(255,255,255,.06); border:1px solid var(--border); color:var(--gold-2); font-size:.78rem; font-weight:800; cursor:pointer; }
.notif-more:active { transform:scale(.98); }
.app-top #refreshBtn { margin-right:6px; }
.app-top #refreshBtn:active { background:rgba(201,168,76,.12); color:var(--gold); border-color:rgba(201,168,76,.35); }
.app-top #refreshBtn.spin svg { animation:spin 0.7s linear infinite; }

.app-body {
  flex:1 1 auto; min-height:0; overflow:hidden;
  position:relative;
}
.tab {
  position:absolute; inset:0;
  display:none; flex-direction:column; overflow-y:auto;
  padding:16px 16px 14px;
  -webkit-overflow-scrolling:touch;
}
.tab.active { display:flex; }

.app-tabs {
  flex:0 0 auto;
  display:grid; grid-template-columns:repeat(5, 1fr);
  gap:2px; padding:8px 6px calc(8px + var(--safe-bot));
  background:rgba(13,13,13,.92);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-top:1px solid var(--line);
}
/* Manager-only elements: hidden by default, revealed when body.is-manager. */
.manager-only { display: none !important; }
body.is-manager .manager-only { display: flex !important; }
body.is-manager .staff-only { display: none !important; }
.app-tabs button {
  background:transparent; border:none; color:var(--text-mute);
  display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:7px 2px 5px; border-radius:10px;
  font-size:.65rem; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; transition:.12s;
}
.app-tabs button svg { width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:2; }
.app-tabs button.active {
  color:var(--gold);
  background:radial-gradient(40px 30px at 50% 30%, rgba(201,168,76,.18), transparent);
}
.app-tabs button:active { transform:scale(.96); }

/* ── Home tab content ──────────────────────────────── */
.greet {
  margin-bottom:14px;
}
.greet .eye {
  font-size:.65rem; font-weight:800; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold);
}
.greet h2 {
  margin:4px 0 0; font-size:1.15rem; font-weight:800; color:#fff;
  letter-spacing:.01em;
}
.greet .sub {
  margin-top:6px; font-size:.78rem; color:var(--text-mute); font-weight:600;
}

.today-card {
  background:linear-gradient(160deg, #1f1a10 0%, #15110a 100%);
  border:1px solid var(--line-strong);
  border-radius:18px; padding:18px 18px 16px;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
  position:relative; overflow:hidden;
  margin-bottom:14px;
}
.today-card::before {
  content:""; position:absolute; inset:0;
  background:radial-gradient(220px 120px at 100% 0%, rgba(201,168,76,.12), transparent 60%);
  pointer-events:none;
}
.today-card .tc-top {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:12px; position:relative;
}
.tc-eyebrow {
  font-size:.65rem; font-weight:800; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold);
}
.tc-top .status-pill { margin-top:0; }
.today-card .shift {
  font-size:1.85rem; font-weight:800; color:#fff;
  letter-spacing:.01em; position:relative; line-height:1.1;
}
.today-card .shift.none { color:var(--text-mute); font-size:1.15rem; }
.today-card .shift small {
  display:inline-flex; align-items:center; gap:3px; vertical-align:middle;
  background:rgba(20,184,166,.15); color:#5eead4; border:1px solid rgba(20,184,166,.32);
  padding:2px 9px; border-radius:20px; font-size:.65rem; font-weight:800; margin-left:9px;
}
.today-card .shift small svg { stroke:#5eead4; }
/* New clean In/Out cells */
.tc-io { display:flex; gap:10px; margin:15px 0 16px; position:relative; }
.tc-io-cell {
  flex:1; display:flex; align-items:baseline; justify-content:space-between;
  background:rgba(255,255,255,.045); border:1px solid var(--line);
  border-radius:13px; padding:12px 14px;
}
.tc-io-cell .k { font-size:.65rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--text-mute); }
.tc-io-cell .v { font-size:1.15rem; font-weight:800; color:#fff; font-variant-numeric:tabular-nums; }
.tc-io-cell .v.dim { color:var(--text-mute); font-weight:700; }
.status-pill {
  display:inline-flex; align-items:center; gap:6px;
  font-size:.65rem; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase; padding:5px 10px; border-radius:999px;
  margin-top:10px;
}
.status-pill .d { width:7px; height:7px; border-radius:50%; }
.status-pill.off       { background:rgba(148,163,184,.12); color:#94a3b8; }
.status-pill.off .d    { background:#64748b; }
.status-pill.scheduled { background:rgba(201,168,76,.14); color:var(--gold-2); }
.status-pill.scheduled .d { background:var(--gold); }
.status-pill.in        { background:rgba(34,197,94,.14); color:#86efac; }
.status-pill.in .d     { background:#22c55e; animation: pulse 1.4s ease-in-out infinite; }
.status-pill.done      { background:rgba(59,130,246,.14); color:#93c5fd; }
.status-pill.done .d   { background:#3b82f6; }
@keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.4; } }

.clock-row {
  display:flex; gap:12px; margin-top:14px; position:relative;
}
.clock-field {
  flex:1; background:rgba(255,255,255,.04);
  border:1px solid var(--line); border-radius:12px;
  padding:10px 12px;
}
.clock-field .lbl {
  font-size:.65rem; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:var(--text-mute);
}
.clock-field .val {
  margin-top:3px; font-size:1.15rem; font-weight:800; color:#fff;
  font-variant-numeric:tabular-nums; letter-spacing:.01em;
}
.clock-field .val.dim { color:var(--text-mute); font-weight:700; }

.clock-btn {
  width:100%; border:none; color:#0d0d0d;
  background:linear-gradient(135deg, var(--gold) 0%, var(--gold-2) 100%);
  padding:16px 20px; border-radius:16px;
  font-size:1rem; font-weight:800; letter-spacing:.04em;
  text-transform:uppercase; margin-top:14px;
  box-shadow:0 10px 24px rgba(201,168,76,.28);
  display:flex; align-items:center; justify-content:center; gap:10px;
  position:relative; transition:.15s;
}
.clock-btn.out {
  background:linear-gradient(135deg, #ef4444 0%, #f87171 100%);
  color:#fff; box-shadow:0 10px 24px rgba(239,68,68,.32);
}
.clock-btn.locked {
  background:rgba(255,255,255,.05); color:var(--text-mute);
  box-shadow:none; border:1px solid var(--line);
}
.clock-btn:disabled { opacity:.6; cursor:not-allowed; }
.clock-btn:active:not(:disabled) { transform:scale(.98); }
.clock-btn svg { width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:2.4; }

.next-card {
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px; padding:14px 16px;
  display:flex; align-items:center; gap:14px;
  margin-bottom:20px;
}
.next-card .ic {
  width:40px; height:40px; border-radius:12px;
  background:rgba(201,168,76,.12); color:var(--gold);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.next-card .info { flex:1; min-width:0; }
.next-card .info .lbl {
  font-size:.65rem; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:var(--text-mute);
}
.next-card .info .val {
  margin-top:2px; font-size:.9rem; font-weight:700; color:#fff;
}
.next-card .info .sub {
  margin-top:2px; font-size:.72rem; color:var(--text-mute); font-weight:600;
}

/* ── Home: Tasks Summary Card (warning red) ────────── */
.tasks-summary {
  background:
    radial-gradient(220px 120px at 100% 0%, rgba(239,68,68,.22), transparent 60%),
    linear-gradient(160deg, #2a0f10 0%, #1a0808 100%);
  border:1px solid rgba(239,68,68,.4);
  border-radius:16px; padding:14px 16px; margin-top:14px;
  box-shadow: 0 8px 22px rgba(239,68,68,.18);
}
.tasks-summary .ts-row {
  display:grid; grid-template-columns:auto 1fr auto;
  gap:14px; align-items:center;
}
.tasks-summary .ts-eye {
  font-size:.65rem; font-weight:800; letter-spacing:.18em;
  text-transform:uppercase; color:#fca5a5;
}
.tasks-summary .ts-msg {
  margin-top:3px; font-size:.9rem; color:#fff; font-weight:700;
}
.tasks-summary .ts-btn {
  background:linear-gradient(135deg, #ef4444, #dc2626);
  color:#fff; font-size:.72rem; font-weight:800;
  letter-spacing:.06em; text-transform:uppercase;
  border:none; padding:9px 14px; border-radius:10px;
  cursor:pointer; flex-shrink:0;
  box-shadow: 0 4px 12px rgba(239,68,68,.35);
}
.tasks-summary .ts-btn:active { transform:scale(.96); }
.tasks-summary .ts-ring {
  --pct: 0;
  width:50px; height:50px; border-radius:50%;
  background:conic-gradient(#ef4444 calc(var(--pct) * 1%), rgba(255,255,255,.08) 0);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.tasks-summary .ts-ring-inner {
  width:38px; height:38px; border-radius:50%;
  background:#1a0808;
  display:flex; align-items:center; justify-content:center;
  font-size:.9rem; font-weight:800; color:#fff;
  font-variant-numeric:tabular-nums;
}
.tasks-summary .ts-ring-inner small {
  font-size:.65rem; color:rgba(255,255,255,.55); margin-left:1px;
}

/* Green "all done" variant — !important so it wins over the red default */
.tasks-summary.all-done {
  background:
    radial-gradient(220px 120px at 100% 0%, rgba(34,197,94,.22), transparent 60%),
    linear-gradient(160deg, #0e2a14 0%, #07150a 100%) !important;
  border-color: rgba(34,197,94,.45) !important;
  box-shadow: 0 8px 22px rgba(34,197,94,.18) !important;
}
.tasks-summary.all-done .ts-eye  { color:#86efac !important; }
.tasks-summary.all-done .ts-ring {
  background:conic-gradient(#22c55e calc(var(--pct) * 1%), rgba(255,255,255,.08) 0) !important;
}
.tasks-summary.all-done .ts-ring-inner { background:#07150a !important; }
.tasks-summary.all-done .ts-btn {
  background:linear-gradient(135deg, #22c55e, #15803d) !important;
  box-shadow: 0 4px 12px rgba(34,197,94,.35) !important;
}

.tasks-cat.overdue-section .lbl { color:#fca5a5; }

.task-info .meta .chip.mine {
  background:linear-gradient(135deg, var(--gold), var(--gold-3));
  color:#0d0d0d; font-weight:800;
}

/* ── Today's Tasks (Home) ──────────────────────────── */
.tasks-section { margin-top:6px; }
.tasks-section .head {
  display:flex; align-items:center; justify-content:space-between;
  margin:14px 2px 8px;
}
.tasks-section .head .title {
  font-size:.78rem; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold);
}
.tasks-section .head .summary {
  font-size:.65rem; color:var(--text-mute); font-weight:700;
}
.tasks-hint {
  background: rgba(239,68,68,.08);
  border: 1px solid rgba(239,68,68,.3);
  color: #fca5a5;
  font-size: .72rem; font-weight:600;
  padding: 8px 12px; border-radius: 10px;
  margin-bottom: 18px;
  line-height: 1.35;
}

.tasks-cat {
  margin-bottom:22px;
}
.tasks-cat:last-child { margin-bottom:0; }
.tasks-cat .lbl {
  font-size:.78rem; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; color:var(--text-dim);
  margin:14px 4px 8px;
}
.tasks-cat.opening  .lbl { color:#86efac; }
.tasks-cat.closing  .lbl { color:#93c5fd; }
.tasks-cat.cleaning .lbl { color:var(--gold-2); }
.tasks-cat.other    .lbl { color:#5eead4; }
.tasks-cat.prep     .lbl { color:#c4b5fd; }
.tasks-cat .lbl { display:flex; align-items:center; justify-content:space-between; cursor:pointer; user-select:none; }
.tasks-cat .tc-chev { flex-shrink:0; transition:transform .18s; opacity:.7; }
.tasks-cat.collapsed .tc-chev { transform:rotate(-90deg); }
.tasks-cat.collapsed .tc-body { display:none; }

.task-row {
  display:grid; grid-template-columns:32px 1fr auto;
  gap:12px; align-items:center;
  padding:11px 14px; margin-bottom:6px;
  background:var(--card); border:1px solid var(--line);
  border-radius:12px; transition:.15s;
}
.task-row.done { opacity:.6; }
.task-row.overdue { border-color:rgba(239,68,68,.32); }
.task-row.mine {
  background:linear-gradient(135deg, rgba(201,168,76,.16), rgba(201,168,76,.06));
  border-color:rgba(201,168,76,.4);
}
.task-row.others { opacity:.65; }

.task-check {
  width:28px; height:28px; border-radius:9px;
  display:inline-flex; align-items:center; justify-content:center;
  border:2px solid rgba(255,255,255,.2);
  background:transparent; color:#fff;
  cursor:pointer; flex-shrink:0; transition:.12s;
}
.task-check:active { transform:scale(.92); }
.task-row.done .task-check {
  background:linear-gradient(135deg, #22c55e, #15803d);
  border-color:#15803d;
}

.task-info { min-width:0; }
.task-info .label {
  font-size:.9rem; font-weight:700; color:#fff;
  word-break:break-word;
}
.task-row.done .task-info .label { text-decoration:line-through; color:var(--text-mute); }
.task-info .meta {
  margin-top:3px; font-size:.65rem; color:var(--text-mute);
  font-weight:600; display:flex; gap:6px; flex-wrap:wrap; align-items:center;
}
.task-info .meta .chip {
  padding:2px 8px; border-radius:999px;
  background:rgba(255,255,255,.05);
}
.task-info .meta .chip.who {
  background:rgba(99,102,241,.16); color:#c7d2fe;
}
.task-info .meta .chip.note { font-style:italic; opacity:.85; }
.task-info .completed-by {
  margin-top:3px; font-size:.65rem; color:#86efac; font-weight:600;
}

.badge-overdue {
  font-size:.65rem; font-weight:800; letter-spacing:.06em;
  text-transform:uppercase; color:#fff;
  background:linear-gradient(135deg,#ef4444,#dc2626);
  padding:3px 8px; border-radius:999px; flex-shrink:0;
  white-space:nowrap;
}

.tasks-empty {
  text-align:center; padding:18px 12px;
  color:var(--text-mute); font-size:.78rem; font-style:italic;
  background:rgba(255,255,255,.03);
  border:1px dashed rgba(255,255,255,.1);
  border-radius:12px;
}

/* ── Rota tab ──────────────────────────────────────── */
.week-nav {
  display:flex; align-items:center; gap:8px; margin-bottom:14px;
}
.week-nav .arr {
  width:38px; height:38px; border-radius:11px;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  color:var(--text-dim); display:flex; align-items:center; justify-content:center;
  transition:.12s;
}
.week-nav .arr:active { background:rgba(201,168,76,.18); color:var(--gold); }
.week-nav .arr:disabled { opacity:.3; }
.week-nav .lbl {
  flex:1; text-align:center; font-size:.78rem; font-weight:700;
  color:#fff; letter-spacing:.04em;
}
.week-nav .lbl .sub {
  display:block; font-size:.65rem; font-weight:600; color:var(--text-mute);
  letter-spacing:.12em; text-transform:uppercase; margin-top:2px;
}
.week-nav .today-btn {
  padding:8px 12px; border-radius:10px;
  background:rgba(201,168,76,.1); border:1px solid rgba(201,168,76,.3);
  color:var(--gold); font-size:.72rem; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase;
}
.week-nav .today-btn:active { background:rgba(201,168,76,.22); }

.unpub-banner {
  background:rgba(148,163,184,.06);
  border:1px dashed rgba(148,163,184,.25);
  border-radius:16px; padding:30px 20px;
  text-align:center; margin-top:20px;
}
.unpub-banner .eye {
  font-size:.65rem; font-weight:800; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold);
}
.unpub-banner .msg {
  margin-top:8px; color:var(--text-dim); font-size:.9rem; font-weight:600;
  line-height:1.45;
}

.rota-list { display:flex; flex-direction:column; gap:8px; }
.rota-day {
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px; padding:12px 14px;
  display:grid; grid-template-columns:44px 1fr auto; gap:12px;
  align-items:center;
}
.rota-day.today {
  background:linear-gradient(135deg, rgba(201,168,76,.12), rgba(201,168,76,.04));
  border-color:rgba(201,168,76,.4);
}
.rota-day .cal {
  text-align:center; padding:6px 0;
  background:rgba(201,168,76,.08); border-radius:10px;
  border:1px solid var(--line);
}
.rota-day.today .cal {
  background:linear-gradient(135deg, var(--gold), var(--gold-3));
  color:#0d0d0d; border-color:var(--gold);
}
.rota-day .cal .dow {
  font-size:.65rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--gold);
}
.rota-day.today .cal .dow { color:#0d0d0d; }
.rota-day .cal .num {
  font-size:1.15rem; font-weight:800; color:#fff; line-height:1;
  margin-top:2px; font-variant-numeric:tabular-nums;
}
.rota-day.today .cal .num { color:#0d0d0d; }

.rota-day .info .nm {
  font-size:.9rem; font-weight:700; color:#fff;
}
.rota-day .info .nm.off { color:var(--text-mute); font-weight:600; }
.rota-day .info .sub {
  margin-top:2px; font-size:.72rem; font-weight:600;
}
.rota-day .info .sub.mute { color:var(--text-mute); }
.rota-day .info .sub.hours { color:var(--gold-2); }
.rota-day .info .sub.ip    { color:#86efac; }
.rota-day .info .sub.miss  { color:#fca5a5; }

.rota-day .status { text-align:right; }
.rota-day .status .pill {
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 8px; border-radius:999px;
  font-size:.65rem; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase;
}
.rota-day .status .pill .d { width:6px; height:6px; border-radius:50%; }
.rota-day .status .pill.off       { background:rgba(148,163,184,.14); color:#94a3b8; }
.rota-day .status .pill.off .d    { background:#64748b; }
.rota-day .status .pill.scheduled { background:rgba(201,168,76,.16); color:var(--gold-2); }
.rota-day .status .pill.scheduled .d { background:var(--gold); }
.rota-day .status .pill.upcoming  { background:rgba(148,163,184,.1);  color:#cbd5e1; }
.rota-day .status .pill.upcoming .d  { background:#94a3b8; }
.rota-day .status .pill.in        { background:rgba(34,197,94,.16);  color:#86efac; }
.rota-day .status .pill.in .d     { background:#22c55e; animation:pulse 1.4s ease-in-out infinite; }
.rota-day .status .pill.done      { background:rgba(59,130,246,.14); color:#93c5fd; }
.rota-day .status .pill.done .d   { background:#3b82f6; }
.rota-day .status .pill.miss      { background:rgba(239,68,68,.14);  color:#fca5a5; }
.rota-day .status .pill.miss .d   { background:#ef4444; }

/* ── Timesheet / Ledger shared ─────────────────────── */
.range-pick {
  display:flex; flex-direction:column; gap:8px; margin-bottom:12px;
}
.range-pick select {
  width:100%; padding:11px 36px 11px 14px; border-radius:12px;
  background:rgba(255,255,255,.05) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23C9A84C' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><polyline points='1,1 6,7 11,1'/></svg>") no-repeat right 14px center;
  border:1px solid var(--line-strong);
  color:#fff; font-size:.9rem; font-weight:700;
  letter-spacing:.01em; appearance:none; -webkit-appearance:none;
  font-family:inherit;
}
.range-pick select:focus { outline:none; border-color:var(--gold); }
.range-pick .custom {
  display:none; gap:8px;
  background:rgba(255,255,255,.03);
  border:1px solid var(--line);
  border-radius:12px; padding:10px 12px;
}
.range-pick .custom.on { display:flex; }
.range-pick .custom > div { flex:1; min-width:0; }
.range-pick .custom .lbl {
  font-size:.65rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--text-mute); margin-bottom:3px;
}
.range-pick .custom input[type=date] {
  width:100%; padding:7px 8px; border-radius:8px;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  color:#fff; font-size:.78rem; font-family:inherit;
  font-variant-numeric:tabular-nums;
}
.range-pick .custom input[type=date]::-webkit-calendar-picker-indicator { filter:invert(.85); cursor:pointer; }

.pager {
  display:flex; align-items:center; justify-content:center;
  gap:6px; margin-top:12px; padding:4px 0;
}
.pager button {
  min-width:34px; height:34px; padding:0 10px; border-radius:9px;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  color:var(--text-dim); font-size:.78rem; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center;
}
.pager button.on {
  background:linear-gradient(135deg, var(--gold), var(--gold-3));
  color:#0d0d0d; border-color:var(--gold);
}
.pager button:disabled { opacity:.3; }
.pager .info {
  font-size:.65rem; font-weight:700; color:var(--text-mute);
  letter-spacing:.04em; text-transform:uppercase; padding:0 6px;
}

.range-info {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:999px; margin-bottom:12px;
  background:rgba(201,168,76,.08); border:1px solid rgba(201,168,76,.25);
  color:var(--gold-2); font-size:.72rem; font-weight:700;
  letter-spacing:.01em;
}
.range-info svg { width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2.2; }

.kpi-row {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:8px;
  margin-bottom:14px;
}
.kpi {
  background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:12px 10px;
  text-align:center;
}
.kpi .lbl {
  font-size:.65rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--text-mute);
}
.kpi .val {
  margin-top:4px; font-size:1.15rem; font-weight:800; color:#fff;
  font-variant-numeric:tabular-nums; letter-spacing:.01em;
}
.kpi.gold  .val { color:var(--gold-2); }
.kpi.green .val { color:#86efac; }

.section-head {
  display:flex; align-items:center; justify-content:space-between;
  margin:6px 2px 8px;
}
.section-head h4 {
  margin:0; font-size:.72rem; font-weight:800; color:var(--gold);
  letter-spacing:.14em; text-transform:uppercase;
}
.section-head .meta { font-size:.72rem; color:var(--text-mute); font-weight:600; }

.entry-list { display:flex; flex-direction:column; gap:6px; }
.entry {
  display:grid; grid-template-columns:44px 1fr auto; gap:10px;
  align-items:center; padding:10px 12px;
  background:var(--card); border:1px solid var(--line);
  border-radius:12px;
}
.entry .cal {
  text-align:center;
  background:rgba(201,168,76,.08); border:1px solid var(--line);
  border-radius:9px; padding:5px 0;
}
.entry .cal .dow {
  font-size:.65rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--gold);
}
.entry .cal .num {
  font-size:1rem; font-weight:800; color:#fff; line-height:1; margin-top:1px;
}
.entry .info .nm {
  font-size:.78rem; font-weight:700; color:#fff;
  font-variant-numeric:tabular-nums;
}
.entry .info .sub {
  margin-top:1px; font-size:.65rem; color:var(--text-mute); font-weight:600;
}
.entry .info .sub.date {
  margin-top:2px; font-size:.65rem; color:var(--text-dim); opacity:.75;
  letter-spacing:.02em;
}
.entry .amt {
  font-size:.9rem; font-weight:800; color:var(--gold-2);
  font-variant-numeric:tabular-nums;
}
.entry .amt.sub { color:var(--text-mute); font-size:.72rem; font-weight:600; margin-top:2px; text-align:right; }
.entry-empty {
  background:rgba(255,255,255,.03);
  border:1px dashed rgba(255,255,255,.1);
  border-radius:12px; padding:22px 10px; text-align:center;
  color:var(--text-mute); font-size:.78rem; font-style:italic;
}

/* ── Ledger ────────────────────────────────────────── */
.owe-card {
  background:
    radial-gradient(240px 120px at 100% 0%, rgba(201,168,76,.16), transparent 60%),
    linear-gradient(160deg, #1f1a10 0%, #15110a 100%);
  border:1px solid var(--line-strong);
  border-radius:18px; padding:18px 18px 16px;
  box-shadow:0 10px 26px rgba(0,0,0,.35);
  margin-bottom:14px;
}
.owe-card .eye {
  font-size:.65rem; font-weight:800; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold);
}
.owe-card .big {
  margin-top:6px; font-size:1.85rem; font-weight:800; color:#fff;
  letter-spacing:-.01em; font-variant-numeric:tabular-nums;
}
.owe-card .big.owed    { color:#86efac; }
.owe-card .big.advance { color:#fca5a5; }
.owe-card .sub {
  margin-top:6px; font-size:.78rem; color:var(--text-mute); font-weight:600;
}
.owe-card .rows {
  margin-top:14px; border-top:1px solid var(--line); padding-top:10px;
  display:flex; flex-direction:column; gap:6px;
}
.owe-card .rows .r {
  display:flex; justify-content:space-between; font-size:.78rem;
}
.owe-card .rows .r .k { color:var(--text-mute); font-weight:600; }
.owe-card .rows .r .v {
  color:#fff; font-weight:700; font-variant-numeric:tabular-nums;
}
.owe-card .rows .r.sub .v { color:var(--text-dim); font-weight:600; }

.next-pay-card {
  background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:14px 16px;
  display:grid; grid-template-columns:1fr auto; gap:10px;
  align-items:center; margin-bottom:14px;
}
.next-pay-card.near { border-color:rgba(201,168,76,.4); background:linear-gradient(135deg, rgba(201,168,76,.08), var(--card)); }
.next-pay-card .lbl {
  font-size:.65rem; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold);
}
.next-pay-card .date {
  margin-top:2px; font-size:1rem; font-weight:800; color:#fff;
}
.next-pay-card .days {
  margin-top:2px; font-size:.72rem; color:var(--text-mute); font-weight:600;
}
.next-pay-card .amt {
  text-align:right; font-size:1.15rem; font-weight:800; color:var(--gold-2);
  font-variant-numeric:tabular-nums;
}
.next-pay-card .amt .sub {
  display:block; margin-top:2px; font-size:.65rem; color:var(--text-mute);
  font-weight:600; letter-spacing:.08em; text-transform:uppercase;
}

.tx-icon {
  width:36px; height:36px; border-radius:10px;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  font-size:.9rem; font-weight:800;
}
.tx-icon.salary    { background:rgba(34,197,94,.14);  color:#86efac; }
.tx-icon.advance   { background:rgba(59,130,246,.14); color:#93c5fd; }
.tx-icon.bonus     { background:rgba(201,168,76,.16); color:var(--gold-2); }
.tx-icon.deduction { background:rgba(239,68,68,.14);  color:#fca5a5; }
.tx-icon.expense   { background:rgba(148,163,184,.14); color:#cbd5e1; }
.tx-icon svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2.2; }

/* ── Admin Home: timesheet-request inbox ──────────── */
.req-mob-box {
  background:
    radial-gradient(220px 120px at 100% 0%, rgba(245,158,11,.16), transparent 60%),
    linear-gradient(160deg, #2a200d 0%, #15110a 100%);
  border:1px solid rgba(245,158,11,.4);
  border-radius:16px; padding:14px 14px 10px;
  margin:14px 0 18px;
}
.req-mob-head {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:10px;
}
.req-mob-head .ttl {
  font-size:.65rem; font-weight:800; letter-spacing:.18em;
  text-transform:uppercase; color:#f59e0b;
}
.req-mob-head .count {
  font-size:.72rem; font-weight:700; color:#fcd34d;
  background:rgba(245,158,11,.18); padding:3px 10px; border-radius:999px;
}
.req-mob-row {
  display:grid; grid-template-columns:34px 1fr; gap:10px;
  padding:10px 0; border-top:1px solid rgba(245,158,11,.14);
}
.req-mob-row.noav { grid-template-columns:1fr; }
.req-mob-row:first-of-type { border-top:none; }
.req-mob-row .av {
  width:34px; height:34px; border-radius:10px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  color:#0d0d0d; font-weight:800; font-size:.78rem;
}
.req-mob-row .info .nm { font-size:.78rem; font-weight:700; color:#fff; }
.req-mob-row .info .nm .muted { color:var(--text-mute); font-weight:600; }
.req-diff-mob {
  display:flex; gap:10px; flex-wrap:wrap;
  margin-top:4px; font-size:.72rem; color:var(--text-dim);
  font-variant-numeric:tabular-nums;
}
.req-diff-mob b { color:var(--text-mute); font-weight:700; margin-right:3px; }
.req-note-mob {
  margin-top:5px; font-size:.72rem; color:var(--text-dim); font-style:italic;
  background:rgba(0,0,0,.18); padding:6px 10px; border-radius:8px;
}
.req-mob-actions { display:flex; gap:6px; margin-top:8px; justify-content:flex-end; }
.req-mob-actions button {
  width:34px; height:34px; padding:0; border-radius:9px;
  border:1px solid transparent; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
}
.req-mob-actions button svg {
  width:16px; height:16px; stroke:currentColor; fill:none;
  stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
}
.req-mob-actions .btn-decline { background:rgba(239,68,68,.12); color:#fca5a5; border-color:rgba(239,68,68,.4); }
.req-mob-actions .btn-adjust  { background:rgba(255,255,255,.06); color:var(--gold-2); border-color:var(--border); }
.req-mob-actions .btn-approve { background:rgba(34,197,94,.14); color:#4ade80; border-color:rgba(34,197,94,.4); }
.req-mob-actions button:active { transform:scale(.97); }
.req-more {
  text-align:center; font-size:.72rem; color:var(--text-mute);
  padding-top:8px; border-top:1px solid rgba(245,158,11,.14); margin-top:6px;
}
/* Compact list rows shown when several requests are pending */
.req-lite {
  display:flex; align-items:center; gap:10px; width:100%; padding:10px 0;
  background:none; border:none; border-top:1px solid rgba(245,158,11,.14);
  cursor:pointer; text-align:left;
}
.req-lite:first-of-type { border-top:none; }
.req-lite .av {
  width:34px; height:34px; border-radius:10px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  color:#0d0d0d; font-weight:800; font-size:.78rem;
}
.req-lite .lite-info { flex:1; min-width:0; }
.req-lite .lite-info .nm { font-size:.78rem; font-weight:700; color:#fff; }
.req-lite .lite-info .sub { font-size:.72rem; color:var(--text-mute); margin-top:1px; }
.req-lite .chev { color:var(--text-mute); font-size:1.15rem; font-weight:400; flex-shrink:0; }
.req-viewall {
  width:100%; margin-top:10px; padding:11px; border-radius:10px;
  background:rgba(245,158,11,.16); color:#fcd34d; border:1px solid rgba(245,158,11,.3);
  font-size:.78rem; font-weight:800; letter-spacing:.02em; cursor:pointer;
}
.req-viewall:active { transform:scale(.98); }

/* ── Submit Shift / Requests screens ───────────────── */
.screen-title { font-size:1rem; font-weight:800; color:#fff; margin:2px 0 12px; }
.screen-sub   { font-size:.78rem; color:var(--text-mute); margin:-8px 0 14px; line-height:1.4; }
.big-cta {
  display:flex; align-items:center; justify-content:center; gap:8px; width:100%;
  padding:15px 18px; border-radius:14px; border:1px solid var(--line-strong);
  background:linear-gradient(135deg,rgba(201,168,76,.9),rgba(201,168,76,.55));
  color:#1a1208; font-size:.9rem; font-weight:800; letter-spacing:.02em;
  cursor:pointer; margin-bottom:18px;
}
.big-cta:active { transform:scale(.98); }
.big-cta svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2.4; }

/* Segmented status filter */
.seg { display:flex; gap:4px; background:rgba(255,255,255,.05); border:1px solid var(--border); border-radius:12px; padding:4px; margin-bottom:14px; }
.seg button {
  flex:1; padding:8px 4px; border:none; background:transparent; border-radius:9px;
  color:var(--text-mute); font-size:.72rem; font-weight:700; cursor:pointer;
}
.seg button.on { background:rgba(201,168,76,.18); color:var(--gold-2); }

/* My-request / manager-request card */
.mreq {
  background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:13px 14px; margin-bottom:9px;
}
.mreq-main { min-width:0; }
.mreq-head { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.mreq-head .nm { font-size:.9rem; font-weight:700; color:#fff; }
.mreq-head .status-pill { margin-left:auto; }
.mreq-sub { margin-top:2px; font-size:.72rem; color:var(--text-dim); font-weight:600; }
/* Side-by-side comparison: Submitted/Requested  vs  Rota */
.mreq-cols { margin-top:12px; display:grid; grid-template-columns:1fr auto 1fr; gap:10px; align-items:center; }
.mreq-vs { color:var(--text-mute); font-size:.72rem; font-weight:700; }
/* Submitted = highlighted (the value under review); Rota = dimmed reference. */
.tpanel { background:rgba(201,168,76,.09); border:1px solid var(--line-strong); border-radius:12px; padding:10px 12px; min-width:0; }
.tpanel.rota { background:rgba(255,255,255,.02); border:1px solid rgba(255,255,255,.06); opacity:.72; }
.tpanel .pk { font-size:.65rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--gold); }
.tpanel.rota .pk { color:var(--text-mute); }
.tpanel .pv { margin-top:4px; font-size:1rem; font-weight:800; color:#fff; font-variant-numeric:tabular-nums; white-space:nowrap; }
.tpanel.rota .pv { color:var(--text-dim); }

/* ── Branded confirm dialog (replaces native confirm) ── */
.yn-confirm-overlay {
  position:fixed; inset:0; z-index:2000;
  background:rgba(0,0,0,.62); backdrop-filter:blur(3px);
  display:flex; align-items:center; justify-content:center; padding:22px;
  animation:ynConfirmFade .14s ease;
}
@keyframes ynConfirmFade { from { opacity:0; } to { opacity:1; } }
.yn-confirm {
  width:min(340px,92vw); background:var(--card);
  border:1px solid var(--line-strong); border-radius:18px; overflow:hidden;
  box-shadow:0 24px 64px rgba(0,0,0,.55);
  animation:ynConfirmPop .18s cubic-bezier(.2,.8,.2,1);
}
@keyframes ynConfirmPop { from { transform:translateY(8px) scale(.97); opacity:0; } to { transform:none; opacity:1; } }
.yn-confirm-body { padding:24px 22px 12px; text-align:center; }
.yn-confirm-ttl { font-size:1rem; font-weight:800; color:#fff; }
.yn-confirm-msg { margin-top:8px; font-size:.85rem; color:var(--text-dim); line-height:1.5; }
.yn-confirm-foot { display:flex; gap:8px; padding:14px 16px 16px; }
.yn-confirm-foot button { flex:1; padding:12px; border-radius:12px; font-weight:800; font-size:.9rem; font-family:inherit; cursor:pointer; border:1px solid transparent; }
.yn-confirm-foot .cancel { background:rgba(255,255,255,.06); color:var(--text-dim); border:1px solid var(--line); }
.yn-confirm-foot .danger { background:linear-gradient(135deg,#ef4444,#b91c1c); color:#fff; }
.yn-confirm-foot .ok { background:linear-gradient(135deg,var(--gold),var(--gold-3)); color:#0d0d0d; }
.yn-confirm-foot button:active { transform:scale(.98); }
@media (prefers-reduced-motion: reduce) { .yn-confirm-overlay, .yn-confirm { animation:none; } }
/* Rota line used on the normal timesheet rows */
.rota-line { margin-top:3px; font-size:.72rem; color:var(--text-mute); font-weight:600; }
.rota-line .rt { color:var(--gold-2); font-weight:700; font-variant-numeric:tabular-nums; }
/* Edit (pencil) icon on the staff's own request cards */
.mreq-edit {
  width:34px; height:34px; padding:0; border-radius:9px; flex-shrink:0; cursor:pointer;
  background:rgba(255,255,255,.06); border:1px solid var(--line); color:var(--gold-2);
  display:inline-flex; align-items:center; justify-content:center;
}
.mreq-edit svg { width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.mreq-edit:active { transform:scale(.97); }
.kind-badge { display:inline-block; padding:1px 7px; border-radius:999px; font-size:.65rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.kind-badge.shift  { background:rgba(59,130,246,.18); color:#93c5fd; }
.kind-badge.change { background:rgba(201,168,76,.18); color:var(--gold-2); }
.mreq .note { margin-top:6px; font-size:.72rem; color:var(--text-dim); font-style:italic; }
.mreq .rvw { margin-top:4px; font-size:.72rem; color:#fca5a5; }
.mreq .reviewed { margin-top:4px; font-size:.72rem; color:var(--text-mute); }
.status-pill { flex-shrink:0; font-size:.65rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; padding:3px 9px; border-radius:999px; }
.status-pill.pending  { background:rgba(245,158,11,.16); color:#fcd34d; }
.status-pill.approved { background:rgba(34,197,94,.16);  color:#86efac; }
.status-pill.declined { background:rgba(239,68,68,.14);  color:#fca5a5; }
.mreq .edit-btn { flex-shrink:0; padding:5px 12px; border-radius:8px; font-size:.72rem; font-weight:800; background:rgba(255,255,255,.06); border:1px solid var(--border); color:var(--gold-2); cursor:pointer; }
.mreq .edit-btn:active { transform:scale(.97); }
.mreq-actions {
  display:flex; justify-content:center; gap:10px;
  margin-top:10px; padding-top:10px; border-top:1px solid var(--line);
}
.mreq-actions button {
  width:32px; height:32px; padding:0; border-radius:9px;
  border:1px solid transparent; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
}
.mreq-actions button svg {
  width:15px; height:15px; stroke:currentColor; fill:none;
  stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
}
/* All three share one tinted style for consistency — colour distinguishes them. */
.mreq-actions .b-decline { background:rgba(239,68,68,.12);  color:#fca5a5;      border-color:rgba(239,68,68,.4); }
.mreq-actions .b-adjust  { background:rgba(255,255,255,.06); color:var(--gold-2); border-color:var(--border); }
.mreq-actions .b-approve { background:rgba(34,197,94,.14);  color:#4ade80;      border-color:rgba(34,197,94,.4); }
.mreq-actions button:active { transform:scale(.97); }
.screen-empty { text-align:center; color:var(--text-mute); font-size:.9rem; padding:40px 20px; }

/* ── Manager Rota grid ─────────────────────────────── */
.mgr-pub-row {
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-bottom:12px; padding:10px 12px;
  background:var(--card); border:1px solid var(--line); border-radius:12px;
}
.mgr-pub-row .pub-on  { color:#86efac; font-weight:700; font-size:.78rem; }
.mgr-pub-row .pub-off { color:#fca5a5; font-weight:700; font-size:.78rem; }
.mgr-pub-row button {
  font-size:.65rem; font-weight:800; letter-spacing:.06em;
  text-transform:uppercase; padding:8px 12px; border-radius:9px;
  border:1px solid transparent; cursor:pointer; flex-shrink:0;
}
.mgr-pub-row .btn-pub-on  { background:linear-gradient(135deg,#22c55e,#15803d); color:#fff; }
.mgr-pub-row .btn-pub-off { background:rgba(239,68,68,.12); color:#fca5a5; border-color:rgba(239,68,68,.4); }

.mgr-day-head {
  display:grid; grid-template-columns:78px repeat(7, minmax(0,1fr));
  gap:3px; margin-bottom:4px; padding:0 2px;
}
.mgr-day-head .dh {
  text-align:center; font-size:.65rem; font-weight:800;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--text-mute); padding-bottom:2px;
}
.mgr-day-head .dh small {
  display:block; font-size:.9rem; font-weight:700; color:#fff;
  margin-top:1px; font-variant-numeric:tabular-nums; letter-spacing:0;
}
.mgr-day-head .dh.today, .mgr-day-head .dh.today small { color:var(--gold); }

.mgr-emp-row {
  display:grid; grid-template-columns:78px repeat(7, minmax(0,1fr));
  gap:3px; margin-bottom:4px; align-items:center; padding:0 2px;
}
.mgr-emp-row .emp-side {
  display:flex; align-items:center; gap:6px; min-width:0;
}
.mgr-emp-row .av {
  width:22px; height:22px; border-radius:7px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  color:#0d0d0d; font-size:.65rem; font-weight:800;
}
.mgr-emp-row .nm {
  font-size:.72rem; color:#fff; font-weight:700;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.day-chip {
  font-size:.65rem; font-weight:700;
  padding:8px 2px; border-radius:7px; min-width:0;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  color:var(--text-mute); font-variant-numeric:tabular-nums;
  cursor:pointer; transition:.12s;
  display:flex; flex-direction:column; align-items:center; gap:2px; line-height:1.15;
}
.day-chip .chip-branch { width:16px; height:3px; border-radius:2px; }
.rota-legend { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:14px; }
.rota-legend .rl-item { display:inline-flex; align-items:center; gap:6px; font-size:.72rem; font-weight:700; color:var(--text-dim); }
.rota-legend .rl-dot { width:10px; height:10px; border-radius:3px; }
.day-chip.on  { background:rgba(201,168,76,.16); color:var(--gold-2); border-color:rgba(201,168,76,.32); }
.day-chip.all { background:rgba(34,197,94,.16);  color:#86efac;        border-color:rgba(34,197,94,.32); }
.day-chip.today { box-shadow:inset 0 0 0 2px var(--gold); }
.day-chip:active { transform:scale(.94); }

/* Sheet row "Request change" affordance + pending pill */
.row-edit-btn {
  width:32px; height:32px; border-radius:9px;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  color:var(--gold-2); display:flex; align-items:center; justify-content:center;
  flex-shrink:0; cursor:pointer; transition:.12s;
}
.row-edit-btn:active { transform:scale(.94); background:rgba(201,168,76,.16); }
.row-edit-btn.danger { color:#fca5a5; }
.row-edit-btn.danger:active { background:rgba(239,68,68,.18); }
.row-admin-btns { display:flex; gap:6px; }
.btn-add-row {
  background:linear-gradient(180deg, var(--gold-2) 0%, var(--gold) 100%);
  color:#1a1208; border:none; border-radius:8px;
  padding:6px 12px; font-size:.72rem; font-weight:800; letter-spacing:.04em;
  cursor:pointer; transition:.12s;
}
.btn-add-row:active { transform:scale(.96); }
.sheet-hint {
  margin-top:10px; font-size:.72rem; color:var(--text-mute);
  font-style:italic;
}
.badge-pending, .badge-approved, .badge-declined {
  font-size:.65rem; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase; padding:2px 8px; border-radius:999px;
  margin-left:6px; vertical-align:middle;
}
.badge-pending  { background:rgba(245,158,11,.16); color:#f59e0b; }
.badge-approved { background:rgba(34,197,94,.18);  color:#34d399; }
.badge-declined { background:rgba(239,68,68,.18);  color:#f87171; }

.note-field { margin-top:12px; }
.note-field span {
  display:block; font-size:.65rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--text-mute); margin-bottom:4px;
}
.note-field textarea {
  width:100%; padding:11px 12px; border-radius:10px;
  background:rgba(255,255,255,.05); border:1px solid var(--line-strong);
  color:#fff; font-size:.9rem; font-family:inherit; resize:vertical;
  min-height:70px;
}

/* Edit-shift bottom sheet modal */
.sheet-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:200;
  display:flex; align-items:flex-end; justify-content:center;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  animation: yn-fade-up .15s ease both;
}
@keyframes yn-fade-up { from { opacity:0; } to { opacity:1; } }
.sheet-card {
  background:linear-gradient(160deg, #1f1a10 0%, #15110a 100%);
  border-top:1px solid var(--line-strong);
  border-radius:20px 20px 0 0;
  width:100%; max-width:480px;
  padding:18px 18px calc(20px + var(--safe-bot));
  box-shadow:0 -10px 30px rgba(0,0,0,.45);
}
.sheet-head {
  display:flex; align-items:flex-start; justify-content:space-between;
  margin-bottom:14px;
}
.sheet-head .ttl { font-size:1rem; font-weight:800; color:#fff; }
.sheet-head .sub { font-size:.78rem; color:var(--text-mute); margin-top:2px; }
.sheet-x {
  width:32px; height:32px; border-radius:9px; flex-shrink:0;
  background:rgba(255,255,255,.05); border:1px solid var(--line);
  color:var(--text-dim); font-size:1.15rem; line-height:1;
}
.sheet-body { margin-bottom:16px; }
.time-row { display:flex; gap:10px; margin-bottom:12px; }
.time-field { flex:1; }
.time-field span {
  display:block; font-size:.65rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--text-mute); margin-bottom:4px;
}
.time-field input[type=time],
.time-field input[type=date],
.time-field input[type=text],
.time-field input[type=number],
.time-field select {
  width:100%; padding:11px 12px; border-radius:10px;
  background:rgba(255,255,255,.05); border:1px solid var(--line-strong);
  color:#fff; font-size:1rem; font-weight:700;
  font-variant-numeric:tabular-nums; font-family:inherit;
  -webkit-appearance:none; appearance:none;
}
.time-field select {
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%23E8D48B' d='M6 8L0 0h12z'/></svg>");
  background-repeat:no-repeat;
  background-position:right 14px center;
  padding-right:34px;
}
.time-field input:disabled { opacity:.4; }
.ad-toggle {
  display:flex; align-items:center; gap:10px;
  padding:11px 14px; border-radius:10px;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  color:#fff; font-size:.9rem; font-weight:700;
}
.ad-toggle input[type=checkbox] { width:18px; height:18px; accent-color:var(--gold); }

.sheet-foot {
  display:grid; grid-template-columns:1fr auto auto; gap:8px;
}
.sheet-foot button {
  padding:11px 14px; border-radius:var(--r-btn, 11px); font-weight:800;
  font-size:.78rem; letter-spacing:.04em; border:1px solid transparent;
  cursor:pointer;
}
.sheet-foot .btn-off    { background:rgba(239,68,68,.12); color:#fca5a5; border-color:rgba(239,68,68,.35); }
.sheet-foot .btn-cancel { background:rgba(255,255,255,.05); color:var(--text-dim); border-color:var(--line); }
.sheet-foot .btn-save   { background:linear-gradient(135deg, var(--gold), var(--gold-3)); color:#0d0d0d; }
.sheet-foot button:active { transform:scale(.97); }

/* ── Admin: employee picker (Sheet, Ledger) ────────── */
.emp-picker {
  display:flex; align-items:center; gap:10px;
  margin-bottom:12px;
}
.emp-picker label {
  font-size:.65rem; font-weight:800; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold);
}
.emp-picker select {
  flex:1; padding:11px 36px 11px 14px; border-radius:12px;
  background:rgba(255,255,255,.05) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23C9A84C' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><polyline points='1,1 6,7 11,1'/></svg>") no-repeat right 14px center;
  border:1px solid var(--line-strong);
  color:#fff; font-size:.9rem; font-weight:700;
  appearance:none; -webkit-appearance:none; font-family:inherit;
}

/* ── Team (Admin/manager) ──────────────────────────── */
.team-totals {
  display:grid; grid-template-columns:repeat(4, 1fr); gap:8px;
  margin-bottom:14px;
}
.team-stat {
  background:var(--card); border:1px solid var(--line);
  border-radius:12px; padding:10px 8px; text-align:center;
}
.team-stat .lbl {
  font-size:.65rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--text-mute);
}
.team-stat .val {
  margin-top:3px; font-size:1rem; font-weight:800; color:#fff;
  font-variant-numeric:tabular-nums;
}
.team-stat.in    .val { color:#86efac; }
.team-stat.done  .val { color:#93c5fd; }
.team-stat.sched .val { color:var(--gold-2); }

.team-row {
  display:grid; grid-template-columns:34px 1fr auto;
  gap:12px; align-items:center;
  padding:11px 14px; margin-bottom:6px;
  background:var(--card); border:1px solid var(--line);
  border-radius:12px;
}
.team-row .av {
  width:34px; height:34px; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:.78rem; color:#0d0d0d;
}
.team-row .info .nm {
  font-size:.9rem; font-weight:700; color:#fff;
  display:flex; align-items:center; gap:6px;
}
.team-row .info .nm .pill-mini {
  font-size:.65rem; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; padding:1px 6px; border-radius:999px;
  background:linear-gradient(135deg,var(--gold),var(--gold-3));
  color:#1a1208;
}
.team-row .info .sub {
  margin-top:2px; font-size:.72rem; color:var(--text-mute); font-weight:600;
}
.team-row .stat {
  text-align:right; font-size:.72rem; font-weight:700;
  color:var(--text-mute); white-space:nowrap;
}
.team-row .stat.in       { color:#86efac; }
.team-row .stat.scheduled{ color:var(--gold-2); }
.team-row .stat.completed{ color:#93c5fd; }
.team-row .stat .sched   { color:var(--text-mute); font-weight:600; font-size:.72rem; }
.team-row .stat .actual  { font-weight:800; font-size:.72rem; margin-top:2px; }

/* ── Admin Home: section blocks ────────────────────── */
.mgr-section {
  background: linear-gradient(160deg, rgba(201,168,76,.04), rgba(201,168,76,.01));
  border:1px solid var(--line); border-radius:14px;
  padding:14px 14px 10px; margin-bottom:14px;
}
.mgr-section-head {
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:10px;
}
.mgr-section-head .ttl {
  font-size:.72rem; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--gold);
}
.mgr-section-head .count {
  font-size:.65rem; font-weight:700; color:var(--text-mute);
}
.mgr-section-head .ttl-link {
  background:none; border:none; color:var(--gold-2);
  font-size:.72rem; font-weight:700; cursor:pointer; padding:0;
}

/* Team-tasks chips + preview rows */
.tt-chips { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:8px; }
.tt-chip {
  padding:4px 10px; border-radius:999px;
  font-size:.65rem; font-weight:800; letter-spacing:.06em;
  background:rgba(255,255,255,.04); border:1px solid var(--line);
  color:var(--text-mute);
}
.tt-chip.all  { background:rgba(34,197,94,.14);  border-color:rgba(34,197,94,.28);  color:#86efac; }
.tt-chip.some { background:rgba(245,158,11,.12); border-color:rgba(245,158,11,.28); color:#fbbf24; }
.tt-chip.none { background:rgba(239,68,68,.10);  border-color:rgba(239,68,68,.24);  color:#fca5a5; }
.tt-row {
  display:flex; align-items:center; gap:9px;
  padding:6px 0; font-size:.78rem; color:var(--text);
}
.tt-row .dot {
  width:7px; height:7px; border-radius:50%;
  background:var(--text-mute); flex-shrink:0;
}
.tt-row .dot.opening  { background:#fbbf24; }
.tt-row .dot.closing  { background:#93c5fd; }
.tt-row .dot.cleaning { background:#86efac; }
.tt-row .lbl { flex:1; }
.tt-more {
  margin-top:4px; font-size:.72rem; color:var(--text-mute);
  font-style:italic;
}

/* ── Profile (Me) ──────────────────────────────────── */
.me-hero {
  background:
    radial-gradient(240px 140px at 100% 0%, rgba(201,168,76,.18), transparent 60%),
    linear-gradient(160deg, #1f1a10 0%, #15110a 100%);
  border:1px solid var(--line-strong);
  border-radius:18px; padding:22px 20px 18px;
  text-align:center; margin-bottom:14px;
}
.me-hero .nm { font-size:1.15rem; font-weight:800; color:#fff; }
.me-hero .rl { font-size:.78rem; color:var(--gold-2); font-weight:700; margin-top:3px; letter-spacing:.01em; }
.me-hero .tags {
  margin-top:10px; display:flex; gap:6px; justify-content:center; flex-wrap:wrap;
}
.me-hero .tag {
  padding:3px 10px; border-radius:999px;
  background:rgba(255,255,255,.05); border:1px solid var(--line);
  font-size:.65rem; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--text-dim);
}
.me-hero .tag.active { background:rgba(34,197,94,.14); border-color:rgba(34,197,94,.3); color:#86efac; }

.info-group {
  background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:4px 16px; margin-bottom:12px;
}
.info-row {
  display:flex; justify-content:space-between; align-items:center;
  padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.info-row:last-child { border-bottom:none; }
.info-row .k {
  font-size:.72rem; font-weight:700; color:var(--text-mute);
  letter-spacing:.04em;
}
.info-row .v {
  font-size:.9rem; font-weight:700; color:#fff;
  text-align:right; font-variant-numeric:tabular-nums;
  word-break:break-word; max-width:60%;
}
.info-row .v.none { color:var(--text-mute); font-weight:600; font-style:italic; }

.me-logout {
  width:100%; padding:14px 20px; border-radius:14px;
  background:rgba(239,68,68,.1); border:1px solid rgba(239,68,68,.3);
  color:#fca5a5; font-size:.9rem; font-weight:800;
  letter-spacing:.04em; text-transform:uppercase;
  display:flex; align-items:center; justify-content:center; gap:8px;
  margin-top:4px;
}
.me-logout:active { background:rgba(239,68,68,.22); transform:scale(.98); }
.me-logout svg { width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2.2; }

/* Me menu — entry points for Timesheet / Ledger (moved off the bottom nav) */
.me-menu { display:flex; flex-direction:column; gap:1px; background:rgba(255,255,255,.06); border:1px solid var(--border); border-radius:14px; overflow:hidden; margin-bottom:16px; }
.me-menu-item { display:flex; align-items:center; gap:12px; width:100%; padding:15px 16px; background:transparent; border:none; color:#fff; font-size:.9rem; font-weight:600; text-align:left; cursor:pointer; }
.me-menu-item + .me-menu-item { border-top:1px solid var(--border); }
.me-menu-item:active { background:rgba(201,168,76,.12); }
.me-menu-item svg { width:20px; height:20px; stroke:var(--gold); fill:none; stroke-width:2; flex-shrink:0; }
.me-menu-item .lbl { flex:1; }
.me-menu-item .chev { color:var(--text-mute); font-size:1.15rem; font-weight:400; line-height:1; }

/* Back bar for sub-pages now living under Me */
.sub-back-row { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0 0 12px; }
.sub-back { display:inline-flex; align-items:center; gap:6px; margin:0; padding:7px 12px 7px 8px; background:rgba(255,255,255,.06); border:1px solid var(--border); border-radius:10px; color:var(--gold-2); font-size:.78rem; font-weight:700; cursor:pointer; }
.sub-back:active { background:rgba(201,168,76,.14); }
.sub-back svg { width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2.4; }
.pdf-btn {
  display:inline-flex; align-items:center; gap:6px;
  background:linear-gradient(180deg, var(--gold-2) 0%, var(--gold) 100%);
  color:#1a1208; border:none; border-radius:10px;
  padding:7px 12px; font-size:.72rem; font-weight:800; letter-spacing:.03em;
  cursor:pointer; transition:.12s; flex-shrink:0;
}
.pdf-btn svg { width:14px; height:14px; }
.pdf-btn:active { transform:scale(.96); }

/* Stock quick-action card (Home) — teal, distinct from the gold task cards */
.mgr-quick { display:flex; align-items:center; gap:12px; width:100%; padding:14px 16px; margin-bottom:16px; background:linear-gradient(135deg,rgba(20,184,166,.20),rgba(13,148,136,.06)); border:1px solid rgba(20,184,166,.42); border-radius:16px; color:#fff; text-align:left; cursor:pointer; }
.mgr-quick:active { transform:scale(.99); }
.mgr-quick .qic { width:40px; height:40px; border-radius:12px; background:rgba(20,184,166,.22); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.mgr-quick .qic svg { width:20px; height:20px; stroke:#5eead4; }
.mgr-quick .qtx { flex:1; display:flex; flex-direction:column; }
.mgr-quick .qt { font-weight:800; font-size:.9rem; }
.mgr-quick .qs { font-size:.72rem; color:var(--text-mute); margin-top:1px; }
.mgr-quick .chev { color:var(--text-mute); font-size:1.15rem; }

/* Stock count screen */
.stk-head { display:flex; align-items:center; gap:8px; margin-bottom:10px; flex-wrap:wrap; }
.stk-head select { flex:1; min-width:120px; padding:9px 11px; background:rgba(255,255,255,.06); border:1px solid var(--border); border-radius:10px; color:#fff; font-size:.9rem; font-weight:700; }
.stk-date { font-size:.78rem; color:var(--text-mute); font-weight:600; }
.stk-saved { font-size:.72rem; color:#86efac; font-weight:700; opacity:0; transition:opacity .2s; }
.stk-saved.show { opacity:1; }
.stk-modes { display:flex; gap:4px; background:rgba(255,255,255,.05); border:1px solid var(--border); border-radius:10px; padding:3px; margin-bottom:12px; }
.stk-modes button { flex:1; padding:8px; background:transparent; border:none; border-radius:8px; color:var(--text-mute); font-size:.78rem; font-weight:700; cursor:pointer; }
.stk-modes button.active { background:rgba(201,168,76,.18); color:var(--gold-2); }
.stk-cat { font-size:.65rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--gold-3); margin:14px 2px 6px; }
.stk-row { display:flex; align-items:center; gap:10px; padding:10px 12px; background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:12px; margin-bottom:6px; }
.stk-row.low { border-color:rgba(239,68,68,.4); background:rgba(239,68,68,.07); }
.stk-info { flex:1; min-width:0; }
.stk-nm { font-weight:700; font-size:.9rem; }
.stk-meta { font-size:.72rem; color:var(--text-mute); margin-top:1px; }
.stk-row.low .stk-meta { color:#fca5a5; }
.stk-stepper { display:flex; align-items:center; gap:0; flex-shrink:0; }
.stk-btn { width:34px; height:34px; border:1px solid var(--border); background:rgba(255,255,255,.06); color:var(--gold-2); font-size:1.15rem; font-weight:800; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.stk-btn:first-child { border-radius:9px 0 0 9px; }
.stk-btn:last-child { border-radius:0 9px 9px 0; }
.stk-btn:active { background:rgba(201,168,76,.2); }
.stk-qty { width:52px; height:34px; text-align:center; border:1px solid var(--border); border-left:none; border-right:none; background:rgba(0,0,0,.2); color:#fff; font-size:.9rem; font-weight:800; font-variant-numeric:tabular-nums; outline:none; }
.stk-mng-row { display:flex; align-items:center; gap:10px; padding:12px; background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:12px; margin-bottom:6px; }
.stk-mng-row .info { flex:1; min-width:0; }
.stk-add { width:100%; padding:13px; margin-top:10px; border-radius:12px; background:rgba(201,168,76,.14); border:1px dashed rgba(201,168,76,.4); color:var(--gold-2); font-weight:800; font-size:.9rem; cursor:pointer; }
.stk-pager { display:flex; align-items:center; justify-content:center; gap:14px; margin:14px 0 4px; }
.stk-pager button { padding:8px 18px; background:rgba(255,255,255,.06); border:1px solid var(--border); border-radius:10px; color:var(--gold-2); font-size:.9rem; font-weight:700; cursor:pointer; }
.stk-pager button:disabled { opacity:.35; cursor:default; }
.stk-pager span { font-size:.78rem; color:var(--text-mute); font-weight:700; font-variant-numeric:tabular-nums; }
.stk-cat-sug { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:8px; }
.stk-cat-sug-item { padding:6px 12px; border-radius:8px; background:rgba(255,255,255,.06); border:1px solid var(--border); color:#e2e8f0; font-size:.78rem; font-weight:600; cursor:pointer; }
.stk-cat-sug-item:active { background:rgba(201,168,76,.2); border-color:var(--gold); }
.stk-cat-sug-new { font-size:.78rem; color:var(--gold-2); font-weight:700; }

/* Manager task management */
.mtask-list { margin-bottom:18px; }
.mtask-list { margin-bottom:30px; }
.mtask-head { display:flex; justify-content:space-between; align-items:center; font-size:1rem; font-weight:800; letter-spacing:.01em; color:#fff; margin:0 2px 14px; padding-bottom:10px; border-bottom:1px solid var(--border); }
.mtask-head span { color:var(--gold-2); font-weight:800; font-size:.78rem; background:rgba(201,168,76,.14); padding:3px 10px; border-radius:20px; }
.mtask-row { display:flex; align-items:center; gap:10px; padding:12px 13px; background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:11px; margin-bottom:6px; cursor:pointer; }
.mtask-row:active { background:rgba(201,168,76,.08); }
.mtask-lbl { flex:1; min-width:0; font-size:.9rem; font-weight:600; }
.mtask-meta { display:flex; align-items:center; gap:7px; flex-shrink:0; }
.mtask-who { font-size:.72rem; font-weight:800; padding:3px 9px; border-radius:20px; white-space:nowrap; }
.mtask-who.none { background:rgba(255,255,255,.06); color:var(--text-mute); }
.mtask-day { font-size:.65rem; font-weight:800; color:var(--gold-2); background:rgba(201,168,76,.14); padding:3px 8px; border-radius:6px; }
.mtask-edit { color:var(--text-mute); font-size:1.15rem; line-height:1; }
.mtask-empty { padding:12px; color:var(--text-mute); font-size:.9rem; text-align:center; }
.mtask-add { display:flex; gap:6px; margin-top:8px; }
.mtask-input { flex:1; min-width:0; padding:11px 12px; background:rgba(0,0,0,.2); border:1px solid var(--border); border-radius:10px; color:#fff; font-size:.9rem; }
.mtask-sel { max-width:110px; padding:0 8px; background:rgba(255,255,255,.06); border:1px solid var(--border); border-radius:10px; color:#fff; font-size:.78rem; }
.mtask-addbtn { padding:0 16px; background:linear-gradient(135deg,var(--gold),var(--gold-2)); border:none; border-radius:var(--r-btn, 11px); color:#1a1208; font-weight:800; font-size:.78rem; cursor:pointer; }

.stub-screen {
  flex:1; display:flex; flex-direction:column; align-items:center;
  justify-content:center; text-align:center; padding:30px 20px;
  gap:10px;
}
.stub-screen .ic {
  width:60px; height:60px; border-radius:18px;
  background:rgba(201,168,76,.08); color:var(--gold);
  display:flex; align-items:center; justify-content:center;
}
.stub-screen h3 { margin:0; font-size:1.15rem; color:#fff; }
.stub-screen p  { margin:0; font-size:.9rem; color:var(--text-mute); max-width:280px; }

.toast {
  position:fixed; bottom:calc(90px + var(--safe-bot)); left:50%;
  transform:translateX(-50%) translateY(20px);
  background:#1a1a1a; border:1px solid var(--line-strong);
  color:#fff; font-size:.9rem; font-weight:600;
  padding:12px 18px; border-radius:14px;
  box-shadow:0 12px 28px rgba(0,0,0,.4);
  opacity:0; pointer-events:none; transition:.2s;
  z-index:400; max-width:320px; text-align:center;
}
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }
.toast.err { border-color:rgba(239,68,68,.5); color:#fca5a5; }
.toast.ok  { border-color:rgba(34,197,94,.5);  color:#86efac; }

.spinner {
  width:22px; height:22px; border:3px solid rgba(201,168,76,.25);
  border-top-color:var(--gold); border-radius:50%;
  animation:spin .8s linear infinite; margin:0 auto;
}
@keyframes spin { to { transform:rotate(360deg); } }

.tab-loading { flex:1; display:flex; align-items:center; justify-content:center; }

@media (max-width: 360px) {
  .greet h2 { font-size:1.15rem; }
  .today-card .shift { font-size:1.15rem; }
}

/* ── Rota time picker: editable hour/minute comboboxes (type or pick) ── */
.time-field .tp { display:flex; align-items:center; gap:6px; margin-top:2px; }
.tp .tp-inp {
  flex:1; min-width:0; width:100%; text-align:center;
  padding:11px 8px; border-radius:10px;
  background:rgba(255,255,255,.05); border:1px solid var(--line-strong);
  color:#fff; font-size:1rem; font-weight:700;
  font-variant-numeric:tabular-nums; font-family:inherit;
}
.tp .tp-inp:focus { outline:none; border-color:var(--gold); background:rgba(201,168,76,.08); }
.tp .tp-sep { color:var(--text-mute); font-weight:800; }

/* ── Requests nested under Timesheet — SAME size as siblings, just indented ── */
.me-menu-item.me-submenu-item { position:relative; padding-left:44px; }
.me-menu-item + .me-menu-item.me-submenu-item { border-top:none; }
.me-menu-item.me-submenu-item::before {
  content:""; position:absolute; left:26px; top:-2px; height:calc(50% + 2px); width:10px;
  border-left:1.5px solid var(--line-strong);
  border-bottom:1.5px solid var(--line-strong);
  border-bottom-left-radius:6px; pointer-events:none;
}