/* App controls adapt to portrait phones; desktop layouts keep their hierarchy. */
.meeting-actions-panel>summary{display:none}.sidebar:has(>.meeting-actions-panel){display:block}
@media(max-width:650px){
 body{padding-left:max(16px,var(--edge-left));padding-right:max(16px,var(--edge-right));font-size:15px}
 .top{height:64px;position:sticky;top:var(--edge-top);background:#000;z-index:5;gap:8px}
 main{padding:24px 0}.hero{gap:16px;margin-bottom:20px}.hero h1{font-size:32px;line-height:1.1}.hero p{font-size:14px}
 .hero>button{width:100%;min-height:48px;margin-top:14px}
 .home-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.home-tools button{min-width:0;padding:12px 8px;font-size:13px;overflow-wrap:anywhere}
 .meeting-row{grid-template-columns:42px minmax(0,1fr);gap:10px;padding:20px 0}.meeting-row .badge{grid-column:2;max-width:none}.meeting-row strong{font-size:19px}
 .overview-stats{gap:10px 16px;font-size:13px;margin:14px 0}
 .meeting-tools{display:grid;grid-template-columns:minmax(0,1fr) 48px;gap:8px;margin:16px 0}.meeting-tools .icon{width:48px;height:48px;padding:12px}.meeting-tools .payment-summary{grid-column:1/-1;margin:0}.meeting-tools>button{flex:1;min-height:48px;font-size:13px}.meeting-tools .primary{flex-basis:100%}
 .tabs{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0;position:sticky;top:calc(var(--edge-top) + 64px);background:#000;z-index:4}
 .tabs button{min-width:0;font-size:13px;padding:12px 2px;min-height:48px}
 .meeting-layout{gap:16px}.sidebar:has(>.meeting-actions-panel){display:block;padding:0;background:transparent;border-radius:6px}
 .meeting-actions-panel{padding:0 14px 14px}.meeting-actions-panel:not([open]){padding-bottom:0}
 .meeting-actions-panel>summary{display:list-item;cursor:pointer;min-height:48px;padding:14px 0;font-size:14px;font-weight:700;color:var(--ink)}
 .meeting-actions-panel>h3{display:none}.meeting-actions-panel>p{font-size:13px;margin-top:0}
 .meeting-actions-panel button{min-height:48px;font-size:14px}.section-head{flex-wrap:wrap;gap:10px;margin-top:20px}
 .section-head>button{width:100%;min-height:48px;font-size:14px}
 .team-section header{align-items:center}.team-section h3{font-size:20px}.team-section header button{font-size:13px;min-width:44px}
 .player{gap:8px;padding:12px 0}.player .name{font-size:15px}.player-meta button{font-size:13px;min-height:44px}
 .guest-form{flex-wrap:wrap}.guest-form input{flex-basis:100%}.guest-form button{width:100%;min-height:48px;font-size:14px}
 .training-transition{display:block}.training-transition button{width:100%;margin-top:10px;min-height:48px}
 .training-heading button{width:100%;min-height:48px}.attendance-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:14px 0}
 .attendance-row>span{grid-column:1/-1;font-size:16px;font-weight:700}.attendance-row button{min-height:48px;font-size:14px}
 .exercise strong{font-size:16px}.exercise-list{margin:16px 0}.plan-row .fields{grid-template-columns:1fr}
 dialog, #distribution{padding:16px;border-radius:0;max-width:calc(100vw - var(--edge-left) - var(--edge-right));width:calc(100vw - var(--edge-left) - var(--edge-right));max-height:calc(var(--app-height) - var(--edge-top) - var(--edge-bottom));inset:calc(var(--viewport-top) + var(--edge-top)) auto auto calc(var(--edge-left) + (100vw - var(--edge-left) - var(--edge-right))/2);scroll-padding-top:100px;scroll-padding-bottom:80px}
 dialog>header,dialog>form>header,#distribution .roster-header{position:sticky;top:-16px;background:#080e0b;z-index:6;padding:12px 0;margin-bottom:16px;gap:12px;align-items:start}
 dialog h2{font-size:23px;line-height:1.2}dialog header>div{min-width:0}dialog header button{width:44px;height:44px;min-width:44px;flex-shrink:0;margin-top:-4px}
 dialog label{font-size:14px}.fields{grid-template-columns:1fr;gap:0}.fields label{margin:10px 0}
 dialog input:not([type=checkbox]),dialog select,dialog textarea{font-size:16px!important;min-height:48px}
 dialog .primary[type=submit]{min-height:48px;width:100%}
 .check,.module-option{min-height:48px}.connection-tools button{flex:1 1 140px;min-height:48px}
 .access-card header{position:static}.access-card .badge{white-space:normal}.progress-records header{position:static}
 .member-add-footer{bottom:-16px;padding:12px 0}.member-add-footer button{min-height:48px;font-size:14px}
 #distribution .roster-header .eyebrow{display:none}#distribution h2{font-size:23px;margin:0 0 6px}#roster-count{font-size:12px}
 .roster-toolbar{margin-bottom:4px;gap:8px}.roster-toolbar label>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .roster-toolbar input,.roster-toolbar select{margin-top:0}.roster-views{height:48px}.roster-views button{min-height:44px;min-width:0;padding:8px 2px}
 .roster-level-guide{padding:0;border-bottom:0;margin:0}.roster-level-guide summary{font-size:12px;padding:12px 0}
 .roster-balance{padding:0}.roster-balance #balance-summary{display:none}#roster-strength-details>summary{font-size:12px}
 #distribution .distribution-actions{margin:6px 0 12px;gap:8px}#distribution .distribution-actions>button{min-height:48px}
 #distribution .board-navigation{position:sticky;top:var(--roster-sticky-top,76px);z-index:5;background:#080e0b}
 #distribution .roster-column>header{position:static}#distribution .roster-column>header span{font-size:13px}
 #distribution .roster-level select{min-height:44px}#distribution .roster-name{font-size:15px}
 .roster-footer{bottom:-16px;max-height:calc((var(--app-height) - var(--edge-top) - var(--edge-bottom))*.5)}
 .roster-selection-fields select{min-height:44px}.roster-selection-fields button{min-height:48px}
 .training-view .meeting-layout>.sidebar{grid-row:2}
 #demo{padding:8px;font-size:11px}#demo select{display:block;width:100%;margin:6px 0 0;min-height:44px}
}
@media(max-width:360px){.top .brand{font-size:16px}#identity{font-size:11px;max-width:100px}.home-tools{grid-template-columns:1fr}.progress-stats{gap:8px}.progress-stats b{font-size:26px}.training-result .training-stats b{font-size:25px}}
@media(max-width:650px) and (max-height:500px){dialog .eyebrow{display:none}dialog h2,#distribution h2{font-size:20px}dialog>header,dialog>form>header{margin-bottom:12px}dialog{scroll-padding-top:76px}.roster-selection-fields{flex-wrap:wrap}.roster-selection>small{display:none}}

@media(max-width:650px){#distribution .roster-card,#distribution .roster-all .roster-card{grid-template-columns:44px minmax(0,1fr) 60px}.roster-select{min-width:44px}}

.short-viewport dialog>header,.short-viewport dialog>form>header,.short-viewport #distribution .roster-header{padding:8px 0;margin-bottom:12px}.short-viewport dialog .eyebrow,.short-viewport #roster-count{display:none}.short-viewport dialog h2,.short-viewport #distribution h2{font-size:20px}.short-viewport dialog{scroll-padding-top:88px}