/* A single app viewport keeps navigation reachable when browser chrome changes. */
:root{--app-height:100dvh}
html,body{height:100%;overflow:hidden;overscroll-behavior:none}
.game-shell{height:var(--app-height);min-height:0;overflow:hidden}
.game-body,.sidebar{height:100%;min-height:0}
.game-body{overflow:hidden}
#main{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scroll-padding-top:14px}
.topbar,.advance-bar{position:relative;inset:auto;flex-shrink:0}
.mobile-nav{display:none}
.sidebar{overflow:auto}
.sidebar-bottom{padding-top:20px}
.next-step{padding:16px 20px;display:flex;justify-content:space-between;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.next-step>span{font-weight:700}.next-step>small{color:#657369}
.people-alerts{display:flex;flex-wrap:wrap;padding:10px;gap:8px;margin-bottom:18px}
.people-alert{display:flex;align-items:center;gap:10px;flex:1 1 220px;text-align:left;background:#fff6e9;border:1px solid #e7d7b5;border-radius:8px;padding:10px}
.people-alert>span{min-width:0}.people-alert small{display:block;line-height:1.6;color:#775227}
.intro-goal{display:flex;justify-content:center;align-items:center;gap:12px;padding:18px 0;font-weight:800;font-size:1.05rem;color:var(--forest)}
.intro-rules{padding-left:20px;margin:12px 0}.intro-rules li{margin:12px 0;line-height:1.7}
.intro-modal .speaker-card{margin:0}.intro-modal .dialog-content>h2{font-size:1.4rem}
.setup-modal .start-fields{display:grid;grid-template-columns:1fr;gap:12px}
.setup-modal .animal-choice{margin-top:12px}
.transfer-modal{overflow:hidden;background:linear-gradient(145deg,#fdf7e4,#f1f6ed)}
.transfer-reveal{position:relative;isolation:isolate;animation:transfer-in .5s ease-out}
.transfer-reveal:before{content:'';position:absolute;inset:0;z-index:-1;background:repeating-conic-gradient(from 15deg at 50% 40%,#d8b85d15 0 10deg,transparent 10deg 25deg);border-radius:14px}
.transfer-reveal .transfer-avatar{box-shadow:0 8px 30px #213c3924;border:4px solid #e1c274;animation:transfer-in .7s ease-out}
.transfer-reveal.farewell:before{background:linear-gradient(135deg,#c9d9d755,#f7e8c4)}
@keyframes transfer-in{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
/* Full-screen match page. Only the opt-in details pane scrolls. */
.game-dialog.match-theatre-modal[open]{position:fixed;inset:0;margin:0;width:100%;max-width:none;height:var(--app-height);max-height:var(--app-height);border:0;border-radius:0;box-sizing:border-box;overflow:hidden}
.match-theatre-modal>.dialog-header{padding:8px 20px;min-height:0}
.match-theatre-modal>.dialog-content{display:flex;flex-direction:column;overflow:hidden;min-height:0;padding:0 20px 10px;width:100%;max-width:900px;align-self:center}
.match-theatre-modal .dialog-content>h2{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0}
#match-theatre{display:flex;flex:1;flex-direction:column;min-height:0;gap:8px;width:100%}
.match-watch-clock{margin:0;padding:6px 0;flex:none;display:flex;justify-content:space-between}
.clash-score{flex:none;padding:10px 20px;margin:0;min-height:0}
.clash-score>div{min-width:0;flex:1}.clash-score>div>strong{overflow-wrap:anywhere;line-height:1.35}
.clash-score .crest.large{width:52px;height:62px}.clash-score .crest.large span{font-size:1.7rem}
.clash-score>b{font-size:clamp(2rem,7vh,4.2rem);white-space:nowrap}
.clash-standing{flex:none;margin:0}.clash-progress{flex:none;margin:0;height:4px}
.match-spotlight{flex:1;min-height:0;margin:0;overflow:hidden;padding:18px;justify-content:center}
.match-spotlight .match-avatar{width:clamp(70px,16vh,150px);height:auto;flex:none}
.match-spotlight .match-commentary{line-height:1.65;font-size:clamp(.85rem,2.3vh,1.15rem)}
.match-end-brief{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;flex:none;padding:6px 0}
.match-end-brief>span{font-size:.8rem;color:#f0cc7c}
.match-theatre-modal>.dialog-footer{background:#102631;max-height:none;padding:10px 20px max(10px,env(safe-area-inset-bottom));overflow:visible}
.match-watch-actions{width:100%;max-width:900px;margin:0 auto;display:flex;gap:8px;flex-wrap:wrap}
.match-watch-actions>.button{min-height:44px;flex:1;padding:10px 14px;line-height:1.35}
.match-watch-actions>.auto-skip-toggle{flex:0 0 100%;font-size:.75rem;min-height:34px;padding:5px}
.match-details-view{overflow:auto;flex:1;min-height:0;overscroll-behavior:contain}.match-details-view h3{margin:18px 0 10px}.match-details-view .compact-table{color:#edf5fa}
@media(max-width:900px){
 .game-shell{display:block;height:var(--app-height)}
 .sidebar{display:none}
 .game-body{width:100%;height:100%;display:flex;flex-direction:column}
 .topbar{height:52px;min-height:52px;padding:0 12px;gap:6px}
 .topbar-right{gap:5px}.topbar-right .difficulty{display:none}
 #main{padding:16px 12px 24px;overflow:auto;height:auto}
 .advance-bar{position:relative;bottom:auto;left:auto;right:auto;width:100%;padding:8px 12px;min-height:60px;background:var(--cream);gap:8px;display:flex}
 .advance-hint{display:none}.advance-button{min-height:44px;padding:10px 12px;flex:1}
 .season-progress{display:none}
 .mobile-nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));flex:none;gap:0;background:var(--forest-deep);padding:3px 2px max(3px,env(safe-area-inset-bottom));border-top:1px solid #577566}
 .mobile-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:52px;border:0;border-radius:6px;background:none;color:#dbe6dd;padding:5px 2px;font-size:11px;line-height:1.3}
 .mobile-nav-item>.icon{width:20px;height:20px}.mobile-nav-item.active{background:#d4ed9220;color:#d4ed92}
 .game-dialog[open]{max-height:calc(var(--app-height) - 16px)}
 .next-step{padding:13px;gap:6px}.next-step>span{font-size:.875rem}.next-step small{font-size:.75rem}
 #toast{bottom:130px}
 .game-dialog.intro-modal{width:calc(100% - 20px);max-width:540px}
 .intro-modal .dialog-header{padding:10px 16px}.intro-modal .dialog-content{padding:8px 16px 12px}.intro-goal{font-size:.9rem;gap:8px;padding:12px 0}.intro-rules li{font-size:.875rem;margin:8px 0}
 .intro-modal .speaker-card{padding:10px;gap:10px}.intro-modal .speaker-card p{font-size:.875rem}.intro-modal .staff-avatar{width:52px}
 .match-theatre-modal>.dialog-content{padding:0 12px 6px}
 .match-theatre-modal>.dialog-header{padding:6px 12px}.match-theatre-modal .clash-score{padding:6px 0;gap:8px}
 .clash-score>div>strong{font-size:.875rem}.clash-score .crest.large{width:38px;height:46px}.clash-score .crest.large span{font-size:1.3rem}
 .match-watch-clock>span{font-size:.75rem}.match-watch-clock>strong{font-size:1rem}
 .match-spotlight{padding:12px;gap:12px}.match-spotlight strong{font-size:.85rem}.match-spotlight small{font-size:.75rem}
 .match-theatre-modal>.dialog-footer{padding:8px 12px max(8px,env(safe-area-inset-bottom))}
 .match-watch-actions>.button{font-size:.8rem;padding:8px 6px}.match-watch-actions>.button.quiet{flex-basis:auto}
 .match-end-brief{font-size:.8rem;gap:4px}.match-end-brief>.button{padding:7px 10px;min-height:40px;font-size:.75rem}
}
@media(max-height:570px){
 .match-theatre-modal .dialog-header{display:none}.match-theatre-modal .clash-score .crest{display:none}
 .match-spotlight{padding:8px;gap:10px}.match-spotlight .match-avatar{width:60px}.match-spotlight small{margin:0}
 .match-watch-clock{padding:3px 0}.clash-score>b{font-size:2rem}.clash-standing{font-size:.75rem}
 .match-watch-actions>.auto-skip-toggle{flex:1;min-height:44px}
}
@media(prefers-reduced-motion:reduce){.transfer-reveal,.transfer-reveal .transfer-avatar{animation:none}}
.pro-goal-reveal{display:flex;align-items:center;flex-direction:column;gap:12px;text-align:center;padding:25px;background:linear-gradient(145deg,#173e35,#2c6151);color:#f1d18c;border-radius:14px;margin-bottom:18px;animation:transfer-in .7s ease-out}.pro-goal-reveal>.icon{width:70px;height:70px}.pro-goal-reveal>span{font-size:.7rem;letter-spacing:.14em}.pro-goal-reveal>strong{font-size:1.25rem;color:#fff7de}

/* v7: replace the obsolete footer spacer, including older mobile overrides. */
.game-body{padding-bottom:0}
.match-panel{display:flex;flex:1;flex-direction:column;min-height:0;overflow:hidden;touch-action:pan-y pinch-zoom}
.match-panel>.match-spotlight{width:100%;height:100%;box-sizing:border-box}
.match-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));flex:none;gap:4px;padding:3px;background:#0c202c;border-radius:10px}
.match-tabs button{min-height:44px;padding:8px 4px;background:transparent;border:0;border-radius:7px;color:#d3e3ed;font:inherit;font-size:.875rem;font-weight:700;cursor:pointer}
.match-tabs button[aria-selected="true"]{color:#132c38;background:#ead49a;box-shadow:0 2px 5px #0002}
.match-tabs button:focus-visible,.match-panel:focus-visible{outline:3px solid #fff;outline-offset:-3px}
.match-record-row{display:flex;gap:14px;padding:12px 8px;border-bottom:1px solid #526976;color:#eff6fa}
.match-record-row>b{color:#ead49a;min-width:32px}.match-record-row small{display:block;color:#c2d3de;line-height:1.6;margin-top:4px}
.match-panel .match-details-view{width:100%;padding:0 4px;box-sizing:border-box}
.match-panel .compact-table tbody td,.match-panel .compact-table tbody th{color:#dce8ef}
.match-end-brief{min-height:22px}.match-end-brief>span{overflow-wrap:anywhere}
.concern-player{display:flex;align-items:center;gap:12px;padding:12px 0}.concern-player p{margin:4px 0;font-size:.875rem}
.position-comparison{margin:18px 0;border:1px solid var(--line);border-radius:10px;padding:14px}
.position-comparison h3{margin:0 0 8px;font-size:1rem}.position-comparison>p{margin:8px 0;font-size:.85rem;line-height:1.7}
.comparison-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:9px;padding:10px 0;border-top:1px solid var(--line)}
.comparison-row .avatar{width:36px;height:36px}.comparison-row strong{font-size:.85rem;overflow-wrap:anywhere}.comparison-row small{display:block;font-size:.72rem;line-height:1.6;color:#626656}
.comparison-row>span{text-align:right;font-size:.75rem}.comparison-impact{color:#526749}
.recruitment-modal .dialog-footer{flex-shrink:0}.signing-footer-quote{display:flex;justify-content:space-between;gap:6px 15px;flex-wrap:wrap;width:100%;font-size:.8rem}.signing-footer-quote b{margin-left:5px}
.sponsor-totals{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 0;font-size:.8rem}.sponsor-totals span>b{display:block;font-size:1.05rem;margin-top:4px;color:var(--forest)}
.sponsor-option{padding-bottom:46px}.sponsor-option small{display:block;line-height:1.6}
@media(max-width:900px){
 .game-body{padding-bottom:0;min-height:0}
 .recruitment-modal .dialog-footer{padding:10px 12px;gap:6px;flex-wrap:wrap}
 .recruitment-modal .dialog-footer .button{flex:1 1 45%;font-size:.75rem;padding:8px;min-height:42px}
 .recruitment-modal .dialog-content{padding:8px 16px 16px}
 .match-tabs button{font-size:.8rem}
}
@media(max-height:570px){
 .match-tabs button{min-height:36px;padding:6px 4px}.match-end-brief{font-size:.7rem;padding:2px 0}
 .match-spotlight .match-commentary{font-size:.8rem;line-height:1.4;margin:5px 0}
}