* {
      box-sizing: border-box;
    }

    :root {
      color-scheme: dark;

      /* X dark semantic tokens */
      --x-bg-primary: #000000;
      --x-bg-secondary: #16181c;
      --x-bg-elevated: #202327;
      --x-text-primary: #e7e9ea;
      --x-text-secondary: #71767b;
      --x-text-muted: #8b98a5;
      --x-border: #2f3336;
      --x-border-light: #3d4144;
      --x-accent: #1da1f2;
      --x-accent-hover: #1a91da;
      --x-success: #00ba7c;
      --x-error: #f4212e;
      --x-warning: #ffad1f;

      /* Legacy aliases (JS + existing CSS) */
      --ui-font: "Roboto", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
      --ui-font-size: 15px;
      --ui-font-size-sm: 12px;
      --ui-radius: 16px;
      --ui-radius-sm: 8px;
      --ui-radius-pill: 9999px;
      --ui-gap: 10px;
      --ui-border-color: var(--x-border);
      --ui-border: 1px solid var(--x-border);
      --ui-page-bg: var(--x-bg-primary);
      --ui-bg: var(--x-bg-secondary);
      --ui-bg-muted: var(--x-bg-secondary);
      --ui-bg-subtle: var(--x-bg-elevated);
      --ui-bg-elevated: var(--x-bg-elevated);
      --ui-surface: var(--x-bg-secondary);
      --ui-text: var(--x-text-primary);
      --ui-text-muted: var(--x-text-secondary);
      --ui-text-dim: var(--x-text-muted);
      --ui-primary: var(--x-accent);
      --ui-primary-hover: var(--x-accent-hover);
      --ui-primary-soft: rgba(29, 161, 242, 0.15);
      --ui-link: var(--x-accent);
      --ui-danger: var(--x-error);
      --ui-control-h: 36px;
      --ui-shadow: none;
      --chart-tick: var(--x-text-secondary);
      --chart-title: var(--x-text-primary);
      --chart-grid: rgba(47, 51, 54, 0.5);
      --app-header-h: 52px;
    }

    html, body {
      font-family: var(--ui-font);
      font-size: 15px;
      line-height: 1.4;
      color: var(--x-text-primary);
      margin: 0;
      padding: 0;
      background: var(--x-bg-primary);
      min-height: 100vh;
    }

    h1, h2, h3, h4, h5, h6,
    .text-h1, .text-h2, .text-h3 {
      color: var(--x-text-primary);
      margin-bottom: 0.8em;
    }

    h1, .text-h1 { font-size: 31px; font-weight: 700; line-height: 1.2; }
    h2, .text-h2 { font-size: 23px; font-weight: 700; line-height: 1.25; }
    h3, .text-h3 { font-size: 20px; font-weight: 600; line-height: 1.3; }
    h4 { font-size: 17px; font-weight: 600; line-height: 1.3; }
    h5 { font-size: 15px; font-weight: 600; line-height: 1.3; }
    h6 { font-size: 13px; font-weight: 600; line-height: 1.3; }

    .text-body {
      font-size: 15px;
      line-height: 1.4;
      font-weight: 400;
    }

    .text-secondary {
      font-size: 13px;
      line-height: 1.3;
      color: var(--x-text-secondary);
    }

    .text-muted {
      font-size: 12px;
      color: var(--x-text-muted);
    }

    .text-button {
      font-size: 15px;
      font-weight: 700;
      line-height: 1;
    }

    .tweet-text {
      font-size: 15px;
      line-height: 1.4;
      color: var(--x-text-primary);
    }

    .username {
      font-weight: 700;
      color: var(--x-text-primary);
    }

    .handle {
      font-weight: 400;
      color: var(--x-text-secondary);
    }

    .metadata {
      font-size: 13px;
      color: var(--x-text-secondary);
    }

    p {
      margin-bottom: 1em;
      color: var(--x-text-secondary);
      max-width: 70ch;
    }

    strong, b {
      font-weight: 600;
      color: var(--x-text-primary);
    }

    a {
      color: var(--x-accent);
      text-decoration: none;
    }

    a:hover {
      text-decoration: underline;
    }

    /* X-style buttons */
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 8px 16px;
      border-radius: var(--ui-radius-pill);
      font-weight: 700;
      font-size: 15px;
      line-height: 1;
      transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
      cursor: pointer;
      border: none;
      font-family: inherit;
    }

    .btn-primary {
      background-color: var(--x-accent);
      color: #fff;
    }

    .btn-primary:hover {
      background-color: var(--x-accent-hover);
    }

    .btn-secondary {
      background-color: transparent;
      color: var(--x-text-primary);
      border: 1px solid var(--x-border);
    }

    .btn-secondary:hover {
      background-color: var(--x-bg-secondary);
    }

    .btn-success {
      background-color: var(--x-success);
      color: #fff;
    }

    .btn-success:hover {
      filter: brightness(1.08);
    }

    .btn-danger {
      background-color: var(--x-error);
      color: #fff;
    }

    .btn-danger:hover {
      filter: brightness(1.08);
    }

    .card {
      background-color: var(--x-bg-primary);
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
    }

    /* Tab panels */
    .tabcontent {
      animation: fadeIn 0.25s ease-out;
    }

    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(10px); }
      to { opacity: 1; transform: translateY(0); }
    }


    .chart-container {
      width: 100%;
      max-width: 100%;
      margin: auto;
    }

    .chart-wrapper {
      width: 100%;
      max-width: 100%;
      /* height: 700px; */
      position: relative;
      overflow: hidden;
      transition: margin-left 0.3s ease, margin-right 0.3s ease;
    }

    /* Make cheapest tab charts: keep top (price) large, bottom (count) compact.
       Note: canvas sizing is controlled by these wrapper heights. */
    /* #CheapestProperties .chart-container:first-of-type .chart-wrapper { height: 700px; } */
    #CheapestProperties .chart-container:nth-of-type(2) .chart-wrapper { height: 350px; }



    /* Chart.js sets canvas display size when responsive:true — do not override with % sizing */
    .chart-wrapper > canvas {
      display: block;
      max-width: 100%;
    }

    #propertyChartWrapper {
      box-sizing: border-box;
      min-width: 0;
      width: 100%;
      max-width: 100%;
      align-self: start;
    }

    body.property-tab-room-filter-visible #PropertyData {
      display: grid !important;
      grid-template-columns: 360px minmax(0, 1fr);
      grid-template-rows: auto auto;
      grid-template-areas:
        'roomFilterPanel propPortfolioAggregateStrips'
        'roomFilterPanel propertyChartWrapper';
      align-items: start;
      align-content: start;
      column-gap: 0;
    }

    body.property-tab-room-filter-visible #roomFilterPanel {
      grid-area: roomFilterPanel;
    }

    body.property-tab-room-filter-visible #propPortfolioAggregateStrips {
      grid-area: propPortfolioAggregateStrips;
      margin-left: 0;
      width: 100%;
      max-width: 100%;
    }

    body.property-tab-room-filter-visible #propertyChartWrapper {
      grid-area: propertyChartWrapper;
      align-self: start;
    }

    body.property-tab-room-filter-visible .prop-portfolio-lane-inset {
      margin-left: 0;
      margin-right: 0;
      width: 100%;
      max-width: 100%;
    }

    #propertyChartWrapper .chart-container {
      width: 100%;
      max-width: 100%;
      margin: 0;
    }

    /* App header — full-width sticky top bar */
    .app-header,
    .app-toolbar {
      position: sticky;
      top: 0;
      z-index: 1100;
      display: flex;
      align-items: center;
      gap: 8px;
      min-height: 52px;
      padding: 6px 12px;
      background: var(--x-bg-primary);
      border-bottom: 1px solid var(--x-border);
      box-shadow: none;
    }

    .app-header__brand {
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 8px;
      padding: 3px 8px;
      margin-left: 4px;
      flex-shrink: 0;
      border: none;
      border-left: 1px solid var(--ui-border-color);
      border-radius: var(--ui-radius-sm);
      background: transparent;
      font: inherit;
      color: inherit;
      cursor: pointer;
      text-align: left;
      transition: background 0.15s ease, box-shadow 0.15s ease;
    }

    .app-header__brand:hover {
      background: var(--x-bg-secondary);
    }

    .app-header__brand:focus-visible {
      outline: 2px solid var(--x-accent);
      outline-offset: 2px;
    }

    .app-header__brand--active,
    .app-header__brand.app-header__brand--active {
      background: var(--ui-primary-soft);
      box-shadow: inset 0 0 0 1px var(--x-accent);
    }

    .app-header__brand--active .app-header__title {
      text-shadow:
        0 0 1px rgba(255, 255, 255, 1),
        0 0 8px rgba(0, 230, 255, 1),
        0 0 18px rgba(0, 210, 255, 0.9),
        0 0 32px rgba(0, 180, 255, 0.55),
        0 0 48px rgba(0, 150, 255, 0.3);
    }

    .app-header__brand--active .app-header__subtitle {
      color: #fff4c2;
      text-shadow:
        0 0 1px rgba(255, 255, 255, 0.95),
        0 0 7px rgba(255, 215, 60, 0.95),
        0 0 16px rgba(255, 193, 37, 0.85),
        0 0 28px rgba(255, 173, 31, 0.55);
    }

    .app-header__end {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
      flex-shrink: 0;
      margin-left: 0;
    }

    .app-header__logo {
      width: 30px;
      height: 30px;
      object-fit: contain;
      flex-shrink: 0;
      border-radius: 6px;
    }

    .app-header__brand-text {
      display: flex;
      flex-direction: column;
      gap: 0;
      position: relative;
      isolation: isolate;
    }

    .app-header__brand-text::before {
      content: '';
      position: absolute;
      left: -18px;
      top: 50%;
      width: 36px;
      height: 120%;
      transform: translateY(-50%);
      background: radial-gradient(ellipse at center, rgba(168, 72, 255, 0.14) 0%, transparent 72%);
      pointer-events: none;
      z-index: -1;
    }

    .app-header__title,
    .app-header__subtitle {
      font-family: 'Orbitron', 'Roboto', system-ui, sans-serif;
      line-height: 1.1;
      color: #eefcff;
      -webkit-font-smoothing: antialiased;
    }

    .app-header__title {
      font-size: 17px;
      font-weight: 600;
      letter-spacing: 0.02em;
      text-shadow:
        0 0 1px rgba(240, 255, 255, 1),
        0 0 6px rgba(0, 220, 255, 0.95),
        0 0 14px rgba(0, 200, 255, 0.75),
        0 0 28px rgba(0, 170, 255, 0.45),
        0 0 42px rgba(0, 140, 255, 0.25);
    }

    .app-header__subtitle {
      font-size: 9px;
      font-weight: 500;
      letter-spacing: 0.34em;
      margin-left: 1px;
      color: #ffe566;
      text-shadow:
        0 0 1px rgba(255, 255, 255, 0.95),
        0 0 5px rgba(255, 220, 50, 0.95),
        0 0 12px rgba(255, 200, 30, 0.75),
        0 0 22px rgba(255, 173, 31, 0.45);
    }

    .app-header__region {
      display: flex;
      align-items: center;
      gap: 0;
      min-width: 0;
    }

    .app-header__region-label {
      display: none;
    }

    .app-toolbar-label {
      font-weight: 600;
      color: var(--ui-text-muted);
      font-size: var(--ui-font-size-sm);
      white-space: nowrap;
      flex-shrink: 0;
    }

    .ui-select,
    .app-toolbar-region-select,
    .app-header__region-select {
      height: 34px;
      padding: 0 32px 0 12px;
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius-pill);
      font-family: inherit;
      font-size: 15px;
      font-weight: 500;
      color: var(--x-text-primary);
      cursor: pointer;
      min-width: 150px;
      max-width: min(320px, 42vw);
      background: var(--x-bg-secondary);
      transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    }

    .ui-select:hover,
    .app-toolbar-region-select:hover,
    .app-header__region-select:hover {
      border-color: var(--x-border-light);
      background: var(--x-bg-elevated);
    }

    .ui-select:focus,
    .app-toolbar-region-select:focus,
    .app-header__region-select:focus {
      outline: none;
      border-color: var(--x-accent);
      box-shadow: 0 0 0 2px rgba(29, 161, 242, 0.35);
    }

    .app-header__nav,
    .main-tabs {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 4px;
      padding: 0;
      flex: 0 0 auto;
      min-width: auto;
      margin: 0;
      flex-shrink: 0;
      background: transparent;
      border: none;
      border-radius: 0;
    }

    .tablinks {
      height: 34px;
      padding: 0 16px;
      border: none;
      border-radius: var(--ui-radius-pill);
      font-family: inherit;
      font-size: 15px;
      font-weight: 700;
      letter-spacing: 0;
      color: var(--x-text-secondary);
      background: transparent;
      cursor: pointer;
      transition: background 0.15s ease, color 0.15s ease;
      white-space: nowrap;
    }

    .tablinks:hover {
      color: var(--x-text-primary);
      background: var(--x-bg-secondary);
    }

    .tablinks.active {
      background: var(--x-text-primary) !important;
      color: var(--x-bg-primary) !important;
      box-shadow: none;
    }

    .app-header-tab-controls {
      flex: 1 1 auto;
      min-width: 0;
      overflow: hidden;
    }

    .app-header-tab-controls__group {
      display: none;
      align-items: center;
      gap: 8px;
      min-width: 0;
      width: 100%;
      overflow-x: auto;
      scrollbar-width: thin;
    }

    .app-header-tab-controls__group.active {
      display: flex;
    }

    .app-header-tab-controls .booking-panel {
      display: flex;
      flex-direction: row;
      align-items: stretch;
      gap: 8px;
      min-width: max-content;
      width: auto;
    }

    .app-header-tab-controls .booking-toolbar,
    .app-header-tab-controls .booking-compare-lanes,
    .app-header-tab-controls .top-controls {
      margin: 0;
      box-shadow: none;
    }

    .app-header-tab-controls .booking-toolbar {
      display: flex;
      flex-wrap: nowrap;
      gap: 8px;
      padding: 6px 8px;
      min-height: 38px;
    }

    .app-header-tab-controls .booking-toolbar-label {
      font-size: 9px;
      letter-spacing: 0.04em;
    }

    .app-header-tab-controls .booking-compare-lanes {
      display: flex;
      flex-direction: column;
      min-width: 400px;
    }

    .app-header-tab-controls .compare-lane {
      grid-template-columns: minmax(110px, auto) 1fr;
      gap: 6px;
      min-height: auto;
      padding: 2px 8px;
    }

    .app-header-tab-controls .compare-lane__date .ui-select,
    .app-header-tab-controls .booking-toolbar-date .ui-select {
      width: 148px;
      min-width: 148px;
      max-width: 148px;
      height: 30px;
    }

    .app-header-tab-controls .icon-btn {
      width: 24px;
      height: 24px;
    }

    .app-header-tab-controls .collections-area {
      margin: 0;
      min-height: 0;
      border: none;
      background: transparent;
      overflow: visible;
    }

    .app-header-tab-controls .collections-scroll {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      align-items: center;
      gap: 4px;
      padding: 0;
      margin: 0;
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      overflow-x: auto;
      max-height: none;
    }

    .app-header-tab-controls .collection-group-sep {
      color: var(--ui-text-dim);
      font-size: 14px;
      font-weight: 300;
      padding: 0 4px;
      user-select: none;
      flex-shrink: 0;
    }

    .app-header-tab-controls .night-item-compact {
      padding: 0;
      margin: 0;
      width: auto;
    }

    .app-header-tab-controls .night-item-compact input[type="checkbox"] {
      position: absolute;
      opacity: 0;
      width: 0;
      height: 0;
      pointer-events: none;
    }

    .app-header-tab-controls .night-item-compact label {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 34px;
      height: 24px;
      padding: 0 8px;
      font-variant-numeric: tabular-nums;
      border-radius: 999px;
      border: 1px solid rgba(var(--coll-rgb, 100, 116, 139), calc(var(--coll-alpha, 1) * 0.35));
      background: var(--ui-bg);
      font-size: 11px;
      font-weight: 700;
      color: var(--ui-text-muted);
      cursor: pointer;
      transition: background 0.12s, color 0.12s, border-color 0.12s, box-shadow 0.12s;
    }

    .app-header-tab-controls .night-item-compact label:hover {
      border-color: rgba(var(--coll-rgb, 37, 99, 235), var(--coll-alpha, 1));
      color: rgb(var(--coll-rgb, 30, 41, 59));
    }

    .app-header-tab-controls .night-item-compact:has(input:checked) label {
      background: rgba(var(--coll-rgb, 37, 99, 235), var(--coll-alpha, 1));
      border-color: rgba(var(--coll-rgb, 37, 99, 235), var(--coll-alpha, 1));
      color: #fff;
      box-shadow: 0 1px 3px rgba(var(--coll-rgb, 0, 0, 0), calc(var(--coll-alpha, 1) * 0.35));
    }

    .app-header-tab-controls .booking-panel--property.booking-toolbar--property {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
      padding: 6px 8px;
      min-height: 38px;
    }

    .app-header-tab-controls .booking-panel--property .prop-toolbar__properties {
      margin-left: auto;
    }

    .app-header-tab-controls .booking-panel--property .prop-date-select {
      width: 132px;
      min-width: 132px;
      max-width: 132px;
      font-variant-numeric: tabular-nums;
      font-weight: 600;
    }

    .app-header-tab-controls .booking-panel--property .prop-date-select--overlay {
      opacity: 0.95;
    }

    .app-header-tab-controls .booking-panel--property .ui-btn--both-dates {
      color: #d32f2f;
      border-color: rgba(211, 47, 47, 0.55);
    }

    .app-header-tab-controls .booking-panel--property .ui-btn--both-dates:hover {
      color: #fff;
      background: #d32f2f;
      border-color: #d32f2f;
    }

    .app-header-tab-controls .top-controls {
      display: flex;
      flex-wrap: nowrap;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
      min-width: max-content;
    }

    .app-header-tab-controls .app-toolbar-region-select,
    .app-header-tab-controls .ui-select {
      height: 30px;
    }

    .app-header-tab-controls .ui-segment {
      padding: 2px;
    }

    .app-header-tab-controls .ui-segment label,
    .app-header-tab-controls .ui-segment .prices-action-btn {
      height: 24px;
      padding: 0 8px;
      font-size: 11px;
    }

    @media (max-width: 720px) {
      :root {
        --app-header-h: 100px;
      }

      .app-header,
      .app-toolbar {
        flex-wrap: wrap;
        padding: 10px 12px;
        gap: 10px;
      }
      .app-header__brand {
        width: auto;
        margin-right: 0;
        padding-right: 0;
        border-left: none;
        border-bottom: none;
        padding-bottom: 3px;
        margin-bottom: 2px;
      }
      .app-header__end {
        width: auto;
        margin-left: 0;
        justify-content: flex-end;
      }
      .app-header__nav,
      .main-tabs {
        width: auto;
        margin: 0;
        flex: none;
        justify-content: flex-end;
      }
      .tablinks {
        flex: 0 0 auto;
        padding: 0 8px;
        font-size: 12px;
        font-weight: 700;
      }
      .app-header-tab-controls {
        order: 5;
        flex-basis: 100%;
      }
      .app-header-tab-controls .booking-panel {
        min-width: 760px;
      }
    }

    .tabcontent {
      display: none;
      margin: 16px;
      padding: 16px;
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
      background: var(--x-bg-primary);
      box-shadow: none;
    }

    .tabcontent.active {
      display: block;
    }

    /* Segmented control (view mode, etc.) */
    .ui-segment {
      display: inline-flex;
      align-items: center;
      gap: 2px;
      padding: 3px;
      background: var(--x-bg-secondary);
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius-pill);
    }

    .ui-segment label {
      display: inline-flex;
      align-items: center;
      margin: 0;
      padding: 0 12px;
      height: calc(var(--ui-control-h) - 8px);
      border-radius: var(--ui-radius-pill);
      font-size: 15px;
      font-weight: 600;
      color: var(--x-text-secondary);
      cursor: pointer;
      transition: background 0.15s ease, color 0.15s ease;
      user-select: none;
      white-space: nowrap;
    }

    .ui-segment label:has(input:checked) {
      background: var(--x-bg-elevated);
      color: var(--x-text-primary);
      box-shadow: none;
    }

    .ui-segment input[type="radio"],
    .ui-segment input[type="checkbox"] {
      position: absolute;
      opacity: 0;
      width: 0;
      height: 0;
      margin: 0;
    }

    /* Prices tab — action buttons inside segmented control */
    .ui-segment .prices-action-btn {
      display: inline-flex;
      align-items: center;
      margin: 0;
      padding: 0 12px;
      height: calc(var(--ui-control-h) - 8px);
      border: none;
      border-radius: var(--ui-radius-pill);
      font-family: inherit;
      font-size: 15px;
      font-weight: 600;
      color: var(--x-text-secondary);
      background: transparent;
      cursor: pointer;
      transition: background 0.15s ease, color 0.15s ease;
      white-space: nowrap;
    }

    .ui-segment .prices-action-btn:hover {
      color: var(--x-text-primary);
    }

    .ui-segment .prices-action-btn.active {
      background: var(--x-accent);
      color: #fff;
      box-shadow: none;
    }

    #CheapestProperties #selectedBtnCount {
      margin-left: 4px;
      font-weight: 700;
    }

    /* Prices tab: count chart should fill available width.
       Keep chart heights controlled by the wrapper (below) so we don't squash the second chart. */
    #countChart {
      width: 100% !important;
      max-width: 100% !important;
      display: block;
    }



    /* X-style control buttons */
    .ctrl-btn {
      font-family: inherit;
      font-size: 15px;
      line-height: 1;
      padding: 8px 16px;
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius-pill);
      background: transparent;
      color: var(--x-text-primary);
      cursor: pointer;
      transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
      font-weight: 700;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      height: auto;
      min-height: 36px;
      box-shadow: none;
    }

    .ctrl-btn:hover {
      background: var(--x-bg-secondary);
      border-color: var(--x-border-light);
    }

    .ctrl-btn:active {
      filter: brightness(0.95);
    }

    .ctrl-btn.primary {
      background: var(--x-accent);
      color: #fff;
      border-color: var(--x-accent);
    }

    .ctrl-btn.primary:hover {
      background: var(--x-accent-hover);
      border-color: var(--x-accent-hover);
    }

    .ctrl-btn.positive {
      background: var(--x-success);
      color: #fff;
      border-color: var(--x-success);
    }

    .ctrl-btn.positive:hover {
      filter: brightness(1.08);
    }

    .ctrl-btn.danger {
      background: var(--x-error);
      color: #fff;
      border-color: var(--x-error);
    }

    .ctrl-btn.danger:hover {
      filter: brightness(1.08);
    }

    .ctrl-btn.accent {
      background: transparent;
      color: var(--x-warning);
      border-color: var(--x-warning);
    }

    .ctrl-btn.accent:hover {
      background: rgba(255, 173, 31, 0.12);
    }

    .ctrl-btn.outline {
      background: transparent;
      border-color: var(--x-border);
      color: var(--x-text-primary);
    }

    .ctrl-btn.outline:hover {
      background: var(--x-bg-secondary);
      color: var(--x-text-primary);
    }

    /* Selection */
    .selection-container {
      display: flex;
      gap: 20px;
      margin-bottom: 15px;
    }

    .selection-column {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 5px;
    }

    /* === BOOKING TAB: HORIZONTAL ADULT + NIGHTS === */
    .adult-row {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 6px;
      font-size: 13px;
    }

    .adult-label {
      width: 80px;
      font-weight: 600;
      color: var(--ui-text);
      text-align: right;
    }

    .nights-group {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }

    .night-item-inline {
      display: flex;
      align-items: center;
      gap: 4px;
    }

    .night-item-inline input[type="checkbox"] {
      margin: 0;
      accent-color: var(--ui-primary);
    }

    .night-item-inline label {
      margin: 0;
      font-size: 12px;
      cursor: pointer;
      white-space: nowrap;
    }

    #collections,
    #collectionsOverlay {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    /* Tooltip */
    .chartjs-tooltip {
      background: rgba(30, 30, 30, 0.95) !important;
      border: 1px solid #444 !important;
      border-radius: 6px !important;
      padding: 10px 14px !important;
      font-family: system-ui, -apple-system, sans-serif;
      font-size: 13px !important;
      font-weight: 400 !important;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    .chartjs-tooltip-title,
    .chartjs-tooltip-body,
    .chartjs-tooltip-body-item,
    .chartjs-tooltip-body-item-text {
      font-weight: 400 !important;
    }

    /* EPIC PANELS — X elevated style */
    #detailsPanel,
    #overlayDetailsPanel {
      position: fixed;
      top: var(--app-header-h);
      width: 350px;
      height: calc(100% - var(--app-header-h));
      background: var(--x-bg-elevated);
      border: 1px solid var(--x-border);
      color: var(--x-text-primary);
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      overflow-y: auto;
      padding: 0;
      z-index: 1000;
      box-shadow: none;
    }

    #detailsPanel {
      left: -352px;
      border-right: none;
    }

    #overlayDetailsPanel {
      right: -352px;
      border-left: none;
    }

    #roomFilterPanel {
      position: sticky;
      top: var(--app-header-h);
      align-self: start;
      width: 360px;
      max-width: 100%;
      min-width: 0;
      height: auto;
      max-height: calc(100vh - var(--app-header-h));
      background: var(--x-bg-elevated);
      color: var(--x-text-primary);
      border-right: 1px solid var(--x-border);
      box-shadow: none;
      z-index: 1;
      overflow-y: auto;
      overflow-x: hidden;
      display: none;
      box-sizing: border-box;
    }

    body.property-tab-room-filter-visible #roomFilterPanel {
      display: block;
    }

    #roomFilterPanel.room-filter-panel--market .room-filter-panel__body,
    #roomFilterPanel.room-filter-panel--empty .room-filter-panel__body,
    #roomFilterPanel.room-filter-panel--property .room-filter-panel__body {
      width: 100%;
      max-width: 100%;
    }

    #roomFilterPanel.room-filter-panel--property {
      overflow-x: auto;
    }

    #roomFilterPanel .room-filter-panel__subtitle {
      font-size: 0.90em;
      color: var(--ui-text-muted);
      margin: 0 0 6px;
      line-height: 1.35;
    }

    .room-filter-panel__checkin-label {
      display: block;
      font-size: 0.82em;
      color: var(--ui-text-muted);
      margin: 0 0 4px;
      text-transform: uppercase;
      letter-spacing: 0.06em;
    }

    .room-filter-panel__checkin-select {
      width: 100%;
      margin-bottom: 4px;
      font-size: 0.95em;
    }

    .room-filter-panel__top {
      padding: 8px 10px;
      border-bottom: 1px solid var(--x-border);
      max-width: 100%;
      box-sizing: border-box;
    }

    .room-filter-panel__header-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 6px;
    }

    .room-filter-panel__header-row h4 {
      margin: 0;
      font-size: 1em;
      color: var(--x-text-primary);
    }

    .room-filter-panel__controls {
      display: flex;
      gap: 6px;
    }

    .room-filter-panel__controls .btn {
      flex: 1;
      padding: 6px 12px;
      font-size: 13px;
    }

    .room-filter-panel__body {
      padding: 8px 10px;
      width: 100%;
      max-width: 100%;
      box-sizing: border-box;
    }

    #roomFilterContent {
      width: 100%;
      max-width: 100%;
      box-sizing: border-box;
    }

    #roomFilterContent .room-filter-table {
      width: 100%;
    }

    #roomFilterContent .room-filter-table--compare {
      width: 100%;
      table-layout: fixed;
    }

    #roomFilterContent .room-filter-table--compare .room-filter-table__col-tier {
      width: 46%;
    }

    #roomFilterContent .room-filter-table--compare .room-filter-table__col-num {
      width: 18%;
    }

    .prop-selector-panel__actions .btn {
      font-size: 13px;
      padding: 6px 14px;
    }

    .ui-btn.btn-success {
      background: var(--x-success);
      border-color: var(--x-success);
      color: #fff;
    }

    .ui-btn.btn-success:hover {
      filter: brightness(1.08);
      background: var(--x-success);
      border-color: var(--x-success);
    }

    .ui-btn.btn-danger {
      background: var(--x-error);
      border-color: var(--x-error);
      color: #fff;
    }

    .ui-btn.btn-danger:hover {
      filter: brightness(1.08);
      background: var(--x-error);
      border-color: var(--x-error);
    }

    .terminal-live-stats {
      margin: 8px 0 0;
    }

    .terminal-index-live {
      display: none;
      margin-bottom: 12px;
    }

    #selectedCount {
      font-weight: normal;
      color: var(--x-text-secondary);
    }

    .room-filter-panel__overlay-hint {
      font-size: 0.85em;
      color: var(--x-text-secondary);
      padding: 8px 15px 12px;
      margin: 0;
      line-height: 1.35;
      border-top: 1px solid var(--x-border);
    }

    .room-filter-table {
      border-collapse: collapse;
      font-size: 0.88em;
    }

    .room-filter-table th {
      text-align: left;
      font-weight: 600;
      color: var(--ui-text-muted);
      padding: 4px 6px;
      border-bottom: 1px solid var(--ui-border-color);
    }

    .room-filter-table__group[data-room-key] {
      cursor: pointer;
    }

    .room-filter-table__group td {
      transition: background-color 0.12s ease, border-color 0.12s ease;
    }

    .room-filter-table__room-row td {
      padding-top: 10px;
      vertical-align: top;
    }

    .room-filter-table__group--chart-hover td,
    .room-filter-table__group--solo td {
      border-color: transparent;
    }

    .room-filter-table__group--chart-hover .room-filter-table__rate-row td {
      border-bottom-color: transparent;
    }

    .room-filter-table__group--solo .room-filter-table__rate-row td {
      border-bottom-color: transparent;
    }

    /* Terminal sort buttons */
    .terminal-sort-btn {
      background: transparent;
      border: none;
      color: var(--x-text-secondary);
      cursor: pointer;
      font-family: inherit;
      font-size: inherit;
      font-weight: 600;
      padding: 0;
      text-align: left;
      transition: color 0.15s ease;
    }

    .terminal-sort-btn:hover {
      color: var(--x-text-primary);
    }

    .terminal-sort-btn--asc::after {
      content: ' ▲';
      color: var(--x-accent);
    }

    .terminal-sort-btn--desc::after {
      content: ' ▼';
      color: var(--x-accent);
    }

    .room-filter-table__group--chart-hover td {
      background-color: color-mix(in srgb, var(--room-series-color, var(--x-accent)) 14%, transparent);
    }

    .room-filter-table__group--chart-hover tr:first-child td {
      border-top: 2px solid var(--room-series-color, var(--x-accent));
    }

    .room-filter-table__group--chart-hover tr:last-child td {
      border-bottom: 2px solid var(--room-series-color, var(--x-accent));
    }

    .room-filter-table__group--chart-hover td:first-child {
      border-left: 2px solid var(--room-series-color, var(--x-accent));
    }

    .room-filter-table__group--chart-hover td:last-child {
      border-right: 2px solid var(--room-series-color, var(--x-accent));
    }

    .room-filter-table__group--solo td {
      background: color-mix(in srgb, var(--room-series-color, var(--x-accent)) 8%, transparent);
    }

    .room-filter-table__group--solo tr:first-child td {
      border-top: 2px solid var(--room-series-color, var(--x-accent));
    }

    .room-filter-table__group--solo tr:last-child td {
      border-bottom: 2px solid var(--room-series-color, var(--x-accent));
    }

    .room-filter-table__group--solo td:first-child {
      border-left: 2px solid var(--room-series-color, var(--x-accent));
    }

    .room-filter-table__group--solo td:last-child {
      border-right: 2px solid var(--room-series-color, var(--x-accent));
    }

    .room-filter-table__group--solo.room-filter-table__group--chart-hover td {
      background-color: color-mix(in srgb, var(--room-series-color, var(--x-accent)) 16%, transparent);
    }

    .room-filter-table input.room-filter-table__series-cb {
      appearance: none;
      -webkit-appearance: none;
      width: 15px;
      height: 15px;
      margin: 0;
      border: 2px solid var(--room-series-color, var(--x-accent));
      border-radius: 3px;
      background: color-mix(in srgb, var(--room-series-color, var(--x-accent)) 16%, transparent);
      vertical-align: middle;
      cursor: pointer;
      flex-shrink: 0;
    }

    .room-filter-table input.room-filter-table__series-cb:checked {
      background-color: var(--room-series-color, var(--x-accent));
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 5 8.7 9.5 3.8' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
      background-size: 11px;
      background-position: center;
      background-repeat: no-repeat;
    }

    .room-filter-table input.room-filter-table__series-cb--light {
      border-color: color-mix(in srgb, var(--room-series-color) 70%, #ffffff);
    }

    .room-filter-table input.room-filter-table__series-cb--light:checked {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 5 8.7 9.5 3.8' fill='none' stroke='%23111827' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    }

    .room-filter-table__room-name label {
      font-weight: 600;
      cursor: pointer;
    }

    .room-filter-table__room-line {
      align-items: center;
      gap: 8px;
      width: 100%;
    }

    .room-filter-table__room-inventory {
      flex-shrink: 0;
      margin-left: auto;
      font-variant-numeric: tabular-nums;
      font-weight: 400;
      min-width: 2.25em;
      text-align: right;
    }

    .room-filter-table__room-title {
      flex: 1;
      min-width: 0;
      display: inline;
      font-weight: 400;
    }


    .room-filter-table__room-row input.room-filter-table__room-cb {
      position: absolute;
      width: 1px;
      height: 1px;
      margin: -1px;
      padding: 0;
      border: 0;
      clip: rect(0, 0, 0, 0);
      overflow: hidden;
      white-space: nowrap;
    }

    .room-filter-table__room-change {
      font-weight: 600;
    }

    .room-filter-table__room-change--sold {
      color: var(--x-success);
    }

    .room-filter-table__room-change--canceled {
      color: var(--x-error);
    }

    .room-filter-table__beds {
      font-size: 0.95em;
      color: var(--ui-text-muted);
      margin-top: 2px;
    }

    .room-filter-table__meta {
      font-weight: 400;
      color: var(--ui-text-muted);
    }

    .room-filter-table__meta-badge--overlay-only {
      font-size: 0.85em;
      font-weight: 600;
      color: var(--ui-text-muted);
      font-style: italic;
    }

    .room-filter-table__rate-row td {
      padding: 2px 6px;
      color: var(--ui-text-muted);
      border-bottom: 1px solid rgba(128, 128, 128, 0.15);
    }

    .room-filter-table__tier-line {
      display: flex;
      align-items: flex-start;
      gap: 6px;
      min-width: 0;
    }

    .room-filter-table__tier-line input.room-filter-table__series-cb {
      margin-top: 2px;
    }

    .room-filter-table__tier-cell {
      padding-right: 8px;
      vertical-align: top;
    }

    .room-filter-table__rate-guest {
      line-height: 1.25;
      white-space: nowrap;
    }

    .room-filter-table__rate-price--overlay {
      color: #c4b5fd;
    }

    .room-filter-table__rate-price--carried {
      color: var(--x-text-muted);
      font-style: italic;
    }

    .room-filter-table__delta {
      font-size: 0.95em;
      white-space: nowrap;
    }

    .room-filter-table__rate-price {
      color: var(--x-accent);
      white-space: nowrap;
    }

    .room-filter-table__facilities {
      font-size: 0.95em;
      color: var(--x-text-muted);
      padding: 0 6px 8px 21px !important;
    }

    .room-filter-index-row {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      padding: 8px 0;
      border-bottom: 1px solid var(--ui-border-color);
    }

    /* PROPERTY tab comparison table (delta view for two runs/dates) */
    .room-filter-table--compare th,
    .room-filter-table--compare td {
      padding: 2px 4px;
      vertical-align: top;
    }
    .room-filter-table--compare th {
      line-height: 1.2;
      font-size: 0.82em;
    }
    .room-filter-table--compare .room-filter-table__th-label,
    .room-filter-table--compare .room-filter-table__th-sub {
      display: block;
      white-space: nowrap;
    }
    .room-filter-table--compare .room-filter-table__th-tier {
      text-align: left;
      padding-right: 8px;
      white-space: nowrap;
    }

    .room-filter-table--compare .room-filter-table__room-row td {
      padding-top: 5px;
      padding-bottom: 4px;
      vertical-align: middle;
    }

    .room-filter-table--compare .room-filter-table__room-row .room-filter-table__room-name {
      padding-top: 8px;
      padding-bottom: 2px;
    }

    .room-filter-table--compare .room-filter-table__room-line {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      gap: 8px;
      width: 100%;
    }

    .room-filter-table--compare .room-filter-table__room-title {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: baseline;
      gap: 6px;
      font-weight: 600;
    }

    .room-filter-table--compare .room-filter-table__room-title-text {
      text-align: left;
      min-width: 0;
    }

    .room-filter-table--compare .room-filter-table__room-inventory {
      flex-shrink: 0;
      margin-left: 8px;
      white-space: nowrap;
      font-variant-numeric: tabular-nums;
    }

    .room-filter-table--compare .room-filter-table__rate-row .room-filter-table__tier-line {
      align-items: center;
    }

    .room-filter-table--compare .room-filter-table__group tr:last-child td {
      padding-bottom: 5px;
    }
    .room-filter-table--compare .room-filter-table__th-num {
      text-align: right;
      padding-left: 6px;
    }
    .room-filter-table--compare .room-filter-table__th-sub {
      font-weight: 400;
      opacity: 0.85;
      font-size: 0.92em;
      margin-top: 2px;
    }
    .room-filter-table--compare .room-filter-table__rate-price,
    .room-filter-table--compare .room-filter-table__delta {
      white-space: nowrap;
      text-align: right;
      font-variant-numeric: tabular-nums;
      padding-left: 6px;
    }
    .room-filter-table--compare .room-filter-table__rate-price {
      font-size: 0.98em;
    }
    .delta-up { color: var(--x-success); font-weight: 600; }
    .delta-down { color: var(--x-error); font-weight: 600; }

    /* Wide panel for dual booking control display */
    #detailsPanel.dual-display {
      width: 700px;
      left: -702px;
    }

    .property-selector-dropdown,
    #propPropertySelectorPanel,
    #selectorPanel {
      display: none;
      position: fixed;
      z-index: 1200;
      width: min(420px, 92vw);
      overflow: hidden;
      background: var(--x-bg-elevated);
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
      flex-direction: column;
    }

    #selectorPanel {
      max-height: min(62vh, 540px);
    }

    #propPropertySelectorPanel,
    #selectorPanel {
      height: auto;
      max-height: none;
    }

    .property-selector-dropdown.open,
    #propPropertySelectorPanel.open,
    #selectorPanel.open {
      display: flex;
    }

    #showSelectorBtn[aria-expanded="true"],
    #propPropertySelectorBtn[aria-expanded="true"] {
      border-color: var(--ui-primary);
      box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.22);
    }

    .property-selector-dropdown__section {
      padding: 0 14px 8px;
      background: rgba(28, 38, 52, 0.65);
      min-height: 0;
    }

    .property-selector-dropdown__section--selected {
      padding: 0 14px 8px;
      border-bottom: 1px solid var(--ui-border-color);
    }

    .property-selector-dropdown__heading {
      margin: 6px 0 0;
      font-size: 0.78em;
      font-weight: 600;
      color: var(--ui-text-muted);
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }

    .property-selector-dropdown__list {
      overflow-y: auto;
      max-height: 16vh;
      min-height: 2.5em;
      padding: 2px 0;
    }

    #propPropertySelectorPanel .property-selector-dropdown__list,
    #selectorPanel .property-selector-dropdown__list {
      max-height: 400px;
      overflow-y: auto;
    }

    #propPropertySelectorPanel .prop-selector-panel__body,
    #selectorPanel .prop-selector-panel__body {
      flex: 1 1 auto;
      min-height: 0;
      overflow-y: visible;
      display: flex;
      flex-direction: column;
    }

    #propPropertySelectorPanel.prop-selector-panel--constrained,
    #selectorPanel.prop-selector-panel--constrained {
      overflow: hidden;
    }

    #propPropertySelectorPanel.prop-selector-panel--constrained .prop-selector-panel__body,
    #selectorPanel.prop-selector-panel--constrained .prop-selector-panel__body {
      overflow-y: auto;
    }

    .property-selector-dropdown__empty {
      margin: 0;
      padding: 4px 0 6px;
      color: var(--ui-text-muted);
      font-size: 0.82em;
      line-height: 1.35;
    }

    .panel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 10px 12px;
      background: var(--x-bg-secondary);
      border-bottom: 1px solid var(--x-border);
      font-weight: 600;
      color: var(--x-text-primary);
      text-align: center;
      font-size: 1em;
      position: sticky;
      top: 0;
      z-index: 100;
    }

    .panel-close {
      background: none;
      border: none;
      font-size: 1.2em;
      cursor: pointer;
      color: var(--x-text-secondary);
      padding: 4px 8px;
      width: 28px;
      height: 28px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: var(--ui-radius-pill);
      transition: background 0.2s ease, color 0.2s ease;
      font-weight: 500;
    }

    .panel-close:hover {
      background: var(--x-bg-secondary);
      color: var(--x-text-primary);
      transform: none;
      box-shadow: none;
    }

    .panel-content {
      padding: 0;
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    /* === CARD-STYLE COLLECTIONS === */
    .collections-card-container {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
      justify-content: flex-start;
      margin-top: 8px;
    }

    /* === COMPACT SCROLLABLE COLLECTIONS (Single large bubble) === */
    .collections-scroll {
      display: flex;
      gap: 12px;
      overflow-x: auto;
      padding: 12px;
      scrollbar-width: thin;
      scrollbar-color: #475569 transparent;
      margin-top: 4px;
      align-items: flex-start;
      justify-content: flex-start;
      width: 100%;
      background: var(--ui-bg-muted);
      border-radius: 10px;
      box-shadow: var(--ui-shadow);
    }

    .collections-scroll::-webkit-scrollbar {
      height: 6px;
    }

    .collections-scroll::-webkit-scrollbar-track {
      background: var(--ui-bg-subtle);
      border-radius: 3px;
    }

    .collections-scroll::-webkit-scrollbar-thumb {
      background: #475569;
      border-radius: 3px;
    }

    .adult-card {
      background: var(--x-bg-secondary);
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
      padding: 12px;
      min-width: 110px;
      box-shadow: none;
      transition: background 0.2s ease, border-color 0.2s ease;
    }

    .adult-card:hover {
      box-shadow: none;
      transform: none;
      border-color: var(--x-border-light);
    }

    .adult-card-header {
      font-weight: 600;
      color: var(--ui-text);
      font-size: 13px;
      margin-bottom: 10px;
      text-align: center;
      padding-bottom: 6px;
      border-bottom: none;
    }

    .adult-card-compact {
      background: transparent;
      border: none;
      border-radius: 0;
      padding: 0;
      min-width: auto;
      max-width: none;
      box-shadow: none;
      flex-shrink: 0;
      font-size: 12px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
      text-align: left;
    }

    .adult-card-header-compact {
      font-weight: 600;
      color: var(--ui-text-muted);
      text-align: left;
      margin-bottom: 4px;
      font-size: var(--ui-font-size-sm);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      width: 100%;
    }

    .nights-list {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .nights-list-compact {
      display: flex;
      flex-direction: column;
      gap: 2px;
      align-items: flex-start;
      width: 100%;
    }

    .night-item {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      white-space: nowrap;
    }

    .night-item-compact {
      display: flex;
      align-items: center;
      gap: 4px;
      white-space: nowrap;
      justify-content: flex-start;
      width: 100%;
      padding: 2px 0;
    }

    .night-item input[type="checkbox"] {
      margin: 0;
      accent-color: var(--ui-primary);
      width: 15px;
      height: 15px;
    }

    .night-item-compact input[type="checkbox"] {
      margin: 0;
      accent-color: var(--ui-primary);
      width: 12px;
      height: 12px;
    }

    .night-item label {
      margin: 0;
      cursor: pointer;
      color: var(--ui-link);
      font-weight: 500;
      font-size: 12px;
    }

    .night-item-compact label {
      margin: 0;
      cursor: pointer;
      color: var(--ui-text);
      font-weight: 600;
      font-size: var(--ui-font-size-sm);
      line-height: 1;
    }

    .night-item-compact:has(input:checked) {
      background: var(--ui-primary-soft);
      border-radius: var(--ui-radius-sm);
      padding: 2px 6px;
      margin: 0 -6px;
    }

    .night-item-compact:has(input:checked) label {
      color: var(--ui-primary);
    }

    .night-item-compact input[type="checkbox"] {
      accent-color: var(--ui-primary);
    }

    #collections,
    #collectionsOverlay {
      margin-top: 2px;
      display: flex;
      gap: 6px;
      align-items: flex-start;
      justify-content: flex-start;
      width: 100%;
    }

    .detail-item {
      padding: 8px 10px !important;
      margin-bottom: 0px !important;
      border: none !important;
      border-radius: 6px !important;
      background: var(--ui-bg-muted) !important;
    }

    .detail-item a {
      color: var(--ui-link);
      text-decoration: none;
      font-weight: 600;
    }

    .detail-item a:hover {
      text-decoration: underline;
    }

    .detail-price {
      color: var(--x-error);
      font-weight: 500;
    }

    /* Selector Panel */
    .selector-section {
      background: var(--x-bg-secondary);
      padding: 12px;
      border-radius: var(--ui-radius);
      border: 1px solid var(--x-border);
      margin-bottom: 16px;
    }

    .selector-section h4 {
      margin: 0 0 8px 0;
      font-size: 16px;
      color: var(--ui-text);
      font-weight: 600;
    }

    .selector-item {
      display: flex;
      align-items: center;
      padding: 8px 10px;
      border-radius: 6px;
      background: var(--ui-bg-elevated);
      cursor: pointer;
      user-select: none;
      font-size: 14px;
      transition: all 0.2s;
      margin-bottom: 4px;
      border: none;
      color: var(--ui-text);
    }

    .selector-item:hover {
      background: var(--ui-primary-soft);
      border-color: var(--ui-primary);
    }

    .selector-item input[type="checkbox"] {
      margin-right: 10px;
      accent-color: var(--ui-primary);
    }

    .selector-item label {
      flex: 1;
      margin: 0;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    /* Search — legacy selector-item styles kept for compatibility */
    /* REMOVE the old #showSelectorBtn block — it conflicted with .ctrl-btn styles */

    /* Button (removed duplicate #showSelectorBtn styles to prevent conflicts)
    #showSelectorBtn {
      padding: 10px 18px;
      background: var(--x-accent);
      color: white;
      border: none;
      border-radius: 6px;
      cursor: pointer;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 12px;
      box-shadow: 0 2px 6px rgba(0, 102, 204, 0.2);
    }

    #showSelectorBtn:hover {
      background: #0055aa;
      transform: translateY(-1px);
      box-shadow: 0 4px 12px rgba(0, 102, 204, 0.3);
    }
    */

    .detail-item {
      background: var(--x-bg-secondary);
      padding: 6px 8px;
      border-radius: var(--ui-radius-sm);
      border: 1px solid var(--x-border);
      margin: 0;
      box-shadow: none;
      line-height: 1.12;
      color: var(--x-text-primary);
    }

    /* Make items stretch edge-to-edge inside the panel */
    #detailsPanel { padding: 0; }
    #detailsPanel .panel-header { padding-left:8px; padding-right:8px; }
    #detailsPanel .panel-header-controls {
      display: flex;
      align-items: center;
      gap: 2px;
      flex-wrap: nowrap;
      flex: 1;
      min-width: 0;
    }
    #detailsPanel .details-panel-chip {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 4px;
      font-size: 0.85em;
      font-weight: 600;
      font-family: inherit;
      color: var(--ui-text-muted);
      background: var(--ui-bg-subtle);
      border: 1px solid var(--ui-border-color);
      padding: 3px 10px;
      border-radius: 4px;
      flex-shrink: 0;
      line-height: 1.3;
      transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
    }
    #detailsPanel .details-panel-chip:hover {
      background: var(--ui-bg-elevated);
      color: var(--ui-text);
      border-color: var(--ui-primary);
    }
    #detailsPanel .details-panel-chip--nav {
      min-width: 32px;
      padding: 3px 8px;
      font-size: 1em;
    }
    #detailsPanel .details-panel-chip--sort {
      cursor: pointer;
      user-select: none;
    }
    #detailsPanel .details-panel-chip--sort .sort-arrow {
      font-size: 0.95em;
      color: var(--ui-primary);
    }
    #detailsPanel .details-panel-date-link {
      min-width: 140px;
      text-align: center;
      color: var(--ui-link);
      text-decoration: none;
      font-weight: 600;
      flex-shrink: 0;
    }
    #detailsPanel .details-panel-date-link:hover {
      text-decoration: underline;
    }
    #detailsPanel .details-property-row {
      transition: background-color 0.12s ease;
    }
    #detailsPanel .details-property-row--chart-hover {
      position: relative;
      z-index: 1;
      box-shadow: none !important;
      background-color: var(--ui-primary-soft) !important;
      outline: 2px solid var(--x-accent);
      outline-offset: -2px;
    }

    #detailsPanel .details-property-row--extended {
      border-left-width: 4px;
      border-left-color: var(--x-accent);
    }

    .price-detail-popover {
      position: fixed;
      z-index: 10050;
      min-width: 240px;
      max-width: 320px;
      padding: 0;
      border-radius: var(--ui-radius);
      border: 1px solid var(--x-border);
      background: var(--x-bg-elevated);
      box-shadow: none;
      pointer-events: none;
      opacity: 0;
      transform: translateY(4px);
      transition: opacity 0.14s ease, transform 0.14s ease;
      overflow: hidden;
    }
    .price-detail-popover.is-visible {
      opacity: 1;
      transform: translateY(0);
    }
    .price-detail-popover__header {
      padding: 10px 12px 8px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.08);
      background: rgba(0, 0, 0, 0.22);
      font-weight: 600;
      font-size: 0.9em;
      color: var(--ui-text);
      line-height: 1.3;
    }
    .price-detail-popover__body {
      padding: 8px 12px 10px;
      font-size: 0.82em;
      color: var(--ui-text-muted);
      background: rgba(0, 0, 0, 0.12);
    }
    .price-detail-popover__row {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      gap: 12px;
      padding: 5px 8px;
      margin: 0 -8px;
      border-radius: 4px;
    }
    .price-detail-popover__row:nth-child(even) {
      background: rgba(255, 255, 255, 0.03);
    }
    .price-detail-popover__row--headline {
      margin-top: 2px;
      margin-bottom: 2px;
      padding: 7px 8px;
      background: rgba(248, 113, 113, 0.1);
      border: 1px solid rgba(248, 113, 113, 0.18);
      border-radius: 6px;
    }
    .price-detail-popover__row--headline .price-detail-popover__value {
      font-size: 1.15em;
      font-weight: 700;
      color: var(--ui-danger);
    }
    .price-detail-popover__label {
      flex-shrink: 0;
      color: var(--ui-text-dim);
    }
    .price-detail-popover__value {
      text-align: right;
      color: var(--ui-text);
    }
    .price-detail-popover__value--strike {
      text-decoration: line-through;
      color: var(--ui-text-muted);
    }
    .price-detail-popover__value--save {
      color: var(--x-success);
      font-weight: 600;
    }
    .price-detail-popover__chips {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      padding: 8px 0 4px;
      margin-top: 4px;
      border-top: 1px solid rgba(255, 255, 255, 0.06);
    }
    .price-detail-popover__chip {
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 0.72em;
      font-weight: 600;
      line-height: 1.4;
    }
    .price-detail-popover__chip--genius {
      background: rgba(0, 76, 184, 0.35);
      color: var(--x-accent);
    }
    .price-detail-popover__chip--deal {
      background: rgba(255, 173, 31, 0.15);
      color: var(--x-warning);
    }
    .price-detail-popover__chip--featured {
      background: rgba(168, 85, 247, 0.2);
      color: #d8b4fe;
    }
    .price-detail-popover__chip--preferred {
      background: rgba(34, 197, 94, 0.2);
      color: var(--x-success);
    }
    .price-detail-popover__chip--new {
      background: rgba(29, 161, 242, 0.15);
      color: var(--x-accent);
    }
    .price-detail-popover__rooms {
      margin-top: 8px;
      padding: 8px 8px 4px;
      border-top: 1px solid rgba(255, 255, 255, 0.08);
      background: rgba(0, 0, 0, 0.18);
      border-radius: 6px;
      line-height: 1.45;
      color: var(--ui-text);
    }
    .price-detail-popover__rooms-title {
      font-size: 0.72em;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.04em;
      color: var(--ui-text-dim);
      margin-bottom: 4px;
    }

    #panelContent,
    #overlayPanelContent {
      color: var(--ui-text);
    }

    /* Dual column layout for booking controls */
    .dual-column-container {
      display: flex;
      gap: 0;
      height: 100%;
    }

    .dual-column {
      flex: 1;
      display: flex;
      flex-direction: column;
    }

    .dual-column:last-child {
      border-right: none;
    }

    .dual-column-header {
      padding: 12px;
      background: var(--ui-bg-muted);
      border-bottom: var(--ui-border);
      font-weight: 600;
      color: var(--ui-text);
      text-align: center;
      font-size: 0.9em;
    }

    .dual-column-content {
      flex: 1;
      overflow-y: auto;
      padding: 0;
    }

    .detail-item a {
      color: var(--ui-link);
      text-decoration: none;
      font-weight: 600;
    }

    .detail-item a:hover {
      text-decoration: underline;
    }

    .detail-price {
      color: var(--ui-danger);
      font-weight: 500;
      font-size: 0.95em;
    }

    /* === CRITICAL FIX: WRAPPERS === */
    #bookingChartWrapper,
    #chartWrapper {
      transition: margin-left 0.3s ease, margin-right 0.3s ease;
    }

    #bookingChartWrapper {
      margin-left: 0;
    }

    #chartWrapper {
      margin-left: 0;
      margin-right: 0;
    }

    /* NEW: unified top controls and refined button styles */
    .top-controls {
      display: flex;
      gap: 10px;
      align-items: center;
      justify-content: center;
      margin-bottom: 20px;
      flex-wrap: wrap;
    }

    .ctrl-select,
    .ctrl-btn {
      font-family: inherit;
      font-size: 15px;
      line-height: 1.4;
    }

    .ctrl-select {
      padding: 8px 12px;
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius-pill);
      min-width: 90px;
      max-width: 180px;
      width: auto;
      height: 38px;
      background: var(--x-bg-secondary);
      color: var(--x-text-primary);
      -webkit-appearance: none;
      appearance: none;
      font-size: 15px;
    }

    /* ctrl-btn base defined above — duplicate block removed */

    /* tighten selected count spacing (keeps numeric badge readable) */
    #selectedBtnCount { margin-left: 6px; font-weight:700; color:inherit; }

    /* Booking tab compact controls */
    .booking-controls {
      display:flex;
      gap:12px;
      align-items:center;
      flex-wrap:wrap;
      margin-bottom:12px;
    }
    .booking-controls .ctrl-select {
      padding:8px 10px;
      border: none;
      border-radius:6px;
      height:36px;
      font-size:14px;
      -webkit-appearance:none;
      appearance:none;
      min-width:120px;
    }
    .collections-area { margin-top:8px; }

    /* ====================== NEW STYLES ====================== */
    /* ========== INVENTORY TAB — compact dashboard ========== */
    #BookingData.tabcontent {
      margin: 12px 16px 16px;
      padding: 0;
      border: none;
      background: transparent;
      box-shadow: none;
    }

    .booking-panel {
      display: flex;
      flex-direction: column;
      gap: 8px;
      width: 100%;
    }

    /* Top command strip */
    .booking-toolbar {
      display: grid;
      grid-template-columns: auto auto 1fr auto;
      align-items: center;
      gap: 12px 16px;
      padding: 10px 14px;
      background: var(--ui-bg);
      border: var(--ui-border);
      border-radius: var(--ui-radius);
      box-shadow: var(--ui-shadow);
    }

    .booking-toolbar-nav {
      display: flex;
      align-items: center;
      gap: 4px;
    }

    .booking-toolbar-nav .ui-btn {
      height: 32px;
      padding: 0 10px;
      font-size: var(--ui-font-size-sm);
    }

    .booking-toolbar-group {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }

    .booking-toolbar-group--grow {
      justify-content: flex-end;
      min-width: 120px;
    }

    .booking-toolbar-label {
      font-size: 10px;
      font-weight: 700;
      color: var(--ui-text-muted);
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }

    /* (comparePropSelect rule moved to prop variant in Property tab; old ID removed) */

    /* Dual date + collection lanes */
    .booking-compare-lanes {
      display: flex;
      flex-direction: column;
      background: var(--ui-bg);
      border: var(--ui-border);
      border-radius: var(--ui-radius);
      box-shadow: var(--ui-shadow);
      overflow: hidden;
    }

    .compare-lane {
      display: grid;
      grid-template-columns: minmax(140px, auto) 1fr;
      align-items: center;
      gap: 12px;
      padding: 8px 12px;
      min-height: 48px;
    }

    .compare-lane + .compare-lane {
      border-top: var(--ui-border);
    }

    .compare-lane--overlay {
      background: var(--ui-bg-muted);
    }

    .compare-lane__tag {
      display: none;
    }

    .compare-lane__tag strong {
      display: block;
      font-size: 11px;
      color: var(--ui-text);
      font-weight: 700;
      letter-spacing: 0;
      text-transform: none;
      margin-top: 2px;
    }

    .compare-lane__date {
      display: flex;
      align-items: center;
      gap: 4px;
    }

    .compare-lane__date .ui-select {
      width: 132px;
      min-width: 132px;
      max-width: 132px;
      height: 32px;
      font-variant-numeric: tabular-nums;
      font-weight: 600;
    }

    .icon-btn {
      width: 28px;
      height: 28px;
      padding: 0;
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius-pill);
      background: var(--x-bg-secondary);
      color: var(--x-text-secondary);
      font-size: 11px;
      font-weight: 700;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: background 0.12s, color 0.12s, border-color 0.12s;
    }

    .icon-btn:hover {
      background: var(--x-bg-elevated);
      color: var(--x-text-primary);
      border-color: var(--x-border-light);
    }

    #BookingData .collections-area {
      margin: 0;
      min-height: 0;
      border: none;
      background: transparent;
      overflow: visible;
    }

    #BookingData .collections-scroll {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      align-items: center;
      gap: 4px;
      padding: 0;
      margin: 0;
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      overflow-x: auto;
      max-height: none;
    }

    #BookingData .collection-group-sep {
      color: var(--ui-text-dim);
      font-size: 14px;
      font-weight: 300;
      padding: 0 4px;
      user-select: none;
      flex-shrink: 0;
    }

    #BookingData .night-item-compact {
      padding: 0;
      margin: 0;
      width: auto;
    }

    #BookingData .night-item-compact input[type="checkbox"] {
      position: absolute;
      opacity: 0;
      width: 0;
      height: 0;
      pointer-events: none;
    }

    #BookingData .night-item-compact label {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 36px;
      height: 14px;
      padding: 0 10px;
      font-variant-numeric: tabular-nums;
      border-radius: 999px;
      border: 1px solid rgba(var(--coll-rgb, 100, 116, 139), calc(var(--coll-alpha, 1) * 0.35));
      background: var(--ui-bg);
      font-size: 11px;
      font-weight: 700;
      color: var(--ui-text-muted);
      cursor: pointer;
      transition: background 0.12s, color 0.12s, border-color 0.12s, box-shadow 0.12s;
    }

    #BookingData .night-item-compact label:hover {
      border-color: rgba(var(--coll-rgb, 37, 99, 235), var(--coll-alpha, 1));
      color: rgb(var(--coll-rgb, 30, 41, 59));
    }

    #BookingData .night-item-compact:has(input:checked) {
      background: transparent;
      padding: 0;
      margin: 0;
    }

    #BookingData .night-item-compact:has(input:checked) label {
      background: rgba(var(--coll-rgb, 37, 99, 235), var(--coll-alpha, 1));
      border-color: rgba(var(--coll-rgb, 37, 99, 235), var(--coll-alpha, 1));
      color: #fff;
      box-shadow: 0 1px 3px rgba(var(--coll-rgb, 0, 0, 0), calc(var(--coll-alpha, 1) * 0.35));
    }

    #BookingData #bookingChartWrapper {
      margin-top: 4px;
    }

    #BookingData .chart-wrapper {
      height: min(72vh, 780px);
    }

    @media (max-width: 900px) {
      .booking-toolbar {
        grid-template-columns: 1fr 1fr;
      }
      .booking-toolbar-group--grow {
        grid-column: 1 / -1;
      }
      .compare-lane {
        grid-template-columns: 56px 1fr;
        grid-template-rows: auto auto;
      }
      .compare-lane__date {
        grid-column: 2;
      }
      #BookingData .collections-area,
      #PropertyData .collections-area {
        grid-column: 1 / -1;
        overflow-x: auto;
      }
    }

    /* End booking tab styles */

    /* Property tab — reuses .booking-* classes for toolbar/lanes, independent IDs and chart */
    #PropertyData.tabcontent {
      margin: 1px 1px 1px;
      padding: 0;
      border: none;
      background: transparent;
      box-shadow: none;
      font-size: 15px;
    }

    .prop-portfolio-lane-inset {
      box-sizing: border-box;
      margin-left: 1px;
      margin-right: 1px;
      width: calc(100% - 40px);
      max-width: calc(100% - 40px);
    }

    .prop-portfolio-table-wrap {
      max-width: 100%;
      min-width: 0;
      overflow: hidden;
    }

    .prop-portfolio-table-wrap .prop-portfolio-table {
      width: 100%;
      max-width: 100%;
    }

    /* Increase text size in PROPERTY tab tables and content */
    #PropertyData .prop-portfolio-table {
      font-size: 0.95em;
      box-sizing: border-box;
    }

    #PropertyData .prop-portfolio-table th {
      font-size: 0.85em;
    }

    #PropertyData .prop-portfolio-filter-hint {
      font-size: 0.95em;
    }

    #PropertyData button:not(.prop-portfolio-sort),
    #PropertyData label {
      font-size: 0.95em;
    }

    /* PROPERTY tab — compact toolbar (flat controls in header panel) */
    .booking-panel--property.booking-toolbar--property {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 10px 14px;
    }

    .booking-panel--property .prop-date-select {
      width: 132px;
      min-width: 132px;
      max-width: 132px;
      height: 32px;
      font-variant-numeric: tabular-nums;
      font-weight: 600;
    }

    .booking-panel--property .prop-date-select--overlay {
      opacity: 0.95;
    }

    .booking-panel--property .prop-toolbar__properties {
      margin-left: auto;
    }

    .booking-panel--property .ui-btn--both-dates {
      color: #d32f2f;
      border-color: rgba(211, 47, 47, 0.55);
    }

    .booking-panel--property .ui-btn--both-dates:hover {
      color: #fff;
      background: #d32f2f;
      border-color: #d32f2f;
    }

    /* Single dataset (1 adult / 1 night): pills hidden; checkboxes still populate for API */
    #PropertyData .booking-collections-row {
      display: none !important;
    }

    #PropertyData .booking-collections-group .collections-area {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
      min-height: 0;
    }

    #propPropertySelectorBtn {
      flex: 0 1 auto;
      min-width: 160px;
      max-width: 280px;
      text-align: left;
    }

    .prop-selector-panel__header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
      padding: 10px 14px;
      border-bottom: 1px solid var(--x-border);
      font-size: 0.9em;
      font-weight: 600;
      background: var(--x-bg-secondary);
      flex-shrink: 0;
    }

    .prop-selector-panel__toolbar {
      display: flex;
      align-items: center;
      gap: 8px;
      flex: 1;
      min-width: 0;
    }

    .prop-selector-panel__toolbar .prop-selector-panel__search {
      flex: 1;
      min-width: 0;
      padding: 0;
      background: transparent;
      border: none;
    }

    .prop-selector-panel__toolbar .prop-selector-panel__search input {
      width: 100%;
      padding: 4px 8px;
      font-size: 0.8em;
      border: 1px solid var(--ui-border-color);
      border-radius: 3px;
      background: var(--x-bg-secondary);
      color: var(--x-text-primary);
    }

    .prop-selector-panel__toolbar .prop-selector-panel__search input:focus {
      outline: none;
      border-color: var(--ui-primary);
      box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.25);
    }

    .prop-selector-panel__title {
      flex: 1;
      text-align: center;
      font-size: 0.95em;
      font-weight: 600;
      color: var(--x-text-primary);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .prop-selector-panel__toolbar .btn {
      flex: 0 0 auto;
      padding: 4px 10px;
      font-size: 0.8em;
      border-radius: 3px;
      border: none;
      cursor: pointer;
      white-space: nowrap;
    }

    .prop-selector-panel__actions {
      display: flex;
      gap: 6px;
      padding: 8px 14px;
      border-bottom: 1px solid var(--ui-border-color);
      background: rgba(28, 38, 52, 0.75);
    }

    .prop-selector-panel__search {
      padding: 8px 14px;
      background: rgba(28, 38, 52, 0.65);
      border-bottom: 1px solid var(--ui-border-color);
      flex-shrink: 0;
    }

    .prop-selector-panel__search-hint {
      padding: 4px 14px;
      background: rgba(28, 38, 52, 0.65);
      border-bottom: 1px solid var(--ui-border-color);
    }

    .prop-selector-kbd-hint {
      margin: 6px 0 0;
      font-size: 0.72em;
      color: var(--ui-text-muted);
      line-height: 1.3;
    }

    #propPropertySearch,
    #propertySearch {
      width: 100%;
      padding: 8px 10px;
      border: var(--ui-border);
      border-radius: 4px;
      font-size: 0.85em;
      background: var(--ui-bg-elevated);
      color: var(--ui-text);
      box-sizing: border-box;
    }

    #propPropertySearch:focus,
    #propertySearch:focus {
      outline: none;
      border-color: var(--ui-primary);
      box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.25);
    }

    .prop-selector-panel__actions button {
      flex: 1;
      padding: 4px 8px;
      font-size: 0.8em;
      border-radius: 3px;
      border: none;
      cursor: pointer;
    }

    .prop-selector-item {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 8px;
      margin: 2px 0;
      font-size: 0.85em;
      cursor: pointer;
      border-radius: 4px;
      border: 1px solid transparent;
      transition: background 0.1s ease, border-color 0.1s ease;
    }

    .prop-selector-item:hover,
    .prop-selector-item--active {
      background: rgba(59, 130, 246, 0.12);
      border-color: rgba(59, 130, 246, 0.35);
    }

    .prop-selector-item--selected span {
      font-weight: 600;
      color: var(--x-text-primary);
    }

    .prop-selector-item input[type="checkbox"] {
      flex-shrink: 0;
      margin: 0;
      pointer-events: none;
    }

    .prop-change-headline {
      margin: 0 0 12px;
      padding: 12px 14px;
      background: rgba(29, 161, 242, 0.08);
      border-left: 3px solid var(--x-accent);
      border-radius: var(--ui-radius-sm);
      font-size: 0.82em;
      line-height: 1.45;
      color: var(--x-text-primary);
    }

    .prop-change-headline strong {
      color: var(--x-accent);
    }

    .prop-chart-toolbar {
      font-size: 0.70em;
      color: var(--ui-text-muted);
      margin-bottom: 6px;
      padding: 0 4px;
    }

    .prop-change-summary {
      margin-top: 16px;
      padding: 12px 14px;
      background: var(--x-bg-secondary);
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
      font-size: 0.78em;
      max-width: 70ch;
    }

    .prop-change-summary h5 {
      margin: 0 0 8px;
      font-size: 0.75em;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      color: var(--ui-text-muted);
    }

    .prop-change-summary ul {
      margin: 0;
      padding-left: 18px;
      line-height: 1.5;
    }

    .prop-change-summary li {
      margin-bottom: 4px;
    }

    .prop-change-summary__focus {
      margin-left: 6px;
      font-size: 0.78em;
      color: var(--x-accent);
      cursor: pointer;
      text-decoration: underline;
      background: none;
      border: none;
      padding: 0;
    }

    .prop-portfolio-summary {
      margin-bottom: 16px;
      overflow-x: auto;
      max-width: 100%;
      box-sizing: border-box;
    }

    .prop-portfolio-chart-container {
      width: 100%;
      max-width: none;
      margin: 0;
    }

    .prop-portfolio-chart-wrapper {
      width: 100%;
      max-width: 100%;
      height: 220px;
    }

    .prop-portfolio-filtered {
      margin-top: 12px;
    }

    .prop-portfolio-focus-reset {
      margin-left: 8px;
      padding: 2px 12px;
      font-size: 0.9em;
      font-weight: 700;
      color: var(--x-bg-primary);
      background: var(--x-warning);
      border: none;
      border-radius: var(--ui-radius-pill);
      cursor: pointer;
      vertical-align: baseline;
    }

    .prop-portfolio-focus-reset:hover {
      filter: brightness(1.08);
    }

    .prop-portfolio-table--day-focus thead th {
      color: var(--x-warning);
    }

    .prop-portfolio-table--day-focus tbody tr.prop-portfolio-row--muted {
      opacity: 0.55;
    }

    .prop-portfolio-filter-hint {
      font-size: 0.82em;
      color: var(--ui-text-muted);
      margin: 0 0 8px;
      line-height: 1.4;
      font-weight: 600;
    }

    .prop-portfolio-table--filtered tbody tr {
      cursor: pointer;
    }

    @media (max-width: 900px) {
      .prop-portfolio-chart-container {
        width: 100%;
        max-width: none;
      }
    }

    .prop-portfolio-table {
      width: 100%;
      table-layout: fixed;
      border-collapse: collapse;
      font-size: 0.82em;
    }

    .prop-portfolio-table th,
    .prop-portfolio-table td {
      padding: 0 !important;
      text-align: left;
      border-bottom: 1px solid var(--ui-border-color);
      min-width: 0;
    }

    .prop-portfolio-table tbody tr.prop-portfolio-row td {
      padding: 3px 0 !important;
      line-height: 1.25;
      vertical-align: middle;
    }

    .prop-portfolio-table th:nth-child(n + 2),
    .prop-portfolio-table tbody tr.prop-portfolio-row td:nth-child(n + 2) {
      text-align: center;
    }

    .prop-portfolio-table th:nth-child(n + 2) .prop-portfolio-sort {
      display: flex;
      justify-content: center;
      width: 100%;
      text-align: center;
    }

    .prop-portfolio-table tbody tr {
      cursor: pointer;
    }

    .prop-portfolio-table tbody tr:hover,
    .prop-portfolio-table tbody tr.prop-portfolio-table__active {
      background: rgba(59, 130, 246, 0.12);
    }

    .prop-portfolio-chart-block .prop-chart-toolbar {
      font-size: 0.78em;
      line-height: 1.45;
    }

    .prop-portfolio-chart-block .prop-chart-toolbar strong {
      color: var(--ui-text);
    }

    .prop-portfolio-aggregate-strips {
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-width: 0;
    }

    .prop-portfolio-aggregate-strip-row {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 10px;
      min-width: 0;
    }

    .prop-portfolio-aggregate-strip-row:empty {
      display: none;
    }

    .prop-portfolio-aggregate-strip-row__label {
      font-size: 0.72em;
      font-weight: 600;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--ui-text-muted);
      white-space: nowrap;
    }

    .prop-portfolio-aggregate-strips .prop-portfolio-daystrip--expanded {
      opacity: 1;
      margin: 0;
      min-width: 0;
      max-width: 100%;
    }

    .prop-portfolio-aggregate-strips .prop-portfolio-daystrip__day--out-of-range {
      opacity: 1;
      background: rgba(255, 255, 255, 0.06);
    }

    .prop-portfolio-table th {
      font-size: 0.75em;
      font-weight: 600;
      color: var(--ui-text-muted);
      white-space: nowrap;
    }

    .prop-portfolio-sort {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 0;
      border: none;
      background: none;
      color: inherit;
      font: inherit;
      font-weight: 600;
      cursor: pointer;
      text-align: left;
    }

    .prop-portfolio-sort:hover {
      color: var(--ui-text);
    }

    .prop-portfolio-sort__indicator {
      font-size: 0.85em;
      opacity: 0.9;
      min-width: 0.85em;
    }

    .prop-portfolio-sort--active {
      color: var(--x-accent);
    }

    .prop-portfolio-table--has-expanded-row .prop-portfolio-sort--active,
    .prop-portfolio-table--day-focus .prop-portfolio-sort--active {
      color: var(--x-warning);
    }

    .prop-portfolio-room-change {
      display: inline-block;
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
    }

    .prop-portfolio-room-change__total {
      color: var(--ui-text);
    }

    .prop-portfolio-room-change__breakdown {
      color: var(--x-text-secondary);
      font-size: 0.85em;
    }

    .prop-portfolio-room-change__sold {
      color: var(--x-success);
    }

    .prop-portfolio-room-change__returned {
      color: var(--x-error);
    }

    .prop-portfolio-row__chevron {
      display: inline-block;
      width: 1em;
      margin-right: 4px;
      color: var(--ui-text-muted);
      flex-shrink: 0;
    }

    .prop-portfolio-row__name-cell {
      min-width: 0;
      vertical-align: middle;
    }

    .prop-portfolio-row__name-line {
      display: flex;
      align-items: center;
      min-width: 0;
      line-height: 1.25;
    }

    .prop-portfolio-row__name {
      flex: 1 1 auto;
      min-width: 0;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .prop-portfolio-row__name--wrap {
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
      word-break: break-word;
      overflow-wrap: anywhere;
    }

    .prop-portfolio-row__name--clip {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    tr.prop-portfolio-row--expanded .prop-portfolio-row__chevron,
    tr.prop-portfolio-row--expanded .prop-portfolio-row__name-cell {
      color: var(--x-warning);
    }

    tr.prop-portfolio-row--expanded .prop-portfolio-row__chevron {
      transform: rotate(90deg);
    }

    .prop-portfolio-table--has-expanded-row {
      border-collapse: separate;
      border-spacing: 0;
    }

    tr.prop-portfolio-row--expanded td {
      background-color: var(--x-bg-secondary);
      background-image: linear-gradient(rgba(255, 173, 31, 0.12), rgba(255, 173, 31, 0.12));
      box-shadow: none;
      border-bottom: 1px solid var(--x-border);
    }

    tr.prop-portfolio-row:has(+ tr.prop-portfolio-timeline-row) td {
      border-bottom-color: transparent;
    }

    tr.prop-portfolio-timeline-row {
      cursor: default;
    }

    tr.prop-portfolio-timeline-row td {
      padding: 0 !important;
      border-bottom: none;
      line-height: normal;
      min-width: 0;
      max-width: 100%;
    }

    tr.prop-portfolio-timeline-row:hover td {
      background: rgba(29, 161, 242, 0.06);
    }

    .prop-portfolio-table--has-expanded-row tr.prop-portfolio-timeline-row:hover td {
      background: rgba(255, 173, 31, 0.08);
    }

    .prop-portfolio-daystrip {
      width: 100%;
    }

    .prop-portfolio-daystrip--dual {
      display: flex;
      flex-direction: column;
      gap: 0;
      background: rgba(255, 255, 255, 0.08);
      border: 1px solid rgba(0, 0, 0, 0.4);
      border-radius: 2px;
      overflow: hidden;
    }

    .prop-portfolio-daystrip--dual .prop-portfolio-daystrip__track {
      border: none;
      border-radius: 0;
      background: transparent;
      flex-shrink: 0;
    }

    .prop-portfolio-daystrip__track {
      display: flex;
      width: 100%;
      height: 14px;
      min-height: 14px;
      background: rgba(255, 255, 255, 0.08);
      border: 1px solid rgba(0, 0, 0, 0.4);
      border-radius: 2px;
      overflow: hidden;
    }

    .prop-portfolio-daystrip--expanded {
      margin: 0;
    }

    .prop-portfolio-daystrip__day {
      flex: 1 1 0;
      min-width: 0;
      border-right: 1px solid rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      container-type: inline-size;
    }

    .prop-portfolio-daystrip__day--has-count {
      min-width: 0;
    }

    .prop-portfolio-daystrip__count {
      font-size: 0.75em;
      font-weight: 400;
      line-height: 1;
      pointer-events: none;
      user-select: none;
    }

    .prop-portfolio-daystrip .prop-portfolio-daystrip__count {
      font-size: clamp(6px, 75cqw, 11px);
    }

    .prop-portfolio-daystrip--expanded .prop-portfolio-daystrip__count {
      font-size: clamp(6px, 75cqw, 11px);
    }

    .prop-portfolio-daystrip__day--booked .prop-portfolio-daystrip__count,
    .prop-portfolio-daystrip__day--cancelled .prop-portfolio-daystrip__count {
      color: #fff;
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65);
    }

    .prop-portfolio-daystrip__day:last-child {
      border-right: none;
    }

    .prop-portfolio-daystrip__day--booked {
      background: color-mix(in srgb, var(--x-success) 55%, transparent);
    }

    .prop-portfolio-daystrip__day--cancelled {
      background: color-mix(in srgb, var(--x-error) 55%, transparent);
    }

    .prop-portfolio-daystrip__day--none {
      background: transparent;
    }

    .prop-portfolio-daystrip__day--sold-out {
      background: color-mix(in srgb, var(--x-success) 28%, transparent);
    }

    .prop-portfolio-daystrip__day--out-of-range {
      background: transparent;
      opacity: 0.35;
    }

    .prop-portfolio-daystrip__day--focused,
    .prop-portfolio-daystrip__day--column-hover {
      outline: none;
      box-shadow: inset 2px 0 0 var(--x-warning), inset -2px 0 0 var(--x-warning);
      z-index: 1;
      position: relative;
    }

    .prop-portfolio-daystrip--expanded .prop-portfolio-daystrip__day--clickable,
    .prop-portfolio-daystrip--interactive .prop-portfolio-daystrip__day--clickable {
      cursor: pointer;
    }

    .prop-portfolio-daystrip--expanded .prop-portfolio-daystrip__day--clickable:hover,
    .prop-portfolio-daystrip--interactive .prop-portfolio-daystrip__day--clickable:hover {
      filter: brightness(1.15);
    }

    tr.prop-portfolio-expand td {
      /* padding: 0 10px 12px 28px !important; */
      background: rgba(15, 23, 42, 0.35);
      border-bottom: 1px solid var(--ui-border-color);
      vertical-align: top;
      min-width: 0;
      max-width: 100%;
    }

    .prop-portfolio-detail {
      font-size: 0.82em;
      line-height: 1.45;
      color: var(--ui-text);
      min-width: 0;
      max-width: 100%;
    }

    .prop-portfolio-detail__lead {
      color: var(--ui-text-muted);
      margin: 0 0 8px;
    }

    .prop-portfolio-detail__facts {
      margin: 0 0 10px;
      padding-left: 18px;
    }

    .prop-portfolio-detail__facts li {
      margin-bottom: 4px;
    }

    .prop-portfolio-detail__strips {
      display: flex;
      flex-direction: column;
      gap: 14px;
      margin: 8px 0 12px;
      min-width: 0;
      max-width: 100%;
    }

    .prop-portfolio-detail__strips > .prop-portfolio-daystrip--expanded {
      margin: 0;
    }

    .prop-portfolio-detail__rooms {
      display: flex;
      flex-direction: column;
      gap: 14px;
      min-width: 0;
      max-width: 100%;
    }

    .prop-portfolio-detail__aggregated {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-top: 6px;
      padding-top: 14px;
      border-top: 1px solid var(--ui-border-color);
      min-width: 0;
      max-width: 100%;
    }

    .prop-portfolio-detail__aggregated-heading {
      font-size: 0.78em;
      font-weight: 600;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--ui-text-muted);
      cursor: help;
      width: fit-content;
    }

    .prop-portfolio-detail__aggregated .prop-portfolio-daystrip--expanded {
      margin: 0;
      min-width: 0;
      max-width: 100%;
    }

    .prop-portfolio-daystrip__count--pct {
      font-size: 0.62em;
      font-weight: 700;
      letter-spacing: -0.02em;
      max-width: 100%;
      overflow: hidden;
      text-overflow: clip;
    }

    .prop-portfolio-daystrip--expanded .prop-portfolio-daystrip__count--pct {
      font-size: 9px;
    }

    .prop-portfolio-daystrip__day--occupancy {
      --occupancy-fill: 0;
      flex: 1 1 0;
      min-width: 0;
      container-type: inline-size;
      background: color-mix(in srgb, var(--x-success) calc(var(--occupancy-fill) * 55%), transparent);
    }

    .prop-portfolio-daystrip__day--occupancy .prop-portfolio-daystrip__count--pct {
      font-size: clamp(6px, 75cqw, 9px);
      color: color-mix(in srgb, #fff calc(var(--occupancy-fill) * 100%), var(--ui-text-muted));
      text-shadow: 0 1px 2px rgba(0, 0, 0, calc(var(--occupancy-fill) * 0.65));
    }

    .prop-portfolio-detail__room-row {
      display: flex;
      flex-direction: column;
      gap: 0;
      transition: opacity 0.12s ease, filter 0.12s ease;
    }

    .prop-portfolio-detail__strips--room-filter-hover .prop-portfolio-detail__room-row--dimmed {
      opacity: 0.22;
      filter: grayscale(0.85);
    }

    .prop-portfolio-detail__room-line {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px 10px;
    }

    .prop-portfolio-detail__room-line .prop-portfolio-detail__room-card-name {
      font-weight: 400;
      font-size: 1.05em;
      flex: 1 1 auto;
      min-width: 0;
      max-width: none;
      white-space: normal;
      word-break: break-word;
    }

    .prop-portfolio-detail__room-row .prop-portfolio-daystrip--expanded {
      margin: 0;
    }

    .prop-portfolio-detail__rooms .prop-portfolio-daystrip__day--price-up {
      box-shadow: inset 0 -1px 0 rgba(74, 222, 128, 0.95);
    }

    .prop-portfolio-detail__rooms .prop-portfolio-daystrip__day--price-down {
      box-shadow: inset 0 -1px 0 rgba(248, 113, 113, 0.95);
    }

    .prop-portfolio-detail__summary {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin: 0 0 12px;
    }

    .prop-portfolio-detail__badge {
      display: inline-block;
      padding: 4px 10px;
      border-radius: 999px;
      font-size: 0.78em;
      font-weight: 600;
      letter-spacing: 0.02em;
    }

    .prop-portfolio-detail__badge--booked {
      background: rgba(74, 222, 128, 0.18);
      color: var(--x-success);
    }

    .prop-portfolio-detail__badge--cancelled {
      background: rgba(248, 113, 113, 0.18);
      color: #fca5a5;
    }

    .prop-portfolio-detail__badge--net {
      background: var(--ui-bg-subtle);
      color: var(--ui-text);
    }

    .prop-portfolio-detail__badge--rooms {
      background: rgba(96, 165, 250, 0.15);
      color: var(--x-accent);
    }

    .prop-portfolio-detail__summary-hint {
      margin: 0 0 12px;
      font-size: 0.75em;
      color: var(--ui-text-muted);
      line-height: 1.4;
    }

    .prop-portfolio-detail__timeline {
      position: relative;
      height: 6px;
      background: rgba(148, 163, 184, 0.15);
      border-radius: 3px;
      overflow: hidden;
    }

    .prop-portfolio-detail__timeline-seg {
      position: absolute;
      top: 0;
      height: 100%;
      border-radius: 2px;
      min-width: 3px;
    }

    .prop-portfolio-detail__timeline-seg--booked {
      background: rgba(248, 113, 113, 0.65);
    }

    .prop-portfolio-detail__timeline-seg--cancelled {
      background: rgba(74, 222, 128, 0.65);
    }

    .prop-portfolio-detail__raw-details {
      margin-top: 8px;
      font-size: 0.92em;
    }

    .prop-portfolio-detail__raw-details summary {
      cursor: pointer;
      color: var(--ui-text-muted);
      font-size: 0.85em;
      user-select: none;
    }

    .prop-portfolio-detail__raw-details summary:hover {
      color: var(--ui-text);
    }

    .prop-portfolio-detail__raw-details-body {
      margin-top: 8px;
      padding-top: 8px;
      border-top: 1px dashed var(--ui-border-color);
    }

    .prop-portfolio-detail__raw-room {
      margin-bottom: 8px;
    }

    .prop-portfolio-detail__raw-room:last-child {
      margin-bottom: 0;
    }

    .prop-portfolio-detail__delta--booked {
      color: var(--x-success);
    }

    .prop-portfolio-detail__delta--cancelled {
      color: var(--x-error);
    }

    .prop-portfolio-detail__empty {
      color: var(--ui-text-muted);
      font-style: italic;
      margin: 4px 0 8px;
    }

    .prop-portfolio-detail__bookings {
      margin: 12px 0;
      padding: 12px;
      background: rgba(34, 197, 94, 0.08);
      border-radius: 4px;
      border: 1px solid rgba(34, 197, 94, 0.2);
    }

    .prop-portfolio-detail__bookings h4 {
      margin: 0 0 8px;
      font-size: 0.85em;
      font-weight: 600;
      color: #22c55e;
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .prop-portfolio-detail__moves {
      margin: 8px 0;
      padding: 8px 10px;
      background: rgba(59, 130, 246, 0.06);
      border-radius: 4px;
    }

    .prop-portfolio-detail__moves-title {
      font-size: 0.75em;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      color: var(--ui-text-muted);
      margin-bottom: 6px;
    }

    .prop-portfolio-detail__actions {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-top: 10px;
    }

    .prop-portfolio-detail__actions button {
      padding: 6px 12px;
      font-size: 0.8em;
      border-radius: 4px;
      border: none;
      cursor: pointer;
    }

    .prop-portfolio-detail__btn-primary {
      background: var(--x-accent);
      color: #fff;
    }

    .prop-portfolio-detail__btn-secondary {
      background: transparent;
      color: var(--x-accent);
      border: 1px solid rgba(96, 165, 250, 0.4) !important;
    }

    .prop-portfolio-inline-availability,
    .prop-portfolio-inline-price {
      margin-top: 1px;
      padding-top: 1px;
      border-top: 1px solid var(--ui-border-color);
    }

    .prop-portfolio-inline-availability .chart-container,
    .prop-portfolio-inline-price .chart-container {
      margin-top: 0;
    }

    #propSinglePropertySection .chart-wrapper,
    .prop-portfolio-inline-availability .chart-wrapper,
    .prop-portfolio-inline-price .chart-wrapper {
      height: 350px;
      min-height: 0;
    }

    .prop-portfolio-inline-price .prop-change-headline {
      margin-top: 0;
    }

    .prop-portfolio-detail .prop-portfolio-detail__bookings {
      margin-top: 1px;
      border-top: 1px solid var(--ui-border-color);
    }

    .room-filter-panel__tiers-heading {
      font-size: 0.82em;
      text-transform: uppercase;
      letter-spacing: 0.06em;
      color: var(--ui-text-muted);
      margin: 10px 0 4px;
    }

    .room-filter-panel__helper {
      font-size: 0.85em;
      color: var(--ui-text-muted);
      margin: 0 0 8px;
      line-height: 1.35;
    }

    .room-filter-market-pulse {
      font-size: 0.9em;
      line-height: 1.4;
      max-width: 100%;
    }

    .room-filter-market-pulse__hero {
      margin: 0 0 10px;
      padding: 10px;
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius-sm);
      background: var(--x-bg-secondary);
    }

    .room-filter-market-pulse__hero-date {
      margin: 0 0 4px;
      font-size: 0.82em;
      color: var(--ui-text-muted);
    }

    .room-filter-market-pulse__hero-headline {
      margin: 0 0 8px;
      font-size: 1.05em;
      color: var(--x-text-primary);
    }

    .room-filter-market-pulse__hero-pct {
      font-size: 1.45em;
      font-weight: 700;
      line-height: 1.1;
    }

    .room-filter-market-pulse__progress {
      height: 6px;
      margin: 0 0 8px;
      border-radius: 999px;
      background: color-mix(in srgb, var(--x-text-primary) 12%, transparent);
      overflow: hidden;
    }

    .room-filter-market-pulse__progress-fill {
      height: 100%;
      border-radius: inherit;
      background: linear-gradient(
        90deg,
        color-mix(in srgb, var(--x-success) 85%, #fff),
        var(--x-success)
      );
      min-width: 0;
      transition: width 0.25s ease;
    }

    .room-filter-market-pulse__hero-sub {
      margin: 0;
      font-size: 0.84em;
      color: var(--x-text-secondary);
      line-height: 1.35;
    }

    .room-filter-market-pulse__kpi-strip {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 6px;
      margin: 0 0 12px;
    }

    .room-filter-market-pulse__kpi {
      padding: 6px 8px;
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius-sm);
      background: var(--x-bg-primary);
      min-width: 0;
    }

    .room-filter-market-pulse__kpi-label {
      display: block;
      font-size: 0.68em;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      color: var(--ui-text-muted);
      margin-bottom: 2px;
    }

    .room-filter-market-pulse__kpi-value {
      display: block;
      font-size: 0.95em;
      font-weight: 600;
      color: var(--x-text-primary);
      line-height: 1.2;
    }

    .room-filter-market-pulse__kpi-pair {
      display: block;
      font-size: 0.78em;
      font-weight: 600;
      line-height: 1.25;
    }

    .room-filter-market-pulse__kpi-sub {
      display: block;
      margin-top: 2px;
      font-size: 0.68em;
      color: var(--ui-text-muted);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .room-filter-market-pulse__tracked {
      margin: 0 0 8px;
      color: var(--ui-text-muted);
      font-size: 0.85em;
    }

    .room-filter-market-pulse__stats {
      margin: 0 0 6px;
      color: var(--x-text-primary);
    }

    .room-filter-market-pulse__change {
      margin: 0 0 8px;
      color: var(--x-text-secondary);
      font-size: 0.88em;
    }

    .room-filter-market-pulse__sold {
      color: var(--x-success);
    }

    .room-filter-market-pulse__returned {
      color: var(--x-danger);
    }

    .room-filter-market-pulse__compression {
      margin: 0 0 10px;
      font-size: 0.85em;
      color: var(--x-warning);
    }

    .room-filter-market-pulse__boards {
      display: flex;
      flex-direction: column;
      gap: 14px;
      margin-bottom: 8px;
    }

    .room-filter-market-pulse__board {
      min-width: 0;
      padding-top: 2px;
      border-top: 1px solid var(--x-border);
    }

    .room-filter-market-pulse__board:first-child {
      border-top: none;
      padding-top: 0;
    }

    .room-filter-market-pulse__board-title,
    .room-filter-market-pulse__board h5 {
      margin: 0 0 6px;
      font-size: 0.72em;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.07em;
      color: var(--ui-text-muted);
    }

    .room-filter-market-pulse__row {
      display: grid;
      grid-template-columns: 1.4em 1fr auto;
      gap: 6px;
      align-items: center;
      width: 100%;
      margin: 0 0 4px;
      padding: 5px 6px;
      border: 1px solid transparent;
      border-radius: var(--ui-radius-sm);
      background: transparent;
      color: inherit;
      font: inherit;
      text-align: left;
      cursor: pointer;
    }

    .room-filter-market-pulse__row:hover {
      background: var(--x-bg-secondary);
      border-color: var(--x-border);
    }

    .room-filter-market-pulse__row--focused {
      background: color-mix(in srgb, var(--x-warning) 14%, transparent);
      border-color: color-mix(in srgb, var(--x-warning) 45%, var(--x-border));
    }

    .room-filter-market-pulse__rank {
      color: var(--ui-text-muted);
      font-size: 0.85em;
    }

    .room-filter-market-pulse__name {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-size: 0.88em;
    }

    .room-filter-market-pulse__value {
      font-weight: 600;
      font-size: 0.85em;
      white-space: nowrap;
      text-align: right;
    }

    .room-filter-market-pulse__value--sold {
      color: var(--x-success);
    }

    .room-filter-market-pulse__value--canceled {
      color: var(--x-danger);
    }

    .room-filter-market-pulse__value--occupancy {
      color: var(--x-warning);
    }

    .room-filter-market-pulse__hint {
      margin: 8px 0 0;
      font-size: 0.75em;
      color: var(--ui-text-muted);
      line-height: 1.35;
    }

    .room-filter-market-pulse__empty,
    .room-filter-market-pulse__empty-state,
    .room-filter-market-pulse__loading {
      margin: 0;
      padding: 12px 4px;
      color: var(--ui-text-muted);
      font-size: 0.88em;
      text-align: center;
    }

    .room-filter-market-pulse__error {
      margin: 0 0 10px;
      padding: 8px;
      border-radius: var(--ui-radius-sm);
      background: color-mix(in srgb, var(--x-danger) 12%, transparent);
      color: var(--x-danger);
      font-size: 0.85em;
    }

    @media (max-width: 900px) {
      .booking-panel--property.booking-toolbar--property .prop-toolbar__properties {
        flex: 1 1 100%;
        margin-left: 0;
      }
    }

    /* ====================== COMPETITOR ANALYSIS STYLES ====================== */
    .competitor-content {
      display: flex;
      gap: 20px;
      margin-top: 20px;
    }

    .competitor-sidebar {
      width: 300px;
      flex-shrink: 0;
    }

    .competitor-main {
      flex: 1;
      min-width: 0;
    }

    .property-selection {
      background: var(--ui-bg-muted);
      padding: 15px;
    }

    .property-selection h4 {
      margin: 0 0 15px 0;
      font-size: 18px;
      color: var(--ui-text);
    }

    .property-list {
      max-height: 400px;
      overflow-y: auto;
    }

    .property-checkbox {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 0;
      border-bottom: none;
    }

    .property-checkbox:last-child {
      border-bottom: none;
    }

    .property-checkbox input[type="checkbox"] {
      margin: 0;
      accent-color: var(--ui-primary);
    }

    .property-checkbox label {
      cursor: pointer;
      font-size: 14px;
      color: var(--ui-text);
      flex: 1;
    }

    .competitor-analysis {
      background: var(--ui-bg);
      padding: 20px;
    }

    .analysis-overview {
      margin-bottom: 30px;
    }

    .analysis-overview h3 {
      margin: 0 0 20px 0;
      color: var(--ui-text);
      font-size: 18px;
    }

    .overview-stats {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 15px;
    }

    .stat {
      background: var(--ui-bg-muted);
      padding: 15px;
      border-radius: 6px;
    }

    .stat-label {
      display: block;
      font-size: 12px;
      color: var(--ui-text-muted);
      margin-bottom: 5px;
    }

    .stat-value {
      display: block;
      font-size: 14px;
      font-weight: 600;
      color: var(--ui-text);
    }

    .detailed-breakdown {
      margin-bottom: 30px;
    }

    .detailed-breakdown h3 {
      margin: 0 0 20px 0;
      color: var(--ui-text);
      font-size: 18px;
    }

    .property-breakdowns {
      display: grid;
      gap: 20px;
    }

    .property-breakdown {
      padding: 20px;
      background: var(--ui-bg-muted);
    }

    .property-breakdown h4 {
      margin: 0 0 15px 0;
      color: var(--ui-text);
      font-size: 16px;
    }

    .property-summary {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 10px;
      margin-bottom: 20px;
    }

    .summary-item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 8px 12px;
      background: var(--ui-bg);
      border-radius: 4px;
    }

    .summary-item .label {
      font-size: 12px;
      color: var(--ui-text-muted);
    }

    .summary-item .value {
      font-weight: 600;
      color: var(--ui-text);
    }

    .accommodation-types h5 {
      margin: 0 0 15px 0;
      color: var(--ui-text);
      font-size: 16px;
    }

    .accommodation-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 15px;
    }

    .accommodation-card {
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
      padding: 15px;
      background: var(--x-bg-secondary);
    }

    .accommodation-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin-bottom: 10px;
    }

    .accommodation-header h6 {
      margin: 0;
      color: var(--ui-text);
      font-size: 14px;
      flex: 1;
    }

    .max-guests {
      background: var(--x-accent);
      color: white;
      padding: 2px 8px;
      border-radius: var(--ui-radius-pill);
      font-size: 0.75em;
      font-weight: 600;
    }

    .accommodation-details {
      margin-bottom: 10px;
    }

    .price-info {
      margin-bottom: 8px;
    }

    .price-per-guest,
    .total-price,
    .availability,
    .size,
    .bedrooms {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 4px;
      font-size: 12px;
    }

    .price-per-guest .label,
    .total-price .label,
    .availability .label,
    .size .label,
    .bedrooms .label {
      color: var(--ui-text-muted);
    }

    .price-per-guest .value,
    .total-price .value {
      font-weight: 600;
      color: #d00;
    }

    .availability .value {
      font-weight: 600;
      color: #2e7d32;
    }

    .features {
      margin-top: 10px;
    }

    .features .label {
      display: block;
      font-size: 12px;
      color: var(--ui-text-muted);
      margin-bottom: 5px;
    }

    .feature-list {
      display: flex;
      flex-wrap: wrap;
      gap: 4px;
    }

    .feature-tag {
      background: #e3f2fd;
      color: var(--x-accent);
      padding: 2px 6px;
      border-radius: 3px;
      font-size: 11px;
    }

    .insights h3 {
      margin: 0 0 20px 0;
      color: var(--ui-text);
      font-size: 18px;
    }

    .insights-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 20px;
    }

    .insight-card {
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
      padding: 20px;
      background: var(--x-bg-secondary);
    }

    .insight-card h4 {
      margin: 0 0 15px 0;
      color: var(--ui-text);
      font-size: 16px;
    }

    .insight-content {
      font-size: 14px;
    }

    .insight-item {
      padding: 8px 0;
      border-bottom: var(--ui-border);
    }

    .insight-item:last-child {
      border-bottom: none;
    }

    .price-segment {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .segment {
      padding: 8px 12px;
      border-radius: 4px;
      font-size: 12px;
      font-weight: 600;
    }

    .segment:nth-child(1) {
      background: rgba(74, 222, 128, 0.15);
      color: var(--x-success);
    }

    .segment:nth-child(2) {
      background: rgba(251, 191, 36, 0.15);
      color: var(--x-warning);
    }

    .segment:nth-child(3) {
      background: rgba(248, 113, 113, 0.15);
      color: var(--x-error);
    }

    .loading {
      text-align: center;
      padding: 40px;
      color: var(--ui-text-muted);
      font-size: 14px;
    }

    /* Active sort button styling */
    .ctrl-btn.active-sort {
      background: var(--x-accent);
      color: #fff;
      border-color: var(--x-accent);
      box-shadow: none;
      font-size: 15px;
    }

    /* Ghost button (booking toolbar, date nav) */
    .ui-btn {
      height: var(--ui-control-h);
      padding: 0 16px;
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius-pill);
      font-family: inherit;
      font-size: 15px;
      font-weight: 700;
      color: var(--x-text-primary);
      background: transparent;
      cursor: pointer;
      transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
      box-shadow: none;
    }

    .ui-btn:hover {
      border-color: var(--x-border-light);
      background: var(--x-bg-secondary);
    }

    .ui-btn--primary {
      background: var(--x-accent);
      border-color: var(--x-accent);
      color: #fff;
    }

    .ui-btn--primary:hover {
      background: var(--x-accent-hover);
      border-color: var(--x-accent-hover);
    }

    .date-nav-btn {
      min-width: 32px;
      width: 32px;
      padding: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: var(--x-bg-secondary);
      color: var(--x-text-primary);
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius-pill);
      cursor: pointer;
      font-size: var(--ui-font-size-sm);
      font-weight: 700;
      transition: background 0.15s ease, color 0.15s ease;
    }

    .date-nav-btn:hover {
      background: var(--x-bg-elevated);
      color: var(--x-text-primary);
      border-color: var(--x-border-light);
    }

    .date-row {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 12px;
      align-items: start;
      padding: 12px;
      background: var(--ui-bg);
      border: var(--ui-border);
      border-radius: var(--ui-radius);
      box-shadow: var(--ui-shadow);
    }

    .date-control {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .date-nav {
      display: flex;
      gap: 6px;
      justify-content: flex-start;
    }

    .ctrl-select {
      width: auto;
      padding: 8px;
      font-size: 1rem;
    }

    .collections-area {
      background: var(--ui-bg-muted);
      border-radius: var(--ui-radius);
      padding: 0;
      min-height: var(--ui-control-h);
      overflow-x: auto;
      align-self: stretch;
      border: var(--ui-border);
    }

    .collections-area .collections-scroll {
      max-height: 420px;
      overflow-y: auto;
      padding: 1px 1px;
      justify-content: flex-start;
      background: var(--ui-bg);
      border: none;
      border-radius: var(--ui-radius-sm);
      box-shadow: none;
    }

    .date-nav-btn:disabled {
      background: var(--x-bg-secondary);
      color: var(--x-text-muted);
      border-color: var(--x-border);
      cursor: not-allowed;
    }

    /* Responsive design for competitor analysis */
    @media (max-width: 1024px) {
      .competitor-content {
        flex-direction: column;
      }
      
      .competitor-sidebar {
        width: 100%;
        order: 2;
      }
      
      .competitor-main {
        order: 1;
      }
      
      .accommodation-grid {
        grid-template-columns: 1fr;
      }
    }

    #TerminalData {
      padding: 16px 20px 32px;
      max-width: 1400px;
      margin: 0 auto;
    }

    .terminal-header {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 12px;
      margin-bottom: 20px;
      padding: 14px 16px;
      background: var(--x-bg-secondary);
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
    }

    .terminal-header__meta { flex: 1; min-width: 200px; }
    .terminal-header__meta h2 { margin: 0 0 6px; font-size: 1.15em; }
    .terminal-header__actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

    .terminal-badge {
      display: inline-block;
      padding: 2px 8px;
      border-radius: 4px;
      font-size: var(--ui-font-size-sm);
      font-weight: 600;
      background: var(--ui-bg-subtle);
      color: var(--ui-text-muted);
    }

    .terminal-badge--ok { background: rgba(0, 186, 124, 0.15); color: var(--x-success); }
    .terminal-badge--warn { background: rgba(255, 173, 31, 0.15); color: var(--x-warning); }
    .terminal-badge--dim { background: var(--x-bg-elevated); color: var(--x-text-muted); }

    .terminal-section {
      margin-bottom: 24px;
      padding: 16px;
      background: var(--x-bg-secondary);
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
    }

    .terminal-section h3 { margin: 0 0 12px; font-size: 1.05em; }

    .terminal-progress {
      height: 8px;
      background: var(--ui-bg-subtle);
      border-radius: 4px;
      overflow: hidden;
      margin: 8px 0;
    }

    .terminal-progress__bar {
      height: 100%;
      background: var(--ui-primary);
      width: 0%;
      transition: width 0.3s ease;
    }

    .terminal-table {
      width: 100%;
      border-collapse: collapse;
      font-size: var(--ui-font-size-sm);
    }

    .terminal-table th,
    .terminal-table td {
      padding: 8px 10px;
      text-align: left;
      border-bottom: 1px solid var(--ui-border-color);
    }

    .terminal-table th { color: var(--ui-text-muted); font-weight: 600; }
    .terminal-table code { font-size: 0.9em; color: var(--ui-text-dim); }

    .terminal-coverage-table td {
      font-family: monospace;
    }

    .terminal-coverage-check {
      font-weight: bold;
      font-size: 1.1em;
    }

    .terminal-coverage-check--yes {
      color: var(--x-success);
    }

    .terminal-coverage-check--no {
      color: var(--x-text-muted);
    }

    .terminal-coverage-row--profiler-only {
      background: color-mix(in srgb, var(--x-warning) 8%, transparent);
    }

    .terminal-coverage-row--profiler-only .terminal-prop-name-clickable {
      color: var(--ui-text);
    }

    .terminal-missing summary { cursor: pointer; color: var(--ui-link); }
    .terminal-missing code { display: block; margin-top: 4px; word-break: break-all; font-size: 0.85em; }

    .terminal-extended-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
    }

    @media (max-width: 900px) {
      .terminal-extended-grid { grid-template-columns: 1fr; }
    }

    .terminal-list-panel {
      background: var(--ui-bg-muted);
      border-radius: var(--ui-radius-sm);
      padding: 10px;
      max-height: 350px;
      overflow-y: auto;
    }

    .terminal-list-panel h4 { margin: 0 0 8px; font-size: 0.95em; }
    .terminal-list-panel ul { margin: 0; padding-left: 18px; }
    .terminal-list-panel li { margin-bottom: 4px; }
    .terminal-list-empty { color: var(--ui-text-dim); list-style: none; margin-left: -18px; }
    .terminal-prop-name { color: var(--ui-text); }
    .terminal-prop-meta { color: var(--ui-text-dim); font-size: 0.9em; }

    .terminal-controls-row {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
      align-items: center;
      margin-bottom: 12px;
    }

    .terminal-controls-row label {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      cursor: pointer;
    }

    .terminal-hint { font-size: var(--ui-font-size-sm); color: var(--ui-text-muted); margin: 8px 0 0; }
    .terminal-hint-secondary { color: var(--ui-text-dim); font-size: 0.9em; margin-left: 8px; }
    .terminal-resume-help p { margin: 4px 0; font-size: var(--ui-font-size-sm); }

    .terminal-log {
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
      font-size: 13px;
      line-height: 1.45;
      width: 100%;
      box-sizing: border-box;
      background: var(--x-bg-primary);
      border: 1px solid var(--x-border);
      border-radius: var(--ui-radius);
      padding: 12px;
      min-height: 320px;
      max-height: min(50vh, 600px);
      overflow-y: auto;
      white-space: pre-wrap;
      word-break: break-word;
      color: var(--x-text-secondary);
    }

    .terminal-log-details[open] .terminal-log {
      max-height: min(55vh, 700px);
    }

    .terminal-job-state { font-size: var(--ui-font-size-sm); color: var(--ui-text-muted); }
    .terminal-job-state--running { color: var(--x-success); }

    .terminal-run-bar {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
      margin-top: 12px;
    }

    .terminal-status-msg { font-size: var(--ui-font-size-sm); color: var(--ui-text-dim); }

    .terminal-live-run {
      margin: 16px 0;
      padding: 16px;
      background: var(--ui-bg-muted);
      border-radius: var(--ui-radius);
      border: var(--ui-border);
    }

    .terminal-live-run[hidden] { display: none !important; }

    .terminal-live-hero {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 16px;
      margin-bottom: 16px;
    }

    .terminal-overall-pct {
      font-size: 2.5rem;
      font-weight: 700;
      color: var(--ui-primary-hover);
      line-height: 1;
      min-width: 4ch;
    }

    .terminal-live-meta { flex: 1; min-width: 200px; }

    .terminal-phase-pill {
      display: inline-block;
      padding: 4px 10px;
      border-radius: 999px;
      font-size: var(--ui-font-size-sm);
      font-weight: 600;
      background: var(--ui-primary-soft);
      color: var(--ui-primary-hover);
    }

    .terminal-live-bars { margin-top: 10px; }

    .terminal-live-bar-row {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 6px;
      font-size: var(--ui-font-size-sm);
    }

    .terminal-live-bar-row span:first-child {
      width: 72px;
      color: var(--ui-text-muted);
    }

    .terminal-live-bar-track {
      flex: 1;
      height: 6px;
      background: var(--ui-bg-subtle);
      border-radius: 3px;
      overflow: hidden;
    }

    .terminal-live-bar-fill {
      height: 100%;
      background: var(--ui-primary);
      width: 0%;
      transition: width 0.35s ease;
    }

    .terminal-live-bar-pct {
      width: 36px;
      text-align: right;
      color: var(--ui-text-dim);
    }

    .terminal-live-current {
      font-size: var(--ui-font-size-sm);
      color: var(--ui-text-muted);
      margin-top: 8px;
    }

    .terminal-live-index-summary {
      margin: 0 0 8px;
      font-weight: 500;
    }

    .terminal-live-index-table {
      width: 100%;
      border-collapse: collapse;
      font-size: var(--ui-font-size-sm);
      margin-bottom: 8px;
    }

    .terminal-live-index-table th,
    .terminal-live-index-table td {
      padding: 4px 8px;
      text-align: left;
      border-bottom: var(--ui-border);
    }

    .terminal-live-index-table th {
      color: var(--ui-text-dim);
      font-weight: 500;
    }

    .terminal-index-day-feed {
      display: flex;
      flex-wrap: wrap;
      gap: 4px;
      max-height: 72px;
      overflow-y: auto;
    }

    .terminal-index-day-chip {
      font-size: 11px;
      padding: 2px 6px;
      border-radius: var(--ui-radius-sm);
      background: var(--ui-bg);
      border: var(--ui-border);
      color: var(--ui-text-muted);
      white-space: nowrap;
    }

    .terminal-live-property-list {
      max-height: 420px;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .terminal-prop-row {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 10px;
      background: var(--ui-bg);
      border: var(--ui-border);
      border-radius: var(--ui-radius-sm);
    }

    .terminal-prop-row--running {
      border-color: var(--ui-primary);
      box-shadow: 0 0 0 1px var(--ui-primary-soft);
    }

    .terminal-prop-check {
      width: 22px;
      height: 22px;
      border-radius: 50%;
      border: 2px solid var(--ui-border-color);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      flex-shrink: 0;
      line-height: 1;
    }

    .terminal-prop-row--complete .terminal-prop-check {
      border-color: #22c55e;
      background: rgba(34, 197, 94, 0.2);
      color: var(--x-success);
    }

    .terminal-prop-row--skipped-done .terminal-prop-check {
      border-color: #64748b;
      background: rgba(100, 116, 139, 0.25);
      color: var(--x-text-secondary);
    }

    .terminal-prop-row--partial .terminal-prop-check {
      border-color: #eab308;
      background: rgba(234, 179, 8, 0.15);
      color: #fcd34d;
    }

    .terminal-prop-row--failed .terminal-prop-check {
      border-color: #ef4444;
      background: rgba(239, 68, 68, 0.15);
      color: var(--x-error);
    }

    .terminal-prop-row--skipped-index .terminal-prop-check {
      border-color: #f59e0b;
      background: rgba(245, 158, 11, 0.12);
      color: var(--x-warning);
    }

    .terminal-prop-row--skipped-other .terminal-prop-check {
      border-color: var(--ui-text-dim);
      color: var(--ui-text-dim);
    }

    .terminal-prop-row--pending .terminal-prop-check {
      color: var(--ui-text-dim);
    }

    .terminal-prop-row--running .terminal-prop-check {
      border-color: var(--ui-primary);
      animation: terminalPulse 1.2s ease-in-out infinite;
    }

    @keyframes terminalPulse {
      50% { opacity: 0.5; }
    }

    .terminal-prop-line {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .terminal-prop-title {
      flex-shrink: 0;
      font-size: 0.9em;
      font-weight: 600;
      color: var(--ui-text);
      max-width: 28%;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .terminal-prop-title .terminal-badge {
      margin-left: 4px;
      vertical-align: middle;
    }

    .terminal-prop-bar-track {
      flex: 0 0 72px;
      height: 4px;
      background: var(--ui-bg-subtle);
      border-radius: 2px;
      overflow: hidden;
    }

    .terminal-prop-bar-track--empty {
      opacity: 0.5;
    }

    .terminal-prop-bar-fill {
      display: block;
      height: 100%;
      background: var(--ui-primary);
      border-radius: 2px;
    }

    .terminal-prop-row--complete .terminal-prop-bar-fill,
    .terminal-prop-row--skipped-done .terminal-prop-bar-fill {
      background: #22c55e;
    }

    .terminal-prop-row--partial .terminal-prop-bar-fill {
      background: #eab308;
    }

    .terminal-prop-summary {
      flex: 1;
      min-width: 0;
      font-size: var(--ui-font-size-sm);
      color: var(--ui-text-muted);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .terminal-log-details {
      margin-top: 12px;
    }

    .terminal-log-details summary {
      cursor: pointer;
      color: var(--ui-text-muted);
      font-size: var(--ui-font-size-sm);
      margin-bottom: 8px;
    }

    /* Consolidated Terminal Controls */
    .terminal-controls {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
      padding: 16px;
      background: var(--x-bg-elevated);
      border: var(--ui-border);
      border-radius: var(--ui-radius);
      margin-bottom: 16px;
      align-items: flex-start;
    }

    .terminal-controls__column {
      flex: 1;
      min-width: 200px;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .terminal-controls__heading {
      margin: 0 0 4px;
      font-size: 0.9em;
      font-weight: 600;
      color: var(--ui-text-muted);
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .terminal-controls__button-group {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }

    .terminal-controls__center {
      display: flex;
      flex-direction: column;
      gap: 8px;
      align-items: center;
      padding: 0 16px;
      border-left: 1px solid var(--ui-border-color);
    }

    .terminal-section--compact {
      padding: 12px 16px;
    }

    .terminal-section--compact h3 {
      margin: 0 0 8px;
      font-size: 1em;
    }

    .terminal-profiler-content {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .terminal-profiler-stats {
      margin: 0;
      font-size: var(--ui-font-size-sm);
      color: var(--ui-text-muted);
    }

    .terminal-profiler-note {
      margin: 0;
      font-size: 0.85em;
      color: var(--ui-text-dim);
    }

    /* New Terminal Dashboard Layout */
    .terminal-header-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 12px 20px;
      background: var(--x-bg-elevated);
      border-bottom: 1px solid var(--ui-border-color);
      margin-bottom: 20px;
    }

    .terminal-header-bar__left,
    .terminal-header-bar__right {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .terminal-header-bar__center {
      flex: 1;
      text-align: center;
    }

    .terminal-header-title {
      margin: 0;
      font-size: 1.25em;
      font-weight: 600;
      color: var(--ui-text-primary);
    }

    .terminal-header-label {
      font-size: 0.85em;
      color: var(--ui-text-muted);
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .terminal-header-value {
      font-size: 1em;
      font-weight: 600;
      color: var(--ui-text-primary);
    }

    .ui-btn--icon {
      padding: 6px 10px;
      font-size: 1.1em;
      min-width: 36px;
    }

    .terminal-grid {
      display: grid;
      grid-template-columns: minmax(240px, 1fr) minmax(360px, 2fr);
      gap: 16px;
      margin-bottom: 20px;
      align-items: start;
    }

    @media (max-width: 900px) {
      .terminal-grid {
        grid-template-columns: 1fr;
      }
    }

    .terminal-card {
      background: var(--x-bg-elevated);
      border: 1px solid var(--ui-border-color);
      border-radius: var(--ui-radius);
      padding: 20px;
    }

    .terminal-card__title {
      margin: 0 0 16px;
      font-size: 1em;
      font-weight: 600;
      color: var(--ui-text-primary);
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .terminal-stats-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      margin-bottom: 16px;
    }

    .terminal-stat-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 16px 12px;
      background: var(--x-bg-secondary);
      border-radius: var(--ui-radius-sm);
      text-align: center;
    }

    .terminal-stat-card__icon {
      font-size: 1.5em;
      margin-bottom: 8px;
    }

    .terminal-stat-card__value {
      font-size: 2em;
      font-weight: 700;
      color: var(--x-accent);
      line-height: 1;
      margin-bottom: 4px;
    }

    .terminal-stat-card__label {
      font-size: 0.75em;
      color: var(--ui-text-muted);
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .terminal-card__note {
      margin: 0;
      font-size: 0.85em;
      color: var(--ui-text-dim);
      text-align: center;
    }

    .terminal-card__note code {
      background: var(--x-bg-secondary);
      padding: 2px 6px;
      border-radius: 4px;
      font-size: 0.9em;
    }

    .terminal-control-group {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .terminal-control-label {
      display: flex;
      align-items: center;
      gap: 8px;
      cursor: pointer;
      font-size: 0.9em;
      color: var(--ui-text-primary);
    }

    .terminal-control-label input[type="checkbox"] {
      width: 16px;
      height: 16px;
      cursor: pointer;
    }

    .terminal-button-row {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }

    .terminal-run-table {
      width: 100%;
      border-collapse: collapse;
      margin-bottom: 10px;
    }

    .terminal-run-table th,
    .terminal-run-table td {
      padding: 12px 10px;
      text-align: left;
      border-bottom: 1px solid var(--ui-border-color);
      vertical-align: middle;
    }

    .terminal-run-table th {
      font-size: 0.75em;
      font-weight: 600;
      color: var(--ui-text-muted);
      text-transform: uppercase;
      letter-spacing: 0.06em;
    }

    .terminal-run-table__col-select,
    .terminal-run-table__col-continue,
    .terminal-run-table__col-parallel {
      width: 72px;
      text-align: center;
    }

    .terminal-run-table__col-parallel {
      width: 88px;
    }

    .terminal-parallel-field {
      display: flex;
      justify-content: center;
    }

    .terminal-parallel-field__input {
      width: 56px;
      padding: 6px 8px;
      border-radius: var(--ui-radius-sm);
      border: 1px solid var(--ui-border-color);
      background: var(--x-bg-secondary);
      color: var(--ui-text-primary);
      font-size: 0.95em;
      font-weight: 600;
      text-align: center;
      font-variant-numeric: tabular-nums;
    }

    .terminal-parallel-field__input:disabled {
      opacity: 0.45;
      cursor: not-allowed;
    }

    .terminal-run-table__name {
      font-weight: 600;
      color: var(--ui-text-primary);
      margin-bottom: 2px;
    }

    .terminal-run-table__meta {
      font-size: 0.82em;
      color: var(--ui-text-dim);
      line-height: 1.35;
    }

    .terminal-run-legend {
      margin: 0 0 14px;
      font-size: 0.82em;
      color: var(--ui-text-dim);
    }

    .terminal-index-combo-tools {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
      padding: 12px 0 16px;
      border-bottom: 1px solid var(--ui-border-color);
      margin-bottom: 16px;
    }

    .terminal-run-toggle {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
    }

    .terminal-run-toggle input {
      position: absolute;
      opacity: 0;
      width: 0;
      height: 0;
    }

    .terminal-run-toggle__ui {
      width: 42px;
      height: 24px;
      border-radius: 999px;
      background: var(--x-bg-secondary);
      border: 1px solid var(--ui-border-color);
      position: relative;
      transition: background 0.15s ease, border-color 0.15s ease;
    }

    .terminal-run-toggle__ui::after {
      content: '';
      position: absolute;
      top: 2px;
      left: 2px;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: var(--ui-text-dim);
      transition: transform 0.15s ease, background 0.15s ease;
    }

    .terminal-run-toggle input:checked + .terminal-run-toggle__ui {
      background: color-mix(in srgb, var(--x-success) 22%, var(--x-bg-secondary));
      border-color: var(--x-success);
    }

    .terminal-run-toggle input:checked + .terminal-run-toggle__ui::after {
      transform: translateX(18px);
      background: var(--x-success);
    }

    .terminal-run-toggle input:focus-visible + .terminal-run-toggle__ui {
      outline: 2px solid var(--x-accent);
      outline-offset: 2px;
    }

    .terminal-run-footer {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .terminal-delay-field {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }

    .terminal-delay-field__label {
      font-size: 0.85em;
      font-weight: 600;
      color: var(--ui-text-muted);
      text-transform: uppercase;
      letter-spacing: 0.05em;
      min-width: 48px;
    }

    .terminal-delay-field__input {
      width: 120px;
      padding: 8px 12px;
      border-radius: var(--ui-radius-sm);
      border: 1px solid var(--ui-border-color);
      background: var(--x-bg-secondary);
      color: var(--ui-text-primary);
      font-size: 0.95em;
    }

    .terminal-delay-field__input::placeholder {
      color: var(--ui-text-dim);
      font-size: 0.9em;
    }

    .terminal-delay-field__suffix {
      font-size: 0.85em;
      color: var(--ui-text-dim);
    }

    .terminal-run-actions {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      align-items: center;
    }

    .ui-btn--start {
      flex: 1 1 240px;
      min-height: 44px;
      font-size: 0.95em;
      font-weight: 600;
      letter-spacing: 0.01em;
      text-align: center;
      white-space: normal;
      line-height: 1.3;
      padding: 10px 16px;
    }

    .terminal-scheduled-hint {
      margin: 0;
      font-size: 0.88em;
      color: var(--x-warning);
      padding: 10px 12px;
      border-radius: var(--ui-radius-sm);
      background: color-mix(in srgb, var(--x-warning) 10%, transparent);
      border: 1px solid color-mix(in srgb, var(--x-warning) 35%, transparent);
    }

    .terminal-card--runs .terminal-card__title {
      margin-bottom: 12px;
    }

    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .ui-btn--primary {
      background: var(--x-success);
      color: white;
      border: none;
    }

    .ui-btn--primary:hover {
      background: #16a34a;
    }

    .ui-btn--primary:disabled {
      background: var(--ui-bg-subtle);
      color: var(--ui-text-dim);
      cursor: not-allowed;
    }

    .ui-btn--secondary {
      background: var(--x-bg-secondary);
      color: var(--ui-text-primary);
      border: 1px solid var(--ui-border-color);
    }

    .ui-btn--secondary:hover {
      background: var(--ui-bg-muted);
    }

    .ui-btn--danger {
      background: #dc2626;
      color: white;
      border: none;
    }

    .ui-btn--danger:hover {
      background: #b91c1c;
    }

    .ui-btn--danger:disabled {
      background: var(--ui-bg-subtle);
      color: var(--ui-text-dim);
      cursor: not-allowed;
    }

    .terminal-status-bar {
      display: flex;
      align-items: center;
      padding: 12px 20px;
      background: var(--x-bg-elevated);
      border: 1px solid var(--ui-border-color);
      border-radius: var(--ui-radius);
      margin-bottom: 16px;
    }

    .terminal-status-bar--running {
      background: rgba(34, 197, 94, 0.1);
      border-color: #22c55e;
    }

    .terminal-status-bar--idle {
      background: var(--x-bg-elevated);
      border-color: var(--ui-border-color);
    }

    .terminal-status-bar--stopped {
      background: rgba(220, 38, 38, 0.1);
      border-color: #dc2626;
    }

    .terminal-status-bar__text {
      font-size: 0.9em;
      color: var(--ui-text-primary);
    }

    .terminal-status-bar--running .terminal-status-bar__text {
      color: #22c55e;
    }

    .terminal-status-bar--stopped .terminal-status-bar__text {
      color: #dc2626;
    }

    @media (max-width: 768px) {
      .terminal-controls {
        flex-direction: column;
      }
      .terminal-controls__center {
        border-left: none;
        border-top: 1px solid var(--ui-border-color);
        padding: 12px 0 0 0;
        width: 100%;
      }
      .terminal-header-bar {
        flex-direction: column;
        gap: 12px;
        text-align: center;
      }
      .terminal-header-bar__left,
      .terminal-header-bar__right {
        justify-content: center;
      }
    }

    /* www: disabled nav tabs (inventory/prices not wired yet) */
    .tablinks--disabled,
    .tablinks:disabled {
      opacity: 0.35;
      cursor: not-allowed;
      pointer-events: none;
    }

    #PropertyData.tabcontent {
      display: block;
    }

    /* www: full-screen loading overlay */
    .www-loading-overlay {
      position: fixed;
      inset: 0;
      z-index: 10000;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #000;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity 0.25s ease, visibility 0.25s ease;
    }

    .www-loading-overlay--visible {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }

    .www-loading-overlay__inner {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 1.25rem;
      text-align: center;
      padding: 1.5rem;
    }

    .www-loading-overlay__gif {
      display: block;
      max-width: min(400px, 80vw);
      height: auto;
      image-rendering: auto;
    }

    .www-loading-overlay__text {
      margin: 0;
      font-family: 'Roboto', system-ui, sans-serif;
      font-size: 1rem;
      font-weight: 500;
      letter-spacing: 0.04em;
      color: #8fa3bc;
      min-height: 1.5em;
    }

    /* www: desktop layout on phones — pan/pinch to navigate */
    html,
    body {
      min-width: 1400px;
    }

    body {
      overflow-x: auto;
    }

    /* www: session chip + logout */
    .app-header__session {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-left: auto;
      flex-shrink: 0;
      padding-left: 8px;
    }

    .app-header__session-user {
      font-size: 0.75rem;
      color: var(--x-text-secondary, #8fa3bc);
      text-transform: lowercase;
    }

    .app-header__logout {
      font-size: 0.75rem;
      color: var(--x-accent, #3d9cf5);
      text-decoration: none;
      white-space: nowrap;
    }

    .app-header__logout:hover {
      text-decoration: underline;
    }

    /* www: always show profiler toolbar controls */
    .app-header-tab-controls__group[data-tab-controls="PropertyData"] {
      display: flex !important;
    }