@import "https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500&display=swap";*{box-sizing:border-box;margin:0;padding:0}body{color:#f0f0f0;background:#0a0a0a;min-height:100vh;font-family:Noto Sans SC,sans-serif;overflow:hidden}.app{width:100vw;height:100vh;position:relative}.title-screen{background:radial-gradient(#1a1a2e 0%,#0a0a0a 70%);justify-content:center;align-items:center;width:100%;height:100%;display:flex}.title-card{text-align:center;background:#ffffff08;border:1px solid #ffffff14;border-radius:4px;max-width:480px;padding:3rem 4rem}.ghost-title{letter-spacing:.3em;color:#fff;font-size:3rem;font-weight:300}.ghost-subtitle{letter-spacing:.5em;color:#ffffff59;margin-top:.5rem;font-size:.75rem}.title-divider{background:#ffffff26;width:60px;height:1px;margin:1.5rem auto}.author{color:#fff6;letter-spacing:.2em;font-size:.8rem}.desc{color:#ffffff80;margin-top:1rem;font-size:.85rem;line-height:1.8}.btn-start{color:#fffc;letter-spacing:.3em;cursor:pointer;background:0 0;border:1px solid #fff3;margin-top:2rem;padding:.8rem 3rem;font-size:.9rem;transition:all .3s}.btn-start:hover{color:#fff;background:#ffffff0f;border-color:#fff6}.player-root{cursor:pointer;background:radial-gradient(at bottom,#112 0%,#0a0a0a 60%);width:100%;height:100%;position:relative;overflow:hidden}.stage{align-items:flex-end;width:0;height:480px;display:flex;position:absolute;bottom:120px;left:50%;transform:translate(-50%)}.character-kero{z-index:10;position:absolute;bottom:0;left:50%;transform:translate(calc(-50% - 60px))}.character-sakura{z-index:10;position:absolute;bottom:0;left:50%;transform:translate(calc(80px - 50%))}.character{align-items:flex-end;height:480px;display:flex;position:relative}.character-layer{pointer-events:none;width:auto;height:480px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.layer-0{z-index:10}.layer-1{z-index:20}.layer-2{z-index:30}.layer-3{z-index:40}.layer-4{z-index:50}.layer-5{z-index:60}.balloon-area{z-index:30;pointer-events:none;flex-direction:column;align-items:center;gap:10px;padding:0 8%;display:flex;position:absolute;bottom:130px;left:0;right:0}.balloon{letter-spacing:.05em;word-break:break-word;white-space:pre-wrap;border-radius:4px;width:100%;max-width:520px;padding:14px 20px;font-size:.95rem;line-height:1.8}.balloon-sakura{color:#1a1a2e;text-align:left;background:#fffffff2;border-left:3px solid #b0a0ff;margin-left:auto;margin-right:0}.balloon-kero{color:#1a1a2e;text-align:left;background:#e6f0fff2;border-left:3px solid #a0c0ff;margin-left:0;margin-right:auto}.cursor{color:#666;animation:.8s step-end infinite blink;display:inline-block}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.btn-random{z-index:40;color:#c8beffe6;letter-spacing:.2em;cursor:pointer;background:#b0a0ff26;border:1px solid #b0a0ff66;border-radius:4px;padding:8px 20px;font-family:Noto Sans SC,sans-serif;font-size:.8rem;transition:all .2s;position:absolute;top:20px;right:20px}.btn-random:hover:not(:disabled){color:#fff;background:#b0a0ff40;border-color:#b0a0ffb3}.btn-random:disabled{opacity:.5;cursor:not-allowed}.done-hint-wrap{z-index:30;pointer-events:none;text-align:center;position:absolute;bottom:56px;left:50%;transform:translate(-50%)}.done-hint{color:#ffffff47;letter-spacing:.2em;white-space:nowrap;font-size:.72rem}.waiting-dot{color:#b0a0ff;animation:.8s ease-in-out infinite waitPulse;display:inline-block}@keyframes waitPulse{0%,to{opacity:1}50%{opacity:.3}}.controls{z-index:30;align-items:center;gap:16px;display:flex;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.btn-next{color:#ffffffb3;letter-spacing:.2em;cursor:pointer;background:#ffffff14;border:1px solid #ffffff26;padding:8px 24px;font-size:.8rem;transition:all .2s}.btn-next:hover{color:#fff;background:#ffffff1f}.hint{color:#fff3;letter-spacing:.1em;font-size:.7rem}.balloon-animate{animation:.3s ease-out balloonIn}@keyframes balloonIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media screen and (width<=600px){.btn-random{padding:6px 14px;font-size:.72rem;top:12px;right:12px}.character-layer{max-height:100%;width:auto!important;height:100%!important}.stage,.character,.character-layer{height:42vh!important}.character-layer{width:auto!important}.stage{bottom:18vh}.balloon-area{gap:8px;padding:0 4vw;bottom:2vh}.balloon{padding:10px 14px;font-size:.88rem}.controls{flex-direction:column;gap:8px;bottom:14vw}.btn-next{padding:7px 20px;font-size:.75rem}.hint{font-size:.65rem}}@media screen and (width<=380px){.stage,.character,.character-layer{height:38vh!important}}