/* Shared compact layouts. Controls retain their touch area without turning
   labels, table values and every card heading into separate button rows. */
.cleaner-session-preview { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; padding:8px 16px; background:var(--accent-soft); border-bottom:1px solid var(--border); font-size:13px; }
.cl-list-note { margin: 12px 16px; color: var(--ink-2); font-size: 12px; line-height: 1.5; }
#cl-checklist .check .ctl { display: none; }
#cl-checklist.editing-list .check .ctl { display: flex; opacity: 1; }
#cl-checklist .addrow { display: flex; gap: 8px; }
#cl-checklist .addrow input { flex: 1; min-width: 0; }
#cl-checklist .check label { padding: 8px 0; }
[hidden] { display: none !important; }
@media (max-width: 820px) {
  .content { padding: 16px; gap: 16px; }
  .main, .content > *, .stack > *, .card, .topbar > * { min-width: 0; }
  .topbar { gap: 8px; }
  .topbar h1 { font-size: 20px; line-height: 1.25; }
  .topbar .sub { line-height: 1.45; }
  .card .card-head { padding: 12px 14px; gap: 8px; }
  .card .card-head > .spacer { flex: 1 1 0; height: auto; }
  .card .card-head h2 { flex: 1 1 auto; min-width: 0; }
  .card .card-head .hint { font-size: 11px; }
  .card .card-head .viewall { min-height: 32px; font-size: 12px; }
  .card .card-body:not(.flush) { padding: 14px; }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .kpi { min-width: 0; padding: 12px; }
  .kpi .k-label { line-height: 1.4; }
  .kpi .k-label.w-face { min-height: 0; display: block; border: 0; font-size: 12px; }
  .kpi .k-value { font-size: clamp(20px, 5.7vw, 25px); letter-spacing: -.7px; overflow-wrap: anywhere; }
  .kpi-nav { display: flex; flex-direction: column; }
  .kpi-nav .k-head { display:flex;align-items:center;flex-wrap:nowrap;gap:4px; }
  .kpi-nav .k-head .k-label { flex:1;min-width:0; }
  .kpi-nav .k-face { order: 1; flex: 1; }
  .kpi-nav .w-nav { margin:0;padding:0;border:0; }
  .kpi .k-sub { line-height: 1.4; }
  .kpi .w-nav { gap: 0; }
  .kpi .w-step { min-width: 28px; min-height: 36px; }
  .kpi .w-period { min-height: 36px; padding: 0 4px; }
  .chip-row { gap: 6px; }
  .table td[data-label]::before { flex-basis: 76px; font-size: 11px; text-transform: none; letter-spacing: 0; font-weight: 400; }
  .table tr { padding: 12px 14px; }
  .table td { font-size: 13px; line-height: 1.5; }
  .table td:first-child { font-weight: 500; }
  .table td:first-child::before { display: none; }
  .table td.num { font-variant-numeric: tabular-nums; }
  .table td .muted, .table td .small { line-height: 1.4; }
  .table.mobile-ledger tr { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px 12px; }
  .table.mobile-ledger td { padding: 0; }
  .table.mobile-ledger td::before { display: none; }
  .table.mobile-ledger td:first-child { grid-column: 1; grid-row: 1; }
  .table.mobile-ledger td:nth-child(2):not(.num) { grid-column: 1; grid-row: 2; color: var(--ink-2); font-size: 12px; }
  .table.mobile-ledger td.num { grid-column: 2; grid-row: 1; justify-content: flex-end; white-space: nowrap; }
  .table.mobile-ledger td[colspan] { grid-column: 1 / -1; }
  .pager { gap: 6px; flex-wrap: wrap; padding: 10px 12px; }
  .pager .spacer { min-width: 0; }
  .listrow { padding: 12px 14px; gap: 8px; }
  .listrow .lr-side { flex-basis: auto; margin-left: auto; }
  .listrow a:not(.btn), #cl-upcoming a, #cl-recent a { color: var(--accent-ink); text-decoration: none; font-weight: 500; }
  .drawer { width: min(100vw, 460px); max-width: 100vw; }
  .modal { width: min(100%, 560px); max-height: calc(100dvh - 32px); }
  .cl-wrap { padding: 16px 16px 28px; }
  .hero { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; }
  .hero .timebox { padding: 9px 10px; }
  #cl-checklist .check { padding: 4px 14px; gap: 12px; }
  #cl-checklist.editing-list .check { flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; }
  #cl-checklist.editing-list .check label { flex-basis: calc(100% - 40px); }
  #cl-checklist.editing-list .check .ctl { margin-left: 30px; gap: 10px; }
  .evi-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
  .evi-actions > * { width: 100%; min-height: 44px; justify-content: center; margin: 0; }
  .evi-thumb { width: 84px; height: 84px; }
  .evi-strip:empty { display: none; }
  .supplies { gap: 8px; padding: 12px 14px; }
}
/* Let enlarged text reflow within the screen instead of imposing intrinsic widths. */
.si-card, .pw-card, .pw-reveal-wrap { min-width:0; }
.si-card input, .pw-card input { min-width:0; }
.si-links { flex-wrap:wrap; gap:10px; }
@media (max-width:820px) {
  #mobilenav > :is(a,button) { flex:1 1 0; min-width:0; text-align:center; overflow-wrap:anywhere; }
  .cl-wrap .week { grid-template-columns:repeat(7,minmax(2.5em,1fr)); gap:4px; padding:12px; overflow-x:auto; }
  .cl-wrap .day { min-width:0; padding:8px 2px; overflow-wrap:anywhere; }
  .cl-wrap .day .n { font-size:9px; }
}
@media (max-width:280px) {
  .si-wrap, .pw-wrap { padding:12px; }
  .si-card, .pw-card { padding:24px 16px; }
  .cleaner-page .kpis { grid-template-columns:minmax(0,1fr); }
}

