/* NALAROO Integrated Storybook World v1
 * Scope carefully: all learning and rewards UI stay on their existing styles.
 * Four user-approved WebP masters are rendered whole, never stretched/cropped.
 */
body.living-world-view:has(.integrated-world){background:#dce8d7;color:#354c42}
.integrated-world{height:100svh!important;min-height:0!important;overflow:hidden!important;isolation:isolate}
.integrated-world .world-landscape{
 position:absolute;inset:-12px;z-index:-2;
 background-position:center center;background-size:cover;
 filter:blur(11px) saturate(.8);opacity:.65;pointer-events:none;
}
.integrated-world[data-grade-band="g1-2"] .world-landscape{
 background-image:linear-gradient(#eaf0e7bb,#eceddaad),url('assets/world/storybook-integrated/home-desktop-g1-2.webp');
}
.integrated-world[data-grade-band="g3-6"] .world-landscape{
 background-image:linear-gradient(#eaf0e7bb,#eceddaad),url('assets/world/storybook-integrated/home-desktop-g3-6.webp');
}
.integrated-world .world-landscape::after{content:none}
.integrated-world .integrated-world-stage{
 position:absolute!important;inset:0!important;
 display:flex!important;align-items:center;justify-content:center;
 overflow:visible!important;min-width:0;min-height:0;
 cursor:default;outline-offset:-3px;touch-action:auto;
}
.integrated-world .integrated-world-canvas{
 box-sizing:border-box;
 position:relative;
 flex:0 0 auto;
 width:min(100vw,177.7778svh)!important;
 height:auto!important;
 min-width:0!important;min-height:0!important;
 max-width:100vw;
 aspect-ratio:16 / 9;
 margin:auto;isolation:isolate;
}
.integrated-world .world-artwork{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.integrated-world .world-master{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none;user-select:none}
.integrated-world .world-building{
 position:absolute!important;
 z-index:3;
 left:var(--ix)!important;top:var(--iy)!important;
 width:var(--iw)!important;height:var(--ih)!important;
 max-width:none!important;min-width:44px;min-height:44px;
 display:block;box-sizing:border-box;
 transform:translate(-50%,-50%)!important;translate:none!important;
 margin:0!important;padding:0!important;border:0!important;
 background:transparent!important;color:#425744!important;
 cursor:pointer;filter:none!important;overflow:visible;
 transition:none;box-shadow:none!important;
}
.integrated-world .world-building::before{
 content:'';position:absolute;inset:5% 6% 10%;
 border:2px solid transparent;border-radius:34% 29% 20% 20%;
 background:transparent;pointer-events:none;
 transition:border-color .16s,background-color .16s,transform .16s;
}
.integrated-world .world-building:hover::before,
.integrated-world .world-building:focus-visible::before{
 border-color:#fff5db;background:rgba(233,245,209,.18);
 transform:scale(1.035);box-shadow:0 0 0 2px #6f95648c;
}
.integrated-world .world-building:focus-visible{outline:0!important}
.integrated-world .world-building-label{
 box-sizing:border-box;
 position:absolute!important;
 display:flex!important;align-items:center;justify-content:center;
 left:50%;bottom:-4px;
 transform:translate(-50%,60%);
 width:max-content!important;max-width:126%;min-width:75px;
 margin:0!important;
 padding:5px 12px!important;min-height:28px!important;
 font:900 clamp(11px,1.08vw,16px)/1.17 Nunito,system-ui,sans-serif!important;
 color:#395646;background:linear-gradient(165deg,#fffaf0f5,#f7e8cafa)!important;
 border:1.4px solid #aa9271!important;
 border-radius:14px 17px 14px 16px!important;
 box-shadow:0 2px 0 #9d7e584c,0 4px 8px #5b443522!important;
 text-shadow:none!important;white-space:nowrap;pointer-events:none;
 text-align:center;
}
.integrated-world .world-hud{z-index:7;top:max(12px,env(safe-area-inset-top))}
.integrated-world .world-identity{
 background:#fffbf0f0;border:1px solid #b8a184;
 color:#3d5948;box-shadow:0 3px 10px #55483527;
}
.integrated-world .world-profile-copy strong,
.integrated-world .world-profile-copy>span,
.integrated-world .world-profile-copy small{color:#3e5846}
.integrated-world .world-xp::-webkit-progress-bar{background:#9eb5a2}
.integrated-world .world-xp::-webkit-progress-value{background:#83ad8b}
.integrated-world .world-coins{
 color:#385645;background:#fffaf0ec;border:1px solid #b4a080;
 box-shadow:0 2px 8px #67553d2d;
}
.integrated-world .world-robot,
.integrated-world .world-explorer{display:none!important}
.integrated-world .world-tip{display:none}
.integrated-world .world-pan-hint{color:#3d5948;background:#fffaf0eb;border:1px solid #baa58b}
.integrated-world .world-dialog{background:#fffaf0;border:2px solid #bda786;color:#304f43}
.integrated-world .world-action{background:#668c70;border-color:#587960}
.integrated-world .world-action.secondary{background:#faefda;color:#3e5846;border-color:#b5a183}
@media(orientation:portrait){
 .integrated-world .integrated-world-canvas{
  width:min(100vw,56.25svh)!important;
  max-width:100vw;
  aspect-ratio:9 / 16;
 }
 .integrated-world .world-building{
  left:var(--imx)!important;top:var(--imy)!important;
  width:var(--imw)!important;height:var(--imh)!important;
 }
 .integrated-world[data-grade-band="g1-2"] .world-landscape{
  background-image:linear-gradient(#eaf0e7c4,#eceddaad),url('assets/world/storybook-integrated/home-mobile-g1-2.webp');
 }
 .integrated-world[data-grade-band="g3-6"] .world-landscape{
  background-image:linear-gradient(#eaf0e7c4,#eceddaad),url('assets/world/storybook-integrated/home-mobile-g3-6.webp');
 }
 .integrated-world .world-building-label{
  font-size:clamp(9px,2.4vw,12px)!important;
  min-width:62px;max-width:116%;
  min-height:25px!important;padding:4px 7px!important;
  transform:translate(-50%,54%);
  bottom:-1px;
  border-radius:12px!important;
 }
 .integrated-world .world-building-pancasila .world-building-label,
 .integrated-world .world-building-bahasa-indonesia .world-building-label{font-size:clamp(8px,2.2vw,11px)!important}
 .integrated-world .world-hud{top:max(7px,env(safe-area-inset-top))}
}
@media(orientation:landscape) and (max-height:620px){
 .integrated-world .integrated-world-stage{
  inset:60px 0 58px!important;
  display:block!important;overflow:auto!important;
  scrollbar-width:thin;touch-action:pan-x pan-y;cursor:grab;
 }
 .integrated-world .integrated-world-stage.world-panning{cursor:grabbing}
 .integrated-world .integrated-world-canvas{
  width:1120px!important;height:630px!important;
  min-width:1120px!important;min-height:630px!important;
  max-width:none;aspect-ratio:16 / 9;margin:0!important;
 }
 .integrated-world .world-building-label{
  font-size:13px!important;min-height:28px!important;
 }
}
@media(prefers-reduced-motion:reduce){
 .integrated-world .world-building::before{transition:none!important}
}
/* KALIBRASI POSISI LABEL DESKTOP */

@media (min-width: 701px) and (orientation: landscape) {

  /* Matematika */
  .integrated-world .world-building-math .world-building-label {
    translate: 20px -40px;
  }

  /* PAI & BP */
  .integrated-world .world-building-paibp .world-building-label {
    translate: 20px -35px;
  }

  /* Bahasa Indonesia */
  .integrated-world .world-building-bahasa-indonesia .world-building-label {
    translate: 0px -30px;
  }

  /* Bahasa Inggris */
  .integrated-world .world-building-english .world-building-label {
    translate: 0px -40px;
  }

  /* Pendidikan Pancasila */
  .integrated-world .world-building-pancasila .world-building-label {
    translate: 0px 0px;
  }

  /* Taman Bermain */
  .integrated-world .world-building-games .world-building-label {
    translate: 0px 0px;
  }

  /* IPAS — Kelas 3–6 */
  .integrated-world .world-building-science .world-building-label {
    translate: 35px -20px;
  }
}
/* KALIBRASI POSISI LABEL MOBILE PORTRAIT */

@media (orientation: portrait) and (max-width: 700px) {

  /* Matematika */
  .integrated-world .world-building-math .world-building-label {
    translate: 40px -20px;
  }

  /* PAI & BP */
  .integrated-world .world-building-paibp .world-building-label {
    translate: 0px -20px;
  }

  /* Bahasa Indonesia */
  .integrated-world .world-building-bahasa-indonesia .world-building-label {
    translate: 0px 0px;
  }

  /* Bahasa Inggris */
  .integrated-world .world-building-english .world-building-label {
    translate: 0px 0px;
  }

  /* Pendidikan Pancasila */
  .integrated-world .world-building-pancasila .world-building-label {
    translate: 0px 0px;
  }

  /* Taman Bermain */
  .integrated-world .world-building-games .world-building-label {
    translate: 0px 0px;
  }

  /* IPAS — Kelas 3–6 */
  .integrated-world .world-building-science .world-building-label {
    translate: 0px 0px;
  }
}