:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-subtle: #f8fafc;
  --surface-raised: #ffffff;
  --header: #111827;
  --header-text: #ffffff;
  --header-muted: #cbd5e1;
  --text: #172033;
  --muted: #64748b;
  --muted-strong: #475569;
  --border: #dbe1e8;
  --border-soft: #e5e7eb;
  --primary: #2563eb;
  --primary-strong: #1d4ed8;
  --primary-soft: #eff6ff;
  --primary-border: #bfdbfe;
  --covered: #15803d;
  --covered-bg: #dcfce7;
  --covered-border: #86efac;
  --partial: #b45309;
  --partial-bg: #fef3c7;
  --partial-border: #fcd34d;
  --uncovered: #b91c1c;
  --uncovered-bg: #fee2e2;
  --uncovered-border: #fca5a5;
  --assignment: #4f46e5;
  --assignment-bg: #eef2ff;
  --assignment-border: #a5b4fc;
  --lead: #9a3412;
  --lead-bg: #ffedd5;
  --lead-border: #fb923c;
  --event: #7e22ce;
  --event-bg: rgba(192, 132, 252, .22);
  --event-border: #c084fc;
  --availability-green: #16a34a;
  --availability-green-hover: #22c55e;
  --availability-red: #dc2626;
  --availability-red-hover: #ef4444;
  --availability-hour-line: #172033;
  --sheet-header: #f5f7f8;
  --sheet-header-border: #d7dce1;
  --sheet-grid: #d9dde3;
  --sheet-row-header: #f7f8fa;
  --sheet-selection: #2d7ff9;
  --sheet-hover: #f2f7ff;
  --shadow: 0 1px 2px rgba(15, 23, 42, .05);
  --dialog-shadow: 0 20px 60px rgba(15, 23, 42, .25);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b1120;
  --surface: #111827;
  --surface-subtle: #172033;
  --surface-raised: #1e293b;
  --header: #080d18;
  --header-text: #f8fafc;
  --header-muted: #94a3b8;
  --text: #e5edf7;
  --muted: #94a3b8;
  --muted-strong: #cbd5e1;
  --border: #334155;
  --border-soft: #273449;
  --primary: #3b82f6;
  --primary-strong: #60a5fa;
  --primary-soft: #172554;
  --primary-border: #1e40af;
  --covered: #86efac;
  --covered-bg: #123524;
  --covered-border: #166534;
  --partial: #fcd34d;
  --partial-bg: #422f12;
  --partial-border: #92400e;
  --uncovered: #fca5a5;
  --uncovered-bg: #451a1a;
  --uncovered-border: #991b1b;
  --assignment: #c4b5fd;
  --assignment-bg: #29244d;
  --assignment-border: #6366f1;
  --lead: #fdba74;
  --lead-bg: #431f12;
  --lead-border: #ea580c;
  --event: #e9d5ff;
  --event-bg: rgba(126, 34, 206, .32);
  --event-border: #a855f7;
  --availability-green: #16a34a;
  --availability-green-hover: #22c55e;
  --availability-red: #dc2626;
  --availability-red-hover: #ef4444;
  --availability-hour-line: #f8fafc;
  --sheet-header: #20252b;
  --sheet-header-border: #3a414a;
  --sheet-grid: #353c45;
  --sheet-row-header: #1b2026;
  --sheet-selection: #4387f8;
  --sheet-hover: #182842;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3);
  --dialog-shadow: 0 20px 60px rgba(0, 0, 0, .55);
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--text); background: var(--bg); font-size: 14px; line-height: 1.45; transition: color .2s, background-color .2s; }
header { background: var(--header); color: var(--header-text); padding: 16px max(24px,calc((100vw - 1452px) / 2)); display: flex; justify-content: space-between; align-items: center; gap: 20px; }
header h1 { margin: 0; font-size: 22px; letter-spacing: -.02em; }
header p { margin: 2px 0 0; color: var(--header-muted); font-size: 13px; }
button { min-height: 36px; border: 1px solid var(--border); background: var(--surface-raised); color: var(--text); border-radius: 6px; padding: 8px 12px; cursor: pointer; font: inherit; font-weight: 650; }
button:hover { filter: brightness(.97); }
:root[data-theme="dark"] button:hover { filter: brightness(1.12); }
button:disabled { cursor: not-allowed; filter: none; opacity: .5; }
button.primary { background: var(--primary); border-color: var(--primary); color: white; }
button.danger { color: var(--uncovered); background: transparent; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.theme-toggle { background: transparent; color: var(--header-text); border-color: #475569; }
nav { position: sticky; top: 0; z-index: 30; background: var(--surface); border-bottom: 1px solid var(--border); padding: 0 max(24px,calc((100vw - 1452px) / 2)); display: flex; gap: 4px; overflow-x: auto; }
nav button { min-height: 44px; border: 0; border-radius: 0; padding: 11px 12px 9px; color: var(--muted); border-bottom: 2px solid transparent; background: transparent; }
nav button.active { color: var(--primary-strong); border-bottom-color: var(--primary); }
main { padding: 24px; max-width: 1500px; margin: auto; }
.tab { display: none; }
.tab.active { display: block; }
.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 2px 0 18px; }
.page-heading h2 { margin: 0; font-size: 24px; letter-spacing: -.02em; }
.page-heading p { margin: 3px 0 0; color: var(--muted); }
.panel { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; padding: 18px; margin-bottom: 16px; box-shadow: var(--shadow); }
.panel h2 { margin: 0 0 14px; font-size: 18px; }
.panel-title, .controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.panel-title { margin-bottom: 16px; }
.panel-title h2 { margin-bottom: 2px; }
.panel-subtitle { margin: 0; color: var(--muted); font-size: 13px; }
.panel-actions { display: flex; align-items: center; gap: 10px; }
.controls { justify-content: flex-start; }
.coverage-controls span, .metrics-controls span { color: var(--muted); font-size: 12px; }
.schedule-controls { justify-content: space-between; }
.schedule-actions { display: flex; align-items: center; gap: 16px; }
.week-navigation { display: flex; align-items: end; gap: 7px; }
.week-navigation > button { min-height: 38px; }
.week-navigation > button:first-child, .week-navigation > button:nth-child(3) { min-width: 40px; padding-inline: 10px; font-size: 18px; }
.schedule-metrics { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); }
.metrics-controls > div:first-child { margin-right: auto; }
.metrics-controls h2 { margin: 0 0 2px; font-size: 20px; }
.disclosure-panel { padding: 0; overflow: hidden; }
.disclosure-panel > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; cursor: pointer; list-style: none; }
.disclosure-panel > summary::-webkit-details-marker { display: none; }
.disclosure-panel > summary span strong, .disclosure-panel > summary span small { display: block; }
.disclosure-panel > summary span strong { font-size: 17px; }
.disclosure-panel > summary span small { margin-top: 2px; color: var(--muted); font-weight: 400; }
.disclosure-panel > summary i { color: var(--muted); font-size: 11px; font-style: normal; }
.disclosure-panel[open] > summary { border-bottom: 1px solid var(--border); }
.disclosure-panel > div { padding: 14px 18px 18px; }
label { display: flex; flex-direction: column; gap: 5px; font-size: 13px; font-weight: 600; color: var(--muted-strong); }
label.inline { flex-direction: row; align-items: center; }
input, select, textarea { border: 1px solid var(--border); border-radius: 6px; padding: 8px 10px; color: var(--text); background: var(--surface-raised); min-height: 36px; font: inherit; }
input:hover, select:hover, textarea:hover { border-color: var(--muted); }
textarea { resize: vertical; }
.form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 10px 8px; border-bottom: 1px solid var(--border-soft); text-align: left; font-size: 13px; white-space: nowrap; }
th { color: var(--muted-strong); background: var(--surface-subtle); position: sticky; top: 0; }
tbody tr:hover td { background: color-mix(in srgb,var(--primary-soft) 45%,transparent); }
.badge { display: inline-block; border-radius: 999px; padding: 5px 9px; font-size: 12px; font-weight: 700; background: var(--partial-bg); color: var(--partial); }
.badge.published { background: var(--covered-bg); color: var(--covered); }
.status-wrap { display: flex; gap: 10px; align-items: center; }
.notice { padding: 12px 14px; margin-bottom: 14px; border-radius: 9px; background: var(--primary-soft); color: var(--primary-strong); border: 1px solid var(--primary-border); }
.notice.warning { background: var(--partial-bg); color: var(--partial); border-color: var(--partial-border); }
.schedule-grid { display: grid; grid-template-columns: repeat(7, minmax(190px, 1fr)); gap: 10px; overflow-x: auto; padding-bottom: 8px; }
.day-column { min-width: 190px; background: var(--surface-subtle); border: 1px solid var(--border); border-radius: 10px; padding: 10px; }
.day-column h3 { margin: 0 0 8px; font-size: 14px; }
.day-column h3 span { color: var(--muted); font-weight: 500; }
.shift-card { display: block; width: 100%; min-height: 0; background: var(--surface-raised); border: 1px solid var(--border); border-left: 4px solid var(--muted); padding: 9px; border-radius: 6px; margin-bottom: 7px; color: var(--text); text-align: left; cursor: pointer; }
.shift-card:hover { border-color: var(--primary-border); }
.shift-card.locked { border-left-color: var(--primary); }
.shift-card.team-lead { border-color: var(--lead-border); border-left: 4px solid var(--lead-border); background: var(--lead-bg); }
.shift-card strong { display: block; font-size: 13px; }
.shift-card span { display: block; color: var(--muted); font-size: 12px; margin-top: 2px; }
.empty-day { color: var(--muted); font-size: 12px; }
.shortage { color: var(--uncovered); font-weight: 700; }
.ok { color: var(--covered); font-weight: 700; }
.view-toggle { display: inline-flex; border: 1px solid var(--border); border-radius: 8px; padding: 3px; background: var(--surface-subtle); }
.view-toggle button { border: 0; padding: 6px 10px; background: transparent; color: var(--muted); }
.view-toggle button.active { background: var(--surface-raised); color: var(--primary-strong); box-shadow: var(--shadow); }
.view-panel[hidden], [hidden] { display: none !important; }

