/* Camp as a lobby (Lead, UI_VIBE_REVIEW_20260923 #5). Loaded last. Camp view only; the Heroes view keeps its layout.
   The hero stage grows to fill the screen, shortcuts sit in a side rail inside it, and the stage strip sits on the Play
   button as one launch block. The #menu prefix outranks the stacked camp rules in menu-shell, beacon-ui and ui-navigation. */
#menu .camp-shell:not(.heroes-open) .camp-stage{flex:1 1 auto;height:auto;min-height:clamp(250px,40dvh,430px);max-height:none}
#menu .camp-shell:not(.heroes-open) .camp-scene-label{display:none}
#menu .camp-shell:not(.heroes-open) .camp-signature{display:none}

/* Hero name and kit, bottom left of the stage. */
#menu .camp-hero-kit{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 0}
#menu .camp-hero-kit b,#menu .camp-hero-kit em{display:inline-flex;align-items:center;min-height:24px;padding:2px 9px;border-radius:12px;font:600 12px/1.2 var(--body);font-style:normal;letter-spacing:0;text-transform:none}
#menu .camp-hero-kit b{background:#0d2530d9;border:1px solid #e3c27a8c;color:#f3dfb2}
#menu .camp-hero-kit em{background:#0d2530b3;border:1px solid #7fb5b566;color:#cfe3de}

/* Side rail: square tiles with an icon over a short label, and a count badge when something is ready. */
#menu .camp-rail{position:absolute;top:12px;right:12px;z-index:3;display:flex;flex-direction:column;gap:10px}
#menu .camp-rail>button{position:relative;inset:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:62px;min-height:62px;margin:0;padding:7px 4px 6px;border:1px solid #d9bd8066;border-radius:16px;background:linear-gradient(180deg,#1f4450f2,#122d39f2);box-shadow:inset 0 1px #ffffff1f,0 4px 12px #0006;color:#f1e4c4;font:600 11px/1.1 var(--body);letter-spacing:0;text-align:center}
#menu .camp-rail>button .camp-icon,#menu .camp-rail>button .item-art,#menu .camp-rail>button svg,#menu .camp-rail>button img{flex:none;width:30px!important;height:30px!important;margin:0}
#menu .camp-rail .camp-board-link>span{display:block}
#menu .camp-rail .camp-board-link b{font:600 11px/1.1 var(--body)}
#menu .camp-rail .camp-board-link small,#menu .camp-rail .camp-board-link i{display:none}
#menu .camp-rail .camp-daily-count{position:absolute;top:-6px;right:-6px;margin:0;min-width:20px;height:20px;border:2px solid #102c38;border-radius:11px}
#menu .camp-rail .camp-daily.ready:after{display:none}
#menu .camp-rail .camp-daily.ready{border-color:#f1d08acc;box-shadow:inset 0 1px #ffffff26,0 0 14px #e3c27a4d,0 4px 12px #0006}
@media(prefers-reduced-motion:no-preference){#menu .camp-rail>button{transition:transform .12s ease}#menu .camp-rail>button:active{transform:scale(.96)}}

/* Launch block: the stage strip reads as the Play button's label. */
#menu .camp-shell:not(.heroes-open) .camp-destination{min-height:0;margin:0 0 -18px;padding:12px 16px 28px;border-radius:18px 18px 0 0;background-size:cover;background-position:center}
#menu .camp-shell:not(.heroes-open) .camp-destination .stage-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:10px;row-gap:2px;padding-right:58px}
#menu .camp-shell:not(.heroes-open) .camp-destination .stage-copy>small{grid-column:1/-1;font-size:11px;letter-spacing:.06em}
#menu .camp-shell:not(.heroes-open) .camp-destination .stage-copy>strong{grid-column:1;font-size:22px;line-height:1.1;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#menu .camp-shell:not(.heroes-open) .camp-destination .stage-copy>span:not(.stage-facts){display:none}
#menu .camp-shell:not(.heroes-open) .camp-destination .stage-facts{grid-column:1/-1;margin:2px 0 0;font-size:12px}
#menu .camp-shell:not(.heroes-open) .camp-destination .stage-badge{top:50%;transform:translateY(-70%);width:44px;height:44px;font-size:18px}
#menu .camp-shell:not(.heroes-open) .camp-launch{position:relative;bottom:auto;z-index:2}

@media(max-height:680px){
 #menu .camp-shell:not(.heroes-open) .camp-stage{min-height:176px}
 /* Short screens: the rail turns into a row of icon tiles along the top, clear of the name and Change Hero. */
 #menu .camp-rail{top:8px;right:8px;flex-direction:row;gap:6px}
 #menu .camp-rail>button{width:46px;min-height:46px;padding:0;border-radius:13px;font-size:0}
 #menu .camp-rail>button>span:not(.camp-icon){display:none}
 #menu .camp-rail>button .camp-icon,#menu .camp-rail>button .item-art,#menu .camp-rail>button svg,#menu .camp-rail>button img{width:28px!important;height:28px!important}
 #menu .camp-rail .camp-daily-count{font-size:11px}
 #menu .camp-shell:not(.heroes-open) .camp-destination{padding:9px 14px 24px}
 #menu .camp-shell:not(.heroes-open) .camp-destination .stage-copy>strong{font-size:19px}
}
#menu .camp-rail .camp-replay{border-color:#8fb2ae55;background:linear-gradient(180deg,#1a3a45e6,#102833e6);color:#d6e4df}
#menu .camp-rail .camp-replay>span{display:block}#menu .camp-rail .camp-replay b{font:600 11px/1.1 var(--body)}

/* Wallet count-up (UI_VIBE_REVIEW #6): the chip pops once while its number counts to the new balance. */
@media(prefers-reduced-motion:no-preference){
 #menu .camp-wallet [data-wallet].wallet-bump{animation:wallet-bump .5s cubic-bezier(.2,1.5,.4,1)}
 #menu .camp-wallet [data-wallet].wallet-up{box-shadow:0 0 0 1px #f1d08a99,0 0 16px #e3c27a66}
}
@keyframes wallet-bump{40%{transform:scale(1.08)}}

/* Nav badges (UI_VIBE_REVIEW #6): a gold dot on a tab with something affordable inside. */
#menu .camp-nav>button{position:relative}
#menu .camp-nav .nav-badge{position:absolute;top:6px;right:calc(50% - 26px);width:11px;height:11px;border-radius:50%;background:#f1d08a;border:2px solid #102c38;box-shadow:0 0 8px #e3c27a99}
#menu .camp-nav>button[aria-disabled="true"] .nav-badge{display:none}