/* Shared phone layout. Data grids scroll within their card, never the page. */
:root{--crm-viewport-height:100dvh;--crm-viewport-top:0px;--crm-header-bottom:58px}
.mobile-scroll-hint{display:none}
.calculator-back{display:none}
.salary-mobile-amount{min-width:0;font-size:12px;line-height:1.2;text-align:center;font-weight:850;overflow-wrap:anywhere;color:var(--ink)}
.salary-mobile-day:disabled{opacity:1}
#calculator-window.calculator-as-section{position:relative;inset:auto!important;width:100%!important;height:calc(var(--crm-viewport-height) - var(--crm-header-bottom) - 32px)!important;min-height:280px;max-height:none;min-width:0;resize:none;border:0;border-radius:0;box-shadow:none!important;background:transparent;z-index:auto}
#calculator-window.calculator-as-section:not(.hidden){display:flex;flex-direction:column}
#calculator-window.calculator-as-section .floating-window-head{height:auto;min-height:54px;flex-shrink:0;flex-wrap:wrap;gap:8px;padding:0 0 12px;cursor:default;background:transparent;box-shadow:none!important;border:0}
#calculator-window.calculator-as-section .floating-window-head>div{min-width:0;flex:1}
#calculator-window.calculator-as-section #calculator-title{white-space:normal;font-size:18px;line-height:1.25}
#calculator-window.calculator-as-section :is(.window-icon,#close-calculator){display:none}
#calculator-window.calculator-as-section .calculator-back{display:inline-flex;align-items:center;min-height:44px}
#calculator-window.calculator-as-section iframe{height:auto;min-width:0;width:100%;min-height:0;flex:1;border-radius:14px}
@media(max-width:850px), (pointer:coarse) and (max-width:1200px) and (max-height:500px){
  html{scroll-padding-top:calc(var(--crm-header-bottom) + 12px)}
  body{padding-bottom:env(safe-area-inset-bottom)}
  /* A header popover belongs to the viewport, not a short/clipped page body. */
  .mobile-city-header .crm-city-menu{position:fixed!important;top:calc(var(--crm-header-bottom) + 6px)!important;left:max(12px,env(safe-area-inset-left))!important;right:max(12px,env(safe-area-inset-right))!important;width:min(280px,calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right)))!important;max-height:calc(var(--crm-viewport-height) + var(--crm-viewport-top) - var(--crm-header-bottom) - 18px);margin:0 auto;transform:none;overflow:auto;overscroll-behavior:contain;touch-action:pan-y pinch-zoom}
  .workspace.with-sidebar{min-width:0;width:100%;margin-left:0!important;padding-left:max(12px,env(safe-area-inset-left))!important;padding-right:max(12px,env(safe-area-inset-right))!important;padding-bottom:max(20px,env(safe-area-inset-bottom))!important}
  .workspace :is(section,article,form,fieldset,aside),.modal :is(form,fieldset,label){min-width:0}
  body :is(button:not(.schedule-create-slot),.primary-button,.ghost-button,.sheet-tab,input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select){min-height:44px!important}
  body :is(button,.primary-button,.ghost-button){min-width:44px;touch-action:manipulation}
  body :is(input:not([type=checkbox]):not([type=radio]),select,textarea){max-width:100%;font-size:16px!important;scroll-margin-block:64px 20px}
  body textarea{min-height:88px;line-height:1.5}
  body select:not([multiple]){-webkit-appearance:none!important;appearance:none!important;padding-right:34px!important;background-image:linear-gradient(45deg,transparent 50%,#768298 50%),linear-gradient(135deg,#768298 50%,transparent 50%);background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%;background-size:5px 5px;background-repeat:no-repeat}
  body :is(input[type=checkbox],input[type=radio]){flex-shrink:0;width:20px;height:20px}
  label:has(>input[type=checkbox]),label:has(>input[type=radio]){min-height:44px;align-content:center}
  :is(button,a,input,select,textarea):focus-visible{outline:3px solid var(--brand);outline-offset:3px}
  .page-heading{gap:14px;margin-bottom:18px}
  .page-heading>div{min-width:0;max-width:100%}
  .page-heading h1{font-size:clamp(24px,5vw,30px);line-height:1.16;overflow-wrap:anywhere}
  .page-heading .muted{line-height:1.5}
  .heading-actions{flex-wrap:wrap;max-width:100%;gap:8px}
  .heading-actions :is(button,a){white-space:normal;line-height:1.3}
  .table-meta{gap:10px;flex-wrap:wrap;align-items:center;padding:14px}
  .table-meta>div{min-width:0;max-width:100%}
  .table-scroll{max-width:100%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .table-scroll:focus-visible{outline-offset:-3px}
  .mobile-scroll-hint:not([hidden]){display:block;margin:8px 12px;color:var(--muted);font-size:12px;line-height:1.4}
  .sheet-tabs{scroll-padding-inline:12px;overscroll-behavior-x:contain}
  .sheet-tab{flex-shrink:0}
  .sidebar{padding-bottom:max(28px,env(safe-area-inset-bottom))!important;overscroll-behavior:contain}
  .sidebar-submenu.open{max-height:none!important}
  .sidebar-submenu button{white-space:normal;line-height:1.35}
  /* Seven-column calendars have their own compact targets, not form-field sizes. */
  body .sidebar-calendar{width:100%!important;max-width:100%!important;padding:8px!important}
  body .sidebar-calendar .mini-calendar-head{grid-template-columns:44px minmax(0,1fr) 44px!important}
  body .sidebar-calendar .mini-calendar-head .icon-button{width:44px!important;height:44px!important;min-height:44px!important}
  body .sidebar-calendar .mini-calendar-head strong{font-size:13px!important;line-height:1.25}
  body .sidebar-calendar :is(.mini-calendar-weekdays,.mini-calendar-grid){grid-template-columns:repeat(7,minmax(0,1fr));gap:2px!important}
  #crm-sidebar .sidebar-calendar .calendar-day{min-width:0!important;width:100%;height:32px!important;min-height:32px!important;font-size:11px!important}
  #crm-sidebar .sidebar-calendar .calendar-today{min-height:36px!important}
  #salary-content .salary-mobile-grid:not(.hidden),#salary-content .salary-mobile-list:not(.hidden){display:block}
  #salary-content .salary-mobile-view-control{display:flex}
  #salary-content .salary-desktop-cards-control{display:none!important}
  body .salary-mobile-card{min-width:0;container-type:inline-size;border-radius:14px}
  body .salary-mobile-card header{flex-wrap:wrap;gap:6px}
  body .salary-mobile-card header>div{min-width:0;flex:1 1 170px}
  body .salary-mobile-card header strong{overflow-wrap:anywhere;line-height:1.25}
  body .salary-mobile-card .salary-mobile-day{min-width:0!important;min-height:52px!important;height:52px;grid-template-rows:14px minmax(0,1fr);padding:4px 1px}
  body .salary-mobile-card .salary-mobile-day:disabled{opacity:1;cursor:default}
  body .salary-mobile-card .salary-mobile-amount{min-width:0;width:100%;font-size:clamp(9px,3.1cqi,13px);font-weight:850;line-height:1.15;text-align:center;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
  body .salary-mobile-card .salary-mobile-day.is-shift .salary-mobile-amount{color:#10231b}
  body.dark-theme .salary-mobile-card .salary-mobile-day .salary-mobile-amount{color:#f2f4f8}
  body.dark-theme .salary-mobile-card .salary-mobile-day.has-color .salary-mobile-amount{color:#172033}
  body.dark-theme .salary-mobile-card .salary-mobile-day.is-shift .salary-mobile-amount{color:#fff}
  body .salary-mobile-card dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  body .salary-mobile-card dd{white-space:normal;overflow-wrap:anywhere;font-size:14px}
  .topbar{padding-left:max(8px,env(safe-area-inset-left))!important;padding-right:max(8px,env(safe-area-inset-right))!important}
  .notification-panel{position:fixed;top:var(--crm-header-bottom);left:8px;right:8px;width:auto;max-height:calc(var(--crm-viewport-height) - var(--crm-header-bottom) - 12px);overscroll-behavior:contain}
  body .modal-backdrop{top:var(--crm-viewport-top)!important;bottom:auto!important;height:var(--crm-viewport-height)!important;max-height:var(--crm-viewport-height);width:100%;align-items:center;padding:8px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important}
  body .modal-backdrop>.modal:not(.photo-view-modal):not(.help-group-modal){max-height:calc(var(--crm-viewport-height) - 20px - env(safe-area-inset-bottom))!important;padding:16px;border-radius:20px!important}
  .modal :is(input,select,textarea){min-width:0;width:100%}
  .modal :is(input[type=checkbox],input[type=radio]){width:20px}
  .modal input[type=file]{overflow:hidden;width:100%;box-sizing:border-box}
  .clients-import-drop{position:relative}
  .clients-import-drop input[type=file]{inset:0;width:100%;height:100%;max-height:100%;min-height:0!important}
  body.auth-page{padding:24px max(12px,env(safe-area-inset-right)) 24px max(12px,env(safe-area-inset-left))}
  body.auth-page .auth-stage{overflow-x:clip}
  .modal-head{align-items:start}
  .modal-head h2{font-size:22px;line-height:1.2}
  .modal :is(.form-grid,.edit-grid,.modal-grid){grid-template-columns:minmax(0,1fr)}
  .modal-actions{gap:8px}
  .modal-actions .spacer{display:none}
  .modal-actions :is(button,a){white-space:normal;line-height:1.3}
  .floating-window{left:max(8px,env(safe-area-inset-left))!important;top:calc(var(--crm-viewport-top) + 8px)!important;width:calc(100% - 16px)!important;height:calc(var(--crm-viewport-height) - 16px)!important;min-width:0;min-height:0;max-height:none;resize:none;border-radius:20px}
  .floating-window-head{cursor:default}
  .inventory-summary{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;overflow:visible}
  .inventory-summary article{min-width:0;padding:14px}
  .inventory-summary strong{overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
  .inventory-category-row th{flex-wrap:wrap;white-space:normal}
  .inventory-category-row small{white-space:normal}
  .fixed-assets-summary :is(strong,small){overflow-wrap:anywhere}
  .fixed-assets-table .fixed-asset-name :is(strong,small){max-width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere}
  .timers-crm-toolbar>div{min-width:0;max-width:100%}
  .timers-crm-toolbar .ghost-button{white-space:normal}
  .timers-crm-panel{min-width:0;width:100%}
  body.timers-section-active .workspace.with-sidebar{height:calc(var(--crm-viewport-height) - var(--crm-header-bottom))!important;padding-top:8px!important;padding-bottom:8px!important}
  .timers-crm-toolbar{grid-template-columns:minmax(0,1fr);padding:10px 12px 8px;gap:8px}
  .timers-crm-toolbar h1{font-size:24px}
  .timers-crm-toolbar .muted{font-size:12px;margin:4px 0 0}
  .timers-toolbar-actions{grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr))}
  .cash-report-fields{gap:14px}
  .cash-report-fields label{line-height:1.4}
  .cash-report-fields input{padding:12px}
  .cash-report-filters label,.cash-report-admin{gap:8px}
  .cash-report-total input{min-height:50px!important}
  .cash-report-side .table-scroll{overflow-x:auto}
  .saby-revenue-panel>.page-heading{align-items:stretch;gap:12px}
  .saby-revenue-panel .heading-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px}
  .saby-revenue-panel .heading-actions label{display:grid;gap:6px;min-width:0;white-space:normal}
  .saby-revenue-panel .heading-actions input{width:100%;max-width:none}
  .saby-revenue-panel .heading-actions button{width:100%}
  .saby-revenue-panel .heading-actions label:has(#saby-city-filter){grid-column:1/-1}
  .saby-revenue-panel .heading-actions select{width:100%;min-width:0}
  .saby-revenue-panel .heading-actions button{padding-inline:8px;gap:6px;white-space:nowrap}
  .saby-revenue-panel .heading-actions button svg{width:16px;height:16px;flex-shrink:0}
  .site-ai-toolbar{gap:8px}
  .site-ai-toolbar input{min-width:0}
  body #site-ai-content :is(.site-ai-filters,.site-ai-toolbar-buttons) :is(button,input,select){min-height:44px!important}
  body #site-ai-content .site-ai-filters :is(input,select){font-size:16px!important}
  .salary-grand-totals dl{grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}
  .salary-grand-totals dl>div{min-width:0;padding:10px}
  .salary-grand-totals dd{overflow-wrap:anywhere}
  #site-ai-templates-modal{margin-top:0!important}
  .clients-card-announcement-modal::before,.clients-card-announcement-modal::after{display:none}
  .fanfic-panel,.fanfic-panel.logs-open{top:var(--crm-viewport-top);bottom:auto;height:var(--crm-viewport-height);max-height:var(--crm-viewport-height)}
  .fanfic-composer textarea{min-height:44px}
  body.site-ai-mobile-dialog-open #site-ai-content,body.admin-mode.site-ai-mobile-dialog-open #site-ai-content{top:var(--crm-viewport-top,0px)!important;height:var(--crm-viewport-height,100dvh)!important}
  #dashboards-content .finance-table :is(tbody,tr,td){min-width:0;max-width:100%}
  #dashboards-content .finance-table tr{grid-template-columns:minmax(0,1fr)!important}
  #dashboards-content .finance-table td>*{min-width:0;max-width:100%}
  .table-card{box-shadow:0 2px 10px rgba(22,29,45,.04)}
}
/* Wide phones in landscape still use a drawer, leaving room for the work area. */
@media(min-width:851px) and (max-width:1200px) and (max-height:500px) and (pointer:coarse){
  .topbar{height:58px;padding:0 12px;gap:12px}
  .topbar #user-name,.topbar #city-switch-wrap,.topbar #logout-button{display:none!important}
  .mobile-menu-toggle{display:grid;place-items:center;width:44px;flex:0 0 44px;padding:0}
  .header-location{flex:1;min-width:0}
  .mobile-city-header{display:block!important;max-width:320px;flex:1;margin:0}
  .mobile-city-header>.hidden{display:none!important}
  .mobile-city-header .crm-city-trigger{width:100%;min-width:0}
  .sidebar{top:var(--mobile-sidebar-top,58px)!important;bottom:0!important;width:280px!important;left:0!important;height:auto!important;padding:12px!important;z-index:930!important;transform:translateX(-105%);transition:transform .22s ease}
  .sidebar-item{width:100%;font-size:14px}
  .sidebar-calendar,.app-version{display:none!important}
  body.mobile-sidebar-open{overflow:hidden!important}
  body.mobile-sidebar-open .sidebar{transform:translateX(0)}
  .mobile-sidebar-scrim{display:block;position:fixed;inset:var(--mobile-sidebar-top,58px) 0 0;z-index:929;background:rgba(17,24,39,.34);border:0;opacity:0;pointer-events:none}
  body.mobile-sidebar-open .mobile-sidebar-scrim{opacity:1;pointer-events:auto}
}
/* Desktop owns a two-axis viewport; phones use page scrolling below. */
#schedule-phone-head{display:none}
body.schedule-section-active .workspace.with-sidebar{height:calc(var(--crm-viewport-height) + var(--crm-viewport-top) - var(--crm-header-bottom));min-height:0;overflow:hidden}
#schedule-content:not(.hidden){display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:12px;height:100%;min-width:0;min-height:0}
#schedule-content .schedule-heading{margin:0}
#schedule-content .schedule-heading .heading-actions{display:grid;grid-template-columns:minmax(150px,1fr) auto auto;align-items:center}
#schedule-content :is(#schedule-date-input,#schedule-today,#refresh-schedule){color:var(--ink)}
body.dark-theme #schedule-date-input{color-scheme:dark}
#schedule-content #schedule-today{display:block}
#schedule-content .schedule-board{position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:0;min-height:0;margin:0;padding:0;overflow:hidden}
#schedule-content .schedule-toolbar{display:none}
#schedule-content .schedule-summary{display:flex;flex-wrap:wrap;gap:12px 24px;margin:0;padding:10px 16px;border-bottom:1px solid var(--line)}
#schedule-content .schedule-summary article{display:flex;align-items:baseline;gap:8px;margin:0;padding:0;border:0;border-radius:0;background:transparent}
#schedule-content .schedule-summary :is(span,strong){margin:0;font-size:13px;text-transform:none}
#schedule-content .schedule-summary .schedule-day-occupancy{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:4px;min-width:150px}
.schedule-day-occupancy>div{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.schedule-day-occupancy strong{font-variant-numeric:tabular-nums}
.schedule-occupancy-bar{--occupancy-fill:var(--action);--occupancy-track:var(--line);display:block;appearance:none;width:100%;height:4px;min-height:4px;margin:0;padding:0;border:0;border-radius:2px;background:var(--occupancy-track);overflow:hidden}
.schedule-occupancy-bar::-webkit-meter-bar{height:4px;border:0;border-radius:2px;background:var(--occupancy-track);box-shadow:none}
.schedule-occupancy-bar::-webkit-meter-optimum-value{background:var(--occupancy-fill);border-radius:2px}
.schedule-occupancy-bar::-moz-meter-bar{background:var(--occupancy-fill);border-radius:2px}
#schedule-content .schedule-grid-shell{min-width:0;min-height:0;height:100%;overflow:hidden}
#schedule-grid-scroll{width:100%;height:100%;max-height:none;overflow:auto;border:0;border-radius:0;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;-webkit-overflow-scrolling:touch;overflow-anchor:none;scrollbar-width:thin}
#schedule-grid.schedule-timeline{--schedule-column-width:240px;display:grid;position:relative;grid-template-columns:var(--schedule-time-width,56px) repeat(var(--schedule-cols),minmax(var(--schedule-column-width),1fr))!important;grid-template-rows:58px var(--schedule-height)!important;width:calc(var(--schedule-time-width,56px) + var(--schedule-cols)*var(--schedule-column-width));min-width:100%!important;max-width:none;gap:0;border:0;border-radius:0;overflow:visible;background:var(--surface);isolation:isolate}
.schedule-timeline .schedule-corner{display:block;position:sticky;top:0;left:0;grid-column:1;grid-row:1;z-index:7;background:var(--surface);border:0;border-bottom:1px solid var(--line)}
.schedule-timeline .schedule-column-head{position:sticky;top:0;grid-row:1;z-index:5;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;height:58px;padding:4px;border:0;border-bottom:1px solid var(--line);background:var(--surface);backdrop-filter:none;text-align:center}
.schedule-timeline .schedule-service-icon{position:relative;left:auto;top:auto;display:grid;place-items:center;flex:none;width:27px;height:27px;margin:0;border-radius:50%;overflow:hidden;background:var(--bg);color:var(--ink);font-size:10px;font-weight:650;line-height:1}
.schedule-timeline .schedule-service-icon img{position:absolute;inset:0;background:var(--surface)}
.schedule-timeline .schedule-column-head strong{display:block;width:100%;min-height:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:600;line-height:16px;color:var(--ink)}
.schedule-timeline .schedule-time-layer{display:block;visibility:visible;position:sticky;left:0;grid-column:1;grid-row:2;align-self:start;z-index:4;height:var(--schedule-height);min-height:0;background:var(--surface);border:0;border-right:1px solid var(--line)}
.schedule-timeline .schedule-mobile-time{position:absolute;left:0;right:4px;display:block;padding-top:2px;text-align:right;font-size:12px;line-height:14px;font-variant-numeric:tabular-nums;color:var(--ink)}
.schedule-timeline .schedule-day-column{position:relative;grid-row:2;min-height:0;height:var(--schedule-height);padding:0;border:0;border-right:1px solid var(--line);background:repeating-linear-gradient(to bottom,var(--line) 0,var(--line) 1px,transparent 1px,transparent 90px),repeating-linear-gradient(to bottom,transparent 0,transparent 22px,color-mix(in srgb,var(--line) 45%,transparent) 22px,color-mix(in srgb,var(--line) 45%,transparent) 22.5px)}
#schedule-grid .schedule-record-timed{position:absolute;top:var(--schedule-record-top);left:calc(100%*var(--schedule-record-lane)/var(--schedule-record-lanes));right:auto;width:calc(100%/var(--schedule-record-lanes) - 1px);height:var(--schedule-record-height);min-height:0!important;min-width:0;margin:0;padding:0;display:flex;flex-direction:column;gap:0;overflow:hidden;border:0;border-radius:3px;background:#c7d4ee;color:#172d50;box-shadow:none;transform:none;transition:none;font:13px/1.25 system-ui,sans-serif;text-align:left;touch-action:pan-x pan-y pinch-zoom}
#schedule-grid .schedule-record-timed:before{display:none}
#schedule-grid .schedule-record-timed strong{flex:none;display:block;margin:0;padding:2px 4px;background:rgba(255,255,255,.2);color:inherit;font-size:12px;font-weight:650;line-height:14px;white-space:nowrap;font-variant-numeric:tabular-nums}
#schedule-grid .schedule-record-copy{padding:3px 4px;min-height:0;overflow:hidden}
#schedule-grid .schedule-record-timed :is(span,small){color:inherit;font-size:13px;font-weight:500;line-height:1.25;white-space:normal;overflow-wrap:anywhere}
#schedule-grid .schedule-record-timed small{margin-top:2px}
#schedule-grid .schedule-record-timed .schedule-record-comment{margin:3px 0 0;padding:0;border:0;font-size:12px;line-height:1.25}
#schedule-grid .schedule-record-people{background:#83c780;color:#13350e}
#schedule-grid :is(.schedule-record-rent,.schedule-record-room){background:#f3b57b;color:#442609}
#schedule-grid .schedule-status-waiting{background:#b9dfba;color:#15391b}
#schedule-grid .schedule-status-paid-arrived{background:#d6c5f5;color:#362052}
#schedule-grid .schedule-status-confirmed{background:#b9d7f5;color:#12385d}
#schedule-grid .schedule-status-absent{background:#f4c1c5;color:#621e29}
#schedule-grid .schedule-status-unpaid-arrived{background:#e1e4eb;color:#303846}
#schedule-grid .schedule-record-status{display:block;flex:none;margin:0;padding:2px 4px;font-weight:650!important}
#schedule-grid .schedule-event-occupancy{display:flex;flex-direction:column;flex:none;gap:4px;margin:0;padding:4px 5px;background:rgba(255,255,255,.52);color:#102d13}
#schedule-grid .schedule-record-timed .schedule-event-occupancy>span{display:block;font-size:12px;font-weight:800;line-height:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
#schedule-grid .schedule-event-occupancy .schedule-occupancy-bar{--occupancy-fill:#1b6b32;--occupancy-track:#43a047;height:9px;min-height:9px;box-shadow:inset 0 0 0 1px var(--occupancy-fill)}
#schedule-grid .schedule-event-occupancy [data-load-band="blue"]{--occupancy-fill:#1565c0;--occupancy-track:#42a5f5}
#schedule-grid .schedule-event-occupancy [data-load-band="purple"]{--occupancy-fill:#6a1b9a;--occupancy-track:#ab47bc}
#schedule-grid .schedule-event-occupancy [data-load-band="burgundy"]{--occupancy-fill:#6f173b;--occupancy-track:#9f315b}
#schedule-grid .schedule-event-occupancy [data-load-band="red"]{--occupancy-fill:#b71c1c;--occupancy-track:#ef5350}
#schedule-grid .schedule-event-occupancy .schedule-occupancy-bar::-webkit-meter-bar{height:9px;background:var(--occupancy-track);box-shadow:inset 0 0 0 1px var(--occupancy-fill)}
#schedule-grid .schedule-record-timed:hover{transform:none;box-shadow:none}
#schedule-grid .schedule-record-timed:active{filter:brightness(.93)}
.schedule-timeline .schedule-now-line{position:absolute;left:var(--schedule-time-width,56px);right:0;height:1px;background:#d83b45;z-index:3;pointer-events:none}
#schedule-mobile-days{position:relative;display:flex;align-items:stretch;gap:0;min-width:0;margin:0;padding:5px 0 8px;border:0;border-top:1px solid var(--line);border-radius:0;background:var(--surface);overflow-x:auto;overscroll-behavior-x:contain;touch-action:pan-x pinch-zoom;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--brand) 56%,var(--line)) var(--bg);box-shadow:none;z-index:8}
#schedule-mobile-days::-webkit-scrollbar{display:block;height:10px}
#schedule-mobile-days::-webkit-scrollbar-track{background:var(--bg);border-top:1px solid var(--line)}
#schedule-mobile-days::-webkit-scrollbar-thumb{border:2px solid var(--bg);border-radius:8px;background:color-mix(in srgb,var(--brand) 56%,var(--line))}
#schedule-mobile-days button{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:0 0 calc(100%/14);gap:3px;min-width:0;min-height:48px;margin:0;padding:4px 0;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:10px;font-weight:550;line-height:1.1;text-transform:uppercase;touch-action:pan-x pinch-zoom}
#schedule-mobile-days button strong{font-size:14px;font-weight:650;color:var(--ink)}
#schedule-mobile-days button.weekend{color:#946214}
#schedule-mobile-days button.active{background:var(--action);color:var(--on-action)}
#schedule-mobile-days button.active strong{color:inherit}
.schedule-timeline .schedule-column-empty{position:sticky;top:74px;z-index:4;width:fit-content;max-width:100%;margin:18px auto 0;padding:2px 8px;background:var(--surface);text-align:center;font-size:12px;line-height:1.4;color:var(--muted);pointer-events:none}
#schedule-error:empty{display:none}
#schedule-error:not(:empty){position:absolute;top:68px;left:60px;right:12px;z-index:12;max-height:40%;overflow:auto;margin:0;padding:12px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);font-size:13px}
@media(max-width:850px), (pointer:coarse) and (max-width:1200px) and (max-height:500px){
  html.schedule-section-active,body.schedule-section-active{height:auto;overflow-y:visible!important;overscroll-behavior-y:auto}
  body.schedule-section-active .workspace.with-sidebar{height:auto;min-height:0;overflow:visible;padding:0!important}
  #schedule-content:not(.hidden){position:relative;top:auto;left:auto;right:auto;height:auto;display:block;margin:0;padding:0 max(0px,env(safe-area-inset-right)) 0 max(0px,env(safe-area-inset-left));background:var(--surface);overflow:visible}
  #schedule-content .schedule-heading{display:block;margin:0;padding:4px 8px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:var(--surface);box-shadow:none}
  #schedule-content .schedule-heading>div:first-child{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  #schedule-content .heading-actions{display:grid!important;grid-template-columns:minmax(0,1fr) auto 44px;align-items:center;gap:4px;width:100%}
  #schedule-content #schedule-date-input{width:100%;min-width:0;height:44px;padding:6px 4px;border:0;border-radius:6px;box-shadow:none;background:transparent;color:var(--ink);font-size:15px!important;font-weight:650;text-align:left}
  #schedule-content .schedule-phone-only{display:block}
  #schedule-content #schedule-today{height:44px;padding:6px 10px;border:0;border-radius:6px;background:transparent;font-size:13px;color:var(--ink)}
  #schedule-content #refresh-schedule{display:grid;place-items:center;width:44px;height:44px;min-width:44px;padding:10px;border:0;border-radius:6px;background:transparent;color:var(--ink)}
  #refresh-schedule>span{display:none}
  #refresh-schedule svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  #schedule-content .schedule-board{position:relative;display:flex;flex-direction:column;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:var(--surface);box-shadow:none;overflow:visible}
  #schedule-content .schedule-toolbar,#schedule-content .schedule-summary .schedule-summary-secondary{display:none}
  #schedule-content .schedule-summary{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:16px;padding:6px 12px}
  #schedule-content .schedule-summary .schedule-summary-revenue{flex-direction:column;align-items:flex-start;gap:2px}
  #schedule-content .schedule-summary .schedule-day-occupancy{min-width:0}
  #schedule-content .schedule-summary span{font-size:11px;line-height:14px}
  #schedule-content .schedule-summary strong{font-size:12px;line-height:14px;white-space:nowrap}
  #schedule-content .schedule-grid-shell{order:2;min-width:0;min-height:0;height:auto;overflow:visible}
  #schedule-grid-scroll{height:auto;max-height:none;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;overscroll-behavior-y:auto;scrollbar-width:none}
  #schedule-grid-scroll::-webkit-scrollbar{display:none}
  #schedule-grid.schedule-timeline,#schedule-phone-head-grid{--schedule-time-width:var(--schedule-clock-width,52px);--schedule-column-width:clamp(94px,calc((100vw - 44px - env(safe-area-inset-left) - env(safe-area-inset-right))/3),220px);zoom:var(--schedule-zoom,1);min-width:100%!important}
  #schedule-grid.schedule-timeline{grid-template-rows:var(--schedule-height)!important}
  #schedule-grid .schedule-day-column,#schedule-grid .schedule-time-layer{grid-row:1}
  #schedule-phone-head{display:block;position:sticky;top:var(--crm-header-bottom);z-index:10;width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;background:var(--surface);overscroll-behavior-x:contain;touch-action:pan-x pan-y pinch-zoom}
  #schedule-phone-head::-webkit-scrollbar{display:none}
  #schedule-phone-head-grid{display:grid;grid-template-columns:var(--schedule-time-width) repeat(var(--schedule-cols),minmax(var(--schedule-column-width),1fr));width:calc(var(--schedule-time-width) + var(--schedule-cols)*var(--schedule-column-width));height:58px;position:relative;isolation:isolate}
  #schedule-phone-head .schedule-column-head strong{white-space:normal;line-height:13px;max-height:26px}
  #schedule-phone-head .schedule-service-icon{width:20px;height:20px;font-size:9px}
  #schedule-mobile-days{order:1;padding-bottom:max(5px,env(safe-area-inset-bottom));border-top:0;border-bottom:1px solid var(--line);scrollbar-width:none}
  #schedule-mobile-days::-webkit-scrollbar{display:none}
  .schedule-timeline .schedule-column-head strong{font-size:var(--schedule-font,13px)}
  .schedule-timeline .schedule-mobile-time{font-size:var(--schedule-small-font,13px)}
  #schedule-grid .schedule-record-timed{font-size:var(--schedule-font,13px)}
  #schedule-grid .schedule-record-timed strong{font-size:var(--schedule-small-font,13px)}
  #schedule-grid .schedule-record-timed :is(span,small){font-size:var(--schedule-font,13px)}
  #schedule-grid .schedule-record-timed .schedule-record-comment{font-size:var(--schedule-small-font,13px)}
  #schedule-mobile-days button{flex-basis:calc(100%/7)}
  #schedule-empty{position:static;order:1;margin:0;padding:12px;pointer-events:none;background:var(--surface)}
  #schedule-loading{place-items:start center;padding:80px 12px}
  #schedule-error:empty{display:none}
  #schedule-error:not(:empty){position:relative;top:auto;left:auto;right:auto;order:0;max-height:none;margin:8px;padding:12px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);font-size:13px}
  body.dark-theme .schedule-timeline :is(.schedule-column-head,.schedule-corner,.schedule-time-layer){background:var(--surface)}
  body.dark-theme #schedule-date-input{color-scheme:dark}
  body.dark-theme .schedule-timeline .schedule-day-column{background:repeating-linear-gradient(to bottom,var(--line) 0,var(--line) 1px,transparent 1px,transparent 90px),repeating-linear-gradient(to bottom,transparent 0,transparent 22px,color-mix(in srgb,var(--line) 45%,transparent) 22px,color-mix(in srgb,var(--line) 45%,transparent) 22.5px)}
  body.dark-theme #schedule-mobile-days button.weekend:not(.active){color:#f2c065}
}
@media(max-width:850px), (pointer:coarse) and (max-width:1200px) and (max-height:500px){body.schedule-section-active:is(.modal-layer-open,.mobile-sidebar-open){overflow:hidden!important}}
/* A non-scrolling overflow ancestor prevents the desktop header sticking to the page. */
.salary-table-scroll{width:100%;max-width:100%;overflow:visible;overscroll-behavior:contain}
#salary-content .salary-table-scroll.salary-local-scroll{overflow:auto;max-height:var(--salary-scroll-height,65dvh)!important;flex:0 1 auto}
#salary-content .salary-local-scroll .salary-table thead{top:0!important}
#salary-content .salary-local-scroll .salary-table thead th{top:auto!important}
@media(max-width:380px){
  .inventory-summary{grid-template-columns:minmax(0,1fr)!important}
  .heading-actions{display:grid;grid-template-columns:minmax(0,1fr);width:100%}
  .heading-actions>*{min-width:0;width:100%}
}
@media(max-width:850px) and (max-height:500px){
  .timers-crm-toolbar{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}
  .timers-crm-toolbar .muted{display:none}
  .modal-backdrop>.modal>.modal-head{padding-bottom:6px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  .sidebar,.sidebar-submenu,.sidebar-submenu button,.modal,.floating-window{animation:none!important;transition:none!important}
}

/* The single allowed archive occupies the first/full column, including instructor-only access. */
.checklist-archive-page.single-archive{grid-template-columns:minmax(0,1fr)}
/* Confirmation dialogs scroll as one document: sticky actions must not cover the input. */
#crm-dialog>.modal{display:block;min-width:0}
#crm-dialog>.modal>.modal-head,#crm-dialog>.modal>.modal-actions{position:static}
#crm-dialog-input-wrap{flex:none;min-height:min-content}
@media(max-width:760px){
  #crm-dialog>.modal>.modal-actions{grid-template-columns:repeat(2,minmax(0,1fr));padding-top:8px;gap:10px}
  #crm-dialog>.modal>.modal-head{gap:12px}
  #crm-dialog .modal-head>div{min-width:0}
  #crm-dialog .modal-head h2{font-size:22px;line-height:1.2}
  #crm-dialog-close{flex:0 0 44px}
  #crm-dialog-input{min-height:44px;font-size:16px;line-height:1.4}
  #crm-dialog .modal-actions button{min-height:44px}
}

@media(max-width:850px), (pointer:coarse) and (max-width:1200px) and (max-height:500px){
 .mobile-disclosure-toggle{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;margin-bottom:8px;text-align:left;font-size:14px}
 .mobile-disclosure-toggle:after{content:"⌄";flex-shrink:0}.mobile-disclosure-toggle[aria-expanded="true"]:after{content:"⌃"}
 [data-mobile-panel]:not(.mobile-panel-open){display:none!important}
 #sales-funnels-content>.page-heading{gap:8px;margin-bottom:12px}
 .sales-funnels-heading .muted{display:none}
 .sales-funnels-heading .heading-actions{display:flex;flex-wrap:wrap;margin-top:0;gap:8px}
 .sales-funnels-heading h1{font-size:26px}
 .sales-funnels-views{margin-bottom:8px}
 .sales-horizontal-hint{margin:0 0 8px;padding:6px 10px}
 .sales-funnels-summary{margin-bottom:8px}
 #crm-sidebar .sidebar-calendar .calendar-day{height:36px!important;min-height:36px!important;font-size:12px!important}
}

/* Phone copying stays separate from row navigation and tel links. */
body .phone-with-copy{display:inline-flex!important;align-items:center;gap:3px;max-width:100%;vertical-align:middle;white-space:nowrap}
body .phone-with-copy>.phone-number{display:inline!important;min-width:0;color:inherit;font:inherit;overflow:visible}
body .phone-with-copy>a{display:inline!important;color:inherit;font:inherit}
body .phone-copy-button{display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 28px;width:28px;min-width:28px;height:28px;min-height:28px!important;margin:0;padding:5px;border:0;border-radius:5px;background:transparent;color:var(--muted);box-shadow:none;vertical-align:middle;cursor:pointer;touch-action:manipulation}
body .phone-copy-button:hover,body .phone-copy-button:focus-visible{background:color-mix(in srgb,var(--brand) 12%,transparent);color:var(--brand)}
body .phone-copy-button:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
body .phone-copy-button svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
body .phone-copy-button .phone-copy-check{display:none}
body .phone-copy-button.is-copied svg{display:none}
body .phone-copy-button.is-copied .phone-copy-check{display:block}
body .phone-copy-button.is-copied{color:var(--brand)}
.phone-copy-status{position:fixed;right:16px;bottom:20px;z-index:1000;max-width:min(340px,calc(100vw - 32px));padding:12px 16px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font-size:14px;box-shadow:0 4px 16px rgba(0,0,0,.14)}
.phone-copy-status[hidden]{display:none}
.phone-copy-fallback{position:fixed;left:-9999px;top:0;opacity:0}
[data-phone-card]{cursor:pointer;color:var(--ink);font:inherit;text-align:left}
[data-phone-card]:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media(max-width:850px){body .phone-copy-button{flex-basis:40px;width:40px;min-width:40px;height:40px;min-height:40px!important}}

.password-with-copy{display:inline-flex;align-items:center;gap:3px;max-width:100%;vertical-align:middle}
.password-copy-text{min-width:0;white-space:pre-wrap;overflow-wrap:anywhere}

/* Header actions preserve full touch targets; only very narrow phones use a second row. */
@media(max-width:850px){
  .topbar{grid-template-columns:44px minmax(0,1fr) auto!important}
  .topbar .user-panel{display:flex!important;flex:0 0 auto!important;width:auto!important;min-width:0!important;gap:4px!important;flex-wrap:nowrap!important}
  .topbar .user-panel>.notification-wrap,.topbar .header-messenger,.topbar .fanfic-button{flex:0 0 auto!important}
  .mobile-city-header{min-width:0!important;width:100%!important}
  .mobile-city-header .crm-city-trigger{overflow:hidden}
  .mobile-city-header .crm-city-trigger>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
}

@media(min-width:601px){#schedule-content[data-schedule-view="list"] .schedule-board{grid-template-rows:auto minmax(0,1fr) auto;align-self:stretch}}
@media(max-width:600px){#schedule-content[data-schedule-view="list"] .schedule-day-list{order:2}#schedule-content[data-schedule-density="comfortable"] #schedule-phone-head .schedule-column-head strong{line-height:16px;max-height:32px}}

@media(max-width:380px){.topbar{grid-template-columns:44px minmax(0,1fr)!important}}
@media(min-width:381px) and (max-width:600px){
  .topbar{gap:2px!important}
  .header-location{gap:4px}
  .topbar .user-panel{gap:1px!important}
  .mobile-city-header .crm-city-trigger{padding:0 8px!important;gap:4px}
}

/* Desktop density scales the entire timeline, including slots and event coordinates. */
@media(min-width:851px){
  #schedule-grid.schedule-timeline{zoom:var(--schedule-zoom,1)}
}
.shift-message-row{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--line)}
.shift-message-row .shift-row{flex:1;min-width:0;border-bottom:0}
.shift-message-row [data-shift-message-done]{flex:none;min-height:44px;padding:8px;font-size:12px}
@media(max-width:420px){.shift-message-row{flex-wrap:wrap;padding-bottom:8px}.shift-message-row .shift-row{flex-basis:100%}.shift-message-row [data-shift-message-done]{margin-left:auto}}

/* The page owns vertical scrolling; the timeline only scrolls across staff. */
html.schedule-section-active,body.schedule-section-active{height:auto;overflow-y:visible!important;overscroll-behavior-y:auto}
body.schedule-section-active .workspace.with-sidebar{height:auto;min-height:0;overflow:visible}
#schedule-content:not(.hidden){height:auto;grid-template-rows:auto auto auto;overflow:visible}
#schedule-content .schedule-board{display:flex;flex-direction:column;overflow:visible;height:auto}
#schedule-content .schedule-grid-shell{height:auto;overflow:visible;order:2}
#schedule-grid-scroll{height:auto;max-height:none;overflow-x:auto;overflow-y:hidden;overscroll-behavior-y:auto}
#schedule-mobile-days{order:1}
#schedule-content .schedule-day-list{order:2;overflow:visible}
#schedule-grid.schedule-timeline{grid-template-rows:var(--schedule-height)!important}
#schedule-grid .schedule-day-column,#schedule-grid .schedule-time-layer{grid-row:1}
#schedule-phone-head{display:block;position:sticky;top:var(--crm-header-bottom);z-index:10;width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;background:var(--surface);overscroll-behavior-x:contain;touch-action:pan-x pan-y pinch-zoom}
#schedule-phone-head::-webkit-scrollbar{display:none}
#schedule-phone-head-grid{display:grid;grid-template-columns:var(--schedule-time-width,56px) repeat(var(--schedule-cols),minmax(var(--schedule-column-width,240px),1fr));width:calc(var(--schedule-time-width,56px) + var(--schedule-cols)*var(--schedule-column-width,240px));min-width:100%;height:58px;position:relative;isolation:isolate}
body.schedule-section-active:is(.modal-layer-open,.mobile-sidebar-open){overflow:hidden!important}

/* Shared load ends at each event boundary; adjacent events meet at the seam. */
#schedule-grid .schedule-record-timed .schedule-event-occupancy{padding:0;gap:0}
#schedule-grid .schedule-record-timed .schedule-event-occupancy>span{padding-left:5px;padding-right:5px}
#schedule-grid .schedule-record-timed .schedule-event-occupancy .schedule-occupancy-bar{width:100%;border-radius:0}

/* A single meter spans touching event cards, including their shared seam. */
#schedule-grid .schedule-shared-load-line{position:absolute;z-index:3;display:block;margin:0;padding:0;pointer-events:none;background:none;gap:0}
#schedule-grid .schedule-shared-load-line .schedule-occupancy-bar{display:block;width:100%;margin:0;border-radius:0}
#schedule-grid .schedule-occupancy-joined{visibility:hidden}