/* Tablet layouts: keep the existing artwork and profile data, use the full canvas. */
@media (min-width: 768px) {
  .md-page.md-child {
    width: 100%;
    max-width: none;
    padding-left: max(28px, calc((100% - 1120px) / 2));
    padding-right: max(28px, calc((100% - 1120px) / 2));
  }
  .md-child .md-timeline > .md-empty {
    min-height: 60dvh;
    justify-content: center;
    gap: 18px;
    padding: 32px;
  }
  .md-child .md-timeline > .md-empty img {
    width: clamp(180px, 20vw, 270px);
    height: clamp(160px, 18vw, 240px);
  }
  .md-child .md-timeline > .md-empty strong {
    font-size: clamp(20px, 2vw, 26px);
  }
  .pp-world > .pp-scroll > .pp-map {
    width: 100%;
    max-width: none;
    min-height: 0;
    aspect-ratio: 9 / 16;
  }
  main.pp-world > .pp-hud {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    padding-left: max(24px, env(safe-area-inset-left, 0px));
    padding-right: max(24px, env(safe-area-inset-right, 0px));
  }
  main.pp-world > .pp-nav {
    box-sizing: border-box;
    max-width: 960px;
    width: calc(100% - 48px);
    left: 24px;
    right: 24px;
  }
  main.pp-world > .pp-nav button { max-width: none; }
  main.pp-world .pp-zone { width: clamp(190px, 24vw, 310px); }
  main.pp-world .pp-guide { max-width: 380px; }
}

/* Activity stages share a tablet canvas; hotspots stay relative to their art. */
@media (min-width: 768px) {
  main.bb-game { background:linear-gradient(135deg,#fff4d9,#fbe1b5); }
  main.bb-game > .bb-scene { max-width:none;width:100%; }
}
@media (min-width: 900px) and (orientation: landscape) {
  main.bb-game > .bb-scene,
  main.bb-game > .bb-scene:not(.bb-finished) {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,66.6667dvh);
    height:100dvh;
    min-height:0;
    padding:0;
    background:linear-gradient(135deg,#fff8e7,#ffe4b8);
  }
  main.bb-game > .bb-scene > .bb-prompt,
  main.bb-game > .bb-scene:not(.bb-finished) > .bb-prompt {
    position:relative;
    grid-column:1;
    grid-row:1;
    top:auto;left:auto;
    width:100%;
    max-height:100dvh;
    overflow-y:auto;
    align-self:center;
    margin:0;
    padding:calc(76px + env(safe-area-inset-top,0px)) 32px 36px;
    box-sizing:border-box;
    pointer-events:auto;
  }
  main.bb-game > .bb-scene > .bb-stage {
    display:block;
    grid-column:2;
    grid-row:1;
    position:relative;
    height:100dvh;
    min-width:0;
  }
  main.bb-game > .bb-scene > .bb-stage > .bb-room {
    width:100%;height:100%;min-height:0;object-fit:fill;
  }
  main.bb-game > .bb-scene .bb-prompt h1,
  main.bb-game > .bb-scene:not(.bb-finished) > .bb-prompt h1 {
    font-size:clamp(22px,2.4vw,34px);
    padding:16px;margin:16px 0;
  }
  main.bb-game > .bb-scene .bb-park-title strong {font-size:clamp(24px,2.8vw,38px);}
  main.bb-game > .bb-scene .bb-level-plaque {font-size:17px;padding:5px 16px;}
  main.bb-game > .bb-scene .bb-prompt p {font-size:22px;margin:18px 0;}
  main.bb-game > .bb-scene .bb-prompt .bb-action {min-height:56px;font-size:22px;}
  main.bb-game > .bb-scene .bb-session-hud {top:calc(14px + env(safe-area-inset-top,0px));}
}
@media (min-width:768px) {
  /* Explicit rows beat the legacy nth-child rule, which put the apple over the cup. */
  main.bb-game .bb-food .bb-hunt .bb-choices button[data-item] {width:17%;}
  main.bb-game .bb-food .bb-hunt .bb-choices [data-item="pizza"],
  main.bb-game .bb-food .bb-hunt .bb-choices [data-item="sandwich"],
  main.bb-game .bb-food .bb-hunt .bb-choices [data-item="apple"] {top:62%;}
  main.bb-game .bb-food .bb-hunt .bb-choices [data-item="red-car"],
  main.bb-game .bb-food .bb-hunt .bb-choices [data-item="beach-ball"],
  main.bb-game .bb-food .bb-hunt .bb-choices [data-item="blue-cup"] {top:77%;}
}