/* Portal and shared mobile surfaces use the same navigation and spacing. */
.booking-requests { border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); }
.booking-requests > summary { cursor:pointer; padding:14px 16px; font-weight:600; }
.booking-requests > summary .badge { margin-left:8px; }
.convo-actions { position:relative; }
.convo-actions > summary { list-style:none; }
.convo-actions[open] > div { position:absolute; right:0; top:calc(100% + 6px); z-index:20; display:grid; gap:6px; padding:8px; min-width:160px; background:var(--surface); border:1px solid var(--border); border-radius:10px; box-shadow:var(--shadow); }
.convo-status { display:flex; gap:6px; flex-wrap:wrap; }
@media (max-width:820px) {
  /* A stay is one item: dates and channel on the left, net on the right. */
  .owner-page #kpis > :last-child:nth-child(odd) { grid-column:1 / -1; }
  .owner-page #kpis > :last-child:nth-child(odd) .k-face { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
  .owner-page #kpis > :last-child:nth-child(odd) .w-nav { justify-content:flex-end; gap:12px; }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 14px; }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td { padding:0; }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td::before { display:none; }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td:nth-child(1) { grid-column:1;grid-row:1; }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td:nth-child(2) { grid-column:1;grid-row:2; }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td:nth-child(3) { grid-column:1;grid-row:3;justify-content:flex-start;color:var(--ink-2); }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td:nth-child(3)::after { content:' stays';white-space:pre; }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td:nth-child(4) { grid-column:2;grid-row:3;justify-content:flex-end;color:var(--ink-2); }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td:nth-child(4)::after { content:' nights';white-space:pre; }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td:nth-child(5) { grid-column:2;grid-row:1;justify-content:flex-end;font-size:17px; }
  .owner-page #stmt-wrap > table tr:not(.subhead):not(.muted-row) td:nth-child(6) { grid-column:1 / -1;grid-row:4;flex-wrap:wrap;gap:8px; }
  .booking-page .rv-head { display:flex; gap:10px; }
  .booking-page .rv-head > div { min-width:0!important; flex:1 1 calc(100% - 72px)!important; }
  .booking-page .rv-head h2 { font-size:20px; overflow-wrap:anywhere; }
  .booking-page .rv-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .booking-page .rv-stats > div { padding:12px 14px; }
  .booking-page .rv-stats > div:nth-child(odd) { border-right:1px solid var(--border); }
  .booking-page .rv-stats > div:last-child:nth-child(odd) { grid-column:1 / -1; border:0; }
  .booking-page .rv-stats b { font-size:16px; }
  .booking-page .rv-kv .row { align-items:baseline; gap:14px; }
  .booking-page .rv-kv .row > :last-child { text-align:right; overflow-wrap:anywhere; min-width:0; }
  /* The inbox owns the viewport. Only the list, history or details scroll. */
  body.app-frame { overflow:hidden; height:100dvh; background:var(--surface); }
  body.app-frame .shell { min-height:0; height:var(--inbox-height,calc(100dvh - 60px)); }
  body.app-frame .main { display:flex; flex-direction:column; min-height:0; height:100%; }
  body.app-frame .topbar { flex:none; margin:0; padding:14px 16px; border-bottom:1px solid var(--border); }
  body.app-frame.inbox-conversation .topbar { display:none; }
  body.app-frame .content { display:flex; flex-direction:column; flex:1; min-height:0; gap:0; padding:0; }
  body.app-frame .inbox { flex:1; min-height:0; height:100%; border:0; border-radius:0; }
  body.app-frame .inbox > .threads,body.app-frame .inbox > .convo,body.app-frame .inbox > .ctx { border:0; border-radius:0; }
  body.app-frame #requests { margin:0!important; }
  body.app-frame .booking-requests { border-width:0 0 1px;border-radius:0; }
  body.app-frame .convo-head { flex-wrap:nowrap; gap:8px; padding:10px 12px; }
  body.app-frame .convo-head .avatar-sm,body.app-frame .convo-status { display:none; }
  body.app-frame .convo-head .convo-who { flex:1;min-width:0; }
  body.app-frame .convo-who .small { white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px; }
  body.app-frame .convo-head .btn { min-width:0; padding:7px 8px;font-size:12px; }
  body.app-frame .convo-head #convo-back { font-size:0; width:36px; }
  body.app-frame .convo-head #convo-back::before { content:'‹';font-size:28px;line-height:1; }
  body.app-frame .convo-body { padding:16px 12px;overscroll-behavior:contain; }
  body.app-frame .convo-reply { padding:10px 12px; }
  body.app-frame #ai-chips { flex-wrap:nowrap; overflow-x:auto; }
  body.app-frame #ai-chips .chip { flex:0 0 auto;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  body.app-frame.keyboard-open #mobilenav { display:none; }
  #generate-form .row > div { min-width:0;flex:1 1 120px; }
  #generate-form .input { width:100%;min-width:0; }
}

