:root{--ibobry-safe-top:max(10px,env(safe-area-inset-top));--ibobry-title-top:calc(var(--ibobry-safe-top) + 66px);--ibobry-content-top:calc(var(--ibobry-title-top) + 70px)}
@media(max-width:760px){
.screen:not(.home)>.screen-title{top:var(--ibobry-title-top)!important;margin-top:0!important}
.screen:not(.home)>.page-art-title,#miniSelectScreen .page-art-title{top:var(--ibobry-title-top)!important}
#collectionScreen .house-top-sign.house-art-title{top:var(--ibobry-title-top)!important}
#miniSelectScreen .mini-select-card{top:var(--ibobry-content-top)!important}
}

/* v8.39 — compact one-line mobile top bar on all inner pages; home stays unchanged */
.mobile-hud-title{display:none}
@media(max-width:760px){
  body:has(.screen.active:not(.home)) .hud{
    top:max(7px,env(safe-area-inset-top))!important;
    left:7px!important;
    right:7px!important;
    width:auto!important;
    height:48px!important;
    min-height:48px!important;
    padding:4px 5px!important;
    gap:4px!important;
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) 34px 34px auto!important;
    align-items:center!important;
    border-radius:16px!important;
  }

  body:has(.screen.active:not(.home)) .hud .back-btn{
    grid-column:1!important;
    width:36px!important;height:36px!important;min-width:36px!important;
    padding:0!important;margin:0!important;font-size:22px!important;
  }

  body:has(.screen.active:not(.home)) .hud .mobile-hud-title{
    display:block!important;
    grid-column:2!important;
    min-width:0!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    text-align:center!important;
    font-size:12px!important;
    line-height:1.05!important;
    font-weight:1000!important;
    color:#4a2d1a!important;
    text-shadow:0 1px rgba(255,255,255,.55)!important;
  }

  body:has(.screen.active:not(.home)) .hud .hud-spacer{display:none!important}
  body:has(.screen.active:not(.home)) .hud .yawn-btn{display:none!important}

  body:has(.screen.active:not(.home)) .hud .info-btn,
  body:has(.screen.active:not(.home)) .hud .settings-gear{
    width:32px!important;height:32px!important;min-width:32px!important;
    padding:0!important;margin:0!important;font-size:17px!important;
  }
  body:has(.screen.active:not(.home)) .hud .info-btn{grid-column:3!important}
  body:has(.screen.active:not(.home)) .hud .settings-gear{grid-column:4!important}

  body:has(.screen.active:not(.home)) .hud .coin-pill{
    grid-column:5!important;
    min-width:48px!important;
    height:32px!important;
    padding:3px 7px 3px 5px!important;
    margin:0!important;
    gap:3px!important;
    border-radius:13px!important;
    font-size:12px!important;
  }
  body:has(.screen.active:not(.home)) .hud .coin-pill img{
    width:22px!important;height:22px!important;object-fit:contain!important;
  }
  body:has(.screen.active:not(.home)) .hud .coin-pill b{
    font-size:13px!important;line-height:1!important;
  }

  /* Page titles are now inside the HUD on mobile. Hide only inner-page visual titles. */
  body:has(.screen.active:not(.home)) .screen.active>.screen-title,
  body:has(.screen.active:not(.home)) .screen.active>.page-art-title,
  body:has(.screen.active:not(.home)) #collectionScreen.active>.house-top-sign{
    display:none!important;
  }

  /* Reclaim the vertical space that was reserved for the old separate title. */
  body:has(.screen.active:not(.home)){
    --ibobry-title-top:calc(max(7px,env(safe-area-inset-top)) + 50px)!important;
    --ibobry-content-top:calc(max(7px,env(safe-area-inset-top)) + 60px)!important;
  }
}
@media(max-width:380px){
  body:has(.screen.active:not(.home)) .hud{
    grid-template-columns:34px minmax(0,1fr) 30px 30px auto!important;
    gap:2px!important;padding-left:3px!important;padding-right:3px!important;
  }
  body:has(.screen.active:not(.home)) .hud .back-btn{width:32px!important;height:32px!important;min-width:32px!important}
  body:has(.screen.active:not(.home)) .hud .info-btn,
  body:has(.screen.active:not(.home)) .hud .settings-gear{width:28px!important;height:28px!important;min-width:28px!important;font-size:15px!important}
  body:has(.screen.active:not(.home)) .hud .coin-pill{min-width:43px!important;padding-left:4px!important;padding-right:5px!important}
  body:has(.screen.active:not(.home)) .hud .coin-pill img{width:19px!important;height:19px!important}
  body:has(.screen.active:not(.home)) .hud .mobile-hud-title{font-size:10.5px!important}
}


/* v8.42 — compact desktop question layout */
@media(min-width:761px){
  #questionScreen .quiz-wrap{
    inset:12% auto 4%!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:min(980px,88vw)!important;
    grid-template-columns:minmax(0,700px) 220px!important;
    gap:18px!important;
    align-items:center!important;
  }

  #questionScreen .paper-card{
    min-height:0!important;
    height:auto!important;
    padding:18px 20px!important;
    border-width:5px!important;
    border-radius:24px!important;
  }

  #questionScreen .paper-card h2{
    font-size:clamp(24px,2.2vw,34px)!important;
    line-height:1.12!important;
    margin:10px 0 14px!important;
  }

  #questionScreen .answers{
    gap:10px!important;
    grid-template-columns:1fr 1fr!important;
  }

  #questionScreen .answer{
    min-height:52px!important;
    padding:8px 10px!important;
    border-width:3px!important;
    border-radius:15px!important;
    font-size:clamp(18px,1.55vw,24px)!important;
    box-shadow:0 4px 0 #5f351c!important;
  }

  #questionScreen .visual-task{
    max-height:150px!important;
    overflow:hidden!important;
    margin:4px auto 10px!important;
  }

  #questionScreen .visual-task .number-row,
  #questionScreen .visual-task .word-card,
  #questionScreen .visual-task .sentence-card{
    transform:scale(.92);
    transform-origin:center;
  }

  #questionScreen .coach{
    width:220px!important;
    max-width:220px!important;
  }

  #questionScreen .coach img{
    max-height:250px!important;
    width:auto!important;
  }

  #questionScreen .speech{
    font-size:14px!important;
    line-height:1.2!important;
    padding:10px 12px!important;
  }

  #questionScreen .question-head{
    top:4%!important;
    gap:8px!important;
  }

  #questionScreen .question-world,
  #questionScreen .question-step{
    padding:7px 12px!important;
    border-width:2px!important;
    border-radius:12px!important;
    font-size:12px!important;
    box-shadow:0 3px 0 #351d11!important;
  }
}

@media(min-width:1200px){
  #questionScreen .quiz-wrap{
    width:min(940px,78vw)!important;
    grid-template-columns:minmax(0,670px) 210px!important;
  }
}


/* v8.93.2 — desktop map/header guard */
@media(min-width:761px){
  .mobile-hud-title{
    display:none!important;
  }
}