.dialogue-overlay{position:absolute;inset:0;z-index:10000;display:flex;align-items:flex-end;justify-content:center;background:linear-gradient(transparent 10%,#080b19bb);font-family:var(--dialogue-font);animation:dialogue-in .32s ease-out;color:#f4f4ff;isolation:isolate}.dialogue-portrait{position:absolute;bottom:19%;left:9%;height:65%;max-width:70%;object-fit:contain;object-position:bottom;filter:drop-shadow(0 12px 25px #0007);z-index:-1}.dialogue-box{width:min(840px,90%);margin:0 0 4%;padding:22px 26px;border:1px solid #a799d47a;border-radius:20px;background:#161a30ed;background-size:100% 100%;box-shadow:0 18px 60px #0006;position:relative}.dialogue-name{position:absolute;left:24px;top:-33px;padding:7px 18px;background:#7970d9;border-radius:10px 10px 0 0;color:#fff;font-size:15px;letter-spacing:.04em}.dialogue-text{min-height:90px;font-size:clamp(16px,2.1vw,25px);line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;max-height:28vh;overflow:auto}.dialogue-text span{display:inline-block;white-space:pre}.dialogue-box footer{display:flex;align-items:center;gap:10px;margin-top:18px;flex-wrap:wrap;font:12px system-ui;color:#b7bad8}.dialogue-count{margin-right:auto}.dialogue-box button{padding:8px 12px;border-radius:8px;border:1px solid #9186d066;background:#303454;color:white;cursor:pointer}.dialogue-box button:focus-visible{outline:2px solid #8af5e2}.dialogue-overlay[data-box=solid] .dialogue-box{background-color:#171820;border:2px solid #fff}.dialogue-overlay[data-box=retro] .dialogue-box{background-color:#090a13;border:4px double white;border-radius:0}.dialogue-text[data-effect=wave] span{animation:dialogue-wave 1.5s ease-in-out infinite;animation-delay:calc(var(--i)*-45ms)}.dialogue-text[data-effect=shake] span{animation:dialogue-shake .3s steps(2) infinite;animation-delay:calc(var(--i)*-30ms)}.dialogue-text[data-effect=glow] span{text-shadow:0 0 12px #9d8cff;color:#c1b9ff}.dialogue-out{animation:none;transition:opacity var(--dialogue-fade) ease-in-out;opacity:0;pointer-events:none}.dialogue-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@keyframes dialogue-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes dialogue-wave{50%{transform:translateY(-3px)}}@keyframes dialogue-shake{50%{transform:translate(1px,-1px)}}@media(prefers-reduced-motion:reduce){.dialogue-overlay,.dialogue-text span{animation:none!important}.dialogue-out{transition:opacity var(--dialogue-fade)}}