@media (max-width:820px) {
  .booking-page .rv-kv3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .booking-page .rv-kv3 > :last-child { grid-column:1 / -1; }
  .booking-page .rv-kv3 .input { width:100%;min-width:0; }
}
@media (max-width:820px) {
  .owner-page #stmt-wrap .row-selected { background:var(--accent-soft); }
  .owner-page #stmt-wrap .row-selected td { background:transparent; }
}
/* Secondary controls remain secondary on a phone. */
@media (max-width:820px) {
  .btn { min-height:36px;padding:7px 11px;font-size:13px;line-height:1.25; }
  .btn.sm { min-height:32px;padding:5px 9px;font-size:12px;border-radius:6px; }
  .chip,.pager button,.pager select,.w-step,.w-period,.panbtn { min-height:32px; }
  .kebab,.iconbtn { min-width:32px;min-height:32px; }
  .kpi .w-step,.kpi .w-period { min-height:28px; }
  .kpi .w-nav { margin:0;padding:0; }
  .card .card-head { gap:6px; }
  .card .card-head .btn,.card .card-head .cf-exports { flex:none; }
  .cf-exports { gap:6px; }
  .cf-schedule-heading { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:4px; }
  .cf-schedule-heading h2 { margin-bottom:3px; }
  .cf-schedule-heading .small { font-size:12px;line-height:1.4; }
  .cf-schedule-heading .cf-actions { flex-wrap:nowrap; }
  /* The same clean is already the first actionable row in Up next. */
  .cf-schedule-heading #btn-open-today { display:none!important; }
  .cf-schedule-heading #btn-timeoff { white-space:nowrap; }
  .label-wide { display:none; }
  .banner .btn { width:auto;flex:none; }
  .diff .diff-actions .btn { flex:0 1 auto; }
}

