.cleaning-auth {
  background:
    radial-gradient(circle at 13% 78%, var(--pink) 0 5.6rem, transparent 5.7rem),
    radial-gradient(circle at 84% 18%, var(--yellow) 0 6.4rem, transparent 6.5rem),
    linear-gradient(124deg, var(--mint) 0 56%, var(--cream) 56% 100%);
}

.cleaning-topbar { background: rgba(245, 241, 230, 0.96); }
.cleaning-shell { width: min(1240px, calc(100% - 36px)); }
.cleaning-hero { background: var(--mint); }
.cleaning-hero::before { background: var(--pink); }
.cleaning-hero::after { background: var(--orange); }

.week-picker {
  width: min(390px, 100%);
  padding: 10px;
  border: 1.5px solid var(--ink);
  border-radius: 999px;
  background: var(--paper);
  display: grid;
  grid-template-columns: 42px 1fr 42px;
  align-items: center;
  gap: 8px;
}

.week-picker button {
  width: 42px;
  height: 42px;
  border: 1px solid var(--ink);
  border-radius: 50%;
  background: var(--cream);
  color: var(--ink);
  font-size: 20px;
}

.week-picker button:hover { background: var(--yellow); }
.week-picker label { display: grid; gap: 3px; }
.week-picker label span {
  color: var(--muted);
  font-family: "Gopher Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.week-picker input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font-family: "Gopher Mono", monospace;
  font-size: 12px;
}

.week-missing {
  margin-top: 22px;
  padding: 26px;
  border: 1.5px dashed var(--ink);
  border-radius: var(--radius-lg);
  background: rgba(254, 254, 244, 0.65);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.week-missing h2, .validation-panel h2 {
  margin: 5px 0 0;
  font-family: "Dalat Sans", "Antonio", sans-serif;
  font-size: 32px;
  font-weight: 400;
}
.week-missing > p { max-width: 440px; margin: 0; color: var(--muted); line-height: 1.5; }

.assignment-panel {
  margin-top: 22px;
  padding: clamp(22px, 4vw, 34px);
  border: 1.5px solid var(--ink);
  border-radius: var(--radius-lg);
  background: var(--pink);
}
.assignment-panel .section-heading { margin: 0 0 20px; }
.admin-lock, .week-status {
  padding: 6px 11px;
  border: 1px solid var(--ink);
  border-radius: 999px;
  background: var(--paper);
  font-family: "Gopher Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.assignment-grid {
  display: grid;
  grid-template-columns: 130px repeat(3, minmax(150px, 1fr)) auto;
  align-items: end;
  gap: 12px;
}
.assignment-grid label { display: grid; gap: 6px; }
.assignment-grid label > span {
  color: var(--ink);
  font-family: "Gopher Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.assignment-grid select {
  width: 100%;
  height: 46px;
  padding: 0 34px 0 13px;
  border: 1px solid var(--ink);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink);
}

.cleaning-summary { grid-template-columns: repeat(4, 1fr); margin-top: 24px; }
.accent-pink { background: var(--pink); }

