/* Compact mobile layout. Desktop retains its existing timetable. */
.mobile-controls,.mobile-navigation{display:none}
#workspace:not(.director-user) .payments-tabs,#workspace.employee-user #management-menu,#workspace.employee-user .view-toolbar,#workspace.employee-user .main-actions,#workspace.employee-user #legend-btn{display:none!important}
.mobile-more-actions{display:grid;gap:8px}
@media(max-width:800px){
 :root{background:#f5f8f5}
 body{background:#f5f8f5}
 #workspace{height:auto;min-height:100dvh}
 header.schedule-header{height:53px;min-height:53px;padding:8px 12px;flex-wrap:nowrap;background:#fff}
 .schedule-header .brand{gap:7px}.schedule-header .brand-icon{display:inline-grid;width:29px;height:29px;border-radius:8px;font-size:19px}
 .schedule-header .brand strong{font-size:19px;letter-spacing:-.6px}
 .schedule-header #identity{display:block;max-width:110px;font-size:11px;text-align:right;line-height:1.35;overflow-wrap:anywhere}
 .schedule-header #management-menu{display:none}.schedule-header .account-menu summary{font-size:11px;padding:6px}
 #workspace>main{display:flex;flex-direction:column;width:100%;min-height:0;padding:12px 12px 14px;max-width:760px;margin:0 auto}
 #workspace .schedule-controls{display:none}
 #workspace .mobile-controls{display:grid;gap:9px;margin-bottom:10px}
 .mobile-date-period{display:flex;justify-content:space-between;gap:8px;align-items:center}
 .mobile-date-title{display:block;font-size:20px;font-weight:650;letter-spacing:-.6px;padding:0;min-height:25px;border:0;background:transparent;text-align:left}
 .mobile-today{display:block;padding:1px 0;border:0;background:transparent;color:#286c53;font-size:12px;min-height:24px}
 .mobile-period,.mobile-density{display:flex;gap:2px;background:#fff;border:1px solid #dce6df;border-radius:10px;padding:3px}
 .mobile-period button,.mobile-density button{border:0;background:transparent;padding:6px 9px;font-size:12px;min-height:34px;border-radius:7px}
 .mobile-period button[aria-pressed=true],.mobile-density button[aria-pressed=true],.mobile-days button[aria-pressed=true],.mobile-navigation button[aria-pressed=true]{background:#286c53;color:white}
 .mobile-week-row{display:grid;grid-template-columns:24px minmax(0,1fr) 24px;gap:2px;align-items:center}
 .mobile-week-row>button{padding:0;border:0;background:transparent;min-height:44px;font-size:22px;color:#627c6d}
 .mobile-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}
 .mobile-days button{padding:3px 0;border:0;background:transparent;min-height:44px;border-radius:9px;display:grid;justify-items:center;align-content:center;gap:0}
 .mobile-days small{font-size:11px}.mobile-days span{font-size:14px;font-weight:600}
 .mobile-days button.is-today:not([aria-pressed=true]){box-shadow:inset 0 -2px #78ab89}
 .mobile-director-tools{display:grid;grid-template-columns:minmax(0,1fr) 44px 44px;gap:6px}
 .mobile-director-tools select{margin:0;padding:9px;font-size:16px;min-height:44px;border-radius:9px}
 .mobile-director-tools button{min-height:44px;padding:5px;font-size:23px;border-radius:9px}
 .mobile-director-tools .has-active-filter{box-shadow:inset 0 0 0 2px #286c53}
 .mobile-result-row{display:flex;align-items:center;justify-content:space-between;gap:6px}
 #mobile-count{font-size:11px;color:#657c6d;white-space:nowrap}
 .mobile-density{padding:2px}.mobile-density button{font-size:11px;padding:5px 8px;min-height:32px;transition:none}
 #workspace .board-wrap{flex:none;overflow:visible;min-height:0;max-height:none;width:100%;max-width:none;border:0;background:transparent;border-radius:0}
 #board.mobile-board{display:block;min-width:0;width:100%;padding:0;background:transparent}
 .mobile-day-section{margin:0 0 12px}.mobile-day-heading{font-size:14px;margin:8px 0;color:#345849;text-transform:capitalize}
 .mobile-person-section{margin-bottom:10px}.mobile-person-heading{font-size:13px;margin:3px 0 5px;color:#345849;font-weight:650}
 .mobile-board .lesson{position:static;display:grid!important;grid-template-columns:85px minmax(0,1fr) auto;grid-template-rows:auto;gap:3px 7px;align-items:center;width:100%;min-height:44px;height:auto;margin:0 0 5px;padding:8px!important;border:1px solid #dce6df;border-left:3px solid #78ab89;border-radius:7px;background:#f0f8f1;text-align:left}
 .mobile-board .lesson .card-time{grid-column:1;grid-row:1;font-size:11px;white-space:nowrap;margin:0;letter-spacing:-.2px}
 .mobile-board .lesson .card-name{grid-column:2;grid-row:1;font-size:13px;line-height:1.35;margin:0;min-width:0;overflow-wrap:anywhere}
 .mobile-board .lesson .pill{display:block;grid-column:3;grid-row:1;max-width:82px;font-size:10px;font-weight:500;text-align:right;white-space:normal;padding:0;background:transparent;color:inherit;line-height:1.35}
 .mobile-board .lesson.planned .pill{display:block}
 .mobile-board .lesson .card-meta,.mobile-board .lesson .card-note,.mobile-board .lesson .comment-flag,.mobile-board .lesson .warning-details,.mobile-board .lesson .card-warning{display:none}
 .mobile-board .lesson .card-comment{margin-left:3px;font-size:11px}
 .mobile-board .lesson .current-label,.mobile-board .lesson .mobile-card-person{grid-column:2/-1;grid-row:auto;font-size:11px;margin:0}
 .mobile-board .lesson.cancelled{background:#fff0ee;border-left-color:#cf8183}
 .mobile-board .lesson.lunch,.mobile-board .lesson.moved,.mobile-board .lesson.needs_cancel,.mobile-board .lesson.needs_move,.mobile-board .lesson.clarify{background:#fff5df;border-left-color:#d1ac62}
 .mobile-board .lesson.replaced{background:#eaf1f8;border-left-color:#8aabc9}
 .mobile-board .lesson.supervision{background:#f4eefa;border-left-color:#b49acb}
 .mobile-board .lesson.missed{background:#edf0f2;border-left-color:#9cabb2}
 .mobile-board .lesson.has-source-warning .card-name::after{content:' ⚠';color:#976c25}
 .mobile-board[data-density=two] .lesson{grid-template-columns:85px minmax(0,1fr);padding:8px 10px!important}
 .mobile-board[data-density=two] .lesson .card-time{grid-column:1;grid-row:1/3;align-self:center}
 .mobile-board[data-density=two] .lesson .card-name{grid-column:2;grid-row:1}
 .mobile-board[data-density=two] .lesson .pill{grid-column:2;grid-row:2;text-align:left;max-width:none}
 .mobile-board[data-density=details] .lesson{grid-template-columns:1fr auto;gap:6px;padding:12px!important}
 .mobile-board[data-density=details] .lesson .card-time{grid-column:1;grid-row:1;font-size:12px}
 .mobile-board[data-density=details] .lesson .pill{grid-column:2;grid-row:1}
 .mobile-board[data-density=details] .lesson .card-name{grid-column:1/-1;grid-row:2;font-size:15px}
 .mobile-board[data-density=details] .lesson .card-meta,.mobile-board[data-density=details] .lesson .card-note,.mobile-board[data-density=details] .lesson .card-warning,.mobile-board[data-density=details] .lesson .warning-details{display:block;grid-column:1/-1;grid-row:auto;font-size:12px;margin:0}
 .mobile-free{width:100%;text-align:left;border:0;border-left:2px dotted #dce6df;border-radius:0;background:transparent;padding:5px 8px;margin:0 0 5px 2px;font-size:11px;color:#667e6c}
 #workspace.director-user .mobile-navigation{display:flex;position:sticky;bottom:0;z-index:5;gap:5px;padding:7px 12px max(7px,env(safe-area-inset-bottom));background:#fff;border-top:1px solid #dce6df;margin-top:auto}
 .mobile-navigation button{flex:1;border:0;padding:10px 4px;font-size:12px;min-height:42px;background:transparent}
 #workspace .payments-tabs{display:none}
 #workspace.payments-open .mobile-controls,#workspace.payments-test-schedule .mobile-controls{display:none}
 #workspace .payments-table{min-width:0;display:block}
 .payments-table thead{display:none}.payments-table tbody{display:block}
 .payments-table tr{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #dce6df;padding:7px 6px;gap:3px}
 .payments-table tr.payments-family{display:block;padding:10px}
 .payments-table .payments-family th{display:block;min-width:0}
 .payments-table td,.payments-table th{border:0;padding:5px;min-width:0;text-align:left!important;white-space:normal}
 .payments-table td:first-child{grid-column:1/-1}.payments-table td:last-child{grid-column:1/-1}
 .payments-table td:nth-child(2)::before{content:'Аванс: ';color:#60796f}.payments-table td:nth-child(3)::before{content:'Долг: ';color:#60796f}.payments-table td:nth-child(4)::before{content:'Просрочено: ';color:#60796f}.payments-table td:nth-child(5)::before{content:'Срок: ';color:#60796f}
 .payments-table .payments-family td::before{content:none}
 .payments-layout{gap:12px}.payments-page,.payments-schedule-demo{overflow:visible}
 dialog{width:100%;max-width:100%;max-height:100dvh;margin:0 0 0 auto;padding:16px;border-radius:0;min-height:100dvh;border:0}
 .wide{width:100%}.dialog-top{gap:10px;margin-bottom:18px;align-items:flex-start}.dialog-top h2{font-size:20px}
 dialog input,dialog select,dialog textarea{font-size:16px}dialog button{min-height:44px}
 .lesson-layout{display:flex;flex-direction:column;gap:16px}.lesson-editor,.day-schedule{width:100%;min-width:0}
 .form-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
 #child-label,#kind-label,#status-label,#cancelled-by-label,#moved-by-label,#entry-type-label{grid-column:1/-1}
 .dialog-actions{flex-wrap:wrap;gap:8px;position:sticky;bottom:-16px;background:#fff;padding:12px 0 max(12px,env(safe-area-inset-bottom));z-index:2}
 .reference-row{grid-template-columns:1fr!important}.reference-row label{min-width:0}
 #mobile-more-dialog .mobile-more-actions{gap:8px}#mobile-filters-dialog label{margin:16px 0}
}

/* Mobile input focus: keep a readable size without restricting user zoom. */
@media(max-width:800px),(pointer:coarse){
 #workspace input:not([type=checkbox]):not([type=radio]),
 #workspace select,#workspace textarea,#login-form input,
 dialog input:not([type=checkbox]):not([type=radio]),dialog select,dialog textarea{font-size:16px}
 #workspace button,#workspace summary{touch-action:manipulation}
}

/* Mobile header must fit the layout viewport, including long account names. */
@media(max-width:800px){
 .schedule-header .brand{flex-shrink:0}
 .schedule-header .account{min-width:0;flex:1;justify-content:flex-end;gap:4px}
 .schedule-header #identity{min-width:0;max-width:95px;white-space:normal;overflow-wrap:anywhere}
 .schedule-header #account-menu{flex-shrink:0}
}
