/* DOBOX ASIA · V153 · Day 4 reconstruction
   Goal: lived home visit, stable responsive composition, cultural information kept secondary. */

.d4-root.d4-v153{
  --d4-copy-bg:linear-gradient(90deg,rgba(4,27,34,.78),rgba(4,27,34,.42),rgba(4,27,34,0));
  --d4-copy-solid:rgba(4,27,34,.88);
  --d4-accent:#e4a08d;
  --d4-paper:#f5f0e3;
  --d4-edge:max(18px,4vw);
  position:absolute!important;
  inset:0;
}
.d4-root.d4-v153 .d4-world-layer,.d4-root.d4-v153 .d4-interaction-layer{position:absolute;inset:0}
.d4-root.d4-v153 .d4-world-img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;transform:none!important}
.d4-root.d4-v153 .d4-stage{padding-top:var(--dobox-hud-top,124px);padding-bottom:var(--dobox-hud-bottom,28px)}
.d4-root.d4-v153 :is(button,[role="button"]){touch-action:manipulation}
.d4-root.d4-v153 :is(.d4-live-dialogue,.d4-market-moment,.d4-threshold-layer,.d4-kitchen-intro-live){box-sizing:border-box}

/* Weather remains visible in the world rather than through a giant card. */
.d4-root.d4-v153.d4-start .d4-world-img{object-position:center 46%}
.d4-root.d4-v153.d4-rain .d4-world-img,.d4-root.d4-v153.d4-walk .d4-world-img{filter:saturate(.88) brightness(.83) contrast(.96)}
.d4-root.d4-v153.d4-walk2 .d4-world-img,.d4-root.d4-v153.d4-houses .d4-world-img{filter:saturate(.92) brightness(1.01)}
.d4-root.d4-v153 .d4-humidity-haze{position:absolute;inset:0;background:linear-gradient(180deg,rgba(205,224,225,.07),rgba(19,43,48,.03) 55%,rgba(255,255,255,.05));backdrop-filter:blur(.18px)}

