/* RUNQUEST 40 — premium sportswear / compact mobile UI layer.
   The document stays fixed; long content scrolls only inside the active pane. */
:root{--rq40-blue:#378cff;--rq40-ice:#eaf7ff;--rq40-quiet:#a8c4e1;--rq40-line:rgba(122,179,239,.24)}
:is(button,a,input,textarea,select,[role="button"]):focus-visible{outline:2px solid #8fd5ff!important;outline-offset:2px!important}
button:disabled,[aria-disabled="true"]{cursor:not-allowed}
@media (max-width:700px), (orientation:landscape) and (max-height:540px) and (pointer:coarse){
 html,body{margin:0!important;width:100%;max-width:100%;overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
 .app{padding-left:max(10px,env(safe-area-inset-left))!important;padding-right:max(10px,env(safe-area-inset-right))!important;min-width:0;}
 .topbar{flex:0 0 auto;position:relative;z-index:4}
 .topbarRight{flex:0 0 auto}
 .mobileBrand{flex:1;min-width:0}.mobileBrand img{max-width:min(37vw,150px)!important;max-height:41px;object-fit:contain}
 .topBell,.installBtn{min-width:44px;min-height:44px}
 .sidebar:not(.hidden){grid-template-columns:repeat(6,minmax(0,1fr));gap:3px;border:1px solid var(--rq40-line);border-radius:19px!important;box-shadow:0 16px 45px #000a,0 0 0 1px #0b1d36 inset;background:rgba(5,18,36,.96)!important;}
 .sidebar button{min-width:0!important;padding:5px 0!important;font-size:clamp(9px,2.6vw,11px)!important;line-height:1.08;letter-spacing:-.2px;}
 .sidebar button.active{background:linear-gradient(165deg,rgba(53,132,255,.34),rgba(23,69,127,.26));border:1px solid rgba(91,159,250,.28)}
 .sidebar button::before{font-size:clamp(19px,5vw,23px)!important}
 .sidebar button[aria-current="page"]{color:var(--rq40-ice)}
 .rq-mobile-tabs{border-color:var(--rq40-line);background:#0b1d35;padding:3px;}
 .rq-mobile-tabs button{min-width:0;min-height:33px;font-size:clamp(11px,2.8vw,13px);line-height:1.1;}
 .rq-mobile-tabs button[aria-selected="true"]{color:white;background:linear-gradient(115deg,#176bff,#237fc4)}
 .pageHead .eyebrow{font-size:10px;letter-spacing:.65px;color:#75b9ff}
 .pageHead h1{font-size:clamp(22px,5.7vw,27px)!important;letter-spacing:-.9px}
 .pageHead button,.pageHead .btns button{min-height:42px!important;border-radius:11px;font-size:11px!important}
 .panel,.lifecycleCard,.segment,.rq-next-quest{border-color:var(--rq40-line)}
 .rq-pager{min-height:44px;height:44px}.rq-pager button{min-width:48px;min-height:42px;height:42px}
 .rq-pager .rq-count{font-size:12px}
 #view-home .heroMain{background:linear-gradient(120deg,#184c9c,#0d2e62 70%,#112b4e);border:1px solid #336bae;}
 #view-home .heroMain .eyebrow{font-size:10px;letter-spacing:.25px}
 #view-home .weekTop .eyebrow{font-size:10px}
 #view-home .quick span{font-size:10px}
 #view-home .focusCopy span{font-size:10px}
 #view-home .focusMetric span{font-size:10px}
 #view-home .panelTitle .eyebrow{font-size:10px}
 #view-home .panelTitle h2{font-size:clamp(14px,3.8vw,17px)}
 #view-home .panelTitle .pill{font-size:10px}
 #view-home .panelTitle button{font-size:11px;min-height:38px}
 #view-home .featuredMeta{font-size:12px}
 #view-home .rewardStrip span{font-size:10px}
 #view-segments .questFilters{gap:4px;height:42px;min-height:42px}
 #view-segments .questFilters button{min-height:42px!important;font-size:clamp(10px,2.7vw,12px);letter-spacing:-.2px}
 #view-segments .nearbyControls{max-height:none;min-height:39px}
 #view-segments #nearbyToggle{min-height:38px;max-height:none;font-size:11px;}
 #view-segments .rq-quest-card{background:linear-gradient(150deg,#102948,#0a203a)}
 #view-segments .rq-quest-card .segmentMap{border-bottom:1px solid rgba(112,176,248,.15)}
 #view-segments .rq-quest-card h3{font-size:clamp(17px,4.5vw,21px)}
 #view-segments .rq-quest-card .questStatus{font-size:10px}
 #view-segments .rq-quest-card .rq-quest-meta{font-size:12px}
 #view-segments .rq-quest-card .rq-quest-accuracy{font-size:11px}
 #view-segments .rq-quest-card .segmentActions>*{min-height:46px!important;height:46px!important;font-size:12px!important}
 #view-segments .rq-quest-card .segmentActions .uploadQuest span{font-size:11px!important}
 #view-segments .rq-quest-card .rq-quest-map-hint{font-size:11px}
 #view-ranking .scopeBtns{min-height:42px;max-height:42px;flex-basis:42px}
 #view-ranking .scopeBtns button{min-height:42px;font-size:clamp(10px,2.6vw,12px)}
 #view-ranking .podiumCard strong{font-size:11px}
 #view-ranking .rankWho strong{font-size:12px}
 #view-ranking .rankWho span{font-size:11px}
 #view-ranking .rankScore{font-size:15px}
 #view-profile .profileStat span{font-size:clamp(9px,2.4vw,11px)}
 #view-profile .pageHead #profileProvince,#view-profile .pageHead #userEmail{font-size:11px}
 #view-profile #profileForm label{font-size:12px}
 #view-profile #profileForm input,#view-friends input, #questBackdrop select{font-size:16px!important}
 #view-profile .homeLayout>.panel,#view-friends>.panel,#view-friends .homeLayout>.panel,#view-rewards .homeLayout>.panel{overflow-y:auto!important;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#315f96 transparent}
 #questBackdrop .sheetTop{min-height:40px;flex:0 0 auto}
 #questBackdrop .sheetClose,#uploadBackdrop .sheetClose,#reviewBackdrop .sheetClose{min-height:44px;min-width:44px;height:44px;width:44px;border-radius:13px}
 #questBackdrop .rq-map-segment-picker{min-width:0;gap:6px}
 #questBackdrop .rq-map-segment-picker span{font-size:10px;letter-spacing:.15px}
 #questBackdrop .rq-map-segment-picker select{font-size:16px!important;min-height:46px!important;max-width:100%}
 #questBackdrop .detailMap{border:1px solid rgba(116,185,255,.22);border-radius:17px}
 #questBackdrop .detailHeader h2{font-size:clamp(21px,5.7vw,29px);line-height:1.1}
 #questBackdrop .detailRouteNotice,#questBackdrop #detailRouteNotice{font-size:11px;line-height:1.4}
 #questBackdrop .routeTools button{min-height:44px!important;font-size:12px!important}
 #questBackdrop .detailStats .detailStat span{font-size:10px}
 #questBackdrop .detailStats .detailStat b{font-size:15px}
 #questBackdrop .detailRule{font-size:12px}
 .rq-build-stamp{margin-top:auto;color:#7494b6;font-size:11px;text-align:center;padding:7px 4px}
 .rq-cloudflare-notice{position:fixed;z-index:185;left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));top:calc(max(7px,env(safe-area-inset-top)) + var(--rq-header,54px) + 5px);display:flex;align-items:center;gap:8px;padding:11px 12px;background:#102a48;border:1px solid #376b9e;border-radius:13px;box-shadow:0 14px 34px #0009;color:#e6f4ff;font:650 12px/1.35 system-ui}
 .rq-cloudflare-notice[hidden]{display:none!important}
 .rq-cloudflare-notice button{background:#246fde;color:#fff;border:0;min-width:40px;min-height:40px;border-radius:10px;font:800 12px system-ui;padding:7px 11px}
 .rq-cloudflare-notice .rq-offline-copy{flex:1;min-width:0}
 /* A short screen may scroll its current content, never the entire document. */
 @media (max-height:670px){
   #view-home .homeHero{height:82px;min-height:82px;max-height:82px}
   #view-home .quickGrid{height:48px;min-height:48px}
   #view-segments .rq-quest-card .segmentBody{overflow-y:auto!important;overscroll-behavior:contain;min-height:0;max-height:61%!important}
   #view-segments .rq-quest-card .segmentMap{min-height:84px!important}
   #view-segments .rq-quest-card .segmentActions{position:sticky;bottom:0;background:#10233e;padding-top:3px}
   #questBackdrop .questSheet{overflow-y:auto!important;overscroll-behavior:contain;}
   #questBackdrop .detailMap{min-height:130px!important;}
 }
}
@media (orientation:landscape) and (max-height:540px) and (pointer:coarse){
 .sidebar:not(.hidden){height:52px!important;--rq-nav:52px}
 .sidebar button{font-size:11px!important;flex-direction:row;gap:4px!important}
 .sidebar button::before{font-size:18px!important}
 #view-home .heroMain{display:none}
 #questBackdrop .questSheet{overflow-y:auto!important}
 #questBackdrop .detailMap{min-height:148px!important;flex:0 0 148px!important;}
}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Do not stack a redundant 'Ver trazado' badge on top of required map attribution. */
@media (max-width:700px), (orientation:landscape) and (max-height:540px) and (pointer:coarse){
 #view-segments .rq-quest-card .rq-quest-map-hint{display:none!important}
 #view-segments .rq-quest-card .rq-map-status{max-width:60%!important;bottom:9px!important}
 .rq-map-surface .rq-map-credit{right:4px!important;bottom:3px!important;font-size:9px!important;max-width:42%;white-space:nowrap}
}
