/*
 * Turnli v0.23.0-rc1.17 — Launch Stabilization / RC Preparation
 * Final density, readability, responsive, and interaction guardrails.
 * This layer is intentionally scoped and additive: it does not change data contracts.
 */
:root{
  --tl-a13-page-gap:clamp(14px,1.35vw,22px);
  --tl-a13-card-pad:clamp(14px,1.25vw,20px);
  --tl-a13-readable-small:11px;
  --tl-a13-readable-copy:12px;
  --tl-a13-touch:44px;
}

/* ---------- Cross-route sizing safety ---------- */
html,body{min-width:0;max-width:100%}
body{overflow-x:clip}
:where(.app-shell-v2,.app-main-v2,.app-content-v2,.view-panel-v2,.panel-v2,.settings-card-v2,
       .flow-shell-v23,.reservation-shell-v23,.guestbook-panel-v23,.host-day-shell-v2310,.ops12-shell,
       .public-shell,.join-shell,.status-shell,.reserve-shell-v23,.kiosk-shell-v15,.tv-shell-v145){min-width:0}
:where(.panel-v2,.settings-card-v2,.flow-item-v23,.reservation-card-v23,.guest-card-v23,.host-day-now-item-v2310,
       .ops12-metric,.ops12-event){overflow-wrap:anywhere}

/* Operational text must remain readable; width pressure should collapse layout first. */
body.app-body :where(.field-help,.settings-title p,.panel-head-v2 p,.page-head-v2 p:not(.view-kicker),.reservation-footnote-v23,.flow-footnote-v23){font-size:max(var(--tl-a13-readable-small),.72rem)}
body.app-body :where(.btn,.btn-v2,button,input,select,textarea){line-height:1.25}

