/* One visual focus: character, role selector and audio share a single surface. */
#start.service-page #need.game-voice-section { padding:64px 0 48px; background:#fff }
#start.service-page #need.game-voice-section>.s-need__container { display:block }
#start.service-page #need.game-voice-section .s-need__title { max-width:900px; margin:0 auto 32px; font-size:clamp(30px,3.6vw,48px); line-height:1.12; letter-spacing:-.035em; text-align:center }
#start.service-page #need.game-voice-section .s-need__title::after { display:none }
.game-lab { --lab-accent:#bc482c; --lab-ink:#43416b; position:relative; display:flex; flex-direction:column; align-items:center; padding:0 32px 28px; background:#f7f5f2; border-radius:28px; overflow:hidden }
.game-lab[data-role="villain"] { --lab-accent:#b34336 }
.game-lab[data-role="narrator"] { --lab-accent:#81704e }
.game-lab__stage { position:relative; width:100%; height:360px; min-width:0; isolation:isolate; color:var(--lab-accent); touch-action:pan-y }
.game-lab__stage::before { content:""; position:absolute; width:500px; max-width:100%; height:100%; left:50%; transform:translateX(-50%); background:radial-gradient(ellipse,#e8e4ec 0%,#f0ecea 35%,transparent 70%); z-index:-1 }
.game-lab__orbit { position:absolute; width:380px; max-width:90%; height:140px; left:50%; top:46%; border:1px solid #d7d1df; border-radius:50%; transform:translateX(-50%) rotate(-18deg); opacity:.6; pointer-events:none }
.game-lab__portrait,.game-lab__canvas { position:absolute; width:100%; height:100%; inset:0; display:block }
.game-lab__canvas { opacity:0; transition:opacity .3s }
.game-lab.is-3d .game-lab__canvas { opacity:1 }
.game-lab.is-3d .game-lab__portrait { visibility:hidden }
.game-lab__controls { width:100%; max-width:480px; text-align:center }
.game-lab__roles { display:flex; gap:4px; padding:4px; border:1px solid #dedbe3; border-radius:30px }
.game-lab__role { flex:1; min-width:0; appearance:none; border:0; background:none; border-radius:24px; padding:10px 12px; font:inherit; font-size:15px; font-weight:500; color:#777286; cursor:pointer; transition:background .2s,color .2s }
.game-lab__role[aria-selected="true"] { background:var(--lab-ink); color:#fff }
.game-lab__role:hover:not([aria-selected="true"]) { color:var(--lab-ink); background:#ece9ef }
.game-lab__player { padding:22px 0 20px }
.game-lab__transport { display:flex; gap:18px; align-items:center }
.game-lab__play { flex:0 0 52px; width:52px; height:52px; display:grid; place-items:center; border:0; border-radius:50%; background:var(--lab-accent); color:#fff; cursor:pointer; transition:background .2s,transform .2s }
.game-lab__play:hover { transform:scale(1.05) }
.game-lab__play:disabled { cursor:wait; opacity:.5 }
.game-lab__play svg { width:22px; height:22px; fill:currentColor }
.game-lab__pause-icon,.game-lab__play[aria-pressed="true"] .game-lab__play-icon { display:none }
.game-lab__play[aria-pressed="true"] .game-lab__pause-icon { display:block }
.game-lab__wave { display:flex; flex:1; height:42px; align-items:center; justify-content:space-between; gap:3px; overflow:hidden; color:var(--lab-accent) }
.game-lab__wave i { display:block; flex:1 0 2px; max-width:4px; height:var(--bar); background:currentColor; border-radius:3px; opacity:.32; transform:scaleY(.5); transform-origin:center; transition:transform .15s,opacity .2s }
.game-lab.is-playing .game-lab__wave i { opacity:.85; animation:game-lab-wave .65s var(--delay) ease-in-out infinite alternate }
.game-lab__time { min-width:33px; font-size:12px; color:#777286; font-variant-numeric:tabular-nums }
.game-lab__credit { display:flex; gap:7px; flex-wrap:wrap; justify-content:center; margin:12px 0 0; font-size:12px; line-height:1.5; color:#777286 }
.game-lab__credit a { color:var(--lab-ink); text-underline-offset:3px; text-decoration:underline }
#start.service-page #need .game-lab__status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
#start.service-page #need .game-lab.has-error .game-lab__status { position:static; width:auto; height:auto; margin:12px 0 0; overflow:visible; clip-path:none; white-space:normal; color:#a43e28; font-size:12px; line-height:1.5; text-align:center }
.game-lab__cta { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:44px; padding:10px 22px; color:var(--lab-accent); border:1px solid #d7b5a9; border-radius:24px; font-size:14px; font-weight:500; text-decoration:none }
.game-lab__cta:hover { border-color:var(--lab-accent); background:#f0e9e4 }
.game-lab__cta span { font-size:20px; font-weight:400; line-height:1 }
.game-lab :is(button,a):focus-visible { outline:2px solid var(--lab-accent); outline-offset:4px }
#start.service-page #need .game-lab-copy { display:block; width:100%; max-width:780px; margin:22px auto 0; padding:0 }
.game-lab-copy summary { display:flex; justify-content:center; align-items:center; gap:12px; width:fit-content; margin:auto; padding:9px 0; font-size:14px; font-weight:400; line-height:1.4; cursor:pointer; list-style:none; color:#777286 }
.game-lab-copy summary::-webkit-details-marker { display:none }
.game-lab-copy summary::after { content:""; display:block; flex:0 0 14px; width:14px; height:14px; color:#777286; background-image:linear-gradient(currentColor,currentColor),linear-gradient(currentColor,currentColor); background-size:12px 2px,2px 12px; background-position:center; background-repeat:no-repeat }
.game-lab-copy[open] summary::after { background-size:12px 2px,0 0 }
.game-lab-copy__body { padding:12px 0 0 }
#start.service-page #need .game-lab-copy p { max-width:none; margin:0 0 18px; font-size:15px; line-height:1.7; text-align:left }
.game-lab-copy summary:focus-visible { outline:2px solid #bc482c; outline-offset:4px }
@keyframes game-lab-wave { from { transform:scaleY(.3) } to { transform:scaleY(1) } }
@media(max-width:640px) {
    #start.service-page #need.game-voice-section { padding:44px 0 32px }
    #start.service-page #need.game-voice-section .s-need__title { font-size:30px; margin-bottom:24px; text-align:left }
    .game-lab { padding:0 20px 24px; border-radius:22px }
    .game-lab__stage { height:290px }
    .game-lab__portrait { transform:scale(1.1) }
    .game-lab__orbit { width:270px; height:110px; top:50% }
    .game-lab__role { font-size:14px; padding:9px 4px }
    .game-lab__transport { gap:12px }
    .game-lab__play { flex-basis:46px; width:46px; height:46px }
    .game-lab__wave { gap:2px }
    .game-lab__player { padding:18px 0 }
    .game-lab__credit { font-size:11px; gap:5px }
    .game-lab__cta { min-height:42px; padding:9px 20px }
}
@media(prefers-reduced-motion:reduce) {
    .game-lab *, .game-lab *::after { animation:none!important; transition:none!important }
}
