/* Camp only: keeps the existing room art and hotspot geometry while framing it as Haru's desk. */
body[data-scene="dungeon"] #roomContext { display:none; }
body[data-scene="camp"] .game { position: relative; display: block; width: 100%; max-width: none; min-height: 100svh; height: 100dvh; padding: 0; overflow: hidden; background: #10100d; }
body[data-scene="camp"] .game-topbar { position: absolute; z-index: 4; top: 0; right: 0; left: 0; display: block; padding: 22px 28px; pointer-events: none; }
body[data-scene="camp"] .game-header { display: flex; align-items: start; justify-content: space-between; pointer-events: auto; }
body[data-scene="camp"] .game-brand { display: flex; gap: 9px; padding: 10px 16px; border: 2px solid #a57c44; border-radius: 4px; background: url('/assets/preparation/paper-frame.png') center / 100% 100% no-repeat, #f4e6bf; box-shadow: 0 3px 10px #0008; color: #3f2818; }
body[data-scene="camp"] .game-brand > .ui-icon { width: 26px; height: 26px; color: #805422; }
body[data-scene="camp"] .game-brand b { display: block; color: #3c2516; font: 25px/1.3 BoardLabel, serif; letter-spacing: .03em; }
body[data-scene="camp"] .game-brand small { display: block; margin-top: 2px; color: #795837; font: 13px/1.3 BoardHand, sans-serif; }
body[data-scene="camp"] .header-actions { gap: 7px; }
body[data-scene="camp"] .header-actions button { min-height: 48px; padding: 7px 12px; border: 2px solid #a4783b; border-radius: 4px; background: linear-gradient(#372516, #16100b); box-shadow: inset 0 0 0 1px #d6aa5d55, 0 3px 7px #0009; color: #f3d89a; font-family: BoardLabel, sans-serif; }
body[data-scene="camp"] .header-actions .ui-icon { width: 22px; height: 22px; }
body[data-scene="camp"] .scene-heading { display: block; width: min(510px, calc(100vw - 56px)); margin-top: 8px; pointer-events: auto; }
body[data-scene="camp"] .location { display: contents; }
body[data-scene="camp"] .game-header { width:100%;max-width:none;margin:0; }
body[data-scene="camp"] .scene-heading { margin:8px 0 0; }
body[data-scene="camp"] :is(#chapterLabel,#locationCopy) { display:none; }
body[data-scene="camp"] #locationName { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%); }
body[data-scene="camp"] #roomContext { position:relative;width:fit-content;max-width:100%;margin:0;border:0;background:none; }
body[data-scene="camp"] #roomContext > summary { min-height:44px;padding:10px 14px;color:#f1dbab;font:15px BoardLabel,sans-serif;border:1px solid #a8783e;background:#2d1c11; }
body[data-scene="camp"] #roomContext[open] #roomFollowup { max-height:min(45dvh,300px);overflow:auto; }
body[data-scene="camp"] #roomFollowup { width: fit-content; max-width: 100%; margin: 0; padding: 8px 14px; border: 1px solid #bc9660; border-radius: 3px; background: #f6e9c6e8; box-shadow: 0 3px 8px #0006; color: #4c301d; font: 15px/1.35 BoardLabel, sans-serif; }
body[data-scene="camp"] #roomFollowup p { margin: 0; } body[data-scene="camp"] #roomFollowup p + p { margin-top: 4px; }
body[data-scene="camp"] #roomFollowup button { min-height: 44px; margin-left: 6px; color: #71411f; font-family: BoardLabel, sans-serif; }
body[data-scene="camp"] .scene-area { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; border: 0; background: #13100d; box-shadow: none; }
body[data-scene="camp"] #world { display: none; }
body[data-scene="camp"] .room-hotspots { position: absolute; z-index: 2; inset: 0; display: block; }
body[data-scene="camp"] .room-art { position: absolute; inset: 0; display: block; width: 100%; height: 100%; background: url('/assets/gamer/haru-room-v2.png') center / cover no-repeat; }
body[data-scene="camp"] .room-art::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #06060933, transparent 42% 72%, #02030a3d), linear-gradient(#02040844, transparent 35% 72%, #09050488); }
body[data-scene="camp"] .room-greeting.sr-only { position: absolute; z-index: 3; top: 37%; left: 34%; display: block; width: min(260px, 22vw); height: auto; padding: 13px 16px; overflow: visible; clip: auto; clip-path: none; border: 1px solid #b58d57; border-radius: 13px 3px 13px 3px; background: url('/assets/preparation/paper-frame.png') center / 100% 100% no-repeat, #f5e4ba; box-shadow: 0 3px 9px #0008; color: #412719; text-shadow: none; }
body[data-scene="camp"] .room-greeting.sr-only::before { content: ''; position: absolute; bottom: -8px; left: 22%; width: 15px; height: 15px; border-right: 1px solid #b58d57; border-bottom: 1px solid #b58d57; background: #f1dfb4; transform: rotate(45deg); }
body[data-scene="camp"] #roomGamerName { display: none; }
body[data-scene="camp"] .room-greeting.sr-only { white-space:normal;pointer-events:none; }
body[data-scene="camp"] #roomGamerLine { margin: 0; color: #482819; font: 700 clamp(18px, 1.8vw, 27px)/1.3 BoardHand, sans-serif; word-break: keep-all; }
body[data-scene="camp"] .room-hotspot { min-width: 44px; min-height: 44px; border: 0; border-radius: 4px; }
body[data-scene="camp"] .room-hotspot::before { width: 0; height: 0; border: 0; box-shadow: none; }
body[data-scene="camp"] .room-hotspot::after { bottom: 6px; padding: 7px 12px; border: 2px solid #a57b43; border-radius: 3px; background: linear-gradient(#f8e7b8, #d7b275); box-shadow: inset 0 0 0 1px #fff3cf, 0 3px 8px #0009; color: #422817; font: 18px/1.3 BoardLabel, sans-serif; opacity: 1; transform: translateX(-50%); }
body[data-scene="camp"] .room-hotspot:hover:not(:disabled)::after, body[data-scene="camp"] .room-hotspot:focus-visible::after { transform: translateX(-50%) translateY(-2px); }
body[data-scene="camp"] .room-hotspot--haru::after { bottom: 22%; }
body[data-scene="camp"] .room-hotspot--monitor::after { bottom: 7%; }
body[data-scene="camp"] .room-hotspot--whiteboard::after { bottom: 8%; }
body[data-scene="camp"] .room-hotspot--bestiary::after { bottom: 4%; }
body[data-scene="camp"] .room-hotspot--bestiary::after { bottom:50%; }
body[data-scene="camp"] .room-hotspot--companions::after { bottom:50%; }
body[data-scene="camp"] .room-departure { display: contents; }
body[data-scene="camp"] #roomPreparation { display: none; }
body[data-scene="camp"] .room-start { position: absolute; z-index: 3; top: auto; right: clamp(22px, 5vw, 84px); bottom: clamp(20px, 4vh, 52px); left: auto; width: auto; min-width: 210px; min-height: 62px; padding: 10px 22px; transform: none; border: 3px solid #a06f2e; border-radius: 5px; background: linear-gradient(#ffe28b, #d69b3c); box-shadow: inset 0 0 0 2px #fff3b7, 0 5px 12px #000a; color: #452810; font: 28px/1.3 BoardLabel, sans-serif; }
body[data-scene="camp"] .room-start .ui-icon { width: 28px; height: 28px; } body[data-scene="camp"] .room-start:hover:not(:disabled), body[data-scene="camp"] .room-start:focus-visible { background: linear-gradient(#ffebaa, #e1a943); }
body[data-scene="camp"] .camp-footer { position:absolute;z-index:4;left:16px;bottom:12px;display:block;margin:0;padding:0; }
body[data-scene="camp"] .camp-footer #campControls { display:none; }
body[data-scene="camp"] .asset-credit { display:inline-flex;min-height:44px;align-items:center;padding:0 8px;border:1px solid #92754b;background:#17130cd9;color:#ead8b2;font-size:11px; }
body[data-scene="camp"] .error-notice { position:fixed;z-index:30;left:12px;bottom:90px;width:min(600px,calc(100vw - 24px)); }

/* The first meeting keeps its existing stage/camera; only the reading and action surfaces change. */
#roomIntro .intro-top { z-index: 4; }
#roomIntro .intro-brand, #roomIntro .intro-skip, #roomIntro .intro-back { border: 2px solid #a77b40; border-radius: 4px; background: linear-gradient(#3c2918, #17100b); box-shadow: inset 0 0 0 1px #d6ab5a66, 0 3px 8px #000a; color: #f5d995; font-family: BoardLabel, sans-serif; }
#roomIntro .intro-brand { padding: 9px 16px; font-size: 20px; letter-spacing: .06em; }
#roomIntro .intro-skip, #roomIntro .intro-back { min-height: 44px; padding: 8px 14px; font-size: 15px; }
#roomIntro .intro-caption { z-index: 4; right: max(28px, env(safe-area-inset-right)); bottom: max(30px, env(safe-area-inset-bottom)); left: max(28px, env(safe-area-inset-left)); display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; justify-items: stretch; gap: 12px; max-width: none; padding: 20px clamp(18px, 3vw, 40px); border: 2px solid #a77d48; border-radius: 5px; background: url('/assets/preparation/paper-frame.png') center / 100% 100% no-repeat, #f3e4be; box-shadow: 0 5px 16px #000a; color: #482919; text-align: left; text-shadow: none; pointer-events: none; }
#roomIntro .intro-speaker { position: absolute; top: -22px; left: 20px; padding: 7px 19px; border: 2px solid #a77d48; border-radius: 4px; background: #f4e4ba; color: #482919; font: 24px/1.3 BoardLabel, sans-serif; }
#roomIntro .intro-speaker::before, #roomIntro .intro-speaker::after, #roomIntro .intro-speaker small { display: none; }
#roomIntro .intro-caption p { max-width: none; margin: 0; color: #442719; font: 700 clamp(25px, 3vw, 42px)/1.3 BoardHand, sans-serif; text-wrap: balance; }
#roomIntro .intro-target { position: absolute; z-index: 5; right: max(48px, calc(3vw + 20px)); bottom: max(40px, calc(env(safe-area-inset-bottom) + 10px)); display: inline-flex; width: auto; height: auto; min-width: 210px; min-height: 62px; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; transform: none; border: 3px solid #9f702e; border-radius: 5px; background: linear-gradient(#ffe38c, #d89c3d); box-shadow: inset 0 0 0 2px #fff4ba, 0 4px 10px #0008; color: #432711; font: 25px/1.3 BoardLabel, sans-serif; }
#roomIntro .intro-target::before, #roomIntro .intro-target::after { content: none; }
#roomIntro .intro-target { left:auto!important;top:auto!important; }
#roomIntro .intro-caption { padding-right:300px; }
body[data-scene="camp"] :is(.header-actions button,.room-start,#roomContext > summary), body[data-scene="camp"] .room-hotspot::after, #roomIntro :is(.intro-brand,.intro-skip,.intro-back,.intro-target) { border:7px solid transparent;border-image:url('/assets/preparation/button-icon-v3.png') 22% / 10px stretch;border-radius:0;background-image:var(--button-surface,url('/assets/preparation/button-secondary-v3.png'));background-position:center;background-size:112% 260%;background-origin:padding-box;background-clip:padding-box;box-shadow:none;color:#f4e1b5; }
body[data-scene="camp"] .room-start, #roomIntro .intro-target { --button-surface:url('/assets/preparation/button-primary-v3.png');color:#42280e; }
body[data-scene="camp"] #roomStart.room-start { color:#42280e; }
body[data-scene="camp"] .room-hotspot::after { --button-surface:url('/assets/preparation/button-primary-v3.png');color:#42280e; }
@media(max-width:760px) and (orientation:portrait) { #roomIntro .intro-caption { padding:16px 16px 82px; } #roomIntro .intro-caption p { font-size:26px; } body[data-scene="camp"] .room-greeting.sr-only { pointer-events:none; } }
#roomIntro .intro-target svg { display: none; width: 28px; height: 28px; grid-area: auto; fill:none;stroke:currentColor; }
#roomIntro .intro-target span { position: static; width: auto; padding: 0; transform: none; background: none; color: inherit; font: inherit; }
#roomIntro .intro-back { z-index: 5; left: 28px; bottom: 18px; }

@media (max-width: 760px) and (orientation: portrait) { body[data-scene="camp"] .game-topbar { padding: max(10px, env(safe-area-inset-top)) 12px 0; } body[data-scene="camp"] .game-brand { padding: 7px 10px; } body[data-scene="camp"] .game-brand b { font-size: 17px; } body[data-scene="camp"] .game-brand small { display: none; } body[data-scene="camp"] .header-actions button { width: 44px; min-height: 44px; padding: 5px; } body[data-scene="camp"] .journal-label { display: none; } body[data-scene="camp"] .scene-heading { width: min(315px, calc(100vw - 24px)); margin-top: 6px; } body[data-scene="camp"] #roomFollowup { padding: 6px 9px; font-size: 12px; } body[data-scene="camp"] .room-art { background-image: url('/assets/gamer/haru-room-mobile-v1.png'); background-position: center top; } body[data-scene="camp"] .room-greeting.sr-only { top: auto; right: 15px; bottom: 24%; left: 15px; width: auto; padding: 10px 12px; } body[data-scene="camp"] #roomGamerLine { font-size: 21px; } body[data-scene="camp"] .room-hotspot::after { padding: 5px 8px; font-size: 14px; } body[data-scene="camp"] .room-hotspot--haru::after { bottom: 11%; } body[data-scene="camp"] .room-start { right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); min-width: 164px; min-height: 52px; padding: 8px 13px; font-size: 21px; } body[data-scene="camp"] .room-start .ui-icon { width: 21px; height: 21px; } #roomIntro .intro-target { right: 26px; bottom: max(26px, env(safe-area-inset-bottom)); min-width: 164px; min-height: 52px; font-size: 20px; } }
@media (max-height: 500px) and (orientation: landscape) { body[data-scene="camp"] .game-topbar { padding: 8px 12px; } body[data-scene="camp"] .game-brand { padding: 6px 10px; } body[data-scene="camp"] .game-brand b { font-size: 17px; } body[data-scene="camp"] .game-brand small, body[data-scene="camp"] .scene-heading { display: none; } body[data-scene="camp"] .header-actions button { min-height: 40px; } body[data-scene="camp"] .room-greeting.sr-only { top: auto; bottom: 14px; left: 30%; width: min(260px, 28vw); padding: 8px 11px; } body[data-scene="camp"] #roomGamerLine { font-size: 17px; } body[data-scene="camp"] .room-hotspot::after { padding: 4px 7px; font-size: 13px; } body[data-scene="camp"] .room-start { right: 14px; bottom: 12px; min-width: 166px; min-height: 48px; padding: 7px 12px; font-size: 20px; } #roomIntro .intro-caption { right: 14px; bottom: 12px; left: 14px; padding: 12px 16px; } #roomIntro .intro-caption p { font-size: 21px; } #roomIntro .intro-target { right: 24px; bottom: 18px; min-width: 150px; min-height: 46px; padding: 7px 10px; font-size: 18px; } #roomIntro .intro-speaker { top: -17px; padding: 5px 12px; font-size: 17px; } }
@media(max-width:760px) and (orientation:portrait) { body[data-scene="camp"] .room-greeting.sr-only { bottom:14%; } }
#roomIntro .intro-room img { display:block;width:100%;height:100%;object-fit:cover; }
@media(max-width:760px) and (orientation:portrait) {
  #roomIntro .intro-camera { width:100%!important;height:100%!important;transform:none!important; }
  #roomIntro .intro-room img { object-position:center top; }
  #roomIntro .intro-monitor { display:none; }
  #roomIntro .intro-board { left:63%;top:19%;width:27%; }
}

body[data-scene="camp"] .game-brand small { display:none; }
body[data-scene="camp"] .room-hotspot::after { max-width:160px;white-space:normal;line-height:1.3;overflow-wrap:anywhere; }
body[data-scene="camp"] #roomStart.room-start { font-size:24px;line-height:1.3; }
body[data-scene="camp"] #roomFollowup { font:14px/1.6 var(--font-copy);overflow-wrap:anywhere; }
#roomIntro .intro-caption p { line-height:1.4; }
#roomIntro .intro-speaker { top:auto;bottom:calc(100% - 12px); }
@media(max-width:560px) and (orientation:portrait) {
  #roomIntro .intro-target { min-width:164px;padding:8px 10px;gap:6px;font-size:18px; }
  #roomIntro .intro-target svg { width:20px;height:20px; }
  #roomIntro .intro-back { bottom:26px;padding:8px; }
}
@media(max-width:760px) and (orientation:portrait) { body[data-scene="camp"] #roomStart.room-start { font-size:21px; } }
