#phoneMenuBtn,#phoneFilterBtn{display:none}
/* Phone layout (max 767 px): small header, one date row, plan visible without scrolling.
   Everything is scoped to body.phone-readonly, so desktop and tablet are unchanged. */
@media(max-width:767px){
body.phone-readonly header{padding:5px 10px!important;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
body.phone-readonly header>div:first-child{display:flex;align-items:center;gap:8px;flex:1 1 0!important;flex-basis:0!important;min-width:0}
body.phone-readonly header .brand-wordmark{height:17px;width:auto;margin:0;flex:none}
body.phone-readonly header h2.planner-title{display:none!important}
body.phone-readonly header small{display:none!important}
body.phone-readonly header>div:nth-child(3){display:none!important;flex:1 1 100%;justify-content:space-between;align-items:center;gap:8px}
body.phone-readonly.pm-open header>div:nth-child(3){display:flex!important}
body.phone-readonly #phoneMenuBtn{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:4px 12px;font-size:13px;border-radius:8px;border:1px solid #fff;background:transparent;color:#fff;flex:none}
body.phone-readonly #phoneFilterBtn{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:4px 12px;font-size:13px;border-radius:8px;border:1px solid #c9d4e3;background:#fff;color:#202b3c;flex:none}
body.phone-readonly.pf-open #phoneFilterBtn{background:#245fac;color:#fff;border-color:#245fac}
body.phone-readonly nav.collab-nav{display:none!important}
body.phone-readonly.pm-open nav.collab-nav{display:flex!important;flex-wrap:wrap;gap:6px;padding:6px 10px}
body.phone-readonly nav.collab-nav button{min-height:34px;padding:4px 10px;font-size:13px;flex:1 1 40%}
body.phone-readonly main{padding:6px 8px!important}
body.phone-readonly .toolbar{display:grid!important;grid-template-columns:34px minmax(0,1fr) 34px 42px 54px 36px!important;gap:4px!important;align-items:center;margin:0 0 4px!important}
body.phone-readonly .toolbar>*{grid-row:1!important;margin:0!important}
body.phone-readonly .toolbar #prev{grid-column:1!important}
body.phone-readonly .toolbar #date{grid-column:2!important;width:100%!important;height:34px!important;font-size:14px!important;padding:2px 6px!important;min-width:0}
body.phone-readonly .toolbar #next{grid-column:3!important}
body.phone-readonly .toolbar #view-day{grid-column:4!important}
body.phone-readonly .toolbar #view-week{grid-column:5!important}
body.phone-readonly .toolbar #jobSearchOpen{grid-column:6!important}
body.phone-readonly .toolbar button{height:34px!important;min-height:34px!important;padding:2px 4px!important;font-size:13px!important}
body.phone-readonly .toolbar details.functions-menu{display:none!important}
body.phone-readonly.pm-open .toolbar details.functions-menu{display:block!important;grid-column:1/-1!important;grid-row:2!important}
body.phone-readonly .plan-controls{display:flex!important;flex-wrap:wrap;gap:4px!important;align-items:center;margin:0 0 4px!important;padding:0!important}
body.phone-readonly .plan-controls #compactScope{flex:1 1 0;min-width:0;height:34px!important;font-size:13px!important;padding:2px 6px!important;margin:0!important}
body.phone-readonly .plan-controls .stats{flex:1 1 100%!important;max-width:none!important;display:flex!important;gap:4px!important;margin:0!important}
body.phone-readonly .plan-controls .stats>.work-status-filter{flex:1 1 0;min-height:30px!important;height:30px;padding:2px 4px!important;font-size:12px!important;margin:0!important;white-space:nowrap}
body.phone-readonly .plan-controls .stats>#workStatusOverview{display:none!important}
body.phone-readonly.pm-open .plan-controls .stats>#workStatusOverview{display:block!important;flex:1 1 100%}
body.phone-readonly .plan-controls .plan-tools{display:none!important}
body.phone-readonly #teamWeekSidebar{display:none!important}
body.phone-readonly.pf-open #teamWeekSidebar{display:block!important;margin:0 0 6px}
body.phone-readonly .teamweek-month{display:none!important}
body.phone-readonly .planner-shell{display:block!important}
body.phone-readonly #mobileList .mobile-banner{display:none!important}
body.phone-readonly #mobileList .mobile-daytitle{font-size:13px!important;margin:2px 2px 4px!important}
body.phone-readonly #mobileList .mobile-person{margin:0 0 6px!important}
body.phone-readonly #mobileList .mobile-person-head{padding:3px 8px!important;min-height:0!important;font-size:13px!important}
body.phone-readonly #mobileList .mobile-person-head *{font-size:13px!important}
body.phone-readonly #mobileList .mobile-person-head small{font-size:11px!important}
body.phone-readonly #mobileList .mobile-entry{padding:4px 8px!important;gap:8px!important;display:grid!important;grid-template-columns:44px minmax(0,1fr)!important;align-items:start}
body.phone-readonly #mobileList .mobile-entry-time{font-size:12px!important;line-height:1.25!important;min-width:0!important;white-space:normal;word-break:keep-all}
body.phone-readonly #mobileList .mobile-entry-text{font-size:13px!important;line-height:1.25!important;display:flex!important;flex-wrap:wrap;align-items:center;gap:2px 8px}
body.phone-readonly #mobileList .mobile-entry-text>div{font-size:13px!important;flex:1 1 150px;min-width:0}
body.phone-readonly #mobileList .mobile-entry-text>small{display:none!important}
body.phone-readonly #mobileList .mobile-entry-text .work-status-badge{min-height:30px!important;padding:2px 10px!important;font-size:12px!important;flex:none;margin:0!important}
body.phone-readonly #status{font-size:11px;margin:4px 2px}
}
@media(max-width:767px){body.phone-readonly.pm-open #workStatusOverview{position:static!important;height:auto!important;margin:0 0 6px!important}}
/* Mitarbeiter (viewer): start with the own department (own position on top); the department selection stays available for reading. */
@media(max-width:767px){body.phone-readonly[data-role="viewer"] nav.collab-nav .collab-admin{display:none!important}}