/* ---------- Dashboard shell ---------- */
body.app-body .app-content-v2{padding-inline:clamp(10px,1.25vw,22px)}
body.app-body .view-shell-v2{width:100%;max-width:1960px;margin-inline:auto}
body.app-body .topbar-v2{min-width:0;padding-inline:clamp(10px,1.2vw,20px)}
body.app-body .location-title{min-width:0}
body.app-body .location-title>div{min-width:0}
body.app-body .location-title strong,body.app-body .location-title small{max-width:min(34vw,420px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.app-body .topbar-actions-v2{min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
body.app-body .page-head-v2{margin-bottom:clamp(12px,1.15vw,20px)}
body.app-body .page-head-v2 p:not(.view-kicker){max-width:74ch}

/* Settings rows breathe before they wrap into awkward micro-columns. */
body.app-body :where(.setting-row-v2,.settings-title-row-v4,.hours-meta-v4){min-width:0}
body.app-body .setting-row-v2>div:first-child{min-width:0}
body.app-body .setting-row-v2 small{line-height:1.45}

@media (max-width:1360px){
  body.app-body .command-trigger-v5 kbd{display:none}
  body.app-body .topbar-actions-v2 .btn-sm{padding-inline:10px}
  body.app-body .sync-control-v14{max-width:190px}
}
@media (max-width:1180px){
  body.app-body .app-content-v2{padding-inline:12px}
  body.app-body .topbar-v2{align-items:flex-start}
  body.app-body .topbar-actions-v2{row-gap:6px}
  body.app-body .location-title strong,body.app-body .location-title small{max-width:38vw}
}
@media (max-width:820px){
  body.app-body .app-content-v2{padding-inline:10px}
  body.app-body .page-head-v2 p:not(.view-kicker){font-size:12px!important;line-height:1.48!important}
}

/* ---------- Reservations: readable without becoming bulky ---------- */
.reservation-shell-v23{gap:18px}
.reservation-summary-v23{gap:12px}
.reservation-grid-v23{gap:16px}
.reservation-column-v23,.reservation-recent-v23{padding:17px}
.reservation-card-v23{padding:12px;gap:12px}
.reservation-time-v23 span{font-size:10.5px}
.reservation-card-title-v23 span{font-size:11px}
.reservation-card-title-v23 em{font-size:10px;padding:4px 8px}
.reservation-card-main-v23>p{font-size:11.5px}
.reservation-flags-v23 span{font-size:10px;min-height:22px;display:inline-flex;align-items:center}
.reservation-actions-v23{gap:7px}
.reservation-actions-v23 button{min-height:34px;padding:7px 9px;font-size:10.5px}
.reservation-section-head-v23 p{font-size:11.5px}
.reservation-rules-v23 summary small{font-size:11px}
#reservationRulesForm{gap:12px}
#reservationRulesForm label>span{font-size:10.5px}
#reservationRulesForm input,#reservationRulesForm select{min-height:40px;font-size:12px}
.reservation-form-grid-v23 label>span,.reservation-form-grid-v23 legend{font-size:11px}
.reservation-table-grid-v23 small{font-size:10px}
.reservation-transport-v238 span{font-size:10.5px}
@media(max-width:1180px){
  #reservationRulesForm{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:720px){
  .reservation-shell-v23{gap:14px}
  .reservation-column-v23,.reservation-recent-v23{padding:14px}
  .reservation-summary-v23 article{padding:14px}
  .reservation-head-actions-v23{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .reservation-head-actions-v23 .btn{width:100%}
}
@media(max-width:420px){
  .reservation-summary-v23{grid-template-columns:1fr}
  .reservation-head-actions-v23{grid-template-columns:1fr}
}

/* ---------- Guestbook: earlier collapse + legible metadata ---------- */
.guestbook-shell-v23{gap:18px;grid-template-columns:minmax(280px,340px) minmax(0,1fr)}
.guestbook-directory-head-v23{padding:17px}
.guest-row-v23{padding:12px}
.guest-row-meta-v23{font-size:10.5px}
.guest-badge-v23{font-size:10px}
.guest-metric-v23 span{font-size:10px}
.guest-card-v23 label{font-size:10.5px}
.guest-tag-v23{font-size:10.5px}
.guest-event-top-v23 time{font-size:10.5px}
.guest-event-v23 p{font-size:11.5px}
@media(max-width:1080px){
  .guestbook-shell-v23{grid-template-columns:1fr}
  .guestbook-list-v23{max-height:330px}
  .guestbook-directory-v23{position:relative}
}
@media(max-width:620px){
  .guestbook-list-v23{max-height:290px}
  .guest-metrics-v23{grid-template-columns:1fr 1fr}
}

/* ---------- Host Day: preserve whitespace on ordinary laptops ---------- */
.host-day-shell-v2310{padding:clamp(16px,1.6vw,28px);gap:20px}
.host-day-layout-v2310{grid-template-columns:minmax(0,1fr) minmax(280px,330px);gap:22px}
.host-day-now-v2310,.host-day-upcoming-v2310,.host-day-recent-card-v2310{padding:21px}
.host-day-window-events-v2310{padding:8px}
.host-day-event-v2310{padding:10px;gap:11px}
.host-day-event-copy-v2310 small{font-size:.74rem}
.host-day-event-state-v2310{font-size:.7rem;padding:5px 8px}
.host-day-pulse-grid-v2310 small{font-size:.7rem}
@media(max-width:1280px){
  .host-day-layout-v2310{grid-template-columns:1fr}
  .host-day-side-v2310{position:static;grid-template-columns:repeat(3,minmax(0,1fr))}
  .host-day-pulse-card-v2310{grid-column:span 2}
}
@media(max-width:900px){
  .host-day-side-v2310{grid-template-columns:1fr 1fr}
  .host-day-pulse-card-v2310{grid-column:1/-1}
  .host-day-windows-v2310{grid-template-columns:1fr}
}
@media(max-width:540px){
  .host-day-topline-v2310{grid-template-columns:1fr 1fr}
  .host-day-side-v2310{grid-template-columns:1fr}
  .host-day-pulse-card-v2310{grid-column:auto}
  .host-day-now-item-v2310{grid-template-columns:34px minmax(0,1fr)}
  .host-day-now-item-v2310 button{grid-column:2;width:100%;min-height:38px}
}
@media(max-width:390px){.host-day-topline-v2310{grid-template-columns:1fr}}

/* ---------- Flow Intelligence: don't solve density with microcopy ---------- */
.flow-lanes-v23{gap:12px}
.flow-item-v23{padding:12px}
.flow-item-v23 small{font-size:11.5px}
.flow-item-v23 button{min-height:36px;font-size:11.5px}
.flow-item-flags-v23 span{font-size:10px;min-height:22px}
.flow-guest-profile-v23 span{font-size:11px}
.flow-guest-profile-v23 small{font-size:10.5px}
.flow-guest-stats-v23 span{font-size:10.5px}
.flow-intel-strip-v23 span,.flow-balance-v239 span{font-size:10.5px}
.flow-intel-strip-v23 em,.flow-balance-v239 em{font-size:11px}
@media(max-width:1280px){
  .flow-main-grid-v23{grid-template-columns:1fr}
  .flow-side-v23{grid-template-columns:1fr 1fr}
}
@media(max-width:820px){
  .flow-side-v23{grid-template-columns:1fr}
  .flow-summary-v23{grid-template-columns:1fr 1fr}
}
@media(max-width:420px){.flow-summary-v23{grid-template-columns:1fr}}

/* ---------- Operations Intelligence / Replay ---------- */
.ops12-shell{gap:18px}
.ops12-head,.ops12-signals,.ops12-replay{padding:clamp(16px,1.4vw,22px)}
.ops12-metrics{gap:12px}
.ops12-metric{padding:16px}
.ops12-metric>span{font-size:10.5px}
.ops12-metric small{font-size:11.5px}
.ops12-event time{font-size:10.5px}
.ops12-event small{font-size:11px}
.ops12-replay-note p{font-size:11.5px}
.ops12-replay-note small{font-size:10.5px}
@media(max-width:1080px){.ops12-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){
  .ops12-head{gap:14px}
  .ops12-metrics{grid-template-columns:1fr 1fr}
  .ops12-replay-controls{grid-template-columns:1fr}
  .ops12-replay-controls label{grid-column:auto}
}
@media(max-width:390px){.ops12-metrics,.ops12-frame-grid{grid-template-columns:1fr}}

/* ---------- Tables & Floor: protect the floor canvas from surrounding chrome ---------- */
html.turnli-floor-embedded .floor-workspace{min-width:0}
html.turnli-floor-embedded .canvas-panel{min-width:0}
html.turnli-floor-embedded .floor-scroll{overscroll-behavior:contain}
html.turnli-floor-embedded :where(.queue-card,.table-grid-card-v0162,.seat-context,.inspector){min-width:0}
@media(min-width:961px) and (max-width:1320px){
  html.turnli-floor-embedded .floor-workspace{grid-template-columns:minmax(205px,228px) minmax(0,1fr)!important}
}
@media(max-width:760px){
  html.turnli-floor-embedded .seat-context-actions .btn{min-height:var(--tl-a13-touch)}
}

/* ---------- Public/customer surfaces ---------- */
:where(body.public-body,body.reserve-body-v23) :where(button,.btn,input,select,textarea){min-height:40px}
@media(max-width:640px),(pointer:coarse){
  :where(body.public-body,body.reserve-body-v23) :where(button,.btn,input:not([type=checkbox]):not([type=radio]):not([type=range]),select){min-height:var(--tl-a13-touch)}
  :where(body.public-body,body.reserve-body-v23) input, :where(body.public-body,body.reserve-body-v23) select, :where(body.public-body,body.reserve-body-v23) textarea{font-size:16px}
}

/* ---------- Coarse pointers / mobile navigation ---------- */
@media(pointer:coarse){
  body.app-body :where(button,.btn,.btn-v2,.icon-btn-v2){min-height:var(--tl-a13-touch)}
  body.app-body :where(.icon-btn-v2,.modal-close,.reservation-close-v23){min-width:var(--tl-a13-touch)}
}
@media(max-width:760px){
  .mobile-nav-v2 button span,.mobile-nav-v2>a span{font-size:.64rem!important}
}

/* ---------- Motion / accessibility ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
@media(forced-colors:active){
  :where(.ops12-metric,.reservation-card-v23,.guest-card-v23,.host-day-now-item-v2310,.flow-item-v23){box-shadow:none!important}
}

/* ---------- Command palette and mobile form legibility ---------- */
.command-search-v5 input{font-size:12px}
.command-group-label-v5{font-size:10px;letter-spacing:.08em}
@media(max-width:760px){
  body.app-body :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea){font-size:16px!important}
  body.app-body :where(.number-input,.slug-input){min-width:0}
  body.app-body :where(.number-input input,.slug-input input){min-width:0}
}