.race-story{border:0!important;padding:0!important;background:transparent!important;box-shadow:none!important;max-width:none!important;width:100%!important;height:100dvh!important;max-height:100dvh!important;margin:0!important;overflow:auto;align-content:end;pointer-events:none;color:#462460}
.race-story::backdrop{background:linear-gradient(0deg,#24123466,transparent 60%);backdrop-filter:none!important}
.story-exchange{display:flex;align-items:center;gap:8px}.story-speaker{width:92px;height:92px;flex:none;background-size:200% 200%;background-position:0 0;background-repeat:no-repeat}.story-exchange .story-dialogue{min-height:0}
.story-cast{flex:none;width:164px;min-height:106px}.story-cast>.story-speaker{margin:auto}
.story-actors{display:flex;gap:6px}.story-actors[hidden],.story-speaker[hidden]{display:none!important}
.story-actor-frame{width:79px;box-sizing:border-box;border:2px solid #ddd0e8;border-radius:14px;background:#faf5ff;text-align:center;overflow:hidden}
.story-actor-frame[data-active="true"]{border:2px solid #80549b;background:#fff4d9}
.story-actor-body{height:83px;width:100%}.story-actor-body>svg{display:block;width:100%;height:100%;overflow:visible}
.story-actor-frame[data-character="KD02"] .story-actor-body{transform:scaleX(-1)}
.story-actor-frame>span{display:block;font-size:11px;font-weight:700;line-height:16px;color:#593273}
@media(max-width:390px){.story-cast{width:148px}.story-actor-frame{width:71px}.story-actor-body{height:88px}}
@media(max-width:350px){.story-cast{width:132px}.story-actor-frame{width:63px}.story-actor-body{height:78px}}
.race-story[open]{display:grid!important;grid-template-columns:1fr!important;place-items:end center}
.story-panel{pointer-events:auto;box-sizing:border-box;width:min(700px,calc(100% - 24px));margin:12px auto max(12px,env(safe-area-inset-bottom));padding:20px 26px;border-radius:25px;background:linear-gradient(115deg,#fff8edfa,#f8f0fffa);box-shadow:0 10px 44px #29103433;text-align:left}
.story-top{display:flex;justify-content:space-between;align-items:center;gap:12px}.story-kicker{font-size:12px;letter-spacing:.13em;margin:0;font-weight:800;color:#76548f}
.story-panel h2{font-size:clamp(24px,4.3vw,38px);line-height:1.05;margin:6px 0}.story-goal{font-size:14px;margin:8px 0;font-weight:700}.story-dialogue{font-size:clamp(17px,2.7vw,23px);line-height:1.35;min-height:2.7em;margin:10px 0;color:#542677}.story-focus{font-size:14px;margin:8px 0;color:#5d4970}
.story-actions{display:flex;align-items:center;gap:14px}.story-actions .primary{margin:0!important;width:auto!important;min-width:180px;padding:13px 30px!important;font-size:23px!important;min-height:52px}.story-next,.story-close{background:transparent!important;color:#63368a!important;box-shadow:none!important;border:0!important;min-height:44px;padding:8px 12px!important;font-size:15px!important}.story-close{margin:0!important}
.story-actions{flex-wrap:wrap;justify-content:space-between;gap:8px}
.story-navigation{display:flex;align-items:center;gap:5px}
.story-navigation button{min-height:44px;min-width:60px;border:1px solid #cab3db!important;border-radius:12px;background:#fff9f0!important;color:#593273!important;padding:7px 10px!important;box-shadow:none!important;font-size:14px!important}
.story-navigation button:disabled{opacity:.45;cursor:default}
.story-position{font-size:12px;font-variant-numeric:tabular-nums;white-space:normal}
.story-reading{display:flex;align-items:center;gap:10px;margin:4px 0 8px;min-width:0}
.story-reading .story-listen{flex:none;border:1px solid #cab3db!important;border-radius:12px;background:#fff9f0!important;color:#593273!important;min-height:44px;padding:7px 12px!important;font-size:14px!important;box-shadow:none!important}
.story-listen:disabled{opacity:.55;cursor:default}.story-voice-status{font-size:12px;line-height:1.3;color:#5d4970}
body.racing:not(.practising) #toast{display:flex!important;position:fixed!important;left:50%!important;right:auto!important;bottom:auto!important;width:min(350px,calc(100vw - 24px))!important;max-width:calc(100vw - 24px)!important;min-height:58px;gap:10px;padding:8px 12px!important;transform:translateX(-50%)!important;z-index:8;pointer-events:none;transition:none;visibility:hidden;opacity:0}
body.racing:not(.practising) #toast.visible{visibility:visible;opacity:1}
body.racing #toast .friend-portrait{width:42px;height:48px;flex:none;overflow:hidden}
body.racing #toast img{width:42px!important;height:48px!important;object-fit:contain;animation:none!important}
body.racing #toast b{font-size:14px!important;line-height:1.1;margin:0 0 3px!important}
body.racing #toast span{font-size:13px!important;line-height:1.25}
@media(max-width:390px){.story-actions .primary{min-width:0!important;padding-inline:16px!important}.story-navigation button{min-width:55px;font-size:13px!important}}
.race-story button:focus-visible,.ceremony button:focus-visible{outline:3px solid #7438ac;outline-offset:4px}
.race-achievements{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:8px 0 12px}.race-achievements li{background:#efe4fa;border:1px solid #ceabe7;border-radius:30px;padding:7px 12px;font-size:13px;font-weight:700;color:#513071}
.race-story-ending{font-size:15px;line-height:1.4;max-width:600px;margin:10px auto!important;color:#5b3675}
#result-dialog #result-friend{display:block!important;grid-column:1 / -1;grid-row:auto;text-align:center;background:transparent;padding:0;margin:0;border-radius:0}
.ceremony-replay{background:transparent!important;border:0!important;box-shadow:none!important;color:#69458b!important;min-height:44px;font-size:13px!important;padding:8px 14px!important}
.ceremony .ceremony-confetti i{animation:none;opacity:0}
.ceremony .ceremony-confetti{bottom:0}
.ceremony[data-phase="cheer"] .ceremony-confetti i,.ceremony[data-phase="kiss"] .ceremony-confetti i{animation:kd-confetti 3.3s var(--delay) ease-out both}
.ceremony[data-phase="rest"] .ceremony-confetti i{animation:none;top:94%;opacity:.65}
.ceremony[data-calm="true"] .ceremony-confetti i{animation:none;top:94%;opacity:.45}
.ceremony[data-paused="true"] *{animation-play-state:paused!important;transition:none!important}
@media(max-width:600px){.story-panel{padding:13px 17px;border-radius:20px}.story-panel h2{font-size:25px}.story-dialogue{font-size:18px;margin:8px 0}.story-goal,.story-focus{font-size:13px}.story-actions .primary{font-size:21px!important;min-width:155px}}
@media(max-height:540px) and (min-width:600px){.race-story[open]{place-items:center end}.story-panel{width:min(430px,52vw);margin:12px;padding:14px 20px}.story-panel h2{font-size:26px}.story-dialogue{font-size:18px;margin:7px 0}.story-actions .primary{font-size:20px!important;min-height:44px;padding:8px 20px!important}}
@media(max-height:420px) and (min-width:520px){
 .race-story[open]{place-items:safe center end}
 .story-panel{width:min(700px,calc(100% - 24px));padding:8px 16px;margin:8px 12px}
 .story-panel h2{font-size:22px;margin:3px 0;line-height:1.1}
 .story-panel .story-goal,.story-panel .story-focus{margin:4px 0;font-size:13px}
 .story-speaker{width:64px;height:64px}
 .story-cast{width:132px;min-height:64px}.story-actor-frame{width:63px;border-radius:10px}.story-actor-body{height:49px}.story-actor-frame>span{font-size:10px;line-height:13px}
 .story-dialogue{font-size:17px;margin:4px 0}
 .story-reading{margin:0 0 4px}
 .story-actions .primary{font-size:20px!important;min-height:44px;padding:8px 20px!important}
}

/* Result composition: scene and decisions first; race details remain accessible. */
#result-dialog[open]{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:6px!important;padding:14px!important;width:min(980px,calc(100vw - 24px))!important;max-height:calc(100dvh - max(12px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)))!important;overflow:auto!important}
#result-dialog[open]>#result-title{grid-area:1/1!important;font-size:clamp(24px,4vw,34px);line-height:1.1;margin:0!important}
#result-dialog[open]>#result-text{grid-area:2/1!important;font-size:13px!important;line-height:1.3;margin:0!important}
#result-dialog[open]>#podium-stage{grid-area:3/1!important;align-self:center;padding:0;min-width:0}
#result-dialog[open]>.result-stats{grid-area:4/1!important;margin:0!important;gap:24px;align-items:center;flex-wrap:wrap}
#result-dialog[open]>.result-stats b{font-size:22px!important;line-height:1.1;margin-top:0}
#result-dialog[open]>.result-actions{grid-area:5/1!important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;min-width:0}
#result-dialog[open] .result-actions>button{grid-area:auto!important;margin:0!important;width:100%;min-height:44px!important;padding:7px 10px!important;font-size:14px;line-height:1.2;white-space:normal;min-width:0;overflow-wrap:anywhere}
#result-dialog[open] .result-actions>#next{grid-column:1/-1!important;min-height:48px!important}
#result-dialog[open]>#result-details{grid-area:6/1!important;min-width:0;border-top:1px solid #d7c7e4;padding-top:2px;text-align:center;color:#593775;font-size:14px}
#result-details>summary{min-height:44px;align-content:center;cursor:pointer;font-weight:700;border-radius:9px}
#result-details>summary:focus-visible{outline:3px solid #643b88;outline-offset:-3px}
#result-dialog #result-details .race-story-ending{margin:8px auto!important}
#result-dialog #result-details .podium-own{margin:6px auto;font-size:14px}
#result-dialog #result-details .podium-rule{font-size:12px;line-height:1.4}
#result-dialog .ceremony-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:4px auto;gap:6px;max-width:520px}
#result-dialog .ceremony-controls button{font-size:13px!important;padding:6px!important;min-height:44px;width:100%;margin:0!important;line-height:1.2}
#result-dialog .ceremony-controls .ceremony-replay,#result-dialog .ceremony-controls .ceremony-retry{grid-column:1/-1}
#result-dialog .ceremony-quote{font-size:16px;line-height:1.25;min-height:0;margin:6px auto!important;padding:0 3px}
#result-dialog .ceremony-asset-notice{font-size:14px;margin:5px auto}
@media(max-width:599px){
 #result-dialog[open]{padding:10px!important;gap:4px!important}
 #result-dialog .ceremony-floor{--world-unit:min(1px,.24cqw);grid-template-columns:1fr 3.8fr 1fr;padding:0 2px 4px}
 #result-dialog .ceremony-character-space{height:calc(108 * var(--world-unit))}
 #result-dialog .ceremony .ceremony-stand{height:66px;padding:4px 1px}
 #result-dialog .ceremony .place-2 .ceremony-stand{height:78px}
 #result-dialog .ceremony .place-1 .ceremony-stand{height:90px}
 #result-dialog .ceremony .podium-number{font-size:22px!important}
 #result-dialog .ceremony .podium-place h3{font-size:11px!important;margin:2px 0!important;line-height:1.1;white-space:normal}
 #result-dialog .ceremony .podium-identity{font-size:9px;padding:1px 3px;margin-top:0}
 #result-dialog .ceremony-quote{font-size:15px;margin:4px auto!important}
}
@media(min-width:600px){
 #result-dialog[open]{grid-template-columns:minmax(0,1.7fr) minmax(200px,1fr)!important;gap:8px 20px!important;padding:16px!important;align-items:center}
 #result-dialog[open]>#result-title{grid-area:1/1/2/-1!important}
 #result-dialog[open]>#result-text{grid-area:2/1/3/-1!important}
 #result-dialog[open]>#podium-stage{grid-area:3/1/6/2!important}
 #result-dialog[open]>.result-stats{grid-area:3/2!important;flex-wrap:wrap;gap:10px}
 #result-dialog[open]>.result-actions{grid-area:4/2!important;grid-template-columns:1fr}
 #result-dialog[open]>#result-details{grid-area:5/2!important;align-self:start}
 #result-dialog[open]>#result-details[open]{grid-area:6/1/7/-1!important}
 #result-dialog .ceremony-floor{--world-unit:min(1.4px,.24cqw)}
}
@media(min-width:600px) and (max-height:540px){
 #result-dialog[open]{gap:4px 12px!important;padding:8px 12px!important}
 #result-dialog .ceremony-floor{--world-unit:min(.75px,.24cqw);padding-bottom:4px}
 #result-dialog .ceremony .ceremony-stand{height:62px}
 #result-dialog .ceremony .place-2 .ceremony-stand{height:74px}
 #result-dialog .ceremony .place-1 .ceremony-stand{height:86px}
 #result-dialog .ceremony-quote{font-size:14px;line-height:1.25;margin:4px auto!important}
 #result-dialog[open]>#result-title{font-size:24px}
}

@media(min-width:520px) and (max-height:540px){
 #result-dialog[open]{grid-template-columns:minmax(0,1.6fr) minmax(190px,1fr)!important;gap:4px 12px!important;padding:8px 12px!important;align-items:center}
 #result-dialog[open]>#result-title{grid-area:1/1!important;font-size:24px}
 #result-dialog[open]>#result-text{grid-area:1/2!important;font-size:12px!important}
 #result-dialog[open]>#podium-stage{grid-area:2/1/6/2!important}
 #result-dialog[open]>.result-stats{grid-area:2/2!important;gap:12px}
 #result-dialog[open]>.result-actions{grid-area:3/2/5/3!important;grid-template-columns:1fr}
 #result-dialog[open]>#result-details{grid-area:5/2!important}
 #result-dialog[open]>#result-details[open]{grid-area:6/1/7/-1!important}
 #result-dialog .ceremony-floor{--world-unit:min(.7px,.24cqw);grid-template-columns:1fr 3.8fr 1fr;padding-bottom:4px}
 #result-dialog .ceremony .ceremony-stand{height:62px}
 #result-dialog .ceremony .place-2 .ceremony-stand{height:74px}
 #result-dialog .ceremony .place-1 .ceremony-stand{height:86px}
 #result-dialog .ceremony-quote{font-size:14px;line-height:1.25;margin:4px auto!important}
 #result-dialog .ceremony .podium-place h3{font-size:11px!important;white-space:normal}
}

@media(min-width:520px) and (max-height:360px){#result-dialog .ceremony-floor{--world-unit:min(.58px,.24cqw)}}

#result-dialog .ceremony .podium-place h3{white-space:normal;overflow-wrap:anywhere}
#result-dialog .ceremony .ceremony-stand{height:auto;min-height:94px!important}
#result-dialog .ceremony .place-2 .ceremony-stand{height:auto;min-height:114px!important}
#result-dialog .ceremony .place-1 .ceremony-stand{height:auto;min-height:134px!important}
@media(max-width:599px){#result-dialog .ceremony .ceremony-stand{min-height:66px!important}#result-dialog .ceremony .place-2 .ceremony-stand{min-height:78px!important}#result-dialog .ceremony .place-1 .ceremony-stand{min-height:90px!important}}
@media(min-width:520px) and (max-height:540px){#result-dialog .ceremony .ceremony-stand{min-height:62px!important}#result-dialog .ceremony .place-2 .ceremony-stand{min-height:74px!important}#result-dialog .ceremony .place-1 .ceremony-stand{min-height:86px!important}}

@media(min-width:520px) and (max-width:599px) and (max-height:540px){#result-dialog[open]>.result-stats b{font-size:20px!important}}

/* WD109: a narrow feedback pocket preserves the full line beside the speed. */
body.racing #toast>div{min-width:0;flex:1}
body.racing #toast>div span{white-space:normal;overflow-wrap:anywhere}