.schedule-strip {
  margin-top: 14px;
  padding: 18px 20px;
  border: 1.5px solid var(--ink);
  border-radius: var(--radius-lg);
  background: var(--paper);
  display: grid;
  grid-template-columns: 0.75fr repeat(3, 1fr) auto;
  align-items: center;
  gap: 14px;
}
.schedule-strip div { min-width: 0; display: grid; gap: 4px; }
.schedule-strip small {
  color: var(--muted);
  font-family: "Gopher Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.schedule-strip strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; }
.week-status { background: var(--yellow); }
.week-status.completed { background: var(--mint); }

.task-heading { align-items: center; }
.assignment-notice {
  margin-bottom: 14px;
  padding: 15px 18px;
  border: 1px solid var(--ink);
  border-radius: var(--radius-md);
  background: var(--yellow);
  color: var(--ink);
  line-height: 1.4;
}

.cleaning-task-list { display: grid; gap: 12px; }
.cleaning-task {
  padding: 20px;
  border: 1.5px solid var(--ink);
  border-radius: var(--radius-lg);
  background: var(--paper);
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto minmax(260px, 0.75fr);
  align-items: center;
  gap: 18px;
}
.cleaning-task[data-status="done"] { background: rgba(182, 213, 206, 0.72); }
.cleaning-task[data-status="not_done"] { background: rgba(249, 166, 108, 0.75); }
.cleaning-task[data-status="na"] { background: rgba(216, 216, 216, 0.62); }
.task-copy { min-width: 0; }
.task-copy h3 { margin: 7px 0 0; font-family: "Dalat Sans", "Antonio", sans-serif; font-size: 20px; font-weight: 400; line-height: 1.2; }
.task-meta { display: flex; flex-wrap: wrap; gap: 7px; }
.task-meta span {
  padding: 4px 8px;
  border: 1px solid var(--ink);
  border-radius: 999px;
  background: var(--cream);
  font-family: "Gopher Mono", monospace;
  font-size: 8px;
  text-transform: uppercase;
}
.task-meta .task-shift { background: var(--mint); }
.task-audit { min-height: 13px; margin: 7px 0 0; color: var(--muted); font-family: "Gopher Mono", monospace; font-size: 8px; }
.task-controls {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--ink);
  border-radius: 999px;
  overflow: hidden;
}
.task-controls button {
  min-height: 40px;
  padding: 0 12px;
  border: 0;
  border-right: 1px solid var(--ink);
  background: var(--paper);
  color: var(--ink);
  font-size: 12px;
  font-weight: 600;
}
.task-controls button:last-child { border-right: 0; }
.task-controls button:hover { background: var(--cream); }
.task-controls button.active[data-status="done"] { background: var(--green); color: var(--paper); }
.task-controls button.active[data-status="not_done"] { background: var(--orange); }
.task-controls button.active[data-status="na"] { background: var(--gray); }
.task-controls button:disabled { opacity: 0.45; }
.task-note { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 8px; }
.task-note label { display: grid; gap: 5px; }
.task-note label span { color: var(--muted); font-family: "Gopher Mono", monospace; font-size: 8px; text-transform: uppercase; }
.task-note textarea {
  width: 100%;
  min-height: 58px;
  padding: 10px 12px;
  resize: vertical;
  border: 1px solid var(--ink);
  border-radius: var(--radius-md);
  background: var(--paper);
  color: var(--ink);
  font-family: "Antonio", sans-serif;
  font-size: 14px;
}
.task-note .save-note { min-height: 40px; padding: 0 13px; border: 1px solid var(--ink); border-radius: 999px; background: var(--ink); color: var(--paper); font-size: 11px; }
.task-note textarea:disabled, .task-note .save-note:disabled { opacity: 0.45; cursor: not-allowed; }

.validation-panel {
  margin-top: 24px;
  padding: 28px;
  border: 1.5px solid var(--ink);
  border-radius: var(--radius-lg);
  background: var(--yellow);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.validation-panel p:not(.eyebrow) { margin: 7px 0 0; color: rgba(1, 5, 6, 0.68); }

@media (max-width: 1080px) {
  .assignment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .assignment-grid .primary-button { width: 100%; }
  .cleaning-summary { grid-template-columns: repeat(2, 1fr); }
  .schedule-strip { grid-template-columns: repeat(2, 1fr); }
  .schedule-strip .week-status { justify-self: start; }
  .cleaning-task { grid-template-columns: minmax(0, 1fr) auto; }
  .task-note { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .cleaning-topbar { align-items: stretch; }
  .cleaning-topbar .session-fields { margin-left: auto; }
  .week-missing, .validation-panel { align-items: flex-start; flex-direction: column; }
  .cleaning-task { grid-template-columns: 1fr; }
  .task-controls { width: 100%; }
  .task-note { grid-column: auto; }
}

@media (max-width: 620px) {
  .cleaning-auth { background: linear-gradient(160deg, var(--mint), var(--cream)); }
  .cleaning-shell { width: min(100% - 24px, 1240px); }
  .cleaning-topbar .session-fields { display: block; width: 100%; margin: 0; }
  .cleaning-hero h1 { font-size: 46px; }
  .week-picker { border-radius: var(--radius-lg); }
  .assignment-grid, .cleaning-summary, .schedule-strip { grid-template-columns: 1fr; }
  .assignment-panel .section-heading { align-items: flex-start; }
  .task-heading .filter-chips { width: 100%; }
  .task-heading .chip { flex: 1; padding-inline: 8px; }
  .task-note { grid-template-columns: 1fr; }
  .task-note .save-note { width: 100%; }
}