/* Keep dates beside the measure; the menu provides stepping on narrow cards. */
@media (max-width:820px) {
  .kpi-nav .w-step { display:none; }
  .kpi-nav .w-period { min-height:28px;max-width:64px;padding:0 2px;font-size:10px; }
  .kpi-nav .k-head { min-height:28px; }
  .kpi-nav .k-face { flex:none; }
  .kpi-nav .k-value { margin-top:3px; }
  .content.stack > :empty { display:none; }
  .dashboard-page .content.stack { gap:14px!important; }
  .dashboard-page .topbar { display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;padding-bottom:8px; }
  .dashboard-page .topbar > :first-child { grid-column:1 / -1; }
  .dashboard-page .topbar > .spacer { display:none; }
  .dashboard-page #period { grid-column:1;gap:3px; }
  .dashboard-page #btn-new-res { font-size:12px;min-height:32px;padding:6px 8px; }
  .dashboard-page #topbar-more { grid-column:3; }
  #money-card .card-head { display:grid;grid-template-columns:minmax(0,1fr) auto; }
  #money-card .card-head > .spacer { display:none; }
  #money-statement-link { grid-column:2;grid-row:1; }
  #money-hint { grid-column:1 / -1;grid-row:2;font-size:11px; }
  .flow .seg { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:9px 14px; }
  .flow .f-label { font-size:12px; }
  .flow .f-amt { font-size:16px;line-height:1.35; }
  .flow .f-sub { grid-column:1 / -1;font-size:11px;line-height:1.35;margin:0; }
  #briefing-card .card-body > :first-child { gap:8px!important; }
  #briefing-card .avatar-sm { width:24px;height:24px;font-size:10px; }
  #briefing-label { font-size:12px!important; }
  #briefing-generated { font-size:10px; }
}
@media (max-width:360px) {
  .dashboard-page #btn-new-res { max-width:84px; }
}

@media (max-width:820px) {
  .dashboard-page .topbar:has(>.theme-toggle) { padding-right:16px; }
  .dashboard-page .topbar > :first-child { padding-right:40px; }
  .dashboard-page #period { flex-wrap:nowrap; }
  .dashboard-page #period .chip { padding:5px 7px; }
  .dashboard-page #period .panbtn { min-width:26px;width:26px;padding:0; }
}

@media (max-width:820px) {
  .task-decision { display:grid;grid-template-columns:16px minmax(0,1fr);align-items:start;gap:8px; }
  .task-decision > .lr-side { grid-column:2;justify-content:flex-end; }
  .task-decision .lr-main { min-width:0; }
  .card-head:has(> .hint):has(> .btn) { display:grid;grid-template-columns:minmax(0,1fr) auto; }
  .card-head:has(> .hint):has(> .btn) > .hint { grid-column:1 / -1;grid-row:2; }
  .card-head:has(> .hint):has(> .btn) > .btn { grid-column:2;grid-row:1; }
  .card-head:has(> .hint):has(> .btn) > .spacer { display:none; }
  .kpis > .kpi:last-child:nth-child(odd) { grid-column:1 / -1; }
}

.clean-detail-heading { padding:0; }
.clean-detail-heading:has(>.theme-toggle) { padding-right:44px; }
.clean-detail-heading>.theme-toggle { top:0;right:0; }
@media (max-width:820px) {
  .commission-ledger tbody tr { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px; }
  .commission-ledger td { padding:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px; }
  .commission-ledger td:first-child { grid-column:1 / -1; }
  .commission-ledger td::before { flex-basis:auto!important;font-size:10px!important; }
  .commission-ledger td[colspan] { grid-column:1 / -1; }
}

