/* BibleQuest production mobile layout.
   Loaded last so the home hierarchy remains stable even when feature modules inject styles later. */

:root{--bq-mobile-nav:64px;--bq-mobile-gap:8px;--bq-mobile-radius:20px}

html,body{max-width:100%;overflow-x:hidden}
body{min-width:0}
.app{width:100%;max-width:680px;padding-left:14px;padding-right:14px;padding-bottom:calc(var(--bq-mobile-nav) + 12px + env(safe-area-inset-bottom))}
.topbar{padding:9px 2px 6px}.brand{font-size:19px}.top-actions{gap:5px}.streak,.level-chip{padding:6px 8px;font-size:10px}

/* Daily Journey is the home hero. The actual shell is #app > .app. */
body.bq-frontpage-focus #app>.app>.hero,
body.bq-modern-home.bq-frontpage-focus #app>.app>.hero{display:none!important}
body.bq-frontpage-focus #app>.app>.quick-stats,
body.bq-modern-home.bq-frontpage-focus #app>.app>.quick-stats{display:none!important}
body.bq-frontpage-focus .modern-home{margin-top:2px!important}
body.bq-frontpage-focus .bq-engagement-stack{margin-top:0!important}

/* Stable content order: mission -> path -> optional season -> shortcuts -> Explore. */
.bq-engagement-stack{gap:var(--bq-mobile-gap)!important;margin:0 0 4px!important}
.bq-engagement-stack>.today-journey-card{order:-40}
.bq-engagement-stack>.journey-path-card{order:-30}
.bq-engagement-stack>.journey-season,
.bq-engagement-stack>.journey-season-empty{order:-20}
.bq-engagement-stack>.journey-mini-row{order:-10}

body.bq-engagement-home .bq-engagement-stack .today-journey-card{padding:14px!important;border-width:1px!important;border-radius:22px!important;box-shadow:0 10px 28px rgba(46,58,79,.09)!important}
.today-journey-card:before{right:10px!important;top:4px!important;font-size:34px!important}
.today-journey-top{gap:8px!important}.today-journey-top h2,body.bq-engagement-home .today-journey-top h2{font-size:21px!important;line-height:1.06!important;margin:3px 0!important}.today-journey-top p{font-size:10px!important;line-height:1.35!important}.today-journey-top small{font-size:8px!important}
.journey-streak{min-width:58px!important;border-radius:15px!important;padding:7px!important}.journey-streak span{font-size:15px!important}.journey-streak b{font-size:17px!important}.journey-streak small{font-size:7px!important;margin-top:2px!important}
.today-step-dots{gap:5px!important;margin:10px 0 9px!important}.today-step-dots i{height:5px!important}
.engagement-focus-chip{margin:0 0 9px!important;padding:8px 9px!important;border-radius:13px!important;gap:8px!important}.engagement-focus-chip>span{font-size:18px!important}.engagement-focus-chip b{font-size:10px!important}.engagement-focus-chip em{font-size:8px!important}.engagement-focus-chip small{font-size:7px!important}
.today-journey-actions{gap:6px!important}.today-journey-actions button{min-height:44px}.bq-engagement-home .journey-primary{flex:1 0 100%!important;padding:11px 13px!important;font-size:11px!important;border-radius:14px!important;box-shadow:0 5px 15px rgba(38,58,88,.14)!important}.today-journey-actions .journey-secondary{flex:0 1 auto!important;min-height:36px!important;margin:0 auto!important;padding:7px 12px!important;border-radius:999px!important;font-size:9px!important}

.journey-path-card{padding:11px!important;border-radius:20px!important;box-shadow:0 6px 18px rgba(51,65,72,.045)!important}.journey-card-head{gap:7px!important}.journey-card-head b{font-size:11px!important}.journey-card-head button{min-height:34px;padding:7px 9px!important;font-size:8px!important}.journey-path-scroll{gap:2px!important;padding:10px 0 6px!important;scroll-snap-type:x proximity;overscroll-behavior-x:contain}.journey-node{flex:0 0 64px!important;scroll-snap-align:start}.journey-node>span{width:34px!important;height:34px!important;font-size:17px!important}.journey-node>i{top:16px!important;width:70px!important}.journey-node b{font-size:7px!important;margin-top:4px!important}.journey-node small{font-size:6px!important}.journey-path-card>p{font-size:7px!important;margin-top:2px!important}

