/* desk-v2.css */
.stage .gameboy { width:95%; max-width:240px; transform:rotate(4deg); }
@media(max-width:650px) {
.stage .gameboy { grid-column:1 / span 2; }
}

/* toys.css */
.object-dialog[data-room="games"] { width:min(1020px,calc(100vw - 32px)); border:0; border-radius:18px; background:linear-gradient(#e5e0d0,#b5ad94); box-shadow:0 28px 90px #0b172077,inset 0 1px #fff; overflow:auto; }
[data-room="games"] .dialog-inner { padding:20px 24px 28px; }
[data-room="games"] .dialog-head { margin-bottom:0; }
[data-room="games"] .dialog-head h2 { font:700 25px/1.1 var(--ui); text-transform:uppercase; letter-spacing:.08em; }
.game-shelf { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(250px,.72fr); gap:20px; align-items:center; }
.cartridge-case { position:relative; }
.cartridge-case > img { display:block; width:100%; height:auto; filter:drop-shadow(0 14px 11px #342c2766); }
.game-slot { position:absolute; top:19%; bottom:13%; width:27%; min-height:0!important; border:0; border-radius:12px; background:transparent; cursor:pointer; }
.game-slot[data-game="draw"] { left:5%; }
.game-slot[data-game="karaoke"] { left:36.5%; }
.game-slot[data-game="name"] { left:68%; }
/* The physical cartridge stays unobstructed; keyboard focus is a quiet underline. */
.game-slot { outline:none; box-shadow:none; }
.game-slot:focus-visible::after { content:''; position:absolute; left:15%; right:15%; bottom:3%; height:2px; background:#353848; }
.game-concept { min-height:300px; padding:25px 22px; border:3px inset #dad4c3; border-radius:9px; background:#353848; color:#f7f1df; box-shadow:inset 0 0 28px #090a11; }
.game-kicker { margin:0 0 16px; color:#9de3ac; font:11px/1 var(--digital); letter-spacing:.2em; }
.game-concept h3 { margin:0 0 16px; color:#fff; font:700 27px/1.08 var(--ui); }
.game-concept p { font:15px/1.55 var(--ui); }
.game-concept ol { margin:20px 0 0; padding:0; list-style-position:inside; color:#c9d8d0; font:13px/1.8 var(--digital); }
.game-play { margin-top:22px; padding:11px 16px; border:2px solid; border-color:#e8ffdc #446b42 #446b42 #e8ffdc; border-radius:4px; background:#b4d797; color:#182e22; font:700 13px var(--digital); cursor:pointer; box-shadow:0 3px 0 #19211f; }
.game-play:hover { background:#cbe6b5; }
.game-play:active { transform:translateY(2px); box-shadow:0 1px 0 #19211f; }
.game-shelf[hidden],.game-player[hidden] { display:none; }
.object-dialog[data-room="games"].is-playing-game { width:min(470px,100vw); max-width:100vw; height:min(900px,100dvh); max-height:100dvh; padding:0; overflow:hidden; border-radius:32px 32px 65px 32px; background:transparent; box-shadow:0 25px 80px #10102599; }
.is-playing-game #games-room { height:100%; }
.game-player { height:100%; min-height:0; }
.gb-shell { box-sizing:border-box; position:relative; display:flex; flex-direction:column; height:100%; padding:10px 20px 12px; border:2px solid #b6a0de; border-bottom:6px solid #50357f; border-radius:32px 32px 65px 32px; background:repeating-linear-gradient(95deg,#ffffff03 0 1px,transparent 1px 4px),radial-gradient(ellipse at 0 10%,#c3a7e885,transparent 50%),linear-gradient(115deg,#926abf,#8560b4 45%,#68449c); box-shadow:inset 4px 2px 4px #e3caffaa,inset -5px 0 8px #361b6266,inset 0 -6px 5px #42256888; }
.gb-top { display:flex; justify-content:space-between; align-items:center; height:27px; flex-shrink:0; padding:0 5px; color:#442c6b; text-shadow:0 1px #b496d9; font:700 9px Arial,sans-serif; letter-spacing:1px; }
.gb-top button { border:0; background:transparent; color:inherit; font:inherit; letter-spacing:inherit; padding:6px; cursor:pointer; }
.gb-top i { display:inline-block; height:6px; width:15px; background:#34223e; border-radius:4px; margin-left:3px; box-shadow:0 1px #cfb4e4; }
.gb-bezel { display:flex; flex-direction:column; flex:1; min-height:180px; padding:0 12px; background:linear-gradient(115deg,#333341,#22232e); border:2px solid #2b213b; border-radius:19px 19px 35px 19px; box-shadow:0 2px 2px #d1b6e08c,inset 0 2px 4px #080914; }
.gb-screen-top { height:27px; flex-shrink:0; display:flex; align-items:center; gap:8px; font:9px 'Courier New',monospace; text-transform:uppercase; letter-spacing:1px; color:#acadb9; }
.gb-led { width:6px; height:6px; border-radius:50%; background:#e44235; box-shadow:0 0 5px #ef4a32; }
.gb-bezel iframe { display:block; width:100%; flex:1; min-height:0; border:2px solid #10141b; border-radius:3px; background:#e8e3d6; box-shadow:0 1px #62606b; }
.gb-logo { flex-shrink:0; padding:11px 0 13px; text-align:center; color:#b8b8c2; font:italic 700 20px Arial,sans-serif; letter-spacing:-1px; text-shadow:0 1px 1px #000; }
.gb-logo span { display:inline-block; margin-left:4px; font-style:normal; letter-spacing:-2px; transform:rotate(-3deg); }
.gb-logo b:nth-child(1){color:#db5280}
.gb-logo b:nth-child(2){color:#a181c6}
.gb-logo b:nth-child(3){color:#83ae54}
.gb-logo b:nth-child(4){color:#dfb658}
.gb-logo b:nth-child(5){color:#58a7aa}
.gb-controls { position:relative; height:158px; flex-shrink:0; margin:14px 7px 0; }
.gb-controls button { cursor:pointer; touch-action:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.gb-dpad { position:absolute; top:4px; left:0; width:108px; height:108px; display:grid; grid-template:repeat(3,36px)/repeat(3,36px); filter:drop-shadow(2px 4px 2px #35214999); }
.gb-dpad button,.gb-dpad span { min-height:0; padding:0; border:0; background:#33313e; color:#16151f; text-shadow:0 1px #65616f; font:13px Arial,sans-serif; box-shadow:inset 1px 2px #77717f,inset -1px -2px #1b1827; }
#gb-up { grid-area:1/2; border-radius:4px 4px 0 0; }
#gb-left{grid-area:2/1;border-radius:4px 0 0 4px}
#gb-right{grid-area:2/3;border-radius:0 4px 4px 0}
#gb-down{grid-area:3/2;border-radius:0 0 4px 4px}
.gb-dpad span{grid-area:2/2;box-shadow:none;background:radial-gradient(circle,#292631 35%,#403b49 38%,#33313e 47%)}
.gb-actions { position:absolute; right:0; top:12px; display:flex; gap:15px; transform:rotate(-25deg); padding:7px; border-radius:40px; box-shadow:inset 1px 3px 5px #45296566,0 1px #b899d355; }
.gb-actions button { width:49px; height:49px; min-height:0; border-radius:50%; border:1px solid #281a3d; background:linear-gradient(135deg,#4a3a59,#302339); color:#b29cc7; font:700 20px Arial,sans-serif; box-shadow:inset 2px 2px 2px #8c709a,inset -2px -3px 3px #211628,2px 4px 3px #352149; transform:rotate(25deg); text-shadow:0 -1px #191021; }
.gb-options { position:absolute; left:calc(50% - 58px); bottom:8px; display:flex; gap:16px; transform:rotate(-12deg); }
.gb-options label { text-align:center; color:#3a245b; text-shadow:0 1px #ad8ccd; font:700 9px Arial,sans-serif; letter-spacing:.5px; }
.gb-options button { display:block; min-height:0; width:38px; height:13px; margin:0 auto 8px; border:1px solid #352543; border-radius:12px; background:#5a4969; box-shadow:inset 1px 2px 2px #9d83ad,0 3px 2px #3d2858; }
.gb-speaker { position:absolute; right:5px; bottom:0; display:flex; gap:5px; transform:rotate(-25deg); }
.gb-speaker i { width:4px; height:31px; border-radius:4px; background:#402a5c; box-shadow:1px 1px #b899d0,inset 1px 1px #241735; }
.gb-controls button:active { filter:brightness(.8); }
.gb-shell button:focus-visible { outline:3px solid #f6df93; outline-offset:3px; }
.gb-hint { flex-shrink:0; margin:6px 0 0; color:#e1d2ee; text-align:center; font:9px/1.4 Arial,sans-serif; }
@media(max-width:500px){
.gb-shell{padding:5px 12px 10px}
.gb-bezel{padding:0 8px}
.gb-controls{height:142px;margin-top:10px}
.gb-top{height:24px}
.gb-logo{font-size:18px;padding:8px 0 10px}
}
@media(max-height:600px){
.is-playing-game.object-dialog[data-room="games"]{overflow:auto}
.gb-shell{min-height:600px}
}
@media(max-width:700px) {
.object-dialog[data-room="games"] { max-height:calc(100dvh - 36px); }
[data-room="games"] .dialog-inner { padding:15px; }
.game-shelf { grid-template-columns:1fr; gap:4px; }
.game-concept { min-height:0; padding:18px; }
.game-concept h3 { font-size:22px; }
.game-concept ol { margin-top:10px; }
}
.object-dialog[data-room="games"].is-playing-game { inset:0; margin:auto; width:min(480px,calc(100vw - 24px),calc((100dvh - 24px) * .62)); max-width:calc(100vw - 24px); height:auto; max-height:calc(100dvh - 24px); aspect-ratio: .62; }
@media(max-height:600px){
.gb-shell{min-height:0}
.gb-controls{height:115px;margin-top:6px}
.gb-dpad{transform:scale(.8);transform-origin:top left}
.gb-actions{transform:rotate(-25deg) scale(.8);transform-origin:top right}
.gb-options{bottom:0}
.gb-speaker{display:none}
}

/* One cartridge and its current description. */
[data-room="games"]:not(.is-playing-game) .dialog-head { display:none; }
.object-dialog[data-room="games"]:not(.is-playing-game) { width:min(680px,calc(100vw - 32px)); }
.game-shelf { grid-template-columns:1fr; gap:18px; }
.cartridge-browser { display:flex; align-items:center; justify-content:center; gap:24px; padding:10px 0; }
.cartridge-case { width:210px; aspect-ratio:480 / 570; flex:none; touch-action:pan-y; }
.cartridge-case .game-slot { position:absolute; inset:0; width:100%; height:100%; border:0; border-radius:9px; padding:0; background-image:url('../../assets/game-cartridges.webp'); background-repeat:no-repeat; background-size:320% 180%; filter:drop-shadow(0 8px 7px #342c2740); }
.cartridge-case .game-slot[data-game="draw"] { background-position:0% 50%; }
.cartridge-case .game-slot[data-game="karaoke"] { background-position:50% 50%; }
.cartridge-case .game-slot[data-game="name"] { background-position:100% 50%; }
.cartridge-case .game-slot[hidden] { display:none; }
.cartridge-arrow { border:0; background:transparent; color:#474737; font:24px Tahoma,sans-serif; width:40px; height:44px; cursor:pointer; }
.game-concept { min-height:0; padding:16px 20px; }
.game-concept p { margin:0; font-size:14px; }
.game-play { margin-top:14px; min-width:90px; }
@media(max-width:700px) {
  .cartridge-case { width:min(190px,50vw); }
  .cartridge-browser { gap:12px; padding:0; }
}

/* The front of the handheld occludes the cartridge as it enters the rear slot. */
.game-player { position:relative; isolation:isolate; }
.game-player .gb-shell { z-index:2; transform-origin:50% 100%; transition:transform 450ms cubic-bezier(.2,.7,.2,1); }
.game-player[data-cartridge="inserting"] .gb-shell { transform:scale(.72); }
.game-player[data-cartridge="inserting"] .gb-shell::before { content:''; position:absolute; top:-5px; left:25%; width:50%; height:8px; border:2px solid #533975; border-radius:5px; background:#251a35; box-shadow:inset 0 2px 3px #000; }
.gb-loading-cartridge { position:absolute; z-index:1; left:32%; top:0; width:36%; aspect-ratio:480 / 570; border-radius:5px; background-image:url('../../assets/game-cartridges.webp'); background-size:320% 180%; background-position:0% 50%; box-shadow:0 7px 12px #17122255; visibility:hidden; }
.gb-loading-cartridge[data-game="karaoke"] { background-position:50% 50%; }
.gb-loading-cartridge[data-game="name"] { background-position:100% 50%; }
[data-cartridge="inserting"] .gb-loading-cartridge { visibility:visible; animation:gb-insert-cartridge 1200ms cubic-bezier(.3,0,.2,1) both; }
[data-cartridge="inserting"] .gb-bezel iframe { visibility:hidden; }
[data-cartridge="inserting"] .gb-led { background:#442b43; box-shadow:none; }
@keyframes gb-insert-cartridge {
  0% { transform:translateY(-8%) rotate(-5deg); }
  30% { transform:translateY(4%) rotate(0); }
  85%,100% { transform:translateY(115%) rotate(0); }
}
@media(prefers-reduced-motion:reduce) {
  .game-player .gb-shell { transition:none; }
  [data-cartridge="inserting"] .gb-loading-cartridge { animation:none; }
}


/* The cartridge preview floats on the desk backdrop: no beige stage, Play centered under the instructions. */
.object-dialog[data-room="games"]:not(.is-playing-game) { background:none; box-shadow:none; border-radius:0; }
.cartridge-arrow { color:#fffdf6; text-shadow:0 1px 3px #101b19; }
.game-play { display:block; width:fit-content; margin:14px auto 0; }

/* The shelf is the three real cartridges: pick one, then press the physical Play control. */
.object-dialog[data-room="games"]:not(.is-playing-game) { width:min(980px,calc(100vw - 24px)); }
.game-shelf { display:block; }
.cartridge-browser { display:block; padding:0; }
.cartridge-case { position:relative; width:min(900px,100%); aspect-ratio:3 / 2; margin:0 auto; touch-action:auto; }
.cartridge-case > img { display:block; width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 16px 12px #10201d85); }
.cartridge-case .game-slot { top:22%; bottom:8%; width:31%; height:auto; inset-block:22% 8%; background:none; filter:none; border-radius:8px; }
.cartridge-case .game-slot[data-game="draw"] { left:0; }
.cartridge-case .game-slot[data-game="karaoke"] { left:34.5%; }
.cartridge-case .game-slot[data-game="name"] { left:69%; }
.cartridge-case .game-slot[aria-pressed="true"] { transform:translateY(-10px) rotate(-1deg); filter:drop-shadow(0 11px 5px #f4dc8255); }
.cartridge-case .game-slot[aria-pressed="true"]::after { content:""; position:absolute; left:18%; right:18%; bottom:2%; height:4px; border-radius:50%; background:#f0d06b; box-shadow:0 0 12px #fff0a6; }
.cartridge-case .game-slot:focus-visible { outline:3px solid #f6df93; outline-offset:-5px; }
.game-play { margin:-4% auto 0; }
@media(max-width:700px) {
  .cartridge-case { width:100%; }
  .game-play { margin:-2% auto 0; }
}
.game-shelf-actions { display:flex; justify-content:center; align-items:center; gap:22px; margin:-4% auto 0; }
.game-shelf-actions .game-play { margin:0; }
@media(max-width:700px) {.game-shelf-actions { margin:-2% auto 0; }}
/* The supplied band photo is printed over the second cartridge label. */
.cartridge-case .game-slot[data-game="karaoke"]::before { content:''; position:absolute; left:12%; top:24%; width:74%; height:46.4%; border-radius:5%; background:#191323 url('../../games/karaoke/cover.png') center / contain no-repeat; }
.cartridge-case .game-slot[data-game="karaoke"][aria-pressed="true"] { transform:none; }
.gb-loading-cartridge[data-game="karaoke"]::after { content:''; position:absolute; inset:32% 12% 15%; background:#191323 url('../../games/karaoke/cover.png') center / contain no-repeat; border-radius:5%; }

/* I Spy replaces the third cartridge's printed label. */
.cartridge-case .game-slot[data-game="spy"] { left:69%; }
.cartridge-case .spy-label { position:absolute; left:9.7%; top:24%; width:75.3%; height:46.4%; object-fit:cover; border-radius:5%; pointer-events:none; }
.gb-loading-cartridge[data-game="spy"] { background-position:100% 50%; }
.gb-loading-cartridge[data-game="spy"]::after { content:''; position:absolute; inset:32% 12% 15%; background:url('../../assets/i-spy-label.webp') center / cover; border-radius:5%; }
.cartridge-case .game-slot[data-game="spy"][aria-pressed="true"] { transform:none; }


/* Each game owns a complete photographic cartridge, equally weighted on the shelf. */
.cartridge-case { display:flex; justify-content:center; gap:clamp(12px,3vw,30px); width:min(900px,100%); aspect-ratio:auto; padding:24px 0; }
.cartridge-case .game-slot { position:relative; inset:auto; width:0; max-width:290px; height:auto; aspect-ratio:380 / 460; flex:1; background-image:url('../../assets/game-cartridges.webp'); background-repeat:no-repeat; background-size:316% 174%; filter:drop-shadow(0 14px 10px #10201d85); }
.cartridge-case .game-slot[data-game="draw"] { left:auto; background-position:0% 50%; }
.cartridge-case .game-slot[data-game="karaoke"] { left:auto; background-position:50% 50%; }
.cartridge-case .game-slot[data-game="spy"] { left:auto; background-position:100% 50%; }
.cartridge-case .spy-label,.cartridge-case .game-slot[data-game="karaoke"]::before { left:12%; top:30%; width:76%; height:59%; }
.cartridge-case .game-slot[aria-pressed="true"],.cartridge-case .game-slot[data-game="spy"][aria-pressed="true"],.cartridge-case .game-slot[data-game="karaoke"][aria-pressed="true"] { transform:translateY(-6px) rotate(-1deg); }
.game-play { margin:16px auto 0; }

/* A printed release sticker belongs to the band-battle cartridge only. */
.cartridge-case .coming-soon { position:absolute; z-index:2; left:7%; right:7%; bottom:-2%; padding:8px 4px; background:#e5ec60; color:#28324b; border:1px solid #f4f6b3; box-shadow:1px 3px 5px #15151770; transform:rotate(-5deg); font:900 clamp(8px,1.8vw,17px)/1 Arial,sans-serif; text-transform:uppercase; letter-spacing:.08em; pointer-events:none; }

.game-shelf-actions { margin:16px auto 0; }
.game-shelf-actions .game-play { margin:0; }

@media (max-height:500px) and (min-width:651px) {
  [data-room="games"] .dialog-inner { padding:10px 20px; }
  .cartridge-case { width:min(600px,100%); padding:6px 0; gap:24px; }
  .cartridge-case .game-slot { max-width:150px; }
  .game-shelf-actions { margin:6px auto 0; }
}
@media(max-width:650px) { body:not(.room-view) .stage .gameboy { --object-width:30vw; } }

/* Keep the shelf actions (Play) above the cartridge case art */
.game-shelf-actions {
  position: relative;
  z-index: 2;
}

/* The shelf is now a pile of cartridges: flick the top one aside to see the next. */
.object-dialog[data-room="games"]:not(.is-playing-game) { width:min(520px,calc(100vw - 24px)); }
.cartridge-browser { position:relative; padding:26px 0 4px; }
.cartridge-case { position:relative; width:min(300px,64vw); aspect-ratio:480 / 570; flex:none; margin:0 auto; touch-action:pan-y; user-select:none; cursor:grab; }
.cartridge-case.is-dragging { cursor:grabbing; }
.cartridge-case .game-slot { position:absolute; inset:0; width:100%; height:100%; min-height:0; border:0; border-radius:9px; padding:0; background-image:url('../../assets/game-cartridges.webp'); background-repeat:no-repeat; background-size:320% 180%; filter:drop-shadow(0 10px 9px #342c2759); transition:transform .38s cubic-bezier(.16,1,.3,1),filter .38s; }
.cartridge-case .game-slot[data-pos="0"] { z-index:3; transform:none; }
.cartridge-case .game-slot[data-pos="1"] { z-index:2; transform:translate(17px,11px) rotate(3.2deg); filter:drop-shadow(0 6px 6px #342c2740) brightness(.96); }
.cartridge-case .game-slot[data-pos="2"] { z-index:1; transform:translate(-15px,21px) rotate(-3.8deg); filter:drop-shadow(0 4px 5px #342c2733) brightness(.92); }
.cartridge-case .game-slot[data-pos="1"],.cartridge-case .game-slot[data-pos="2"] { pointer-events:none; }
.cartridge-case .game-slot:focus-visible::after { display:none; }
.cartridge-case .game-slot:focus-visible { outline:3px solid #f6df93; outline-offset:5px; }
.game-ghost { position:absolute; inset:0; z-index:6; pointer-events:none; }
.game-flick-hint { position:absolute; right:-4px; bottom:-34px; display:inline-flex; align-items:flex-end; gap:3px; color:#fffdf6e0; font:20px/1 var(--hand); letter-spacing:.02em; transform:rotate(-4deg); transition:opacity .45s ease; pointer-events:none; text-shadow:0 1px 4px #101b19; }
.game-flick-hint.is-gone { opacity:0; }
@media(max-width:700px) {
  .cartridge-case { width:min(240px,62vw); }
  .cartridge-browser { padding:18px 0 0; }
}
@media(prefers-reduced-motion:reduce) {
  .cartridge-case .game-slot { transition:none; }
}

.object-dialog[data-room="games"]:has(#game-player:not([hidden])) > .keyboard-shuffle { display:none; }

/* Keep the cartridge, its Play control, and keyboard alternative as one compact object. */
.object-dialog[data-room="games"]:not(.is-playing-game) { width:min(440px,calc(100vw - 24px)); }
.object-dialog[data-room="games"]:not(.is-playing-game) .dialog-inner { padding:4px 12px 12px; }
.object-dialog[data-room="games"]:not(.is-playing-game) .cartridge-browser { padding:0; }
.object-dialog[data-room="games"]:not(.is-playing-game) .cartridge-case { width:min(260px,62vw); }
.object-dialog[data-room="games"]:not(.is-playing-game) .game-flick-hint { right:-22px; bottom:12px; }
.object-dialog[data-room="games"]:not(.is-playing-game) .game-shelf-actions { margin:8px auto 0; gap:12px; }
.object-dialog[data-room="games"]:not(.is-playing-game) .game-shelf-actions .keyboard-shuffle { margin:0; }
@media(max-width:700px) {
  .object-dialog[data-room="games"]:not(.is-playing-game) .game-flick-hint { right:-8px; }
}

.gb-controls { perspective:900px; }
.gb-dpad { transform-origin:50% 50%; transition:rotate 90ms; filter:drop-shadow(1px 3px 1px #09080e88); }
.gb-actions button.physical-pressed,.gb-options button.physical-pressed { box-shadow:inset 1px 3px 4px #000b; }
.gb-bezel { box-shadow:inset 0 3px 9px #0008; }
.gb-loading-cartridge { filter:drop-shadow(2px 10px 5px #0008); }
[data-cartridge="loaded"] .gb-loading-cartridge { filter:drop-shadow(0 1px 1px #0008); }
@media(prefers-reduced-motion:reduce) { .gb-dpad { rotate:none!important; transition:none; } }