.riverside-dialogue { position:fixed; z-index:90; left:max(18vw,220px); right:42vw; bottom:5vh; color:white; }
.riverside-dialogue-advance { width:100%; border:0; outline:none; box-shadow:none; background:transparent; color:inherit; text-align:left; font:600 clamp(20px,1.8vw,30px)/1.65 "I.MingCP","PMingLiU",serif; cursor:pointer; }
.riverside-dialogue-advance:focus,.riverside-dialogue-advance:focus-visible { outline:none !important; box-shadow:none !important; }
.riverside-dialogue-advance:focus-visible small { text-decoration:underline; text-underline-offset:4px; }
.riverside-dialogue .story-dialogue-lines { min-height:0; max-height:80dvh; padding:16px; }
.riverside-dialogue small { display:block; font:400 13px/1.5 "Microsoft JhengHei",sans-serif; text-align:right; }
.riverside-dialogue .speaker-mengjie { color:#e4cfff; font-family:"Microsoft JhengHei",sans-serif; font-weight:400; }
.riverside-mengjie { position:fixed; z-index:85; right:1vw; bottom:-16vh; height:96vh; width:auto; max-width:none; pointer-events:none; transform:translateX(120%); transition:transform .84s cubic-bezier(.22,.78,.24,1); }
.riverside-mengjie.is-visible { transform:translateX(0); }
.has-riverside-dialogue .entrance-recenter,.has-riverside-dialogue .entrance-hint { visibility:hidden; }
.riverside-thought { position:fixed; z-index:84; top:44%; left:50%; transform:translate(-50%,-50%); width:min(88vw,760px); padding:36px; color:white; border:0; background:transparent; white-space:pre-line; font:600 clamp(20px,2.2vw,32px)/1.8 "I.MingCP","PMingLiU",serif; cursor:pointer; text-shadow:0 0 1px #ffffff9e,0 0 4px #ffffff47; }
.riverside-drawing { position:fixed; inset:0; width:100vw; max-width:none; height:100dvh; max-height:none; margin:0; padding:0; border:0; background:transparent; color:white; overflow:hidden; }
.riverside-drawing::backdrop { background:#0008; }
.riverside-drawing-viewport { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; overflow:hidden; touch-action:none; cursor:grab; outline:none !important; border:0; box-shadow:none; }
.riverside-drawing-viewport img { display:block; max-width:60vw; max-height:78dvh; width:auto; height:auto; object-fit:contain; user-select:none; transform-origin:center; }
.riverside-drawing,.riverside-drawing:focus,.riverside-drawing:focus-visible { outline:none !important; box-shadow:none; }
.riverside-drawing-close { position:absolute; z-index:8; right:20px; top:16px; border:0; background:transparent; color:white; font-size:32px; cursor:pointer; }
.riverside-drawing-thumb { position:fixed; z-index:80; left:calc(max(8px,env(safe-area-inset-left)) + clamp(126px,14.5vw,210px) + 12px); bottom:76px; width:92px; height:92px; padding:0; border:0; background:transparent; box-shadow:none; cursor:pointer; }
.riverside-drawing-thumb img { width:100%; height:100%; object-fit:contain; }
.riverside-drawing-error { position:absolute; inset:35% 10% auto; text-align:center; font-size:18px; }
.riverside-choices { position:absolute; z-index:5; inset:45% 3vw auto; display:flex; justify-content:space-between; gap:18px; pointer-events:none; }
.riverside-choice { pointer-events:auto; color:white; font:600 clamp(18px,1.8vw,26px)/1.6 "I.MingCP","PMingLiU",serif; cursor:pointer; }
.riverside-answer { position:absolute; z-index:6; left:50%; top:50%; transform:translate(-50%,-50%); width:max-content; max-width:90vw; color:white; font:600 clamp(18px,2vw,28px)/1.8 "I.MingCP","PMingLiU",serif; }
.riverside-answer .dialogue-frost__content { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:12px; }
.riverside-answer label { display:flex; align-items:center; gap:10px; white-space:nowrap; }
#basketballWallDialog .riverside-choices { top:auto; bottom:max(26px,env(safe-area-inset-bottom)); justify-content:center; gap:12vw; }
.riverside-choices[hidden],.riverside-answer[hidden],.riverside-drawing-thumb[hidden],.riverside-drawing-error[hidden] { display:none; }
@media(max-width:760px) {
 body.has-riverside-dialogue {
  --mengjie-mobile-image-height:66dvh;
  --mengjie-mobile-hidden-bottom:12dvh;
  /* Both approved portraits have their first opaque head pixels at ~1/6
     of the image height. Anchor to the visible head, not the empty canvas. */
  --mengjie-mobile-head-bottom:calc(var(--mengjie-mobile-image-height) * .8335 - var(--mengjie-mobile-hidden-bottom));
 }
 .riverside-dialogue { top:auto; bottom:calc(var(--mengjie-mobile-head-bottom) + 12px); left:max(8px,env(safe-area-inset-left)); right:max(8px,env(safe-area-inset-right)); }
 .riverside-dialogue-advance { font-size:20px; line-height:1.5; }
 .riverside-dialogue .story-dialogue-lines { max-height:calc(100dvh - var(--mengjie-mobile-head-bottom) - 64px - env(safe-area-inset-top)); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; justify-content:safe flex-end; }
 .riverside-dialogue .story-dialogue-lines::-webkit-scrollbar { display:none; }
 .riverside-mengjie { height:var(--mengjie-mobile-image-height,66dvh); right:-5vw; bottom:calc(-1 * var(--mengjie-mobile-hidden-bottom,12dvh)); }
 .riverside-drawing-viewport img { max-width:92vw; max-height:68dvh; }
 .riverside-choices { inset:auto 4vw 10dvh; }
 .riverside-drawing-thumb { bottom:96px; left:calc(max(4px,env(safe-area-inset-left)) + clamp(116px,31vw,145px) + 8px); width:72px; height:72px; }
 .riverside-thought { padding:12px; }
}
@media(prefers-reduced-motion:reduce) { .riverside-mengjie { transition:none; } }

.riverside-choice:focus-visible { outline:none !important; text-decoration:underline; text-underline-offset:4px; }