/* Narration: bounded rail, never a full-screen rectangle. */
.d4-root.d4-v153 .d4-live-dialogue{
  width:min(490px,37vw);
  max-height:min(38svh,330px);
  overflow:auto;
  overscroll-behavior:contain;
  padding:11px 15px 12px;
  border-left:2px solid var(--d4-accent);
  border-radius:0 16px 16px 0;
  background:var(--d4-copy-bg);
  box-shadow:none;
  backdrop-filter:blur(4px);
}
.d4-root.d4-v153 .d4-live-dialogue>small,.d4-root.d4-v153 .d4-scene-kicker{font-size:10px;letter-spacing:.15em;color:#efb09e}
.d4-root.d4-v153 .d4-live-dialogue p,.d4-root.d4-v153 .d4-ambient-line{font-size:clamp(14px,1.15vw,17px);line-height:1.45}
.d4-root.d4-v153 .d4-observation{color:rgba(255,255,255,.78)}
.d4-root.d4-v153 .d4-next-quiet,.d4-root.d4-v153 .d4-market-forward{
  min-height:44px;padding:8px 13px;border:1px solid rgba(255,255,255,.38);border-radius:999px;
  background:rgba(4,29,36,.73);font-size:14px;line-height:1.2
}

/* Gesture coach stays separate from narrative text. */
.d4-root.d4-v153 .gesture-hint{z-index:75;max-width:min(360px,72vw);pointer-events:none}
.d4-root.d4-v153 .d4-gesture-shoji{left:50%;right:auto;bottom:18%;transform:translateX(-50%)}
.d4-root.d4-v153 .d4-gesture-aisle,.d4-root.d4-v153 .d4-gesture-object,.d4-root.d4-v153 .d4-gesture-bag,.d4-root.d4-v153 .d4-gesture-cooking{position:absolute;left:50%;bottom:18px;transform:translateX(-50%)}

/* Mme Sato: character belongs to the ryokan scene, text stays secondary. */
.d4-root.d4-v153.d4-sato .d4-world-img{object-position:center 42%;filter:saturate(.9) brightness(.94)}
.d4-root.d4-v153 .d4-live-dialogue-sato{left:var(--d4-edge);right:auto;bottom:clamp(34px,6vh,70px);width:min(430px,33vw);max-height:31svh;background:var(--d4-copy-bg)}
.d4-root.d4-v153 .d4-live-dialogue-sato .speaker{color:#f1b19f;font-weight:800}

/* Rain decision: small contextual control, not an interface splash. */
.d4-root.d4-v153 .d4-rain-caption{left:var(--d4-edge);bottom:clamp(28px,5vh,62px)}
.d4-root.d4-v153 .d4-rain-caption .d4-next-quiet{width:auto;max-width:100%}

/* Konbini is a short recovery stop, not another full shopping dashboard. */
.d4-root.d4-v153 .d4-konbini-drawer{width:min(520px,39vw);max-height:min(62svh,570px);overflow:auto;left:var(--d4-edge);right:auto;bottom:clamp(24px,4vh,52px)}
.d4-root.d4-v153 .d4-breakfast-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.d4-root.d4-v153 .d4-breakfast-grid button{min-height:116px}
.d4-root.d4-v153 .d4-breakfast-grid img{height:54px}

/* Yanagibashi: preserve the real covered-market feeling while making generated signage non-authoritative. */
.d4-root.d4-v153.d4-market .d4-market-scene-bg{
  filter:saturate(.72) brightness(1.03) contrast(.94) blur(.38px);
  transform:scale(1.015);
}
.d4-root.d4-v153.d4-market:before{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(180deg,rgba(240,245,242,.05),transparent 36%,rgba(4,25,31,.12))}
.d4-root.d4-v153 .d4-market-moment,.d4-root.d4-v153 .d4-mei-reveal-live{
  left:var(--d4-edge);bottom:clamp(28px,5vh,58px);width:min(500px,37vw);max-height:34svh;
  padding:10px 14px 11px;background:var(--d4-copy-bg);border-left-color:var(--d4-accent);overflow:auto
}
.d4-root.d4-v153 .d4-market-moment>p{font-size:clamp(14px,1.12vw,17px);line-height:1.42;max-width:42ch}
.d4-root.d4-v153 .d4-pocket-note{right:var(--d4-edge);bottom:clamp(28px,5vh,58px);width:min(350px,27vw);max-height:34svh;overflow:auto}
.d4-root.d4-v153 .d4-gifts{grid-template-columns:1fr;gap:8px}
.d4-root.d4-v153 .d4-gifts button{min-height:78px;display:grid;grid-template-columns:68px 1fr auto;align-items:center;padding:7px}
.d4-root.d4-v153 .d4-gifts button img{width:64px;height:62px;border-radius:10px}
.d4-root.d4-v153 .d4-gifts button>span{padding:0 8px}.d4-root.d4-v153 .d4-gifts button strong{margin:0 6px 0 0}
.d4-root.d4-v153 .d4-aisle-moment{max-width:360px;background:rgba(3,26,33,.47)}

/* House identification stays in the world. */
.d4-root.d4-v153 .d4-house-spots button{width:74px;height:74px;background:rgba(4,29,36,.28);border-color:rgba(255,255,255,.66);backdrop-filter:blur(2px)}
.d4-root.d4-v153 .d4-house-spots button span{opacity:0;transition:opacity .18s ease}
[data-dobox-input="pointer"] .d4-root.d4-v153 .d4-house-spots button:hover span,.d4-root.d4-v153 .d4-house-spots button:focus-visible span{opacity:1}
.d4-root.d4-v153 .d4-house-caption{left:var(--d4-edge);bottom:clamp(28px,5vh,58px);max-width:480px!important}

/* Yuki video: full narrative beat, controls never cover the face. */
.d4-root.d4-v153 .d4-stage-yuki-live{display:block;padding:0!important}
.d4-root.d4-v153 .d4-yuki-video-shell{position:absolute;left:clamp(28px,7vw,120px);top:calc(var(--dobox-hud-top,112px) + 8px);bottom:clamp(24px,4vh,48px);height:auto;max-height:none;width:min(34vw,440px);aspect-ratio:478/850;border-radius:22px}
.d4-root.d4-v153 .d4-yuki-response{position:absolute;right:var(--d4-edge);left:auto;bottom:clamp(28px,6vh,72px);width:min(480px,36vw)}
.d4-root.d4-v153 .d4-doorbell-zone span,.d4-root.d4-v153 .d4-replay-video{bottom:16px}

/* Genkan = actions in space. */
.d4-root.d4-v153 .d4-threshold-layer{position:absolute;inset:var(--dobox-hud-top,120px) var(--d4-edge) var(--dobox-hud-bottom,26px);pointer-events:none}
.d4-root.d4-v153 .d4-threshold-layer>*{pointer-events:auto}
.d4-root.d4-v153 .d4-threshold-layer>.d4-scene-kicker{position:absolute;left:0;top:0;padding:7px 10px;background:rgba(4,29,36,.48);border-radius:999px}
.d4-root.d4-v153 .d4-threshold-layer>.d4-ambient-line{position:absolute;left:0;bottom:0;width:min(480px,38vw);margin:0;padding:9px 12px;background:var(--d4-copy-bg);border-left:2px solid var(--d4-accent)}
.d4-root.d4-v153 .d4-umbrella-gesture,.d4-root.d4-v153 .d4-genkan-live,.d4-root.d4-v153 .d4-gift-gesture{position:absolute;inset:10% 5% 13%;min-height:0!important;height:auto!important}

/* Living room: observe the host cue, physically place the bag, then follow the kitchen hotspot. */
.d4-root.d4-v153 .d4-living-cue-layer{position:absolute;inset:0}
.d4-root.d4-v153 .d4-living-caption{position:absolute;left:var(--d4-edge);bottom:clamp(28px,5vh,58px);width:min(430px,33vw);max-height:28svh}
.d4-root.d4-v153 .d4-bag-object{position:absolute;z-index:16;left:13%;bottom:17%;width:clamp(90px,11vw,150px);cursor:grab;touch-action:none;transform:translate(var(--drag-x,0),var(--drag-y,0))}
.d4-root.d4-v153 .d4-bag-object img{width:100%;height:auto;filter:drop-shadow(0 12px 18px rgba(0,0,0,.28))}
.d4-root.d4-v153 .d4-bag-target{position:absolute;z-index:10;right:18%;bottom:18%;width:clamp(116px,14vw,190px);height:clamp(74px,10vw,126px);border:1px dashed rgba(245,240,227,.5);border-radius:22px;background:rgba(4,29,36,.08);display:grid;place-items:center}
.d4-root.d4-v153 .d4-bag-target span{font-size:30px;opacity:.58}
.d4-root.d4-v153 .d4-kitchen-path-hotspot{--hotspot-x:84%!important;--hotspot-y:55%!important}
.d4-root.d4-v153 .d4-kitchen-path-hotspot span{font-size:11px}

/* Kitchen = work surface first, explanatory copy second. */
.d4-root.d4-v153.d4-kitchen .d4-world-img{filter:saturate(.94) brightness(.97)}
.d4-root.d4-v153 .d4-kitchen-intro-live{width:min(470px,36vw);left:var(--d4-edge);bottom:clamp(28px,5vh,58px);max-height:32svh}
.d4-root.d4-v153 .d4-kitchen-live-work{position:absolute;inset:var(--dobox-hud-top,118px) var(--d4-edge) var(--dobox-hud-bottom,26px)}
.d4-root.d4-v153 .d4-kitchen-step-note{width:min(430px,32vw);max-height:22svh;overflow:auto}
.d4-root.d4-v153 .d4-cook-progress{position:absolute;z-index:24;right:0;top:0;display:flex;gap:7px;padding:7px 10px;border-radius:999px;background:rgba(4,29,36,.5)}
.d4-root.d4-v153 .d4-cook-progress i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.28)}
.d4-root.d4-v153 .d4-cook-progress i.done{background:rgba(237,177,157,.75)}
.d4-root.d4-v153 .d4-cook-progress i.active{background:#f4efdf;box-shadow:0 0 0 4px rgba(244,239,223,.14)}
.d4-root.d4-v153 .d4-kitchen-counter{max-width:min(720px,58vw);margin-left:auto;margin-right:0}
.d4-root.d4-v153 .d4-dish-finished .d4-next-quiet{width:auto;margin-inline:auto}

/* Table and farewell: calm, not another dashboard. */
.d4-root.d4-v153 .d4-table-caption,.d4-root.d4-v153 .d4-departure-caption{left:var(--d4-edge);bottom:clamp(28px,5vh,58px);width:min(480px,36vw);max-height:34svh}
.d4-root.d4-v153 .d4-topic-row.compact{display:flex;flex-wrap:wrap;gap:7px}
.d4-root.d4-v153 .d4-topic-row.compact button{min-height:40px;padding:8px 11px;border-radius:999px}
.d4-root.d4-v153 .d4-phrase-natural{min-height:46px}
.d4-root.d4-v153 .d4-stage-final .d4-copy{width:min(540px,40vw)}

/* Mobile composition is rebuilt separately instead of shrinking desktop. */
@media(max-width:600px){
  .d4-root.d4-v153{--d4-edge:12px}
  .d4-root.d4-v153 .d4-stage{padding-top:var(--dobox-hud-top,116px);padding-left:12px;padding-right:12px;padding-bottom:var(--dobox-hud-bottom,18px)}
  .d4-root.d4-v153 .d4-live-dialogue,.d4-root.d4-v153 .d4-market-moment,.d4-root.d4-v153 .d4-mei-reveal-live{
    left:12px!important;right:12px!important;bottom:var(--dobox-hud-bottom,14px)!important;width:auto!important;max-height:30svh!important;
    padding:8px 10px 9px;border-radius:14px;background:linear-gradient(0deg,rgba(4,27,34,.86),rgba(4,27,34,.50),rgba(4,27,34,.12))
  }
  .d4-root.d4-v153 .d4-live-dialogue p,.d4-root.d4-v153 .d4-market-moment>p,.d4-root.d4-v153 .d4-ambient-line{font-size:13px!important;line-height:1.38!important}
  .d4-root.d4-v153 .d4-next-quiet,.d4-root.d4-v153 .d4-market-forward{min-height:42px;font-size:12px}
  .d4-root.d4-v153 .gesture-hint{bottom:calc(var(--dobox-hud-bottom,16px) + 34svh)!important;max-width:74vw;font-size:12px}
  .d4-root.d4-v153 .d4-konbini-drawer{left:10px!important;right:10px!important;bottom:var(--dobox-hud-bottom,12px)!important;width:auto!important;max-height:57svh!important;padding:10px!important}
  .d4-root.d4-v153 .d4-breakfast-grid button{min-height:104px}.d4-root.d4-v153 .d4-breakfast-grid img{height:48px}
  .d4-root.d4-v153.d4-market .d4-market-scene-bg{filter:saturate(.68) brightness(1.02) contrast(.93) blur(.46px);object-position:center}
  .d4-root.d4-v153 .d4-pocket-note{left:12px!important;right:12px!important;bottom:var(--dobox-hud-bottom,12px)!important;width:auto!important;max-height:33svh}
  .d4-root.d4-v153 .d4-gifts button{grid-template-columns:56px 1fr auto;min-height:68px}.d4-root.d4-v153 .d4-gifts button img{width:52px;height:52px}
  .d4-root.d4-v153 .d4-house-caption{max-height:22svh!important}.d4-root.d4-v153 .d4-house-spots{display:none}
  .d4-root.d4-v153 .d4-yuki-video-shell{left:50%;transform:translateX(-50%);top:calc(var(--dobox-hud-top,110px) + 4px);bottom:auto;width:min(72vw,310px);height:min(53svh,545px);border-radius:18px}
  .d4-root.d4-v153 .d4-yuki-response{left:10px!important;right:10px!important;bottom:var(--dobox-hud-bottom,12px)!important;width:auto!important;max-height:27svh!important}
  .d4-root.d4-v153 .d4-threshold-layer{inset:var(--dobox-hud-top,112px) 10px var(--dobox-hud-bottom,12px)}
  .d4-root.d4-v153 .d4-threshold-layer>.d4-ambient-line{left:0;right:0;bottom:0;width:auto!important;max-width:none!important;font-size:12.5px!important}
  .d4-root.d4-v153 .d4-umbrella-gesture,.d4-root.d4-v153 .d4-genkan-live,.d4-root.d4-v153 .d4-gift-gesture{inset:9% 0 24%;height:auto!important}
  .d4-root.d4-v153 .d4-living-caption{left:10px!important;right:10px!important;bottom:var(--dobox-hud-bottom,12px)!important;width:auto!important;max-height:24svh!important}
  .d4-root.d4-v153 .d4-bag-object{left:10%;bottom:30%;width:96px}.d4-root.d4-v153 .d4-bag-target{right:11%;bottom:31%;width:118px;height:78px}
  .d4-root.d4-v153 .d4-kitchen-path-hotspot{--hotspot-x:82%!important;--hotspot-y:48%!important}
  .d4-root.d4-v153 .d4-kitchen-intro-live{left:10px!important;right:10px!important;bottom:var(--dobox-hud-bottom,12px)!important;width:auto!important;max-height:28svh!important}
  .d4-root.d4-v153 .d4-kitchen-live-work{inset:var(--dobox-hud-top,112px) 10px var(--dobox-hud-bottom,12px)}
  .d4-root.d4-v153 .d4-kitchen-step-note{left:0!important;right:0!important;width:auto!important;max-height:17svh!important}
  .d4-root.d4-v153 .d4-kitchen-counter{max-width:100%;margin:18svh auto 0}
  .d4-root.d4-v153 .d4-cook-progress{top:0;right:0}
  .d4-root.d4-v153 .d4-table-caption,.d4-root.d4-v153 .d4-departure-caption{left:10px!important;right:10px!important;bottom:var(--dobox-hud-bottom,12px)!important;width:auto!important;max-height:30svh!important}
  .d4-root.d4-v153 .d4-stage-final .d4-copy{width:auto!important;max-width:none!important;margin:0 0 var(--dobox-hud-bottom,12px)!important;padding:14px!important}
}

@media(max-width:374px),(max-height:650px){
  .d4-root.d4-v153 .d4-live-dialogue,.d4-root.d4-v153 .d4-market-moment,.d4-root.d4-v153 .d4-yuki-response,.d4-root.d4-v153 .d4-table-caption,.d4-root.d4-v153 .d4-departure-caption{max-height:27svh!important}
  .d4-root.d4-v153 .d4-live-dialogue p,.d4-root.d4-v153 .d4-market-moment>p{font-size:12.25px!important;line-height:1.34!important}
  .d4-root.d4-v153 .d4-yuki-video-shell{height:min(47svh,390px)}
  .d4-root.d4-v153 .d4-kitchen-counter{transform:scale(.9);transform-origin:center bottom}
}

@media(min-width:1181px) and (max-height:820px){
  .d4-root.d4-v153 .d4-live-dialogue,.d4-root.d4-v153 .d4-market-moment{max-height:34svh}
  .d4-root.d4-v153 .d4-yuki-video-shell{top:calc(var(--dobox-hud-top,105px) + 4px);bottom:24px;width:min(30vw,365px)}
  .d4-root.d4-v153 .d4-kitchen-live-work{inset:var(--dobox-hud-top,102px) 3vw 20px}
}

@media(prefers-reduced-motion:reduce){
  .d4-root.d4-v153 .d4-market-scene-bg,.d4-root.d4-v153 .d4-world-img{transition:none!important;transform:none!important}
}

/* V154.3 strict visual recovery — canonical Yuki home continuity */
.d4-root.d4-v153.d4-yuki .d4-world-img{object-position:center 50%!important}
.d4-root.d4-v153.d4-threshold .d4-world-img{object-position:center 54%!important}
.d4-root.d4-v153.d4-living .d4-world-img{object-position:center 48%!important}
.d4-root.d4-v153.d4-kitchen .d4-world-img{object-position:center 50%!important}
.d4-root.d4-v153.d4-table .d4-world-img{object-position:center 54%!important}
.d4-root.d4-v153.d4-departure .d4-world-img{object-position:center 54%!important}

/* House-search desktop is now composed from three explicit candidates so the
   correct facade remains the same house that is entered in the next scene. */
.d4-root.d4-v153 .d4-house-grid{
  position:absolute;z-index:6;left:var(--d4-edge);right:var(--d4-edge);
  top:calc(var(--dobox-hud-top,112px) + 18px);height:min(54vh,520px);
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.5vw,22px);
  pointer-events:auto
}
.d4-root.d4-v153 .d4-house-card{
  position:relative;min-width:0;overflow:hidden;padding:0;border:1px solid rgba(255,255,255,.42);
  border-radius:20px;background:#0a2026;color:#fff;box-shadow:0 18px 42px rgba(0,0,0,.22);
  cursor:pointer
}
.d4-root.d4-v153 .d4-house-card img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.d4-root.d4-v153 .d4-house-card span{
  position:absolute;left:12px;right:12px;bottom:12px;padding:9px 12px;border-radius:999px;
  background:rgba(4,29,36,.78);border:1px solid rgba(255,255,255,.28);font-size:13px;font-weight:800;
  text-align:center;backdrop-filter:blur(8px)
}
.d4-root.d4-v153 .d4-house-card.correct{outline:3px solid rgba(101,185,139,.88);outline-offset:2px}
.d4-root.d4-v153 .d4-house-card.wrong{outline:2px solid rgba(187,94,79,.72);outline-offset:2px}

