/* Dedicated touch layout. The desktop entry keeps its original court and sidebar. */
html:fullscreen{background:#11181e}
.mobile-app{height:100svh;height:100dvh;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);overscroll-behavior:none}
.mobile-app header{height:auto;min-height:0;margin:0;padding:4px 12px 7px;display:grid;grid-template-columns:minmax(0,1fr) auto 36px;gap:4px 10px;border:0}
.mobile-app .brand{font-size:21px;gap:8px;min-width:0}.mobile-app .brand-mark{height:29px;width:28px;font-size:25px}.mobile-app .brand small{font-size:9px;margin-top:2px;letter-spacing:1px}.mobile-app .view-link{font-size:11px;display:flex;align-items:center;min-height:36px;color:#aebfb8;text-decoration:none;white-space:nowrap}.mobile-app .help{order:0;font-size:0;width:36px;height:36px;padding:0}.mobile-app .help span{font-size:13px;margin:0}
.mobile-app .mode-switch{order:0;grid-column:1/-1;grid-row:2;width:100%;padding:3px;gap:3px}.mobile-app .mode-switch button{flex:1;min-height:34px;padding:5px 8px;font-size:12px;white-space:nowrap}
.mobile-app main{display:block;width:100%;min-height:0;padding:0 8px 7px;max-width:none;margin:0}.mobile-app .arena{height:100%;min-height:0;position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) 42px 144px;gap:6px}
.mobile-app .lesson-mission,.mobile-app .scoreboard{grid-column:1;grid-row:1}.mobile-app .lesson-mission{margin:0;padding:6px 10px;border-radius:8px}.mobile-app .mission-top{gap:8px;line-height:1.2}.mobile-app .mission-top .eyebrow{font-size:9px;letter-spacing:1px}.mobile-app #mobileLessonProgress{font-size:10px;color:#b8cead;flex:1}.mobile-app .mission-top>div{gap:14px}.mobile-app .mission-top .text-button{min-height:26px;font-size:11px}.mobile-app .lesson-mission h2{font-size:14px;line-height:1.35;margin:0 0 3px}.mobile-app .lesson-mission>p{font-size:12px;line-height:1.5;margin:0;min-height:0}.mobile-app .lesson-steps,.mobile-app .lesson-bottom,.mobile-app .lesson-shot-meter{display:none!important}
.mobile-app .scoreboard{height:43px;padding:0 10px}.mobile-app .team-score{gap:8px}.mobile-app .team-score strong{font-size:33px;min-width:32px}.mobile-app .team-score span{font-size:10px}.mobile-app .score-center>span{display:none}.mobile-app .score-center b{font-size:12px}.mobile-app .score-center small{font-size:9px}
.mobile-app .court-wrap{grid-row:2;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;border-radius:10px;background:#b98f5b}.mobile-app #court,.mobile-app.tutorial-mode #court{width:100%;height:100%;min-height:0;max-height:none;object-fit:contain;outline-offset:-3px}.mobile-app .court-top{top:6px;left:6px;right:6px}.mobile-app .court-top>span{font-size:9px;padding:3px 6px;max-width:calc(100% - 68px)}.mobile-app .shotclock{display:flex;padding:1px 6px;gap:5px}.mobile-app .shotclock>span{display:none}.mobile-app .shotclock strong{font-size:23px;min-width:32px}.mobile-app.tutorial-mode .shotclock{display:none}.mobile-app .court-bottom{display:none}.mobile-app .toast{position:relative;left:auto;bottom:auto;transform:none;width:100%;max-width:none;min-height:27px;max-height:42px;overflow:hidden;padding:5px 8px;font-size:10px;line-height:1.5;border:0;border-radius:0;color:#e4ecdb;background:#172830f5}.mobile-app .screen-banner{font-size:10px;top:39px;padding:4px 7px;white-space:nowrap}
.mobile-app .court-overlay{padding:12px}.mobile-app .court-overlay h1{font-size:22px;margin:5px 0;letter-spacing:1px}.mobile-app .court-overlay p{font-size:12px;line-height:1.7;margin-bottom:10px;max-width:350px}.mobile-app .overlay-label{font-size:11px;letter-spacing:2px}.mobile-app .court-overlay small{font-size:9px;margin-top:7px}.mobile-app .primary{min-height:44px;padding:9px 18px;font-size:13px}
.mobile-app .transport{grid-row:3;margin:0;gap:5px;flex-wrap:nowrap;justify-content:flex-start}.mobile-app .transport>div{gap:5px}.mobile-app .square{width:44px;flex:0 0 44px;padding:0;height:42px;font-size:20px;border-radius:8px}.mobile-app .mobile-details-button{order:3;margin-left:auto;letter-spacing:0;font-size:25px}.mobile-app .practice-speed{gap:5px;font-size:10px;margin-left:auto;white-space:nowrap}.mobile-app .practice-speed select{min-height:42px;padding:5px;font-size:11px;border-radius:8px}.mobile-app .replay-panel{position:absolute;z-index:5;left:8px;right:8px;bottom:195px;background:#1b2a32f5;box-shadow:0 6px 24px #0006;margin:0;padding:10px}.mobile-app .replay-panel p{font-size:11px;margin-bottom:0}.mobile-app .replay-panel input{min-height:34px}
.mobile-app .controls{grid-row:4;min-height:0;margin:0;padding:5px 7px 7px;display:grid;grid-template-columns:88px minmax(0,1fr);grid-template-rows:28px minmax(0,1fr);gap:4px 8px;background:#19262b;border:1px solid #354840;border-radius:12px;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none}.mobile-app .mobile-shot-meter{grid-column:1/-1;grid-row:1;align-self:start}.mobile-app .mobile-shot-meter>div:first-child{display:flex;align-items:center;justify-content:space-between;font-size:10px;line-height:1.3;color:#9db4ab}.mobile-app .mobile-shot-meter b{font-size:10px;font-weight:500;color:#d7e9bd}.mobile-app .mobile-shot-meter .meter-track{height:6px;margin-top:4px;background:#0e181d}.mobile-app #mobileChargeFill{position:absolute;inset:0 auto 0 0;width:0;background:#def7937a}.mobile-app #mobileChargeCursor{height:12px;top:-3px}.mobile-app .mobile-shot-meter.no-ball .meter-track{opacity:.25}.mobile-app .mobile-shot-meter.charging b{color:var(--lime)}
.mobile-app .stick{display:block;position:relative;grid-column:1;grid-row:2;align-self:center;width:88px;height:88px;border-radius:50%;background:radial-gradient(circle,#243b36 44%,#16272c 45%);border:1px solid #536b5c;touch-action:none;flex-shrink:0}.mobile-app .stick>span{position:absolute;width:38px;height:38px;left:24px;top:24px;border-radius:50%;background:#728957;border:1px solid #c5df91;box-shadow:0 3px 12px #0005;pointer-events:none}.mobile-app .stick>b{display:none}.mobile-app .stick:after{content:'移动';position:absolute;left:0;right:0;bottom:3px;text-align:center;color:#a9beaa;font-size:9px;pointer-events:none}
.mobile-app .controls-content{grid-row:2;grid-column:2;min-width:0;align-self:stretch;display:grid;grid-template-rows:48px minmax(44px,1fr);gap:5px}.mobile-app .pass-controls{gap:5px}.mobile-app .pass-controls button{min-width:0;min-height:46px;display:flex;flex-direction:row;gap:5px;justify-content:center;padding:3px;background:#30402d;border-color:#6c8050;border-radius:8px;touch-action:none}.mobile-app .pass-controls kbd{font:700 24px 'Barlow Condensed',sans-serif;min-width:16px;line-height:1;color:#e1ffa6;background:none}.mobile-app .pass-controls span{display:block;font-size:9px;line-height:1.1;color:#c0d0ae}.mobile-app .pass-controls small{display:none}.mobile-app .action-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0}.mobile-app .action-controls button{min-width:0;min-height:44px;padding:3px 1px;font-size:10px;line-height:1.3;white-space:normal;border-radius:8px;background:#27363b;border-color:#455955}.mobile-app .action-controls kbd{display:none}.mobile-app .action-controls #shootBtn{background:#526635;color:#eaffc8;border-color:#899e61;font-weight:600}.mobile-app .action-controls:has(#stealBtn:not([hidden])){grid-template-columns:repeat(2,minmax(0,1fr))}.mobile-app .action-controls button:active,.mobile-app .pass-controls button:active{filter:brightness(1.25)}.mobile-app .below-court{display:none}
.mobile-app dialog{width:min(560px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:24px 16px;overscroll-behavior:contain}.mobile-app dialog h2{font-size:20px}.mobile-app dialog p{font-size:13px}.mobile-app .close-dialog{width:44px;height:44px;top:0;right:0;z-index:1}.mobile-app .desktop-help-grid{display:none}.mobile-help-grid{display:grid;grid-template-columns:76px 1fr;gap:14px 12px;padding:16px 0;border-block:1px solid var(--line);font-size:12px}.mobile-help-grid b{font-weight:500;color:#d5ebb2}.mobile-help-grid span{color:#b7cbd2}.mobile-app .sidebar{display:grid;grid-template-columns:1fr;gap:10px;padding:0}.mobile-app .coach-card,.mobile-app .feed-card,.mobile-app .report-card{padding:14px}.mobile-app .sidebar .shot-meter{display:none}.mobile-app .mobile-detail-options{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin:10px 0 16px}.mobile-app .mobile-detail-options>button{min-height:44px}.mobile-app .toggle{min-height:44px;margin:0}.mobile-app .tactic-select select{min-height:44px}.mobile-app .lesson-choice{min-height:64px}.mobile-app .lesson-choice small{line-height:1.6}.mobile-app .lesson-choice em{font-size:10px}.mobile-app .your-role{font-size:13px}.mobile-app .teammate-list{grid-template-columns:repeat(3,1fr)}
@media(orientation:landscape){.mobile-app header{grid-template-columns:170px minmax(270px,1fr) auto 36px;gap:8px;padding:3px 10px;height:46px}.mobile-app .brand{font-size:18px}.mobile-app .brand-mark{height:28px;width:27px}.mobile-app .brand small{font-size:8px}.mobile-app .mode-switch{grid-column:2;grid-row:1}.mobile-app .mode-switch button{min-height:30px;padding:3px 6px;font-size:11px}.mobile-app .arena{grid-template-columns:minmax(0,1fr) minmax(285px,38%);grid-template-rows:auto 42px minmax(144px,1fr);column-gap:8px}.mobile-app .court-wrap{grid-column:1;grid-row:1/4}.mobile-app .lesson-mission,.mobile-app .scoreboard{grid-column:2;grid-row:1}.mobile-app .lesson-mission{padding:5px 8px}.mobile-app .lesson-mission h2{font-size:13px}.mobile-app .lesson-mission>p{font-size:11px;line-height:1.45}.mobile-app .mission-top>div{gap:10px}.mobile-app .transport{grid-column:2;grid-row:2}.mobile-app .controls{grid-column:2;grid-row:3;align-self:end;height:144px;grid-template-columns:70px minmax(0,1fr);gap:4px 6px;padding-inline:5px}.mobile-app .stick{width:70px;height:70px}.mobile-app .stick>span{left:17px;top:17px;width:34px;height:34px}.mobile-app .stick:after{font-size:8px;bottom:1px}.mobile-app .pass-controls button{gap:2px}.mobile-app .pass-controls span{font-size:8px}.mobile-app .action-controls{gap:3px}.mobile-app .action-controls button{font-size:10px}.mobile-app .replay-panel{right:calc(38% + 12px);bottom:12px}.mobile-app .court-overlay h1{font-size:22px}.mobile-app .court-overlay p{max-width:320px}}
@media(max-height:620px) and (orientation:portrait){.mobile-app header{padding-top:2px;padding-bottom:3px}.mobile-app .brand small{display:none}.mobile-app .arena{grid-template-rows:auto minmax(0,1fr) 42px 138px;gap:4px}.mobile-app .lesson-mission h2{display:none}.mobile-app .lesson-mission{padding:4px 8px}.mobile-app .court-overlay h1{font-size:18px}.mobile-app .court-overlay p{font-size:11px;line-height:1.45;margin-bottom:5px}.mobile-app .court-overlay small{display:none}.mobile-app .controls{grid-template-rows:24px minmax(0,1fr)}}

/* On a wide phone, the thumbs stay at opposite edges of the screen. */
@media(orientation:landscape){.mobile-app .controls{grid-template-columns:minmax(0,1fr)}.mobile-app .controls-content{grid-column:1}.mobile-app .stick{position:fixed;z-index:3;left:calc(env(safe-area-inset-left) + 16px);bottom:calc(env(safe-area-inset-bottom) + 16px);width:76px;height:76px;background:radial-gradient(circle,#243b36e8 44%,#16272ce8 45%);box-shadow:0 3px 16px #0003}.mobile-app .stick>span{left:20px;top:20px;width:34px;height:34px}}

.mobile-app .mobile-fullscreen-button{min-width:50px;height:36px;padding:0 5px;border:1px solid #647751;border-radius:7px;color:#def49c;background:#2b3a29;font-size:11px;white-space:nowrap;touch-action:manipulation}
.mobile-app header>.view-link{display:none}
.mobile-rotate-gate{position:fixed;z-index:100;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:32px max(24px,env(safe-area-inset-right)) 32px max(24px,env(safe-area-inset-left));text-align:center;background:radial-gradient(ellipse at 50% 15%,#30412c,#11181e 65%);overflow:auto}
.mobile-rotate-gate[hidden],.mobile-screen-notice[hidden]{display:none}
.mobile-rotate-gate h1{font-size:27px;line-height:1.4;margin:0;color:#edf5e3}
.mobile-rotate-gate p{font-size:14px;line-height:1.9;color:#b7c9bd;margin:0}
.mobile-rotate-gate .primary{margin-top:8px;min-width:180px;min-height:48px}
.mobile-rotate-gate small{max-width:280px;color:#a8b9b0;font-size:12px;line-height:1.8}
.mobile-rotate-gate a{font-size:12px;color:#cce693;padding:10px}
.rotate-phone{width:94px;height:51px;border:3px solid #cee994;border-radius:12px;box-shadow:0 0 50px #c5f37812;display:grid;place-items:center;margin-bottom:12px;position:relative}
.rotate-phone:after{content:'';position:absolute;right:5px;width:3px;height:12px;border-radius:2px;background:#cee994}
.rotate-phone span{font-size:36px;color:#cee994;line-height:1}
.mobile-screen-notice{position:fixed;z-index:110;bottom:calc(env(safe-area-inset-bottom) + 10px);left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);padding:10px 16px;border:1px solid #6a7856;border-radius:10px;color:#e3efca;background:#1b2b29f5;box-shadow:0 4px 20px #0005;font-size:12px;line-height:1.6;pointer-events:none}
@media(orientation:landscape){
 .mobile-app header{grid-template-columns:minmax(105px,145px) minmax(210px,1fr) 50px 36px;gap:8px}
 .mobile-app .arena{grid-template-rows:minmax(0,1fr) 42px 144px}
 .mobile-app .lesson-mission{min-height:0;overflow:auto;align-self:start;max-height:100%}
 .mobile-app .scoreboard{align-self:start}
}
@media(orientation:landscape) and (max-height:380px){
 .mobile-app header{height:40px;padding-block:1px}
 .mobile-app .arena{grid-template-rows:minmax(0,1fr) 38px 126px;gap:4px 8px}
 .mobile-app .square,.mobile-app .practice-speed select{height:38px;min-height:38px}
 .mobile-app .controls{height:126px;grid-template-rows:22px minmax(0,1fr);padding-block:3px}
 .mobile-app .controls-content{grid-template-rows:42px minmax(42px,1fr);gap:4px}
 .mobile-app .pass-controls button,.mobile-app .action-controls button{min-height:42px}
 .mobile-app .lesson-mission h2{font-size:12px}
 .mobile-app .court-overlay h1{font-size:19px;margin:3px 0}
 .mobile-app .court-overlay p{font-size:11px;line-height:1.5;margin-bottom:7px}
}