.mobile-shortcuts{display:none}
@media(max-width:700px),(max-height:600px){
  html{scroll-padding-top:72px}
  body.desk{height:auto;min-height:100dvh;overflow:visible;display:block;font-size:16px}
  .desk .desk-header{padding:8px 12px;gap:8px;min-width:0}
  .desk-header .institution-brand{width:185px;max-width:60%;margin-right:auto}
  .desk-header #session-select{order:3;width:100%;max-width:none;min-width:0}
  .desk-header #room-filter{order:4;flex:1;min-width:0}
  .desk-header #room-select{min-width:0;max-width:100%;flex:1}
  .desk-header #connection{order:5;flex-basis:100%;margin:0}
  .desk-header .role-label,.desk-header #account{display:none}
  .desk-header form{order:6}.desk-header [data-exam-sound]{order:6}
  .desk button,.desk input:not([type=checkbox]),.desk select{min-height:44px;font-size:16px}
  .desk .mobile-shortcuts{display:flex;position:sticky;top:0;z-index:5;gap:5px;padding:7px 8px;background:var(--paper);border-bottom:2px solid #d6ae30;overflow-x:auto}
  .mobile-shortcuts button{flex:1;min-width:0;padding:8px 5px;line-height:1.2;font-size:14px}
  .mobile-shortcuts [aria-current=page],.mobile-shortcuts [aria-expanded=true]{background:var(--soft);border-color:#a78629;font-weight:700}
  .desk #timer-workspace{display:none;height:auto;min-height:0;max-height:none;padding:12px;scroll-margin-top:66px}
  .desk.mobile-timers-open #timer-workspace{display:flex}
  .desk #splitter{display:none}
  .desk .timers{overflow:visible;grid-template-columns:minmax(0,1fr)}
  .desk .timer .controls button{min-height:44px;font-size:15px}
  .desk .timer .digits{font-size:48px}
  .desk .tab-groups{padding:8px 8px 0}
  .desk .tabbar{display:block;padding:4px 8px 8px}
  .desk #tabs{min-width:0;overflow:auto}
  .desk #all-tabs{width:100%;margin-top:6px;font-size:16px}
  .desk #workspace{overflow:visible;min-height:220px;padding:16px 12px;scroll-margin-top:64px;min-width:0}
  .desk .page-heading{display:block;margin-bottom:14px}
  .desk .page-heading .toolbar{margin:10px 0}
  .desk .columns,.desk .field-grid,.desk .toilet-grid{grid-template-columns:minmax(0,1fr)}
  .desk .toilet-grid .toolbar button{flex:1;min-height:48px}
  .desk .panel{padding:15px}.desk .toolbar>*{max-width:100%}
  .desk .kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .desk .kpis>div{border-bottom:1px solid var(--line);padding:12px}
  .desk .desk-footer{padding:12px;overflow-wrap:anywhere}
  .desk dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
  .desk dialog form{max-height:calc(100dvh - 20px)}
  .desk .dialog-head,.desk #modal-body,.desk .dialog-actions{padding:14px}
  .desk .dialog-head h2{font-size:19px}.desk .dialog-actions{flex-wrap:wrap;flex-shrink:0}
  .desk .dialog-actions button{flex:1;min-height:44px}
  .desk #modal-error{margin:0 14px 10px}
  .projection{height:auto;min-height:100dvh;padding:12px}
  .projection header{flex-wrap:wrap;gap:12px}
  .projection header button{min-height:44px;font-size:16px}
  .projection .timers{overflow:visible;grid-template-columns:minmax(0,1fr)}
  .projection .digits{font-size:64px}
}
@media(max-width:360px){
  html{scroll-padding-top:120px}
  .desk .mobile-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .desk #workspace,.desk #timer-workspace{scroll-margin-top:116px}
}