/* Option 4 readability floor — no tiny brochure copy. */
body{font-size:17px;line-height:1.52}.brand{min-height:44px}.desktop-nav button{font-size:15px;font-weight:500}.profile-button strong{font-size:15px}.profile-button small{font-size:13px}.eyebrow,.stat-label{font-size:13px;line-height:1.3}.section-sub,.muted{font-size:15px}.card p,.empty span,.choice small,.option small,.game-tile span,.player-chip small,.fixture-row small,.person-row small,.ladder-row small,.event-row small,.feature-card p,.training-tool p,.price-card p,.setup-step p{font-size:15px;line-height:1.5}.choice strong,.option strong,.game-tile strong,.player-chip strong{font-size:16px}.badge{font-size:13px}.btn{font-size:15px;min-height:50px}.btn.small{font-size:14px;min-height:44px}.mobile-menu button{font-size:15px;font-weight:500}.footer-links button,.footer p,.footer-brand span{font-size:14px}.system-check span,.match-player small,.match-vs small,.match-message small,.bot-entry label:first-child,.owner-row small,.owner-row time,.inbox-list>button span,.inbox-list>button small{font-size:13px}.segment-grid button{font-size:18px}.mult-row button{font-size:14px}.auth-links button{font-size:14px}.all-games span{font-size:12px}.all-games small{font-size:14px}.r3bv-head-meta span,.r3bv-kicker{font-size:13px!important}.r3bv-card p{font-size:16px!important}.r3bv-btn{font-size:15px!important}.mobile-bottom button{font-weight:500}
/* Phone menu safety: grid children must never expand the fixed menu beyond the viewport.
   This matters for first-class entries such as Arena as well as future longer labels. */
.mobile-menu{max-width:calc(100vw - 24px)!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;overflow-x:hidden!important}.mobile-menu button{min-width:0!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important}
/* Keep the signed-in account identity useful without letting long names/status copy push
   the production header past the viewport at normal laptop/desktop widths. The Cameras
   entry is first-class now, so compact the header spacing rather than clipping the account. */
@media(max-width:1500px) and (min-width:1181px){.topbar{padding-left:16px;padding-right:16px;gap:14px}.desktop-nav{min-width:0}.desktop-nav button{padding-left:7px;padding-right:7px;font-size:14px}.top-actions{min-width:0;gap:5px}.profile-button{min-width:0;padding-left:5px;padding-right:5px}.profile-button span:last-child{min-width:0;max-width:78px}.profile-button strong{display:block;max-width:78px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-button small{display:none}}
/* Twelve first-class product tabs cannot fit honestly at compact-desktop widths. Collapse
   every desktop-nav child with an important display rule because Arena injects late CSS.
   Keep the nav container itself present for layout/acceptance identity, then expose the full
   menu button. Fixed-size brand/actions cannot force horizontal document overflow. */
@media(max-width:1180px) and (min-width:981px){.topbar{padding-left:14px!important;padding-right:14px!important;gap:12px!important;max-width:100vw!important}.brand{flex:0 0 auto!important;min-width:0!important}.desktop-nav{display:flex!important;min-width:0!important;max-width:0!important;flex:0 1 0!important;overflow:hidden!important}.desktop-nav button,.desktop-nav [data-dv-arena-nav]{display:none!important;min-width:0!important;width:0!important;padding:0!important;margin:0!important;border:0!important}.menu-button{display:grid!important;place-items:center!important;flex:0 0 46px!important}.top-actions{margin-left:auto!important;min-width:0!important;flex:0 0 auto!important;gap:5px!important}.profile-button{min-width:0!important;padding-left:4px!important;padding-right:4px!important}.profile-button span:last-child{display:none!important}.icon-btn{flex:0 0 44px!important;width:44px!important;height:44px!important}}
@media(max-width:620px){body{font-size:17px}.brand{min-height:44px}.page-title{font-size:40px}.hero p,.lede{font-size:17px}.section-sub,.muted,.card p,.empty span,.choice small,.option small,.game-tile span,.player-chip small,.fixture-row small,.person-row small,.feature-card p,.training-tool p,.price-card p,.setup-step p{font-size:15px}.mobile-bottom button{font-size:13px}.mobile-bottom button b{font-size:21px}.match-player span{font-size:13px}.btn{min-height:52px}.segment-grid button{min-height:52px}
/* Real-tester mobile floor: any visible interactive control must be comfortably tappable.
   Some inherited/overlay controls still declared 32–36px fixed heights. Min-height wins
   without changing their width or visual identity and keeps every escape/action at least 44px. */
body button,body a[href],body input:not([type="hidden"]),body select{min-height:44px!important}}

/* Production viewport authority v2.
   The live root was still resolving a 1280px layout box at compact widths even after the
   nav itself collapsed. Lock the Option 4 shell and each top-level surface to the actual
   visual viewport, and anchor the compact menu from the viewport's left edge so an
   accidental transformed containing block can never place it off-screen. */
html,body,#app,.app-shell{min-width:0!important;width:100%!important;max-width:100vw!important}
#app{contain:layout style!important}
#app>.topbar,#app>.page,#app>.footer,#app>[data-mobile-menu]{min-width:0!important;max-width:100vw!important}
.topbar{width:100%!important}
.page{min-width:0!important}
.page>*{min-width:0!important;max-width:100%!important}
.footer{min-width:0!important;width:100%!important;max-width:100vw!important}
@media(max-width:1180px){
  .page{width:calc(100vw - 24px)!important;max-width:calc(100vw - 24px)!important}
  .dashboard-strip,.play-modes,.home-lower,.grid-2,.grid-3,.grid-4,.grid-5,.grid-6,.split-layout,.feed-layout,.challenge-hero,.compete-top,.train-hero,.passport-hero,.board-layout,.online-layout,.games-night-board{min-width:0!important;max-width:100%!important}
}
@media(max-width:980px){
  .mobile-menu{position:fixed!important;left:12px!important;right:auto!important;width:min(340px,calc(100vw - 24px))!important;max-width:calc(100vw - 24px)!important}
}
