    #availability-view .band-card,
    #team-availability-view .band-card {
      padding: 24px;
    }

    #availability-view .band-card + .band-card,
    #team-availability-view .band-card:not(.hidden) + .band-card {
      margin-top: 0;
    }

    .avail-day {
      display: grid;
      grid-template-columns: 112px 44px minmax(0, 1fr);
      gap: 8px 12px;
      align-items: center;
      padding: 10px 0;
      border-bottom: 1px solid var(--border);
    }

    .avail-day-main {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 12px;
      align-items: center;
      min-width: 0;
    }

    .avail-day-name {
      font-weight: 600;
    }

    .avail-blocks {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      min-width: 0;
    }

    .avail-day.is-off .avail-blocks {
      display: none;
    }

    .avail-block {
      display: flex;
      align-items: center;
      gap: 6px;
    }

    .avail-dash {
      color: var(--muted);
    }

    #availability-view .avail-time,
    #avail-off-modal .avail-time,
    #availability-view .avail-icon-btn,
    #availability-view .avail-delete,
    #availability-view .avail-copy-btn,
    #avail-save-btn,
    #avail-add-off-btn,
    #avail-off-save,
    #avail-off-whole,
    #avail-off-part {
      min-height: 44px;
    }

    #avail-add-off-btn {
      color: var(--text);
      background: #fff;
      border: 1px solid var(--border);
      padding: 0 16px;
    }

    .avail-time {
      border: 1px solid var(--border);
      background: #fff;
      border-radius: 8px;
      padding: 8px 12px;
      font: 500 14px var(--font-body);
      font-variant-numeric: tabular-nums;
      color: var(--text);
      cursor: pointer;
    }

    .avail-icon-btn,
    .avail-copy-btn {
      border: 0;
      background: transparent;
      color: var(--accent);
      font: 600 14px var(--font-body);
      padding: 8px 4px;
      cursor: pointer;
    }

    .avail-day-cap {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-weight: 600;
      white-space: nowrap;
    }

    .avail-day-cap input {
      width: 64px;
      min-height: 44px;
      margin: 0;
      flex: 0 0 auto;
    }

    #availability-view .toggle.avail-toggle {
      width: 44px;
      height: 44px;
    }

    #availability-view .toggle.avail-toggle .toggle-slider {
      top: 10px;
      bottom: 10px;
    }

    .avail-limit {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
      margin-top: 16px;
      font-weight: 600;
    }

    .avail-limit input {
      width: 72px;
      min-height: 44px;
      margin: 0;
    }

    .avail-off-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      margin-bottom: 8px;
    }

    .avail-off-head h2 {
      margin: 0;
      font-size: 18px;
    }

    .avail-off-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      padding: 8px 0;
      border-top: 1px solid var(--border);
    }

    .avail-off-row p {
      margin: 0;
    }

    .avail-empty {
      color: var(--muted);
      margin: 8px 0 0;
    }

    .avail-time-menu {
      position: fixed;
      z-index: 90;
      background: #fff;
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 8px;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 6px;
      max-height: 280px;
      overflow: auto;
      box-shadow: 0 8px 24px rgba(16, 24, 40, 0.12);
    }

    .avail-time-menu .dtp-slot {
      min-height: 44px;
    }

    .avail-time-menu.is-sheet {
      border-radius: 16px 16px 0 0;
      max-height: 70vh;
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .avail-copy-menu {
      position: fixed;
      z-index: 90;
      background: #fff;
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 8px;
      display: flex;
      flex-direction: column;
      gap: 4px;
      width: 260px;
      max-height: min(80vh, 520px);
      overflow: auto;
      box-shadow: 0 8px 24px rgba(16, 24, 40, 0.12);
    }

    .avail-copy-choice,
    .avail-copy-day {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      min-height: 44px;
      margin: 0;
      padding: 8px 10px;
      border: 0;
      border-radius: 8px;
      background: transparent;
      color: var(--text);
      font: 600 14px var(--font-body);
      text-align: left;
      cursor: pointer;
    }

    .avail-copy-choice:hover,
    .avail-copy-day:hover {
      background: #f4f6f8;
    }

    .avail-copy-picks {
      border-top: 1px solid var(--border);
      margin-top: 4px;
      padding-top: 4px;
    }

    .avail-copy-apply {
      width: 100%;
      min-height: 44px;
      margin-top: 4px;
    }

    .avail-copy-menu.is-sheet {
      left: 0;
      right: 0;
      bottom: 0;
      top: auto;
      width: 100%;
      border-radius: 16px 16px 0 0;
      max-height: 85vh;
    }

    .team-show-all {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      min-height: 44px;
      margin: 0 0 12px;
      font-weight: 600;
      cursor: pointer;
    }

    .avail-off-modes {
      display: flex;
      gap: 8px;
      margin-bottom: 12px;
    }

    .avail-off-modes button {
      border: 1px solid var(--border);
      background: #fff;
      border-radius: 999px;
      padding: 8px 14px;
      font: 600 14px var(--font-body);
      cursor: pointer;
    }

    .avail-off-modes button[aria-pressed="true"] {
      background: var(--accent);
      border-color: var(--accent);
      color: #fff;
    }

    .avail-off-dates {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .avail-off-label {
      display: block;
      font-size: 13px;
      color: var(--muted);
      margin-bottom: 4px;
    }

    #avail-off-times {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-top: 12px;
    }

    .team-avail-table {
      width: 100%;
      border-collapse: collapse;
    }

    .team-avail-table th {
      text-align: left;
      font-size: 12px;
      color: var(--muted);
      font-weight: 600;
      padding: 8px;
    }

    .team-avail-table td {
      padding: 12px 8px;
      border-top: 1px solid var(--border);
      vertical-align: top;
    }

    .team-avail-table tbody tr {
      cursor: pointer;
    }

    .team-avail-table tbody tr:hover {
      background: #f7f8fa;
    }

    .team-defaults {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      margin-bottom: 12px;
    }

    .team-defaults label,
    #team-booking-form > #team-booking-defaults > label,
    #office-bookings-card label {
      display: block;
      font-size: 13px;
      font-weight: 600;
      margin: 12px 0 4px;
    }

    .team-defaults label {
      margin-top: 0;
    }

    .team-defaults select,
    .team-defaults input,
    #team-booking-unconfirmed,
    #team-booking-remind,
    #office-bookings-card select,
    #office-bookings-card input {
      width: 100%;
      min-height: 44px;
    }

    .team-defaults .field-hint {
      margin: 6px 0 0;
    }

    .cal-shade {
      position: absolute;
      left: 0;
      right: 0;
      background: rgba(20, 24, 33, 0.07);
      pointer-events: none;
      z-index: 0;
    }

    .cal-timeoff {
      position: absolute;
      left: 3px;
      right: 3px;
      z-index: 1;
      pointer-events: none;
      overflow: hidden;
      border-radius: 6px;
      background: repeating-linear-gradient(-45deg, rgba(90, 98, 112, 0.18), rgba(90, 98, 112, 0.18) 6px, rgba(255, 255, 255, 0.65) 6px, rgba(255, 255, 255, 0.65) 12px);
      color: #3d4450;
      font-size: 11px;
      font-weight: 600;
      padding: 4px 6px;
    }

    .cal-load-label.is-full,
    .cal-load-count.is-full,
    .cal-col-sub .is-full {
      color: #d97706;
    }

    .cal-load-off {
      color: #9a6700;
      font-weight: 600;
    }

    .book-demo-avail {
      margin: 8px 0 0;
      padding: 8px 10px;
      border-radius: 8px;
      background: #fff6e8;
      color: #9a6700;
      font-size: 14px;
    }

    .dealer-picker-item-role.is-warn {
      color: #d97706;
      font-weight: 600;
    }

    #availability-view .page-band-actions,
    #today-dealer .page-band-actions,
    #demos-view .page-band-actions {
      flex-wrap: wrap;
    }

    #team-availability-view .table-wrap {
      overflow-x: hidden;
    }

    #availability-view,
    #team-availability-view {
      overflow-x: hidden;
    }

    .avail-week-card {
      margin-bottom: 16px;
    }

    .avail-week-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px 12px;
      margin-bottom: 8px;
    }

    .avail-week-head h2 {
      margin: 0;
      font-size: 18px;
      min-width: 0;
    }

    .avail-week-actions {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px 12px;
    }

    .avail-week-actions .btn-secondary,
    .avail-week-actions .link-btn {
      height: auto;
      min-height: 44px;
      padding: 0 12px;
      font-size: 14px;
      font-weight: 600;
    }

    .avail-date {
      display: grid;
      grid-template-columns: 124px 44px minmax(0, 1fr) auto;
      gap: 8px 12px;
      align-items: center;
      padding: 10px 0;
      border-bottom: 1px solid var(--border);
    }

    .avail-date-main {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 12px;
      align-items: center;
      min-width: 0;
      grid-column: 3;
      grid-row: 1;
    }

    .avail-date-name {
      grid-column: 1;
      grid-row: 1;
      font-weight: 600;
      white-space: nowrap;
    }

    .avail-date > .toggle {
      grid-column: 2;
      grid-row: 1;
    }

    .avail-date > .avail-chip {
      grid-column: 4;
      grid-row: 1;
      justify-self: end;
    }

    .avail-date.is-past .avail-date-name,
    .avail-date.is-past .avail-date-main,
    .avail-date.is-past .avail-chip,
    .avail-date.is-past .toggle {
      opacity: 0.55;
    }

    .avail-date.is-past .avail-time,
    .avail-date.is-past .avail-icon-btn,
    .avail-date.is-past .toggle,
    .avail-date.is-past .avail-day-cap input {
      pointer-events: none;
    }

    .avail-chip {
      display: inline-flex;
      align-items: center;
      min-height: 28px;
      padding: 0 8px;
      border-radius: 999px;
      font-size: 12px;
      font-weight: 700;
      white-space: nowrap;
      background: #fff6e8;
      color: #9a6700;
    }

    .avail-chip.is-confirmed {
      background: #e7f6ee;
      color: #0f7a3a;
    }

    .avail-chip.is-clash {
      background: #fdecec;
      color: #b42318;
    }

    .avail-clash {
      grid-column: 1 / -1;
      margin: 0;
      color: #b42318;
      font-size: 14px;
      font-weight: 600;
    }

    .avail-chip.is-off,
    .avail-chip.is-time-off {
      background: #eef0f3;
      color: #5c6570;
    }

    .avail-date.is-off .avail-blocks {
      display: none;
    }

    .avail-diff,
    .avail-booked {
      grid-column: 1 / -1;
      margin: 0;
    }

    .avail-diff {
      color: var(--muted);
      font-size: 13px;
    }

    .avail-diff .link-btn {
      color: var(--muted);
      font-size: 13px;
      font-weight: 600;
      text-decoration: underline;
      min-height: 44px;
      padding: 0 4px;
    }

    .avail-booked {
      color: var(--muted);
      font-size: 14px;
    }

    .avail-booked .link-btn {
      min-height: 44px;
      padding: 0 2px;
      font-size: 14px;
    }

    .avail-booked-item {
      white-space: nowrap;
    }

    .today-confirm {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin: 0 0 16px;
      padding: 16px;
      border: 1px solid #f0d7a6;
      border-radius: 12px;
      background: #fff6e8;
    }

    .today-confirm p {
      margin: 0;
      font-weight: 600;
    }

    .today-confirm .btn-secondary {
      min-height: 44px;
    }

    #team-avail-card .band-tab {
      color: var(--text);
      font-size: 14px;
      font-weight: 600;
      min-height: 44px;
    }

    #team-avail-card .band-tab.active {
      color: var(--text);
      border-bottom-color: var(--accent);
    }

    .team-date-key {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 16px;
      margin: 0 0 12px;
      padding: 0;
      list-style: none;
    }

    .team-date-key li {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      font-weight: 600;
    }

    .team-date-swatch {
      width: 16px;
      height: 16px;
      border-radius: 4px;
      flex: 0 0 auto;
    }

    .team-date-swatch.is-yes {
      background: #d9f2e4;
    }

    .team-date-swatch.is-open {
      background: #fdecc8;
    }

    .team-date-swatch.is-off {
      background: #e6eaee;
    }

    .team-date-swatch.is-timeoff {
      background: repeating-linear-gradient(-45deg, rgba(90, 98, 112, 0.18), rgba(90, 98, 112, 0.18) 4px, rgba(255, 255, 255, 0.85) 4px, rgba(255, 255, 255, 0.85) 8px);
    }

    .team-date-swatch.is-clash {
      background: #fff;
      box-shadow: inset 0 0 0 2px #d92d20;
    }

    .team-date-wrap {
      overflow: hidden;
      max-width: 100%;
    }

    .team-date-scroll {
      overflow-x: auto;
      max-width: 100%;
    }

    .team-date-table {
      border-collapse: collapse;
      width: max-content;
    }

    .team-date-table th,
    .team-date-table td {
      padding: 4px;
      text-align: center;
      font-size: 12px;
      font-weight: 600;
    }

    .team-date-table th.is-today,
    .team-date-table td.is-today {
      background: #eef2ff;
    }

    .team-date-table th.is-today {
      color: var(--accent);
    }

    .team-date-name {
      text-align: left;
      text-transform: none;
      font-weight: 600;
      min-width: 160px;
      max-width: 220px;
      position: sticky;
      left: 0;
      background: #fff;
      z-index: 1;
      white-space: normal;
    }

    .team-date-person {
      display: block;
      text-align: left;
      text-transform: none;
      font-weight: 600;
    }

    .team-date-unconfirmed {
      display: block;
      margin-top: 2px;
      color: #9a6700;
      font-size: 12px;
      font-weight: 600;
      text-align: left;
      text-transform: none;
      white-space: normal;
    }

    .team-date-copy {
      display: inline-flex;
      align-items: center;
      min-height: 44px;
      margin-top: 4px;
      text-align: left;
    }

    .team-date-cell {
      position: relative;
      min-width: 112px;
      height: 44px;
      padding: 0 8px;
      border: 0;
      border-radius: 8px;
      font-size: 12px;
      font-weight: 700;
      white-space: nowrap;
      cursor: pointer;
    }

    td.is-today .team-date-cell {
      box-shadow: inset 0 0 0 2px #2b4eff;
    }

    .team-date-cell.is-yes {
      background: #d9f2e4;
      color: #145c32;
    }

    .team-date-cell.is-open {
      background: #fdecc8;
      color: #6b4a00;
    }

    .team-date-cell.is-off {
      background: #e6eaee;
      color: #3a4352;
    }

    .team-date-cell.is-timeoff {
      color: #3d4450;
      background: repeating-linear-gradient(-45deg, rgba(90, 98, 112, 0.18), rgba(90, 98, 112, 0.18) 6px, rgba(255, 255, 255, 0.85) 6px, rgba(255, 255, 255, 0.85) 12px);
    }

    .team-date-cell.is-clash {
      color: #b42318;
      box-shadow: inset 0 0 0 2px #d92d20;
    }

    td.is-today .team-date-cell.is-clash {
      box-shadow: inset 0 0 0 2px #d92d20;
    }

    .avail-day-on-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      font-weight: 600;
    }

    .avail-day-state {
      margin: 0 0 4px;
      font-weight: 600;
    }

    .avail-day-changed {
      margin: 0 0 12px;
      color: var(--muted);
      font-size: 14px;
    }

    .avail-day-demo {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 4px 12px;
      align-items: center;
      padding: 8px 0;
      border-top: 1px solid var(--border);
    }

    .avail-day-demo-main {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
    }

    .avail-day-demo .link-btn,
    .avail-day-demo .btn-secondary {
      min-height: 44px;
    }

    .avail-day-clash {
      grid-column: 1 / -1;
      margin: 0 0 12px;
      color: #b42318;
      font-size: 14px;
      font-weight: 600;
    }

    #book-demo-modal.modal-backdrop {
      z-index: 30;
    }

    #avail-day-modal .toggle.avail-toggle {
      width: 44px;
      height: 44px;
    }

    #avail-day-modal .toggle.avail-toggle .toggle-slider {
      top: 10px;
      bottom: 10px;
    }

    #avail-day-modal .avail-time,
    #avail-day-modal .avail-icon-btn,
    #avail-day-save,
    #avail-confirm-all,
    #avail-tab-dates,
    #avail-tab-week {
      min-height: 44px;
    }

    .cal-unconfirmed {
      position: absolute;
      left: 0;
      right: 0;
      z-index: 0;
      pointer-events: none;
      background: repeating-linear-gradient(-45deg, rgba(217, 119, 6, 0.16), rgba(217, 119, 6, 0.16) 6px, rgba(255, 246, 232, 0.2) 6px, rgba(255, 246, 232, 0.2) 12px);
    }

    .cal-shade.is-off {
      background: rgba(90, 98, 112, 0.16);
    }

    .book-demo-avail.is-block {
      background: #fff1f0;
      color: #b42318;
    }

    @media (max-width: 767px) {
      .avail-day {
        grid-template-columns: 1fr 44px;
      }

      .avail-day-main {
        grid-column: 1 / -1;
      }

      .avail-off-dates,
      .team-defaults {
        grid-template-columns: 1fr;
      }

      .team-avail-table thead {
        display: none;
      }

      .team-avail-table,
      .team-avail-table tbody,
      .team-avail-table tr,
      .team-avail-table td {
        display: block;
        width: 100%;
      }

      .team-avail-table tr {
        padding: 8px 0 12px;
        border-top: 1px solid var(--border);
      }

      .team-avail-table td {
        border: 0;
        padding: 2px 0;
      }

      .team-avail-table td:first-child {
        font-weight: 700;
      }

      .avail-date {
        grid-template-columns: minmax(0, 1fr) 44px auto;
      }

      .avail-date > .avail-chip {
        grid-column: 3;
        grid-row: 1;
      }

      .avail-date-main,
      .avail-diff,
      .avail-clash,
      .avail-booked {
        grid-column: 1 / -1;
        grid-row: auto;
      }
    }
