/* Presentation-only refinements. Keep the existing print layout. */
@media screen {
  :root {
    --page-min-width: 0px;
    --content-min-width: 0px;
    --content-width: 1180px;
    --schedule-min-width: 760px;
    --page-gutter: 28px;
    --topbar-height: 88px;
    --color-background: #f7f8fa;
    --color-text: #252b32;
    --color-text-strong: #222830;
    --color-text-secondary: #68717c;
    --color-border: #dce1e6;
    --color-border-light: #e8ebee;
    --color-border-subtle: #edf0f2;
    --color-current-week: #ffffff;
    --color-current-week-hover: #f7f9fa;
    --color-today: #edf7f3;
    --color-today-hover: #e5f2ec;
    --color-today-border: #cae3d7;
    --color-weekend: #fafbfc;
    --color-primary-700: #26755b;
    --color-primary-600: #26755b;
    --color-primary-500: #36896b;
    --color-primary-200: #c8ddd3;
    --color-primary-100: #e6f1eb;
    --color-primary-50: #f1f7f4;
  }

  *, *::before, *::after { letter-spacing: 0; }
  body { line-height: 1.5; }
  .date-weekday { display: block; margin-top: 2px; color: #7a838e; font-size: 11px; font-weight: 400; }
  .role-main { display: block; color: #424a55; font-size: 13px; font-weight: 600; }
  .role-sub { display: block; margin-top: 2px; font-size: 11px; }
  .week-table .cell-weekday, .schedule-table .cell-weekday,
  .week-table th:nth-child(2), .schedule-table th:nth-child(2),
  .schedule-table col.col-weekday { display: none; }
  .week-table th:nth-child(2) { width: 0; }
  .refresh-button { flex: 0 0 36px; color: #65707b; border: 1px solid #dce1e6; font-size: 23px; }
  .refresh-button.is-refreshing { opacity: 0.6; }
  .week-table tr.is-today .cell-date, .schedule-table tr.is-today .cell-date,
  .week-table tr.is-today .date-weekday, .schedule-table tr.is-today .date-weekday { color: #1c6048; }
  @media (max-width: 600px) {
    .week-table .cell-date, .schedule-table .cell-date { grid-column: 1 / -1; }
    .date-weekday { display: inline; margin-left: 8px; }
    .week-table td.is-empty-field, .schedule-table td.is-empty-field { display: none; }
  }
  .topbar {
    position: relative;
    color: #252b32;
    background: #ffffff;
    border-bottom: 1px solid #e5e8ec;
    box-shadow: none;
  }
  .topbar__inner { min-height: 88px; gap: 24px; }
  .topbar__title-area { min-width: 0; }
  .topbar__title-area h1 { color: #222830; font-size: 23px; line-height: 1.4; }
  .last-updated { margin-top: 5px; color: #747c86; font-size: 12px; }
  .topbar__actions { gap: 8px; }
  .button { min-height: 36px; border-radius: 5px; font-size: 14px; font-weight: 500; box-shadow: none; }
  .button:hover:not(:disabled) { box-shadow: none; transform: none; }
  .topbar .button--outline {
    color: #505965; background: #ffffff; border-color: #dce1e6;
  }
  .topbar .button--outline:hover:not(:disabled) {
    color: #20262e; background: #f4f6f8; border-color: #b8c1ca;
  }
  .topbar .button--primary {
    color: #ffffff; background: #26755b; border-color: #26755b; box-shadow: none;
  }
  .topbar .button--primary:hover:not(:disabled) {
    color: #ffffff; background: #1e6049; border-color: #1e6049;
  }
  .topbar__actions .button { min-width: 0; padding: 8px 13px; }
  #adminButton { border-color: transparent; color: #747c86; }
  .main-content { display: flex; flex-direction: column; padding-top: 30px; padding-bottom: 36px; }
  .week-overview { order: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .week-overview__heading {
    min-height: 0; padding: 0 0 20px; color: #252b32; background: transparent; border-radius: 0; gap: 20px;
  }
  .week-overview__eyebrow { display: none; }
  .week-overview__heading h2 { color: #252b32; font-size: 21px; line-height: 1.4; }
  .week-overview__range { margin-top: 7px; color: #68717c; font-size: 13px; }
  .week-navigation { gap: 0; border: 1px solid #dce1e6; border-radius: 5px; overflow: hidden; background: #fff; }
  .week-navigation .button {
    min-width: 80px; min-height: 36px; padding: 7px 12px;
    color: #505965; background: #fff; border: 0; border-radius: 0; box-shadow: none;
  }
  .week-navigation .button + .button { border-left: 1px solid #e4e8eb; }
  .week-overview__heading .button:hover:not(:disabled) { color: #26755b; background: #f1f7f4; border-color: #e4e8eb; }
  .week-overview__heading .button:disabled { color: #959da6; background: #f7f8fa; opacity: 1; }
  .week-table-wrapper, .schedule-table-wrapper { overflow: auto; border: 1px solid #dce1e6; border-radius: 6px; background: #fff; }
  .week-table, .schedule-table { width: 100%; table-layout: fixed; }
  .week-table th, .schedule-table th {
    height: 44px; padding: 11px 12px; color: #66707c; background: #f5f7f9;
    border-bottom: 1px solid #dce1e6; font-size: 12px; font-weight: 500;
  }
  .week-table td, .schedule-table td {
    height: 45px; padding: 10px 12px; font-size: 15px; line-height: 1.55;
    background: #fff; border-bottom: 1px solid #edf0f2;
  }
  .week-table th:nth-child(1) { width: 18%; }
  .week-table th:nth-child(2) { width: 7%; }
  .week-table th:nth-child(3), .week-table th:nth-child(4) { width: 17%; }
  .week-table th:nth-child(5) { width: 14%; }
  .week-table th:nth-child(6) { width: 18%; }
  .week-table th:nth-child(7) { width: 16%; }
  .schedule-table col.col-date { width: 16%; }
  .schedule-table col.col-weekday { width: 7%; }
  .schedule-table col.col-primary, .schedule-table col.col-secondary { width: 15%; }
  .schedule-table col.col-producer { width: 13%; }
  .schedule-table col.col-holiday, .schedule-table col.col-note { width: 17%; }
  .week-table .cell-date, .schedule-table .cell-date { padding-left: 20px; text-align: left; font-size: 14px; font-weight: 500; color: #424a55; }
  .week-table th:first-child, .schedule-table th:first-child { padding-left: 20px; text-align: left; }
  .week-table .cell-person, .schedule-table .cell-person { color: #252b32; font-size: 16px; font-weight: 600; }
  .week-table .cell-weekday, .schedule-table .cell-weekday { color: #7a838e; font-size: 12px; }
  .week-table .cell-note, .schedule-table .cell-note { color: #747c86; font-size: 12px; text-align: left; }
  .week-table th:last-child, .schedule-table th:last-child { text-align: left; }
  .week-table .cell-empty, .schedule-table .cell-empty { color: #bcc3cb; font-weight: 400; }
  .week-table tr.is-weekend .cell-weekday, .schedule-table tr.is-weekend .cell-weekday { color: #87716e; }
  .week-table tr.is-today td, .schedule-table tr.is-today td { border-top: 0; border-bottom: 1px solid #d7e8df; }
  .week-table tr.is-today td:first-child, .schedule-table tr.is-today td:first-child { box-shadow: inset 3px 0 0 #26755b; }
  .week-table tr.is-today .cell-person, .schedule-table tr.is-today .cell-person { color: #1c6048; font-weight: 700; }
  .week-table .cell-date .day-labels, .schedule-table .cell-date .day-labels { flex-direction: row; margin-left: 8px; }
  .week-table .cell-date .status-badge--today, .schedule-table .cell-date .status-badge--today {
    color: #fff; background: #26755b; border-color: #26755b; font-weight: 500; padding: 2px 5px;
  }
  .week-table tr.is-current-week-start.is-today td, .schedule-table tr.is-current-week-start.is-today td { height: 45px; }
  .week-divider-row .week-divider-cell, .week-divider-row:hover .week-divider-cell {
    height: 38px; padding: 0 20px; color: #747c86; background: #f2f4f6;
    border-top: 1px solid #e0e5e9; border-bottom: 1px solid #e0e5e9; text-align: left; line-height: 36px;
  }
  .week-divider-label { color: #424a55; font-size: 12px; }
  .week-divider-range { color: #88919a; font-size: 11px; }
  .full-schedule-details { order: 1; margin-top: 14px; }
  .full-schedule-details > summary, .full-schedule-details[open] > summary {
    width: fit-content; margin: 0 auto 16px; padding: 8px 12px; color: #65707b;
    background: transparent; border: 0; border-radius: 4px; box-shadow: none; font-size: 13px;
  }
  .full-schedule-details > summary:hover { color: #26755b; background: #edf2ef; box-shadow: none; }
  .full-schedule-details > summary::before { color: #65707b; }
  .duty-explanation {
    order: 3; min-height: 0; margin: 4px 0 0; padding: 16px 0 0; color: #7a838e;
    background: transparent; border: 0; border-top: 1px solid #e4e8eb; border-radius: 0;
    box-shadow: none; font-size: 12px; flex-wrap: wrap; gap: 6px 12px;
  }
  .duty-explanation strong { color: #68717c; font-weight: 500; }
  .duty-explanation span { border: 0; padding: 0; }
  .month-section { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .month-heading { padding: 14px 0; color: #252b32; background: transparent; border: 0; border-radius: 0; }
  .month-heading h2 { color: #252b32; font-size: 18px; }
  .dialog { max-width: calc(100vw - 32px); border-color: #dce1e6; border-radius: 8px; }
  .dialog__header { background: #fff; border-color: #e4e8eb; }
  .dialog__header h2 { color: #252b32; }
  .dialog__footer { background: #f8f9fa; }
  .calendar-nav-button, .calendar-select { border-color: #dce1e6; }
  .state-panel { border: 0; background: transparent; box-shadow: none; }
  :focus-visible { outline: 2px solid #26755b; outline-offset: 3px; }

  @media (max-width: 900px) {
    :root { --page-gutter: 20px; }
    .topbar__inner { align-items: flex-start; flex-direction: column; padding: 20px 0; gap: 16px; }
    .topbar__title-area h1 { font-size: 22px; }
    .topbar__actions { flex-wrap: wrap; justify-content: flex-start; }
    .main-content { padding-top: 24px; }
    .week-overview__heading { align-items: flex-start; flex-direction: column; gap: 16px; }
    .week-overview__heading h2 { font-size: 20px; }
    .week-navigation { align-self: flex-start; }
  }

  @media (max-width: 600px) {
    :root { --page-gutter: 16px; }
    .topbar__inner { padding: 18px 0 16px; }
    .topbar__title-area h1 { font-size: 21px; }
    .topbar__actions { width: 100%; gap: 6px; }
    .topbar__actions .button { padding: 8px 9px; font-size: 12px; }
    .last-updated { font-size: 11px; }
    .week-overview__range { font-size: 12px; overflow-wrap: anywhere; }
    .week-table-wrapper, .schedule-table-wrapper { overflow: visible; border: 0; border-radius: 0; background: transparent; }
    .week-table, .schedule-table { display: block; min-width: 0; }
    .week-table thead, .schedule-table thead, .schedule-table colgroup { display: none; }
    .week-table tbody, .schedule-table tbody { display: block; }
    .week-table tbody tr:not(.week-divider-row), .schedule-table tbody tr {
      display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
      padding: 14px 16px; gap: 10px 16px; background: #fff; border-bottom: 1px solid #e5e8ec;
    }
    .week-table tbody tr.is-today, .schedule-table tbody tr.is-today { background: #edf7f3; box-shadow: inset 3px 0 #26755b; }
    .week-table td, .schedule-table td,
    .week-table tbody tr:hover td, .schedule-table tbody tr:hover td,
    .week-table tr.is-current-week:not(.is-today) td,
    .schedule-table tr.is-current-week:not(.is-today) td,
    .week-table tr.is-today td, .schedule-table tr.is-today td {
      display: block; height: auto; min-width: 0; padding: 0; background: transparent; border: 0; text-align: left; box-shadow: none;
    }
    .week-table td[data-label]::before, .schedule-table td[data-label]::before {
      content: attr(data-label); display: block; margin-bottom: 3px; color: #7a838e; font-size: 11px; font-weight: 400;
    }
    .week-table .cell-date, .schedule-table .cell-date { font-size: 14px; font-weight: 600; }
    .week-table .cell-weekday, .schedule-table .cell-weekday { align-self: center; text-align: right; }
    .week-table .cell-note, .schedule-table .cell-note, .week-table .cell-action, .schedule-table .cell-action { grid-column: 1 / -1; }
    .week-table tr.is-today td:first-child, .schedule-table tr.is-today td:first-child { box-shadow: none; }
    .week-table .cell-person, .schedule-table .cell-person { font-size: 16px; }
    .week-table tr.is-current-week-start.is-today td, .schedule-table tr.is-current-week-start.is-today td { height: auto; }
    .week-divider-row { display: block; margin: 18px 0 8px; }
    .week-divider-row .week-divider-cell, .week-divider-row:hover .week-divider-cell { height: auto; padding: 4px 0; border: 0; background: transparent; line-height: 1.5; }
    .week-divider-range { display: block; margin-top: 4px; }
    .week-table td.cell-action { position: static; width: auto; }
    .week-table .cell-action .day-edit-button, .schedule-table .cell-action .day-edit-button { position: static; transform: none; }
    .dialog__body { padding: 16px; }
    .dialog__footer { flex-wrap: wrap; padding: 12px 16px; gap: 8px; }
    .form-grid { grid-template-columns: 1fr; }
    .calendar-toolbar { display: grid; grid-template-columns: 1fr 1fr; padding: 10px; gap: 8px; }
    .calendar-selectors { grid-column: 1 / -1; grid-row: 1; display: grid; grid-template-columns: 1fr 1fr; width: 100%; min-width: 0; gap: 8px; }
    .calendar-select { width: 100%; min-width: 0; padding: 8px; font-size: 14px; }
    .calendar-nav-button { width: 100%; min-width: 0; padding: 8px; font-size: 12px; }
    .calendar-status { flex-wrap: wrap; }
    .calendar-dialog__footer-actions { gap: 6px; }
    .dialog--calendar { width: calc(100vw - 24px); max-width: calc(100vw - 24px); }
    .toast { min-width: 0; max-width: calc(100vw - 32px); right: 16px; bottom: 16px; }
  }
}

@media screen and (max-width: 600px) {
  #weekScheduleBody tr td.cell-weekday, #scheduleContent tr td.cell-weekday,
  #weekScheduleBody tr td.is-empty-field, #scheduleContent tr td.is-empty-field { display: none; }
}