/* One persistent portrait, wallet HUD and toolbar; only the location scene changes.
   Outside these locations the wrappers have no layout, preserving blackjack/full-screen games. */
#locationShell,#locationStage { display:contents; }
#locationShell>.yard-toolbar[hidden] { display:none!important; }
body.location-shell { background:radial-gradient(ellipse at 70% 0,#30233655,transparent 65%),#141610; }
body.location-shell #locationStage {
  position:relative; display:flex; flex-direction:column; flex:1; width:100%; min-width:0; min-height:0;
  overflow:hidden; isolation:isolate; border-radius:11px 11px 0 0; background:#101510;
}
body.location-shell #locationStage>.scene-view:not([hidden]) {
  position:relative; display:flex; flex-direction:column; flex:1; width:100%; height:100%; min-height:0;
  padding:0; margin:0; gap:0; border:0; border-radius:0; box-shadow:none;
  overflow:hidden; background:transparent;
}
#locationStage>.scene-view[hidden] { display:none!important; }
body.location-shell #locationStage #home .yard-frame {
  flex:1; width:100%; height:100%; min-height:0; border:0; border-radius:0;
}
body.location-shell #locationStage #home .yard-scene { flex:none; width:100%; height:auto; max-height:none; aspect-ratio:3/2; }
body.location-shell #locationStage #shop .kiosk-stage {
  position:relative; isolation:isolate;
  display:flex; align-items:flex-start; justify-content:center; flex:1; width:100%; height:100%; min-height:0; padding:0;
  container:kiosk-scene/size; overflow:hidden;
}
body.location-shell #locationStage #shop .kiosk-window {
  /* Frame the shop above the counter (source y=720), hiding the lower advertising panels. */
  width:max(100cqw,232.2223cqh); height:auto; min-height:0; max-width:none; aspect-ratio:1672/941;
  flex:none; margin:0; border:0; border-radius:0; box-shadow:none;
  transform:translateY(calc(100cqh - 76.5143%));
}
body.location-shell #locationStage #shop .kiosk-picture {
  position:absolute; inset:0 auto auto 0; width:100%; height:auto; max-width:none; object-fit:initial;
}
body.location-shell #locationStage #shop .kiosk-seller {
  left:40%; width:28%; bottom:23.4857%;
}
body.location-shell #locationStage #shop .kiosk-window::after {
  content:''; position:absolute; inset:0; z-index:6; pointer-events:none;
  background:url('assets/shop/02_larek_inside_counter.png?v=widescreen-1') left top/100% auto no-repeat;
  clip-path:inset(74% 0 23.4857% 0);
}
body.location-shell #locationStage #shop .kiosk-delivery {
  bottom:calc(23.4857% + 10px);
}
body.location-shell #locationStage #clubIntro {
  display:flex; align-items:center; justify-content:center; padding:0; overflow:hidden;
}
body.location-shell #locationStage #clubIntro[hidden] { display:none; }
body.location-shell #locationStage .club-entrance-scene {
  flex:none; width:100%; height:auto; aspect-ratio:3/2; border:0; border-radius:0;
}
/* Inherited fullscreen-shop and away-home rules must not collapse the portrait. */
body.location-shell .shell:has(#locationShell) #characterPanel {
  display:grid!important; position:relative; inset:auto; height:100%; min-height:0; visibility:visible; margin:0; padding:0; gap:0;
  border:1px solid #4b4338; border-radius:12px; background:#23251b; box-shadow:0 6px 20px #0004;
}
body.location-shell .shell #characterPanel .hero-top,
body.location-shell .shell #characterPanel .character-stage,
body.location-shell .shell #characterPanel .speech,
body.location-shell .shell #characterPanel .vitals,
body.location-shell .shell #characterPanel .beerbar { visibility:visible; }
body.location-shell .shell:has(#locationShell) #characterPanel .hero-top { display:flex; }
body.location-shell .shell:has(#locationShell) #characterPanel .speech-label { font-size:11px; }
body.location-shell .shell:has(#locationShell) #characterPanel .vitals { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
body.location-shell .shell:has(#locationShell) #characterPanel .vitals label { font-size:11px; gap:6px; }
body.location-shell .shell #characterPanel .character-stage { display:flex!important; }
body.location-shell .shell #characterPanel .speech { display:grid!important; }
body.location-shell .shell #characterPanel .beerbar { display:flex!important; }
body.location-shell #locationStage::before {
  content:''; position:absolute; inset:0; z-index:-1; opacity:.18; pointer-events:none;
  background:var(--location-backdrop) center/cover; filter:blur(18px);
}
body.location-shell:has(#club:not([hidden])) #locationStage { --location-backdrop:url('assets/club-enter/maramyga-club.png'); }
/* A shared HUD rail keeps the club sign and every shop item unobstructed. */
@media(min-width:701px) {
  body.location-shell #locationShell #locationStage>.wallets {
    position:relative; inset:auto; order:-1; flex:none; width:100%; max-width:none;
    grid-template-columns:1fr 1fr 1.2fr; gap:0; padding:10px 13px;
    border:0; border-bottom:1px solid #78623e77; border-radius:10px 10px 0 0;
    background:linear-gradient(140deg,#343428,#20271e 75%); box-shadow:inset 0 1px #f9dfa619;
  }
  body.location-shell #locationShell #locationStage>.wallets .goal {
    grid-column:auto; align-self:center; width:auto; margin:0; padding:0 0 0 12px;
    border-top:0; border-left:1px solid #c7aa6e25;
  }
  body.location-shell #locationShell #locationStage>.wallets .goal>span { white-space:normal; }
}
@media(max-width:700px) {
  body.location-shell .shell:has(#locationShell) #characterPanel { height:auto; padding:8px; }
  body.location-shell .shell:has(#locationShell) #characterPanel .hero-top { display:none; }
  body.location-shell .shell:has(#locationShell) #characterPanel .speech { border:0; }
  body.location-shell .shell:has(#locationShell) #characterPanel .speech-label { font-size:10px; }
  body.location-shell .shell:has(#locationShell) #characterPanel .vitals label { font-size:11px; }
  body.location-shell .shell:has(#locationShell) #drink { padding:3px 8px 3px 5px; }
  body.location-shell #locationStage { flex:none; aspect-ratio:auto; }
  body.location-shell #locationStage>.scene-view:not([hidden]) { flex:none; height:auto; aspect-ratio:3/2; }
  body.location-shell #locationStage #shop .kiosk-stage { min-height:0; }
}
@container kiosk-scene (max-aspect-ratio:19/10) {
  body.location-shell #locationStage #shop .kiosk-bottle.vodka {
    width:4%; margin-left:0;
    left:calc(50% + 50cqw - var(--vodka-edge))!important;
  }
  body.location-shell #locationStage #shop .kiosk-bottle.vodka[id$="_0"] { --vodka-edge:24cqw; }
  body.location-shell #locationStage #shop .kiosk-bottle.vodka[id$="_1"] { --vodka-edge:17.5cqw; }
  body.location-shell #locationStage #shop .kiosk-bottle.vodka[id$="_2"] { --vodka-edge:11cqw; }
  body.location-shell #locationStage #shop .kiosk-bottle.vodka[id$="_3"] { --vodka-edge:4.5cqw; }
  body.location-shell #locationStage #shop #kioskLottery { left:48%; width:20%; }
}
@container kiosk-scene (max-width:340px) {
  body.location-shell #locationStage #shop .kiosk-bottle.vodka[id$="_0"] { --vodka-edge:25.5cqw; }
  body.location-shell #locationStage #shop .kiosk-bottle.vodka[id$="_1"] { --vodka-edge:18.5cqw; }
  body.location-shell #locationStage #shop .kiosk-bottle.vodka[id$="_2"] { --vodka-edge:11.5cqw; }
}