.spreadsheet-summary { display: grid; grid-template-columns: repeat(5,minmax(150px,1fr)); margin-bottom: 14px; overflow: hidden; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-subtle); }
.spreadsheet-summary > div { padding: 12px 14px; border-right: 1px solid var(--border); }
.spreadsheet-summary > div:last-child { border-right: 0; }
.spreadsheet-summary span, .spreadsheet-summary strong { display: block; }
.spreadsheet-summary span { color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.spreadsheet-summary strong { margin-top: 3px; font-size: 21px; }
.spreadsheet-wrap { max-height: 720px; border: 1px solid var(--sheet-grid); border-radius: 0 0 4px 4px; box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--sheet-grid) 25%,transparent); }
.schedule-spreadsheet { min-width: 1500px; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.schedule-spreadsheet th, .schedule-spreadsheet td { height: 34px; padding: 5px 8px; border-right: 1px solid var(--sheet-grid); border-bottom: 1px solid var(--sheet-grid); font-size: 12px; }
.schedule-spreadsheet th { z-index: 3; height: 36px; color: var(--muted-strong); background: var(--sheet-header); border-color: var(--sheet-header-border); font-weight: 650; }
.schedule-spreadsheet th:last-child, .schedule-spreadsheet td:last-child { border-right: 0; }
.schedule-spreadsheet th:nth-child(n+7), .schedule-spreadsheet td:nth-child(n+7) { text-align: right; }
.schedule-spreadsheet th:last-child, .schedule-spreadsheet td:last-child { text-align: center; }
.schedule-spreadsheet th:first-child, .schedule-spreadsheet td:first-child { position: sticky; left: 0; width: 42px; min-width: 42px; max-width: 42px; z-index: 3; text-align: center; background: var(--sheet-row-header); color: var(--muted); }
.schedule-spreadsheet th:nth-child(2), .schedule-spreadsheet td:nth-child(2) { position: sticky; left: 42px; width: 145px; min-width: 145px; z-index: 2; background: var(--surface); }
.schedule-spreadsheet th:nth-child(3), .schedule-spreadsheet td:nth-child(3) { position: sticky; left: 187px; width: 150px; min-width: 150px; z-index: 2; background: var(--surface); box-shadow: 2px 0 2px -1px color-mix(in srgb,var(--text) 18%,transparent); }
.schedule-spreadsheet thead th:nth-child(-n+3) { z-index: 6; color: var(--muted-strong); background: var(--sheet-header); }
.schedule-spreadsheet .spreadsheet-corner { font-weight: 500; }
.spreadsheet-shift-row { cursor: pointer; }
.spreadsheet-shift-row:hover td, .spreadsheet-shift-row:focus td { background: var(--sheet-hover); }
.spreadsheet-shift-row:focus { outline: none; }
.spreadsheet-row-number { user-select: none; font-size: 11px; font-weight: 500; }
.schedule-spreadsheet .spreadsheet-input-cell { padding: 0; }
.spreadsheet-input-cell input:not([type="checkbox"]), .spreadsheet-input-cell select { width: 100%; min-width: 0; min-height: 33px; padding: 5px 7px; border: 1px solid transparent; border-radius: 0; color: var(--text); background: transparent; font: inherit; font-size: 12px; outline: 0; }
.spreadsheet-input-cell input:not([type="checkbox"]):hover, .spreadsheet-input-cell select:hover { background: color-mix(in srgb,var(--sheet-selection) 5%,var(--surface)); }
.spreadsheet-input-cell input:not([type="checkbox"]):focus, .spreadsheet-input-cell select:focus { position: relative; z-index: 6; border: 2px solid var(--sheet-selection); background: var(--surface); box-shadow: 0 1px 4px color-mix(in srgb,var(--sheet-selection) 24%,transparent); }
.spreadsheet-input-cell input.dirty, .spreadsheet-input-cell select.dirty { background: color-mix(in srgb,var(--partial-bg) 40%,var(--surface)); }
.schedule-spreadsheet td:nth-child(3) select { font-weight: 700; }
.schedule-spreadsheet td:nth-child(8) input, .schedule-spreadsheet td:nth-child(9) input { text-align: right; }
.spreadsheet-input-cell input[type="checkbox"] { width: 16px; height: 16px; min-height: 16px; margin: 0; padding: 0; accent-color: var(--sheet-selection); cursor: pointer; }
.spreadsheet-input-cell:has(input[type="checkbox"]) { text-align: center; }
.spreadsheet-input-cell.saving-cell { opacity: .62; }
.spreadsheet-formula-cell { user-select: text; }
#spreadsheetSaveStatus { padding-right: 12px; border-right: 1px solid var(--sheet-grid); color: var(--muted); }
#spreadsheetSaveStatus[data-state="saving"] { color: var(--partial); }
#spreadsheetSaveStatus[data-state="saved"] { color: var(--covered); }
#spreadsheetSaveStatus[data-state="error"] { color: var(--uncovered); }
.spreadsheet-cell { position: relative; cursor: cell; }
.spreadsheet-cell.selected-cell { z-index: 5; background: color-mix(in srgb,var(--sheet-selection) 7%,var(--surface)) !important; box-shadow: inset 0 0 0 2px var(--sheet-selection) !important; }
.spreadsheet-cell.editing-cell { z-index: 7; padding: 0; background: var(--surface) !important; box-shadow: inset 0 0 0 2px var(--sheet-selection) !important; }
.spreadsheet-cell.editing-cell input, .spreadsheet-cell.editing-cell select { width: 100%; min-width: 95px; min-height: 33px; margin: 0; padding: 4px 7px; border: 2px solid var(--sheet-selection); border-radius: 1px; background: var(--surface-raised); font-size: 12px; outline: 0; }
.spreadsheet-cell.saving-cell { opacity: .72; }
.schedule-spreadsheet .spreadsheet-formula-cell { background: color-mix(in srgb,var(--sheet-row-header) 70%,var(--surface)); color: var(--muted-strong); cursor: not-allowed; }
.spreadsheet-toolbar { display: flex; align-items: center; justify-content: space-between; min-height: 40px; padding: 5px 10px; border: 1px solid var(--sheet-grid); border-bottom: 0; border-radius: 4px 4px 0 0; background: var(--surface); }
.spreadsheet-toolbar > div { display: flex; align-items: center; gap: 9px; }
.spreadsheet-toolbar > div:first-child > span:last-child { padding-left: 9px; border-left: 1px solid var(--sheet-grid); color: var(--muted); font-size: 11px; }
.airtable-grid-icon { display: inline-grid; width: 23px; height: 23px; place-items: center; border-radius: 4px; color: #fff; background: #6b66da; font-size: 15px; }
.spreadsheet-help { display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: 10px; }
.spreadsheet-help strong { color: var(--muted-strong); }
.field-type { display: inline-block; min-width: 18px; margin-right: 4px; color: var(--muted); font-size: 10px; font-weight: 600; }
.airtable-pill { display: inline-block; padding: 2px 7px; border-radius: 999px; color: #514b83; background: #dedaf3; font-size: 11px; line-height: 18px; }
:root[data-theme="dark"] .airtable-pill { color: #dedaf3; background: #494469; }
.airtable-checkbox { display: inline-grid; width: 15px; height: 15px; min-height: 15px; padding: 0; place-items: center; border: 1px solid var(--sheet-grid); border-radius: 3px; color: #fff; background: var(--surface); font-size: 11px; font-weight: 800; }
.airtable-checkbox.checked { border-color: #2d7ff9; background: #2d7ff9; }
.spreadsheet-subtotal td { height: 31px; background: var(--sheet-row-header); color: var(--muted-strong); border-top: 0; border-bottom: 1px solid var(--sheet-grid); font-weight: 700; }
.spreadsheet-subtotal td { position: static !important; min-width: 0 !important; box-shadow: none !important; }
.spreadsheet-subtotal td:first-child { text-align: left; }
.spreadsheet-add-row td { position: static !important; height: 37px; background: var(--surface) !important; box-shadow: none !important; }
.spreadsheet-add-row td:first-child { color: var(--muted); font-size: 17px; }
.spreadsheet-add-row button { min-height: 25px; padding: 2px 5px; border: 0; color: var(--muted-strong); background: transparent; font-size: 12px; font-weight: 500; }
.schedule-spreadsheet tfoot td { position: static; border-top: 0; border-bottom: 1px solid var(--sheet-grid); background: var(--sheet-header); font-weight: 750; }
.schedule-spreadsheet tfoot td:first-child { position: static; text-align: left; }
.schedule-spreadsheet tfoot td:nth-child(2) { min-width: 0; box-shadow: none; }

.summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.summary-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 17px 18px; box-shadow: var(--shadow); }
.summary-card > span { display: block; color: var(--muted); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.summary-card strong { display: block; margin: 5px 0 1px; font-size: 28px; line-height: 1.1; }
.summary-card strong em { color: var(--muted); font-size: 16px; font-style: normal; font-weight: 600; }
.summary-card small { color: var(--muted); }
.summary-card.accent { border-top: 3px solid var(--primary); }
.summary-card.alert { border-top: 3px solid var(--uncovered); }
.summary-card.alert strong { color: var(--uncovered); }
.metrics-summary { grid-template-columns: repeat(5, minmax(170px, 1fr)); }
.summary-card.goal-met { border-top: 3px solid var(--covered); }
.summary-card.goal-open { border-top: 3px solid var(--partial); }
.metrics-table { min-width: 920px; }
.metrics-table td:not(:first-child), .metrics-table th:not(:first-child) { text-align: right; }
.metrics-table td:first-child, .metrics-table th:first-child { text-align: left; }
.clickable-row { cursor: pointer; }
.clickable-row:hover td { background: var(--primary-soft); }
.metrics-day-heading th { padding-top: 15px; color: var(--primary-strong); background: var(--surface); text-align: left !important; }
.metrics-day-total td { background: var(--surface-subtle); font-weight: 700; }
.shift-metrics-table { min-width: 1120px; }
.analytics-grid { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); gap: 18px; }
.analytics-panel { min-height: 330px; }
.progress-chart { display: grid; gap: 15px; }
.progress-label { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 5px; font-size: 12px; }
.progress-label span { color: var(--muted); }
.progress-track { position: relative; height: 24px; overflow: hidden; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-subtle); }
.progress-track i { position: absolute; inset: 0 auto 0 0; min-width: 0; transition: width .25s; }
.progress-track i.covered { background: var(--covered-bg); border-right: 2px solid var(--covered); }
.progress-track i.partial { background: var(--partial-bg); border-right: 2px solid var(--partial); }
.progress-track i.uncovered { background: var(--uncovered-bg); }
.progress-track b { position: relative; z-index: 1; display: block; padding: 3px 7px; color: var(--text); text-align: right; font-size: 11px; }
.chart-legend { display: flex; justify-content: flex-end; gap: 13px; margin-bottom: 8px; color: var(--muted); font-size: 11px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 5px; }
.chart-legend i { width: 9px; height: 9px; border-radius: 2px; }
.chart-legend .actual, .bar-pair .actual { background: var(--primary); }
.chart-legend .expected, .bar-pair .expected { background: var(--assignment-border); }
.daily-bar-chart { display: grid; grid-template-columns: repeat(7,minmax(34px,1fr)); align-items: end; gap: 8px; height: 225px; padding-top: 18px; border-bottom: 1px solid var(--border); }
.daily-bar-group { position: relative; display: grid; grid-template-rows: 1fr auto; align-items: end; height: 100%; min-width: 0; }
.bar-pair { display: flex; align-items: end; justify-content: center; gap: 3px; height: 100%; }
.bar-pair i { display: block; width: min(16px,42%); min-height: 0; border-radius: 4px 4px 0 0; }
.bar-values { position: absolute; inset: -16px 0 auto; display: flex; justify-content: center; gap: 4px; color: var(--muted); font-size: 8px; }
.bar-values span { width: 45%; overflow: hidden; text-align: center; text-overflow: ellipsis; }
.daily-bar-group > strong { padding: 6px 0; color: var(--muted); text-align: center; font-size: 10px; }
.coverage-pill { display: inline-block; border-radius: 999px; padding: 4px 8px; font-size: 11px; font-weight: 700; }
.coverage-pill.covered { color: var(--covered); background: var(--covered-bg); }
.coverage-pill.partial { color: var(--partial); background: var(--partial-bg); }
.coverage-pill.uncovered { color: var(--uncovered); background: var(--uncovered-bg); }

.calendar-panel { overflow-x: auto; }
.calendar-toolbar { min-width: 820px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; margin-bottom: 16px; }
.calendar-toolbar h2 { margin: 0; text-align: center; font-size: 21px; }
.calendar-toolbar > .primary { justify-self: end; }
.calendar-navigation { display: flex; gap: 6px; }
.calendar-weekdays { min-width: 820px; display: grid; grid-template-columns: repeat(7, 1fr); border: 1px solid var(--border); border-bottom: 0; border-radius: 10px 10px 0 0; overflow: hidden; }
.calendar-weekdays span { padding: 8px; color: var(--muted); background: var(--surface-subtle); text-align: center; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.events-calendar { min-width: 820px; display: grid; grid-template-columns: repeat(7, minmax(115px, 1fr)); grid-template-rows: repeat(6, minmax(105px, auto)); border-left: 1px solid var(--border); border-top: 1px solid var(--border); }
.calendar-day { min-height: 105px; padding: 6px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--surface); }
.calendar-day.outside-month { background: var(--surface-subtle); opacity: .62; }
.calendar-day.today { box-shadow: inset 0 0 0 2px var(--primary); }
.calendar-date { width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: transparent; font-size: 12px; }
.calendar-day.today .calendar-date { background: var(--primary); color: white; }
.calendar-events { display: grid; gap: 4px; }
.calendar-event { display: block; width: 100%; padding: 4px 6px; overflow: hidden; border: 1px solid var(--primary-border); border-radius: 5px; background: var(--primary-soft); color: var(--primary-strong); text-align: left; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.calendar-event.timed span { margin-right: 4px; opacity: .75; font-size: 9px; }
.calendar-event.all-day { background: var(--assignment-bg); border-color: var(--assignment-border); color: var(--assignment); }
.calendar-event small { display: block; margin-top: 2px; overflow: hidden; opacity: .8; text-overflow: ellipsis; font-size: 8px; }
.event-dialog form { gap: 13px; }
.event-time-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.split-actions { display: grid; grid-template-columns: auto 1fr auto auto; }

.time-off-form { display: grid; grid-template-columns: minmax(170px,1fr) repeat(2,minmax(145px,.7fr)) minmax(220px,1.4fr) auto; align-items: end; gap: 10px; }
.requirement-form { display: grid; grid-template-columns: minmax(150px,1fr) repeat(2,minmax(145px,.8fr)) minmax(150px,1fr) minmax(130px,.7fr) auto; align-items: end; gap: 10px; }
.summary-card.pending { border-top: 3px solid var(--partial-border); }
.summary-card.approved { border-top: 3px solid var(--covered-border); }
.status-select { min-height: 32px; padding: 5px 8px; font-weight: 700; }
.status-select.pending { color: var(--partial); background: var(--partial-bg); border-color: var(--partial-border); }
.status-select.approved { color: var(--covered); background: var(--covered-bg); border-color: var(--covered-border); }
.status-select.denied { color: var(--uncovered); background: var(--uncovered-bg); border-color: var(--uncovered-border); }

.employee-add-form { display: grid; grid-template-columns: repeat(3,minmax(150px,1fr)) minmax(140px,.8fr) minmax(150px,.8fr) auto; align-items: end; gap: 12px; }
.employee-add-form button { min-height: 38px; }
.attendance-import-controls { display: flex; align-items: end; gap: 10px; }
.attendance-import-controls label { flex: 1; max-width: 520px; }
.attendance-import-controls input[type="file"] { padding: 6px; background: var(--surface-subtle); }
.attendance-import-panel > .form-help { margin: 10px 0 0; }
#attendanceImportResult:not(:empty) { margin-top: 16px; }
.attendance-result-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 13px; border: 1px solid var(--partial-border); border-radius: 7px 7px 0 0; color: var(--partial); background: var(--partial-bg); }
.attendance-result-heading.applied { color: var(--covered); border-color: var(--covered-border); background: var(--covered-bg); }
.attendance-result-heading span { color: var(--muted-strong); font-size: 11px; }
.attendance-summary { display: grid; grid-template-columns: repeat(5,1fr); border: 1px solid var(--border); border-top: 0; }
.attendance-summary > div { padding: 11px 13px; border-right: 1px solid var(--border); background: var(--surface-subtle); }
.attendance-summary > div:last-child { border-right: 0; }
.attendance-summary span, .attendance-summary strong { display: block; }
.attendance-summary span { color: var(--muted); font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.attendance-summary strong { margin-top: 2px; font-size: 20px; }
.attendance-summary .warning strong { color: var(--partial); }
.attendance-detail { margin-top: 10px; border: 1px solid var(--border); border-radius: 7px; overflow: hidden; }
.attendance-detail summary { padding: 10px 12px; cursor: pointer; background: var(--surface-subtle); font-size: 12px; font-weight: 750; }
.attendance-detail table { min-width: 720px; }
.attendance-detail td small { display: block; margin-top: 2px; color: var(--muted); }
.attendance-detail ul { margin: 0; padding: 8px 12px; list-style: none; }
.attendance-detail li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 2px; border-bottom: 1px solid var(--border); font-size: 12px; }
.attendance-detail li:last-child { border-bottom: 0; }
.attendance-detail li span { color: var(--muted); text-align: right; }
.attendance-detail.warning summary { color: var(--partial); }
.employee-filters { display: flex; align-items: end; gap: 10px; }
.employee-filters input { width: 210px; }
.employee-filters select { min-width: 110px; }
.inline-message { margin-top: 12px; padding: 9px 11px; border: 1px solid var(--covered-border); border-radius: 7px; color: var(--covered); background: var(--covered-bg); font-size: 12px; font-weight: 700; }
.inline-message.warning { color: var(--partial); border-color: var(--partial-border); background: var(--partial-bg); }
.inline-message.error { color: var(--uncovered); border-color: var(--uncovered-border); background: var(--uncovered-bg); }
.empty-state { padding: 28px 16px; border: 1px dashed var(--border); border-radius: 8px; color: var(--muted); text-align: center; }
.employee-editor-table { min-width: 1320px; table-layout: fixed; }
.employee-editor-table th:nth-child(1), .employee-editor-table th:nth-child(2), .employee-editor-table th:nth-child(3) { width: 13%; }
.employee-editor-table th:nth-child(4) { width: 12%; }
.employee-editor-table th:nth-child(5) { width: 12%; }
.employee-editor-table th:nth-child(6) { width: 11%; }
.employee-editor-table th:nth-child(7) { width: 14%; }
.employee-editor-table th:nth-child(8) { width: 12%; }
.employee-editor-table td { vertical-align: middle; transition: background-color .15s; }
.employee-editor-table tr.dirty td { background: var(--primary-soft); }
.employee-editor-table input:not([type="checkbox"]), .employee-editor-table select { width: 100%; min-width: 80px; }
.employee-editor-table td:nth-child(-n+3) input { min-width: 120px; }
.employee-editor-table td:nth-child(4) select { min-width: 115px; }
.employee-editor-table td:nth-child(5) input { min-width: 105px; }
.cell-help { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }
.employee-status-toggle { position: relative; flex-direction: row; align-items: center; gap: 8px; width: max-content; cursor: pointer; color: var(--text); white-space: nowrap; }
.employee-status-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.toggle-track { position: relative; display: inline-block; width: 36px; height: 20px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-subtle); transition: .15s; }
.toggle-track i { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: var(--muted); transition: .15s; }
.employee-status-toggle input:checked + .toggle-track { border-color: var(--covered-border); background: var(--covered-bg); }
.employee-status-toggle input:checked + .toggle-track i { left: 18px; background: var(--covered); }
.employee-status-toggle input:focus-visible + .toggle-track { outline: 2px solid var(--primary); outline-offset: 2px; }
.employee-row-actions { display: flex; align-items: flex-start; flex-direction: column; gap: 6px; }
.employee-row-actions button { padding: 8px 10px; }
.employee-autosave-status { color: var(--muted); font-size: 9px; font-weight: 700; white-space: nowrap; }
.employee-autosave-status[data-save-status="saving"], .employee-autosave-status[data-save-status="pending"] { color: var(--partial); }
.employee-autosave-status[data-save-status="saved"] { color: var(--covered); }
.employee-autosave-status[data-save-status="error"] { color: var(--uncovered); }
.availability-button { display: flex; flex-direction: column; align-items: flex-start; min-width: 116px; border-color: var(--covered-border); background: var(--covered-bg); color: var(--covered); }
.availability-button span { font-size: 12px; }
.availability-button small { margin-top: 2px; opacity: .85; font-size: 10px; }

dialog.availability-dialog { width: min(1320px, 96vw); max-width: none; }
.availability-editor { padding: 20px; }
.dialog-heading, .availability-toolbar, .availability-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.dialog-heading h2 { margin: 0; font-size: 20px; }
.dialog-heading p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.dialog-heading > button { padding: 4px 10px; border: 0; background: transparent; color: var(--muted); font-size: 24px; }
.availability-toolbar { margin-top: 18px; flex-wrap: wrap; }
.availability-legend, .availability-quick-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.availability-legend { color: var(--muted); font-size: 12px; }
.availability-legend span { display: inline-flex; align-items: center; gap: 5px; }
.availability-swatch { display: inline-block; width: 13px; height: 13px; border: 1px solid; border-radius: 3px; }
.availability-swatch.available { background: var(--availability-green); border-color: var(--availability-green); }
.availability-swatch.unavailable { background: var(--availability-red); border-color: var(--availability-red); }
.availability-help { margin: 11px 0; color: var(--muted); font-size: 12px; }
.availability-grid-wrap { max-height: min(520px, 60vh); overflow: auto; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-subtle); }
.availability-grid { display: grid; grid-template-columns: 86px repeat(var(--slot-count), 25px); width: max-content; min-width: 100%; user-select: none; }
.availability-corner, .availability-time { position: sticky; top: 0; z-index: 4; height: 30px; border-bottom: 1px solid var(--border); background: var(--surface); color: var(--muted); font-size: 9px; font-weight: 700; }
.availability-corner { left: 0; z-index: 6; padding: 8px 10px; text-transform: uppercase; letter-spacing: .05em; }
.availability-time { padding-top: 8px; text-align: center; }
.availability-time.hour-start { border-left: 2px solid var(--availability-hour-line); }
.availability-day { position: sticky; left: 0; z-index: 3; height: 43px; border: 0; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); border-radius: 0; background: var(--surface); color: var(--text); text-align: left; }
.availability-slot { height: 43px; min-width: 25px; padding: 0; border: 0; border-right: 1px solid rgba(255,255,255,.22); border-bottom: 1px solid rgba(255,255,255,.28); border-radius: 0; }
.availability-slot.hour-start { border-left: 2px solid var(--availability-hour-line); }
.availability-slot.available { background: var(--availability-green); }
.availability-slot.available:hover { background: var(--availability-green-hover); }
.availability-slot.unavailable { background: var(--availability-red); }
.availability-slot.unavailable:hover { background: var(--availability-red-hover); }
.availability-slot:focus-visible { position: relative; z-index: 2; outline: 2px solid var(--primary); outline-offset: -2px; }
.availability-footer { margin-top: 15px; }
.availability-footer > div { display: flex; gap: 8px; }
.availability-footer strong { color: var(--muted-strong); font-size: 13px; }

.gantt-legend { display: flex; flex-wrap: wrap; gap: 14px; margin: 0 0 12px; color: var(--muted); font-size: 12px; }
.gantt-legend.compact { margin: 0; }
.gantt-legend span { display: inline-flex; align-items: center; gap: 5px; }
.legend-dot { width: 10px; height: 10px; border-radius: 3px; display: inline-block; border: 1px solid; }
.legend-dot.covered { background: var(--covered-bg); border-color: var(--covered-border); }
.legend-dot.partial { background: var(--partial-bg); border-color: var(--partial-border); }
.legend-dot.uncovered { background: var(--uncovered-bg); border-color: var(--uncovered-border); }
.legend-dot.event { background: var(--event-bg); border-color: var(--event-border); }
.legend-dot.assignment { background: var(--assignment-bg); border-color: var(--assignment-border); }
.legend-dot.team-lead { background: var(--lead-bg); border-color: var(--lead-border); }
.gantt-scroll { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-subtle); }
.gantt-chart { min-width: 900px; }
.gantt-axis { display: grid; grid-template-columns: 105px minmax(700px, 1fr); height: 34px; border-bottom: 1px solid var(--border); background: var(--surface); position: sticky; top: 0; z-index: 5; }
.gantt-axis > div:last-child, .gantt-grid { position: relative; }
.gantt-axis span { position: absolute; top: 9px; transform: translateX(-50%); color: var(--muted); font-size: 10px; text-transform: uppercase; }
.gantt-axis > div:last-child span:last-child { transform: translateX(-100%); }
.gantt-day { display: grid; grid-template-columns: 105px minmax(700px, 1fr); border-bottom: 1px solid var(--border); }
.gantt-day:last-child { border-bottom: 0; }
.gantt-day-label { padding: 14px 12px; border-right: 1px solid var(--border); background: var(--surface); }
.gantt-day-label strong, .gantt-day-label span { display: block; }
.gantt-day-label strong { font-size: 12px; }
.gantt-day-label span { margin-top: 2px; color: var(--muted); font-size: 11px; }
.gantt-day-chart { position: relative; padding: 8px 0; overflow: hidden; }
.gantt-event-layer { position: absolute; inset: 0; z-index: 0; }
.gantt-event-highlight { position: absolute; top: 0; bottom: 0; min-width: 3px; padding: 2px 5px; overflow: hidden; border: 0; border-left: 2px solid var(--event-border); border-right: 2px solid var(--event-border); border-radius: 0; background: var(--event-bg); color: var(--event); text-align: left; }
.gantt-event-highlight.covered { border-color: var(--covered-border); }
.gantt-event-highlight.uncovered { border-color: var(--uncovered-border); }
.gantt-event-highlight span, .gantt-event-highlight small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gantt-event-highlight span { font-size: 9px; font-weight: 800; }
.gantt-event-highlight small { font-size: 8px; }
.gantt-grid { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.gantt-grid span { position: absolute; top: 0; bottom: 0; width: 1px; overflow: hidden; text-indent: -9999px; background: var(--border-soft); }
.gantt-lane { position: relative; z-index: 2; margin: 0; min-height: 30px; }
.coverage-lane { margin-bottom: 5px; }
.assignment-lane { border-top: 1px dashed var(--border); padding-top: 4px; }
.lane-label { position: relative; z-index: 2; padding: 2px 7px 4px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.gantt-block { position: absolute; display: flex; align-items: center; justify-content: space-between; gap: 5px; min-width: 3px; height: 28px; padding: 4px 7px; overflow: hidden; border: 1px solid; border-radius: 6px; text-align: left; white-space: nowrap; box-shadow: none; }
.gantt-block strong { overflow: hidden; text-overflow: ellipsis; font-size: 11px; }
.gantt-block span { flex: 0 0 auto; font-size: 10px; font-weight: 700; }
.coverage-block.covered { color: var(--covered); background: var(--covered-bg); border-color: var(--covered-border); }
.coverage-block.partial { color: var(--partial); background: var(--partial-bg); border-color: var(--partial-border); }
.coverage-block.uncovered { color: var(--uncovered); background: var(--uncovered-bg); border-color: var(--uncovered-border); }
.coverage-block.has-segments { background: var(--surface-raised); overflow: hidden; }
.coverage-block.has-segments strong, .coverage-block.has-segments > span { position: relative; z-index: 2; padding: 1px 3px; border-radius: 3px; background: color-mix(in srgb, var(--surface-raised) 82%, transparent); }
.coverage-segment { position: absolute; top: 0; bottom: 0; z-index: 1; border-right: 1px solid rgba(255,255,255,.3); }
.coverage-segment.covered { background: var(--covered-bg); }
.coverage-segment.partial { background: var(--partial-bg); }
.coverage-segment.uncovered { background: var(--uncovered-bg); }
.shift-block { height: 25px; color: var(--assignment); background: var(--assignment-bg); border-color: var(--assignment-border); }
.shift-block.team-lead { color: var(--lead); background: var(--lead-bg); border-color: var(--lead-border); }
.shift-block.locked { box-shadow: inset 3px 0 0 var(--primary); }
.empty-lane { position: absolute; left: 8px; top: 7px; color: var(--muted); font-size: 10px; }

dialog { border: 1px solid var(--border); border-radius: 12px; padding: 0; color: var(--text); background: var(--surface); box-shadow: var(--dialog-shadow); width: min(450px, 92vw); }
dialog::backdrop { background: rgba(15, 23, 42, .58); }
dialog form { padding: 22px; display: grid; gap: 12px; }
dialog form > h2 { margin: 0 0 2px; font-size: 20px; }
.shift-metric-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.form-help { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; font-weight: 500; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.app-toast { position: fixed; right: 20px; bottom: 20px; z-index: 100; max-width: min(420px,calc(100vw - 40px)); padding: 11px 14px; border: 1px solid var(--covered-border); border-radius: 7px; background: var(--covered-bg); color: var(--covered); box-shadow: var(--dialog-shadow); font-size: 13px; font-weight: 700; }
.app-toast.error { border-color: var(--uncovered-border); background: var(--uncovered-bg); color: var(--uncovered); }

@media (max-width: 800px) {
  .summary-grid { grid-template-columns: 1fr; }
  .metrics-summary { grid-template-columns: 1fr 1fr; }
  .panel-actions { width: 100%; justify-content: space-between; }
  .time-off-form { grid-template-columns: 1fr 1fr; }
  .time-off-reason { grid-column: 1 / -1; }
  .employee-add-form { grid-template-columns: 1fr 1fr; }
  .attendance-summary { grid-template-columns: repeat(2,1fr); }
  .attendance-summary > div { border-bottom: 1px solid var(--border); }
  .analytics-grid { grid-template-columns: 1fr; }
  .schedule-controls { align-items: stretch; flex-direction: column; }
  .schedule-actions { justify-content: space-between; }
  .requirement-form { grid-template-columns: 1fr 1fr; }
  .spreadsheet-summary { grid-template-columns: repeat(2,1fr); }
  .spreadsheet-summary > div { border-bottom: 1px solid var(--border); }
}

@media (max-width: 700px) {
  header { align-items: flex-start; flex-direction: column; }
  .status-wrap { width: 100%; flex-wrap: wrap; }
  main { padding: 14px; }
  .panel { padding: 14px; }
  .gantt-axis, .gantt-day { grid-template-columns: 85px minmax(700px, 1fr); }
  .gantt-day-label { padding-left: 8px; }
  .availability-editor { padding: 14px; }
  .availability-footer { align-items: stretch; flex-direction: column; }
  .availability-footer > div { justify-content: flex-end; }
  .time-off-form { grid-template-columns: 1fr; }
  .time-off-reason { grid-column: auto; }
  .metrics-summary, .shift-metric-fields { grid-template-columns: 1fr; }
  .employee-add-form { grid-template-columns: 1fr; }
  .attendance-import-controls { align-items: stretch; flex-direction: column; }
  .attendance-import-controls label { width: 100%; max-width: none; }
  .employee-filters { width: 100%; align-items: stretch; flex-direction: column; }
  .employee-filters input, .employee-filters select { width: 100%; }
  .employee-table-wrap { overflow: visible; }
  .employee-editor-table { min-width: 0; table-layout: auto; }
  .employee-editor-table thead { display: none; }
  .employee-editor-table, .employee-editor-table tbody, .employee-editor-table tr, .employee-editor-table td { display: block; width: 100%; }
  .employee-editor-table tr { margin-bottom: 12px; padding: 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-subtle); }
  .employee-editor-table td { display: grid; grid-template-columns: 110px minmax(0,1fr); align-items: center; gap: 10px; padding: 7px 3px; border: 0; white-space: normal; }
  .employee-editor-table td::before { content: attr(data-label); color: var(--muted); font-size: 11px; font-weight: 800; }
  .employee-editor-table td input, .employee-editor-table td select { min-width: 0; }
  .employee-row-actions { justify-content: flex-start; }
  .week-navigation { align-items: stretch; flex-wrap: wrap; }
  .week-navigation label { flex: 1 1 150px; }
  .week-navigation #currentWeekBtn { flex: 1 1 100%; }
  .schedule-actions { align-items: stretch; flex-direction: column; }
  .requirement-form { grid-template-columns: 1fr; }
}

@media print {
  :root, :root[data-theme="dark"] { color-scheme: light; }
  body { background: white; color: #111827; }
  header, nav, .page-heading, .schedule-controls, #generateMessage, .panel-title .panel-actions, #ganttView, .schedule-metrics { display: none !important; }
  main { max-width: none; padding: 0; }
  .tab { display: none !important; }
  #dashboard { display: block !important; }
  #dashboard > .panel { border: 0; padding: 0; box-shadow: none; }
  .spreadsheet-wrap { max-height: none; overflow: visible; border: 0; }
  .schedule-spreadsheet { min-width: 0; font-size: 9px; }
  .schedule-spreadsheet th, .schedule-spreadsheet td { position: static !important; min-width: 0 !important; padding: 5px 4px; background: white !important; box-shadow: none !important; }
  .spreadsheet-input-cell input, .spreadsheet-input-cell select { min-height: 0; padding: 0; border: 0; color: #111827; background: transparent; appearance: none; }
  .spreadsheet-summary { break-inside: avoid; }
}

/* Link-based manager access and Fellow self-service portal */
.access-link-form{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-bottom:18px}
.access-link-form label{flex:1;min-width:240px}
.link-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.team-admin-card{margin-top:18px;padding-top:18px;border-top:1px solid var(--border)}
.team-admin-card:first-child{margin-top:0;padding-top:0;border-top:0}
.team-admin-card .link-actions{margin-bottom:12px}
.button-link{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font-weight:650;text-decoration:none;white-space:nowrap}
.button-link:hover{border-color:var(--primary);color:var(--primary)}
.access-landing{min-height:100vh;background:var(--background)}
.access-landing-main{min-height:100vh;display:grid;place-items:center;padding:24px}
.access-landing-card{max-width:560px;text-align:center;padding:44px}
.access-landing-card h1{font-size:2rem;margin:6px 0 12px}
.access-landing-card>p{font-size:1.05rem;line-height:1.65;color:var(--muted)}
.access-landing-icon{font-size:3rem}
.fellow-tab{display:none}
.fellow-tab.active{display:block}
.fellow-week-controls{display:flex;align-items:end;gap:10px;flex-wrap:wrap}
.fellow-week-controls label{min-width:180px}
.fellow-week-controls .badge{margin-left:auto}
.fellow-event-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}
.fellow-event-list article{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-subtle)}
.fellow-event-list span,.fellow-event-list small{color:var(--muted)}
.fellow-schedule-table tr.my-shift td{background:color-mix(in srgb,var(--primary) 10%,var(--surface))}
.fellow-portal main{max-width:1200px}

@media (max-width:700px){
  .access-landing-card{padding:28px 20px}
  .fellow-week-controls .badge{margin-left:0}
  .link-actions{min-width:190px}
}