#saori-dialogue { box-sizing:border-box; position:fixed; z-index:15; top:0; left:0; visibility:hidden; width:min(320px,calc(100vw - 28px)); max-height:calc(100dvh - 16px); overflow-y:auto; padding:8px 14px; border:2px solid #c4a55f; border-radius:12px; background:#183a35fa; color:#fff9e5; box-shadow:0 8px 26px #0004; }
#saori-dialogue strong { display:block; margin-bottom:4px; color:#f2d68f; font-size:13px; letter-spacing:.15em; }
#saori-line { font-size:18px; line-height:1.3; }
#saori-question { color:#ff9797; font-size:17px; line-height:1.3; font-weight:800; margin-top:6px; }
#saori-dialogue .actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
#saori-dialogue button { min-height:44px; min-width:76px; color:#fff9e5; border-color:#c8d8c5; font-weight:700; }
#saori-yes { background:#f0d191; color:#163c36!important; }
#saori-dialogue [hidden],#saori-effects[hidden],#saori-guide[hidden] { display:none; }
#saori-guide { position:fixed; z-index:14; visibility:hidden; max-width:calc(100vw - 28px); padding:12px 18px; margin:0; background:#fff4d8f2; border:2px solid #dbb153; border-radius:12px; color:#183a35; font-size:17px; pointer-events:none; }
#saori-effects { position:fixed; z-index:13; visibility:hidden; pointer-events:none; width:0; height:0; color:#ffd65a; }
#saori-line.explanation { color:#ffe29c; font-weight:750; line-height:1.5; }
#saori-complete { position:fixed; z-index:16; pointer-events:none; padding:10px 18px; border:2px solid #ffe9a2; border-radius:8px; background:#4e350af5; color:#ffeb9a; font-size:22px; font-weight:900; white-space:nowrap; box-shadow:0 0 24px #ffd34b88; }
#saori-complete[hidden] { display:none; }
#saori-effects .coin { position:absolute; top:0; left:calc(var(--spread) * var(--x) / 100); width:var(--size); height:var(--size); font-size:calc(var(--size) * .65); line-height:var(--size); text-align:center; font-weight:900; color:#805000; border-radius:50%; border:2px solid #bd7f0d; background:radial-gradient(circle at 30% 25%,#fffac4,#ffcf3f 55%,#e99409); box-shadow:0 0 5px #ffce4b80; animation:saori-rain var(--duration) linear var(--delay) infinite; }
#saori-effects .money-symbol { position:absolute; left:calc(var(--spread) * var(--x) / 100); font-size:32px; font-weight:900; text-shadow:0 2px 4px #825700; animation:saori-money 1.2s ease-in-out infinite alternate; }
#saori-effects .spark { position:absolute; color:#fff0a1; font-size:17px; text-shadow:0 0 9px #ffc52b; animation:saori-spark .75s ease-in-out infinite alternate; }
@keyframes saori-rain { 0% { transform:translateY(-90px) rotateY(0deg) rotate(0deg); opacity:0; } 10% { opacity:1; } 90% { opacity:1; } 100% { transform:translateY(var(--fall)) rotateY(300deg) rotate(100deg); opacity:0; } }
@keyframes saori-money { from { transform:translate(-5px,0) scale(.9) rotate(-8deg); } to { transform:translate(5px,-10px) scale(1.1) rotate(8deg); } }
@keyframes saori-spark { from { opacity:.2;transform:scale(.5); } to { opacity:1;transform:scale(1.15); } }
@media(max-width:780px) { #saori-dialogue { width:min(250px,calc(100vw - 16px)); } #saori-guide { max-width:250px; font-size:15px; } #saori-complete {font-size:18px;} }
@media(prefers-reduced-motion:reduce) { #saori-effects * { animation-duration:3s!important; } }