/* Mobile layout is isolated here; desktop keeps its existing presentation. */
.ace-mobile-nav-toggle{display:none}
@media(max-width:860px){
  :root{scroll-padding-top:90px}
  body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body.ace-mobile-dialog-open{overflow:hidden}
  #app,.portal-body,.ace-account-shell,.booking-main,.booking-summary{min-width:0;max-width:100%}
  .container{padding-inline:20px}
  .ace-public .site-head,.ace-public .site-head.over{position:relative;inset:auto;margin:0;background:var(--theme-surface,#000);border-bottom:1px solid var(--theme-border,#25272d);z-index:40}
  .ace-public .site-nav{height:auto;min-height:78px;padding:12px 16px;gap:10px}
  .ace-public .site-nav .brand-logo{width:96px;height:44px}
  .ace-public .nav-actions{gap:8px;min-width:0}
  .ace-public .nav-actions>a.btn:not(.sign-in-button){display:none}
  .ace-public .nav-actions .sign-in-button{font-size:14px;min-height:44px;padding:10px 12px;max-width:112px;white-space:normal;text-align:center}
  .ace-public .menu-button,.theme-toggle,.icon-button{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  .ace-public .site-nav .nav-links{top:100%;left:0;right:0;padding:12px 16px 20px;max-height:calc(100dvh - 90px);overflow-y:auto;gap:0;background:var(--theme-surface,#080b12);color:var(--theme-text,#fff);border-color:var(--theme-border,#28303e)}
  .ace-public .site-nav .nav-links a{width:100%;font-size:14px;min-height:48px;display:flex;align-items:center;padding:12px 8px;border-bottom:1px solid var(--theme-border,#28303e)}
  .ace-public .ace-hero{min-height:560px;margin:10px 10px 0;padding:64px 20px 48px;border-radius:14px}
  .ace-public .ace-hero h1{font-size:clamp(34px,8.8vw,60px)}
  .ace-public .ace-hero .hero-content{padding-top:0}
  .ace-public .ace-hero p{font-size:16px;line-height:1.65;max-width:100%}
  .ace-hero-actions{display:grid;grid-template-columns:1fr;width:100%;gap:12px}
  .ace-hero-actions .btn{width:100%;min-height:50px;font-size:16px}
  .ace-hero-proof{gap:12px;font-size:12px;line-height:1.5}
  .ace-public .section,.container.section{padding-block:48px}
  .ace-company{gap:26px;grid-template-columns:minmax(0,1fr)}
  .ace-company-photo{height:300px}
  .ace-services,.cards,.portal .cards,.client-browse .cards,.service-grid,.cities,.footer-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .ace-services{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .ace-service{min-width:0;padding:22px 16px}
  .ace-service h3{font-size:18px}
  .ace-service p{font-size:15px}
  .ace-public .car-photo-wrap{height:230px}
  .ace-public .car-content{padding:22px}
  .ace-public .car-content h3{font-size:18px;line-height:1.5}
  .ace-public .car-go{width:48px;height:48px}
  .page-intro,.content-page{padding:36px 20px}
  .page-intro>.container{padding:0}
  .page-intro h1,.content-page h1,.detail-title{font-size:clamp(32px,8vw,46px);overflow-wrap:anywhere}
  .search-panel,.client-browse .search-panel,.ace-account-browse .search-panel{grid-template-columns:minmax(0,1fr);padding:16px;gap:0}
  .search-panel label{padding:12px 0;border-right:0;border-bottom:1px solid var(--theme-border,var(--line))}
  .search-panel .btn{margin-top:12px;width:100%}
  .search-panel .ace-date-trigger{min-height:44px;font-size:16px}
  .search-panel label span{font-size:14px}
  .filters{gap:8px;flex-wrap:wrap}
  .filter{min-height:44px;font-size:14px;padding:10px 14px;white-space:normal}
  .fleet-count{font-size:14px;line-height:1.7;overflow-wrap:anywhere}
  .fleet-count>span{float:none!important;display:block}
  .detail-grid,.booking-layout,.settings-card,.op-grid,.op-signup .op-grid,.rewards-middle,.rewards-top{grid-template-columns:minmax(0,1fr);gap:24px}
  .detail-image{height:auto;aspect-ratio:4/3;object-fit:cover}
  .detail-spec-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .rules>div,.costs>div{gap:12px;flex-wrap:wrap;overflow-wrap:anywhere}
  .costs b{max-width:100%;text-align:right}
  .owner-banner,.footer-bottom,.document-row,.panel-head{flex-wrap:wrap;gap:16px}
  .owner-stats{grid-template-columns:minmax(0,1fr)}
  .footer a{min-height:44px;display:flex;align-items:center;line-height:1.5}
  .footer-bottom{align-items:flex-start;font-size:13px}

  /* A compact menu opens the same account destinations on phones. */
  .ace-mobile-nav-toggle{display:flex;align-items:center;gap:12px;width:100%;min-height:50px;padding:12px 16px;border:1px solid var(--theme-border);border-radius:6px;background:var(--theme-soft);color:var(--theme-text);text-align:left;font-size:15px}
  .ace-mobile-nav-toggle>span:first-child{color:var(--theme-muted)}
  .ace-mobile-nav-toggle strong{flex:1;min-width:0;overflow-wrap:anywhere;font-size:15px}
  .ace-mobile-nav-symbol{font-size:24px;line-height:1}
  .portal .ace-mobile-nav-panel[data-mobile-open=false],.ace-account-nav.ace-mobile-nav-panel[data-mobile-open=false]{display:none}
  .portal .ace-mobile-nav-panel[data-mobile-open=true],.ace-account-nav.ace-mobile-nav-panel[data-mobile-open=true]{display:grid;margin-top:14px}
  .portal .nav-primary,.portal[data-portal=client] .nav-primary{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .portal .side-nav a,.portal[data-portal=client] .side-nav a{min-height:50px;font-size:15px;padding:12px;white-space:normal;overflow-wrap:anywhere}
  .portal .nav-group summary,.portal[data-portal=client] .nav-group summary{min-height:48px;font-size:15px;padding:12px 14px}
  .portal[data-portal=client] .nav-group-links{position:static;margin:12px 0 0;box-shadow:none;width:100%}
  [data-theme] .portal:not([data-portal=client]) .sidebar{padding:18px 20px;max-height:none}
  .portal .sidebar>.portal-brand{margin-bottom:14px}
  .portal[data-portal=client] .client-club-header{grid-template-columns:minmax(0,1fr);padding:18px 20px;gap:16px}
  .portal[data-portal=client] .portal-top{grid-column:1;grid-row:2;width:100%}
  .portal[data-portal=client] .sidebar>div:not(.side-bottom){grid-row:3;grid-column:1}
  .portal[data-portal=client] .sidebar>.portal-brand{margin:0}
  .portal-top{min-height:72px;padding:14px 20px;gap:12px;align-items:center}
  .portal-top .bread{flex:1 1 100%;max-width:none;font-size:13px!important;line-height:1.5}
  .portal-top .bread b{font-size:14px}
  .portal-top>.row{width:100%;gap:12px;justify-content:flex-end}
  .portal-top .select-small{max-width:100%;font-size:16px;min-height:44px}
  .portal-account summary{min-height:44px}
  .portal-account-menu{max-width:calc(100vw - 40px)}
  .portal-account-menu a,.portal-account-menu button{min-height:44px;font-size:15px}
  .portal-main,.portal[data-portal=client] .portal-main{padding:28px 20px;min-width:0}
  .portal .dashboard-title h1{font-size:32px}
  .portal .dashboard-title p,.portal .stat-card .label,.portal .stat-card .stat-note,.portal-note{font-size:14px;line-height:1.6}
  .portal .stat-card .label{max-width:none}
  .portal .stat-card .value{font-size:28px}
  .portal .btn,.portal[data-portal=client] .btn,.btn.compact,.data-table .btn{min-height:46px;font-size:15px;line-height:1.45;white-space:normal;padding:12px 16px}
  .portal .panel,.ace-account-main .panel{min-width:0}
  .portal .table-panel{padding-inline:0}
  .dashboard-panels{grid-template-columns:minmax(0,1fr)}
  .portal .portal-section-head,.dashboard-title,.handover-top,.handover-rental{flex-wrap:wrap}
  .portal[data-portal=client] .portal-welcome{margin-inline:-20px}
  .portal[data-portal=client] .portal-welcome-copy{padding:48px 24px 88px}
  .portal[data-portal=client] .portal-welcome h1{font-size:clamp(40px,10vw,58px)}
  .portal[data-portal=client] .portal-welcome p{font-size:16px}
  .portal[data-portal=client] .portal-welcome .btn{font-size:15px;letter-spacing:0}
  .portal[data-portal=client] .client-greeting{max-width:none;font-size:15px;overflow-wrap:anywhere}
  .ace-account-header{padding:20px;gap:18px}
  .ace-account-header>.ace-mobile-nav-toggle{margin-top:0}
  .ace-account-identity{width:100%;gap:12px}
  .ace-account-identity>span:first-child{flex:1 1 100%;font-size:16px}
  .ace-account-nav.ace-mobile-nav-panel{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .ace-account-nav a{font-size:15px;min-height:48px;padding:12px 10px;text-align:center}
  .ace-account-main{padding:30px 20px 60px}
  .ace-account-main>h1{font-size:clamp(36px,9vw,46px);overflow-wrap:anywhere}
  .ace-account-overview,.ace-auth-layout{grid-template-columns:minmax(0,1fr)}
  .ace-account-browse .cards{grid-template-columns:minmax(0,1fr)}
  .ace-auth-layout{padding:36px 20px;gap:24px}
  .ace-auth-copy h1{font-size:42px}
  .ace-auth-panel{padding:24px}

  /* Tables become labelled records without removing click or billing actions. */
  table.data-table.ace-mobile-records{display:block;min-width:0!important;width:100%;table-layout:auto}
  .ace-mobile-records thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .ace-mobile-records tbody{display:grid;gap:14px;padding:14px}
  table.ace-mobile-records tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:18px;border:1px solid var(--theme-border);border-radius:6px;background:var(--theme-surface)}
  table.data-table.ace-mobile-records td{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;max-width:none;padding:0;border:0;white-space:normal;font-size:15px;overflow-wrap:anywhere}
  table.ace-mobile-records td:before{content:attr(data-label);color:var(--theme-muted);font-size:12px;line-height:1.5;font-weight:600;letter-spacing:.03em}
  table.ace-mobile-records td[colspan]{grid-column:1/-1}
  table.ace-mobile-records td[colspan]:before{display:none}
  table.ace-mobile-records td strong,table.ace-mobile-records .sub{font-size:14px}
  table.ace-mobile-records .row,table.ace-mobile-records .table-car{flex-wrap:wrap;min-width:0}
  table.ace-mobile-records td:last-child{grid-column:1/-1;align-items:stretch}
  .crm-revenue.ace-mobile-records td:last-child{grid-column:auto}
  .table-wrap{max-width:100%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .hq-calendar th:first-child{min-width:150px}
  .calendar-grid{padding:6px}
  .calendar-week{font-size:10px}
  .calendar-day{padding:5px 3px;min-height:70px}
  .calendar-day span{font-size:10px;line-height:1.3}

  /* Touch-friendly forms and scrollable dialogs fit the mobile viewport. */
  .form-grid,.summary-checks,.crm-review-grid,.reservation-archive-grid .crm-review-grid{grid-template-columns:minmax(0,1fr)}
  .form-field,body[data-portal-role] dialog .form-field{font-size:15px!important;gap:8px}
  input:not([type=checkbox]):not([type=radio]),select,textarea{min-width:0;max-width:100%;font-size:16px!important;min-height:48px;line-height:1.5}
  input[type=file]{width:100%;padding:12px 8px;white-space:normal}
  input[type=file]::file-selector-button{padding:10px;border:1px solid var(--theme-border);border-radius:4px;background:var(--theme-soft);color:var(--theme-text);font:inherit;margin-right:10px}
  .check-row,.saved-fee-option{min-height:44px;padding-block:10px;font-size:15px;line-height:1.6}
  input[type=checkbox],input[type=radio]{width:22px;height:22px;min-height:0;flex-shrink:0}
  fieldset{min-width:0;max-width:100%}
  legend{max-width:100%;white-space:normal}
  dialog:not(.ace-datepicker){width:calc(100% - 16px);max-width:720px;max-height:calc(100dvh - 16px);margin:auto;padding:0;overflow:auto;overscroll-behavior:contain;border-radius:12px!important}
  dialog .modal-head,body[data-portal-role] dialog .modal-head{padding:16px 18px;position:sticky;top:0;z-index:20}
  dialog .modal-head h2,body[data-portal-role] dialog .modal-head h2{font-size:23px!important;line-height:1.3}
  dialog .modal-body,body[data-portal-role] dialog .modal-body{padding:20px 18px max(24px,env(safe-area-inset-bottom))}
  .modal-actions,.crm-actions,.handover-footer{display:flex;flex-wrap:wrap;gap:12px}
  .modal-actions .btn,.crm-actions .btn{flex:1 1 150px;min-height:48px;white-space:normal}
  .crm-flow{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:16px 0}
  .crm-flow li{font-size:13px;padding:10px 0;line-height:1.5;overflow-wrap:anywhere}
  .crm-pdf,.ace-pdf-viewer{width:100%;max-height:60dvh}
  .crm-pdf{height:440px}
  .ace-pdf-viewer{padding:6px}
  .ace-pdf-viewer canvas{max-width:100%;height:auto!important}
  .handover-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .handover-fee{grid-template-columns:minmax(0,1fr);gap:12px}
  .handover-card-actions{width:100%;flex-wrap:wrap}
  .handover-card-actions .btn{flex:1 1 150px}
  dialog.ace-datepicker{width:calc(100% - 16px);max-height:calc(100dvh - 16px);margin:auto}
  .ace-datepicker .ace-cal-top{padding:16px 12px 10px}
  .ace-datepicker .ace-cal-values{margin-inline:12px}
  .ace-datepicker .ace-cal-nav{padding-inline:12px}
  .ace-datepicker .ace-cal-scroll{min-height:140px;max-height:calc(100dvh - 350px);padding-inline:8px}
  .ace-cal-months{grid-template-columns:minmax(0,1fr)}
  .ace-cal-cell{min-height:44px}
  .ace-datepicker .ace-cal-day{width:min(44px,100%);height:44px;line-height:44px}
  .ace-datepicker .ace-cal-icon{width:44px;height:44px}
  .ace-datepicker .ace-cal-year select{padding:8px}
  .ace-cal-footer{padding:12px 16px max(12px,env(safe-area-inset-bottom));gap:12px}
  #toast{max-width:calc(100% - 32px);bottom:max(20px,env(safe-area-inset-bottom));white-space:normal;overflow-wrap:anywhere}
}
@media(max-width:380px){
  .ace-public .site-nav{padding-inline:10px;gap:6px}
  .ace-public .site-nav .brand-logo{width:78px}
  .ace-public .nav-actions{gap:4px}
  .ace-public .nav-actions .sign-in-button{font-size:13px;max-width:100px;padding-inline:8px}
  .ace-services,.portal .stat-grid,.reward-balances{grid-template-columns:minmax(0,1fr)}
  table.ace-mobile-records tbody tr{grid-template-columns:minmax(0,1fr)}
  .crm-revenue.ace-mobile-records td:last-child{grid-column:1}
}
@media(max-width:860px) and (max-height:550px){
  dialog:not(.ace-datepicker){max-height:calc(100dvh - 12px)}
  .ace-datepicker .ace-cal-values{display:none}
  .ace-datepicker .ace-cal-segments{margin-bottom:6px}
  .ace-datepicker .ace-cal-scroll{min-height:90px;max-height:calc(100dvh - 230px)}
}