/* Two explicit contexts: the play bay, then a permanently reserved POD display.
   All bay effects stay inside the bay; no animation covers the controls/dialogue. */
:root{
 --layer-field:0;--layer-frame:10;--layer-mechanism:20;--layer-ui:30;
 --layer-transport:40;--layer-chance:50;--layer-comment:60;
 --layer-draw:70;--layer-reward:80;--layer-jackpot:90;--layer-loading:100;
 --pod-display-height:4.75rem;
}
.cabinet{isolation:isolate}
.machine-stage{z-index:0;isolation:isolate}
#scene{z-index:var(--layer-field)}
.rig-chassis,.mechanical-rails,.rail-hardware{z-index:var(--layer-frame)}
.orbit-rack,#chance-zone,body[data-chance] #chance-zone,.field-header,.wall-lift{z-index:var(--layer-mechanism)}
.orbit-unit,.orbit-unit.active,.orbit-unit[data-stage="3"]{z-index:auto}
#companion,.slot-screen,.slot-reach .slot-screen,.win-meter,.embedded-items,.reward-port,.led-spine,.glass-sheen,.cabinet-charm{z-index:var(--layer-ui)}
.transport-mechanism{z-index:var(--layer-transport)}
#collect-fx,.impact-light{z-index:var(--layer-chance);pointer-events:none}
#kurun{z-index:var(--layer-draw)}
#reward-overlay{z-index:var(--layer-reward)}
#cinematic{z-index:var(--layer-jackpot)}
#loading{z-index:var(--layer-loading)}
/* The dialogue is a sibling of the clipped bay, not a child of Yona's portrait. */
#yona-dialogue{
 position:relative;z-index:var(--layer-comment);isolation:isolate;
 flex:0 0 var(--pod-display-height);height:var(--pod-display-height);min-height:var(--pod-display-height);
 display:grid;grid-template-columns:3rem minmax(0,1fr);align-items:center;gap:.6rem;
 margin:0 12px;padding:6px 10px;border:2px ridge #87728f;border-radius:9px;
 background:linear-gradient(110deg,#251a31,#100c18 70%);color:var(--quote-color,#eee2f8);
 overflow:hidden;overflow-anchor:none;--quote-color:#eee2f8;
}
.pod-display-label{font-size:12px;font-weight:800;letter-spacing:.05em;line-height:1.35;color:#bba3d0}
#yona-dialogue #yona-quote{
 position:static;inset:auto;display:block;width:auto;max-width:none;height:100%;min-width:0;
 margin:0;padding:0;border:0;border-radius:0;background:none;
 font-size:14px;font-weight:600;line-height:1.45;letter-spacing:normal;text-align:left;
 color:var(--quote-color);text-shadow:none;white-space:normal;overflow-wrap:anywhere;word-break:normal;
 text-overflow:clip;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;
 opacity:1;visibility:visible;z-index:auto;transition:none;animation:none;
}
#yona-quote:focus-visible{outline:2px solid #bce8ff;outline-offset:-2px}
body[data-yona-cue="0"] #yona-dialogue{--quote-color:#c7becf}
body[data-yona-cue="1"] #yona-dialogue{--quote-color:#a6e6f1}
body[data-yona-cue="2"] #yona-dialogue{--quote-color:#d9afff}
body[data-yona-cue="3"] #yona-dialogue{--quote-color:#ffb9df}
body[data-yona-cue="4"] #yona-dialogue{--quote-color:#ffe5aa;border-color:#d8bc83}
body[data-yona-rare="1"] #yona-dialogue{background:linear-gradient(110deg,#3b2746,#292030)}
/* One presentation owner prevents a stale win flash from covering a draw/reward. */
body[data-presentation="draw"] #collect-fx,
body[data-presentation="reward"] #collect-fx,
body[data-presentation="jackpot"] #collect-fx,
body[data-presentation="draw"] #reward-overlay,
body[data-presentation="jackpot"] #reward-overlay,
body[data-presentation="jackpot"] #kurun{visibility:hidden;pointer-events:none}
@media(max-width:650px){#yona-dialogue{margin:0 8px;padding:6px 8px;gap:.4rem;grid-template-columns:2.7rem minmax(0,1fr)}}