.journey-season,.journey-season-empty{min-height:54px!important;grid-template-columns:34px 1fr auto!important;gap:8px!important;padding:9px 11px!important;border-radius:17px!important;box-shadow:0 4px 14px rgba(75,65,82,.045)!important}.journey-season>span,.journey-season-empty>span{font-size:23px!important}.journey-season b,.journey-season-empty b{font-size:11px!important;margin:1px 0!important}.journey-season small,.journey-season-empty small{font-size:7px!important}.journey-season-empty i{font-size:18px!important}.journey-season-bar{height:4px!important;margin-top:4px!important}
.journey-mini-row{gap:6px!important}.journey-mini-row button{min-height:42px!important;padding:8px 7px!important;border-radius:14px!important;font-size:9px!important}

/* Explore remains useful but visually secondary to the journey. */
.modern-label{margin:14px 2px 7px!important}.modern-label span{font-size:17px!important}.modern-label small{font-size:9px!important}.modern-hubs{gap:8px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}.modern-hub{min-height:96px!important;border-radius:19px!important;padding:12px!important;box-shadow:0 6px 18px rgba(42,57,47,.05)!important}.modern-hub>span{font-size:24px!important}.modern-hub b{font-size:15px!important;margin-top:8px!important}.modern-hub small{font-size:9px!important;max-width:none!important}.modern-hub>i{font-size:20px!important}.modern-footer-row{margin:10px 1px 0!important;padding:7px 1px!important;gap:6px!important;font-size:8px!important}.modern-footer-row button{font-size:9px!important}

/* Five tabs fit one phone row and leave more vertical room. */
.bottom{width:min(680px,100%)!important;height:calc(var(--bq-mobile-nav) + env(safe-area-inset-bottom))!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;padding:3px 2px env(safe-area-inset-bottom)!important;background:rgba(255,255,255,.96)!important;box-shadow:0 -5px 20px rgba(45,60,50,.055)!important}.navbtn{min-width:0!important;padding:4px 1px!important;font-size:8px!important;line-height:1.05!important}.navbtn b{font-size:18px!important;margin-bottom:3px!important}
.bq-transform-overlay{inset:0 0 calc(var(--bq-mobile-nav) + env(safe-area-inset-bottom)) 0!important}

/* Sheets and full-screen tools use dynamic viewport height and tighter mobile rhythm. */
.modern-sheet-panel{max-height:min(86dvh,720px)!important;border-radius:24px 24px 0 0!important;padding:8px 12px calc(14px + env(safe-area-inset-bottom))!important}.modern-sheet-head{padding-bottom:9px!important}.modern-sheet-head>div>span{width:42px!important;height:42px!important;font-size:21px!important}.modern-sheet-head h2{font-size:19px!important}.modern-sheet-list{gap:6px!important}.modern-sheet-list>button{min-height:58px!important;border-radius:15px!important;padding:9px!important;grid-template-columns:38px 1fr auto!important;gap:9px!important}.modern-sheet-list>button>span{width:38px!important;height:38px!important;font-size:19px!important}.modern-sheet-list b{font-size:12px!important}.modern-sheet-list small{font-size:8px!important}
.journey-loop-layer{min-height:100dvh}.journey-loop-app{width:min(680px,100%)!important;padding:10px 13px calc(var(--bq-mobile-nav) + 14px + env(safe-area-inset-bottom))!important}.journey-loop-head{padding:5px 0 8px!important}.journey-loop-hero{padding:16px!important;border-radius:21px!important}.journey-task{border-radius:17px!important;padding:11px!important;margin:6px 0!important}.reader-app{max-width:680px!important;padding-left:13px!important;padding-right:13px!important;padding-bottom:calc(var(--bq-mobile-nav) + 16px + env(safe-area-inset-bottom))!important}

@media(max-width:430px){
  .app{padding-left:12px;padding-right:12px}
  .topbar{padding-top:7px}.brand{font-size:18px}
  .today-journey-card{border-radius:20px!important}
  .journey-node{flex-basis:62px!important}
  .modern-home{margin-top:0!important}
}

@media(max-width:360px){
  .app{padding-left:10px;padding-right:10px}
  .today-journey-top h2,body.bq-engagement-home .today-journey-top h2{font-size:19px!important}
  .journey-streak{min-width:52px!important}
  .modern-hub{min-height:90px!important;padding:10px!important}.modern-hub>span{font-size:22px!important}.modern-hub b{font-size:14px!important}
  .navbtn{font-size:7px!important}.navbtn b{font-size:17px!important}
}

@media(min-width:650px){
  .app{padding-left:20px;padding-right:20px}
  body.bq-frontpage-focus #app>.app>.quick-stats{display:grid!important}
  .modern-hubs{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .modern-hub{min-height:118px!important}
}