/* The new exterior contains a decorative name plate on the far-right pillar.
   The first live Yuki video occupies that side on desktop, so the scene never
   teaches or relies on generated micro-text as an address clue. */
@media (min-width:761px){
  .d4-root.d4-v153 .d4-stage-yuki-live .d4-yuki-video-shell{
    left:auto!important;right:clamp(28px,6vw,110px)!important;transform:none!important;
    width:min(31vw,420px)!important
  }
  .d4-root.d4-v153 .d4-yuki-response{
    left:var(--d4-edge)!important;right:auto!important;width:min(470px,35vw)!important
  }
  .d4-root.d4-v153 .d4-house-caption{max-width:min(520px,38vw)!important}
}

@media (max-width:760px){
  .d4-root.d4-v153 .d4-house-grid{display:none!important}
  .d4-root.d4-v153.d4-yuki .d4-world-img,
  .d4-root.d4-v153.d4-threshold .d4-world-img,
  .d4-root.d4-v153.d4-living .d4-world-img,
  .d4-root.d4-v153.d4-kitchen .d4-world-img,
  .d4-root.d4-v153.d4-table .d4-world-img,
  .d4-root.d4-v153.d4-departure .d4-world-img{object-position:center!important}
}

/* Align diegetic interactions with the new Yuki interior artwork. */
@media (min-width:761px){
  .d4-root.d4-v153 .d4-bag-object{left:12%!important;bottom:16%!important}
  .d4-root.d4-v153 .d4-bag-target{right:40%!important;bottom:16%!important}
  .d4-root.d4-v153 .d4-kitchen-path-hotspot{--hotspot-x:27%!important;--hotspot-y:45%!important}
  .d4-root.d4-v153 .d4-kitchen-step-note{margin-left:auto!important;margin-right:0!important}
  .d4-root.d4-v153 .d4-kitchen-counter{max-width:min(690px,54vw)!important;margin-left:0!important;margin-right:auto!important}
}
@media (max-width:760px){
  .d4-root.d4-v153 .d4-bag-object{left:9%!important;bottom:29%!important}
  .d4-root.d4-v153 .d4-bag-target{right:17%!important;bottom:30%!important}
  .d4-root.d4-v153 .d4-kitchen-path-hotspot{--hotspot-x:29%!important;--hotspot-y:46%!important}
}