@media (max-width:820px) {
}
/* The calendar owns its scroll area; mobile navigation owns the bottom edge. */
@media(max-width:820px) {
 html { scrollbar-width:none; }
 html::-webkit-scrollbar,body::-webkit-scrollbar { display:none; }
 .calendar-page .shell { min-height:0;height:calc(100dvh - 56px - env(safe-area-inset-bottom) - var(--calendar-preview-height,0px)); }
 .calendar-page .cal-main { height:100%;min-height:0; }
 .calendar-page .cal-main>.content { padding:8px 12px 0; }
 .calendar-page .topbar { display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px!important;padding:12px!important; }
 .calendar-page .topbar h1 { display:block;grid-column:1 / -1;margin:0;padding-right:40px;font-size:18px; }
 .calendar-page .topbar>.spacer { display:none; }
 .calendar-page #cv2-today { grid-column:1;grid-row:2; }
 .calendar-page #cv2-jump { grid-column:2;grid-row:2;width:100%!important;min-width:0;height:32px;padding:4px 6px!important;font-size:12px; }
 .calendar-page .topbar>div:has(#cv2-filter-btn) { grid-column:3;grid-row:2; }
 .calendar-page #cv2-filter-menu { left:auto;right:0; }
 .calendar-page #cv2-props { grid-column:1 / -1;grid-row:4;gap:5px; }
 .calendar-page #rate-channel { grid-column:1 / -1;grid-row:3;justify-self:start;max-width:100%;height:28px;border:0;background:transparent;padding:3px 22px 3px 0!important;color:var(--ink-2);font-size:11px; }
 .calendar-page .topbar>.theme-toggle { top:9px;right:12px; }
 #months-card .card-head { display:grid;grid-template-columns:minmax(0,1fr) auto; }
 #months-window { grid-column:1 / -1;grid-row:2; }
 #months-card .panbar { grid-column:2;grid-row:1; }
}

/* A wrapped title must not leave a flex spacer on the period controls' row.
   Use the available CSS viewport at browser/display zoom; preserve text scaling. */
@media (max-width:820px) {
  body:not(.dashboard-page):not(.calendar-page) .topbar:has(> #period) {
    display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:10px;
  }
  body:not(.dashboard-page):not(.calendar-page) .topbar:has(> #period)>.spacer { display:none; }
  body:not(.dashboard-page):not(.calendar-page) .topbar>#period { justify-self:start;margin:0;max-width:100%; }
  .topbar #period { display:flex;align-items:center;flex-wrap:nowrap;gap:6px; }
  .topbar #period .panbtn { flex:0 0 32px;width:32px;min-width:32px;height:32px;min-height:32px; }
  .topbar #period .chip { min-height:32px;max-width:100%;padding:5px 9px;line-height:1.25; }
  .topbar #period .chip>span { min-width:0; }
  .cf-schedule-heading { gap:8px; }
  .cf-schedule-heading .cf-actions { flex-shrink:0; }
  .card-head .cf-exports { display:flex;flex-wrap:nowrap; }
}

@media (max-width:360px) {
  #mobilenav>:is(a,button) { padding-left:2px;padding-right:2px;font-size:9px; }
  #mobilenav>:is(a,button)>span { white-space:nowrap;overflow-wrap:normal; }
}
@media (max-width:300px) {
  .kpis { grid-template-columns:minmax(0,1fr)!important; }
  .kpi .k-value { overflow-wrap:normal; }
}

@media (max-width:820px) {
  .panbar { flex:none;gap:4px; }
  .panbar .panbtn { flex:0 0 28px;min-width:28px;width:28px;min-height:28px;height:28px;padding:0; }
}

/* Preserve desktop columns for ledgers that should scroll, never become cards. */
@media(max-width:820px) {
  #res-wrap { overflow-x:auto;max-width:100%; }
  .table.table-preserve { display:table;width:100%; }
  .table.table-preserve thead { display:table-header-group; }
  .table.table-preserve tbody { display:table-row-group; }
  .table.table-preserve tr { display:table-row;padding:0;border:0; }
  .table.table-preserve :is(th,td) { display:table-cell;padding:11px 16px;border-bottom:1px solid var(--border);vertical-align:middle;white-space:nowrap;overflow-wrap:normal;font-size:13px;font-weight:400; }
  .table.table-preserve th { font-size:11px; }
  .table.table-preserve td::before { display:none!important; }
  .table.table-preserve .num,.table.table-preserve .open-cell { text-align:right; }
  .table.table-preserve .open-cell a { display:inline;min-height:0; }
}

.res-mobile { display:none; }
.res-guest-link { color:inherit;text-decoration:none; }
.res-guest-link:hover { text-decoration:underline; }
/* Same single-line ledger rhythm as monthly figures: secondary columns yield. */
@media(max-width:820px) {
  #restable { table-layout:fixed; }
  #restable :is(th,td) { padding:10px 6px;font-size:11px;white-space:nowrap; }
  #restable th { font-size:10px; }
  #restable :is(th,td):first-child { padding-left:12px; }
  #restable .res-desktop,#restable .res-nights,#restable .res-extra-money,#restable .res-status,#restable .open-cell { display:none; }
  #restable .res-mobile { display:inline; }
  #restable .res-dates { width:102px; }
  #restable .res-channel { width:82px; }
  #restable .num { width:84px;padding-right:12px; }
  #restable .res-guest-link { display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
  #restable .res-guest-link b { font-weight:500; }
  #restable .badge { font-size:10px;padding:2px 5px; }
  #restable th:nth-child(3) { width:82px; }
}
@media(max-width:480px) {
  #restable .res-channel,#restable th:nth-child(3) { display:none; }
}
@media(max-width:360px) {
  #restable :is(th,td) { padding:9px 4px;font-size:10px; }
  #restable :is(th,td):first-child { padding-left:8px; }
  #restable .res-dates { width:84px; }
  #restable .num { width:74px;padding-right:8px; }
}

/* Restore secondary reservation columns progressively as space permits. */
@media(min-width:520px) and (max-width:820px) {
  #restable .res-status { display:table-cell;width:88px; }
}
@media(min-width:600px) and (max-width:820px) {
  #restable .open-cell { display:table-cell;width:54px;padding-right:12px; }
}
