/* Review controls are isolated. The selected schedule treatment reuses the
   same lighting and accent rules as the lab's lit variants below. */
.card-lab[hidden] { display: none; }
.card-lab { flex: 0 0 auto; max-height: 70vh; overflow: auto; padding: 16px 24px; border-top: 1px solid var(--line); background: #202320; --lab-opacity: 1; --lab-curve: 1.5; --lab-scale: 4; --lab-card-width: 117px; --lab-card-height: 55px; }
.lab-heading { display: flex; justify-content: space-between; align-items: start; gap: 16px; }
.lab-heading h2 { margin: 0; font: 500 22px Georgia, serif; }
.lab-heading p, .lab-support { margin: 6px 0 12px; font-size: 12px; color: var(--muted); }
.lab-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.lab-controls label { display: grid; gap: 5px; color: #c4c9c2; font-size: 11px; }
.lab-controls select { min-height: 30px; border: 1px solid #4b535a; border-radius: 6px; padding: 3px 7px; background: #292e30; color: var(--text); font: inherit; }
.lab-controls input { accent-color: var(--brand); }
.lab-controls .lab-check { display: flex; align-items: center; gap: 5px; }
.lab-support { margin: 12px 0; }
.lab-comparisons { display: grid; grid-template-columns: repeat(4, minmax(200px, 1fr)); gap: 16px; overflow-x: auto; }
.lab-variant { padding: 10px; border: 1px solid #3a403b; border-radius: 8px; min-width: 200px; }
.lab-variant[data-selected="true"] { border-color: #ad915f; }
.lab-variant > button { border: 0; padding: 0; background: none; color: var(--text); font: inherit; font-size: 12px; cursor: pointer; text-align: left; }
.lab-variant p { min-height: 30px; margin: 6px 0 8px; font-size: 11px; line-height: 1.4; color: var(--muted); }
.lab-stage, .lab-corner { background: #292d2a; }
.card-lab.lab-grid-background .lab-stage, .card-lab.lab-grid-background .lab-corner { background: #1d201d; }
.lab-stage { min-height: 78px; padding: 7px; display: flex; align-items: start; }
.card-lab .lab-card { width: var(--lab-card-width); height: var(--lab-card-height); min-height: 0; flex-shrink: 0; cursor: default; --accent-opacity: var(--lab-opacity); }
.card-lab .lab-card:hover { transform: none; border-color: #4b535a; }
.card-lab .lab-lit, #scheduleGrid .shift-card { background: var(--publication-pattern, linear-gradient(transparent, transparent)), linear-gradient(180deg, #ffffff08, #ffffff01 40%, #0000000a), #30363b; box-shadow: inset 0 1px #ffffff12, inset 0 -1px #00000040, 0 1px 2px #00000040, 0 3px 5px #00000016; }
/* One continuous border band has a native rounded inner edge. Masking the
   entire band once gives a top fade without compositing two colored strips. */
.card-lab .lab-lit::before, #scheduleGrid .shift-card::before { inset: 0; width: auto; box-sizing: border-box; border: 0 solid var(--accent); border-left-width: 4px; border-top-width: 3px; border-radius: inherit; background: none; opacity: var(--lab-opacity, 1); }
.card-lab .lab-lit::after, #scheduleGrid .shift-card::after { display: none; }
#scheduleGrid .shift-card::before { opacity: var(--schedule-accent-opacity, .9); }
@supports (mask-image: linear-gradient(90deg, #000, transparent)) {
  .card-lab .lab-lit::before, #scheduleGrid .shift-card::before { mask-image: linear-gradient(90deg, #000, #00000073 28%, transparent 58%); }
}
@supports (corner-shape: squircle) {
  .card-lab:not(.lab-force-fallback) .lab-c { corner-shape: squircle; }
  .card-lab:not(.lab-force-fallback) .lab-c::before { corner-shape: squircle; }
}
@supports (corner-shape: superellipse(2)) {
  .card-lab:not(.lab-force-fallback) .lab-d { corner-shape: superellipse(var(--lab-curve)); }
  .card-lab:not(.lab-force-fallback) .lab-d::before { corner-shape: superellipse(var(--lab-curve)); }
}
@supports (corner-shape: superellipse(1.5)) {
  #scheduleGrid .shift-card, #scheduleGrid .shift-card::before { corner-shape: superellipse(1.5); }
}
.lab-corner-label { display: block; margin: 10px 0 5px; color: #bdc3bb; font-size: 10px; }
.lab-corner { width: 180px; height: 112px; padding: 12px; overflow: hidden; }
.lab-corner .lab-card { transform: scale(var(--lab-scale)); transform-origin: top left; pointer-events: none; }
.lab-corner .lab-card:hover { transform: scale(var(--lab-scale)); }
.lab-dense-heading { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.lab-dense-heading h3 { margin: 0; font-size: 12px; font-weight: 600; }
.lab-dense-heading span { color: var(--muted); font-size: 11px; }
.lab-dense-scroll { overflow-x: auto; margin-top: 8px; }
.lab-dense { display: grid; grid-template-columns: repeat(8, var(--day-width)); width: max-content; }
.lab-dense .lab-stage { width: var(--day-width); height: 78px; border: 1px solid #ffffff09; }
.lab-schedule-preview { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 10px 0; color: #c4c9c2; font-size: 12px; }
.lab-schedule-preview label { display: flex; align-items: center; gap: 8px; }
.lab-schedule-preview select { padding: 5px 8px; border: 1px solid #4b535a; border-radius: 6px; background: #292e30; color: var(--text); font: inherit; }
.lab-schedule-preview small { color: var(--muted); }
.card-lab.lab-schedule-focus :is(.lab-controls, .lab-support, .lab-comparisons, .lab-dense-heading, .lab-dense-scroll) { display: none; }
/* Publication patterns are behind content and the unchanged template accent. */
.publication-new { --publication-pattern: repeating-linear-gradient(45deg, #e2e6e91f 0 1px, transparent 1px 10px); }
.publication-modified { --publication-pattern: repeating-linear-gradient(45deg, color-mix(in srgb, var(--accent) 15%, transparent) 0 1px, transparent 1px 10px); }
#scheduleGrid .shift-card.publication-deleted { background: linear-gradient(180deg, #292e32, #252a2e); border: 2px solid #a77978; color: #a3a7aa; box-shadow: none; }
#scheduleGrid .shift-card.publication-deleted::before { opacity: .55; }
#scheduleGrid .shift-card.publication-deleted strong { color: #a3a7aa; padding-right: 9px; }
#scheduleGrid .shift-card.publication-deleted span { color: #969b9f; }
.deletion-mark { position: absolute; top: 5px; right: 3px; width: 10px; height: 10px; fill: none; stroke: #c19a98; stroke-width: 1.4; pointer-events: none; }
.publication-sample { display: inline-block; width: 28px; height: 12px; border-radius: 3px; background: var(--publication-pattern, none), #30363b; --accent: #8ba06d; }
.publication-sample.publication-deleted { border: 2px solid #a77978; background: #252a2e; }
