#app{z-index:1;position:relative}.scenery{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.skyline{opacity:.55;width:100%;height:26vh;min-height:140px;position:absolute;bottom:0;left:0}.cloud{opacity:.75;width:150px;animation:linear infinite drift;position:absolute}.cloud.c1{animation-duration:95s;animation-delay:-20s;top:8vh}.cloud.c2{opacity:.55;width:110px;animation-duration:130s;animation-delay:-80s;top:22vh}.cloud.c3{opacity:.4;width:90px;animation-duration:160s;animation-delay:-40s;top:40vh}@keyframes drift{0%{transform:translate(-200px)}to{transform:translate(calc(100vw + 200px))}}.flake{opacity:.7;background:#fff;border-radius:50%;animation:linear infinite snow;position:absolute;top:-12px}@keyframes snow{0%{transform:translateY(-10px)}50%{transform:translate(18px,50vh)}to{transform:translate(-6px,102vh)}}.screen-in{animation:.28s ease-out screen-in}@keyframes screen-in{0%{opacity:0;transform:translateY(12px)}}.fx-layer{pointer-events:none;z-index:50;position:fixed;inset:0;overflow:hidden}.spark{text-shadow:0 0 2px #fff;font-size:18px;font-style:normal;font-weight:700;animation:.7s ease-out forwards spark;position:absolute;translate:-50% -50%}@keyframes spark{to{transform:translate(var(--dx), var(--dy)) scale(.3) rotate(160deg);opacity:0}}.confetti{border:2px solid var(--ink);border-radius:3px;width:10px;height:16px;animation:ease-in forwards confetti-fall;position:absolute;top:-20px}@keyframes confetti-fall{to{transform:translate(var(--drift), 108vh) rotate(var(--spin))}}.toasts{z-index:60;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;top:14px;left:50%;translate:-50%}.toast{background:var(--paper);border:3px solid var(--ink);min-width:260px;box-shadow:0 5px 0 var(--ink);border-radius:16px;align-items:center;gap:12px;padding:10px 18px 10px 12px;animation:.35s cubic-bezier(.2,1.6,.4,1) toast-in;display:flex}.toast.out{animation:.4s forwards toast-out}.toast-icon{font-size:2rem}.toast b{display:block}.toast small{color:var(--muted);font-weight:500}@keyframes toast-in{0%{opacity:0;transform:translateY(-40px)scale(.8)}}@keyframes toast-out{to{opacity:0;transform:translateY(-30px)}}.mascot{display:block;overflow:visible}.mascot .m-body{transform-origin:60px 138px;animation:2.6s ease-in-out infinite bob}.mascot .m-eyes{transform-box:fill-box;transform-origin:50%;animation:4.5s infinite blink}.mascot.mood-cheer .m-body{animation:.6s ease-in-out infinite alternate hop}.mascot.mood-cheer .m-arms{transform-origin:60px 96px;animation:.6s ease-in-out infinite alternate wave}.mascot.mood-sad .m-body{animation:3s ease-in-out infinite sway}@keyframes bob{50%{transform:translateY(-3px)scaleY(1.02)}}@keyframes hop{to{transform:translateY(-8px)}}@keyframes wave{to{transform:rotate(4deg)}}@keyframes sway{50%{transform:rotate(-3deg)}}@keyframes blink{0%,92%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}.buddy{justify-content:center;align-items:center;gap:6px;max-width:640px;margin:4px auto 0;display:flex}.buddy-bear{box-shadow:none;background:0 0;border:0;padding:0}.buddy-bear:hover:not(:disabled){box-shadow:none;transform:rotate(-4deg)scale(1.05)}.buddy-bear:active:not(:disabled){box-shadow:none;transform:scale(.95)}.say-bubble{text-align:left;border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);background:#fff;border-radius:18px;padding:10px 16px;font-weight:600;animation:.3s pop;position:relative}.say-bubble:before{content:"";border:9px solid #0000;border-right-color:var(--ink);position:absolute;top:50%;left:-12px;translate:0 -50%}.say-bubble .ru{color:var(--sky1);font-size:1.25rem}.say-bubble small{color:var(--muted);font-weight:500;display:block}@keyframes pop{0%{opacity:0;transform:scale(.6)}}.end-buddy{justify-content:center;align-items:center;gap:12px;margin:-6px 0 6px;display:flex}.end-bars{gap:8px;max-width:460px;margin:14px auto 0;display:grid}.meter{text-align:left;grid-template-columns:110px 1fr 100px;align-items:center;gap:10px;font-size:.9rem;font-weight:600;display:grid}.meter span:last-child{text-align:right;color:var(--muted)}.meter-bar{border:2px solid var(--ink);background:#ebe7fa;border-radius:99px;height:14px;overflow:hidden}.meter-bar i{background:var(--good);border-radius:99px;height:100%;animation:.9s ease-out fill;display:block}.meter-bar.xp i{background:var(--accent)}@keyframes fill{0%{width:0}}.menu .modes .mode{animation:.4s backwards card-in;animation-delay:calc(var(--i,0) * 45ms)}@keyframes card-in{0%{opacity:0;transform:translateY(16px)scale(.92)}}.mode:hover:not(:disabled) .mode-icon{animation:.5s wiggle}@keyframes wiggle{25%{rotate:-12deg;scale:1.15}75%{rotate:10deg;scale:1.15}}.menu h1{animation:4s ease-in-out infinite title-float;display:inline-block}@keyframes title-float{50%{transform:translateY(-4px)rotate(-1deg)}}.cell{transition:transform .1s}.topbar{flex-wrap:wrap;justify-content:center;gap:10px;margin:12px 0 4px;display:flex}.chip{background:var(--paper);border:3px solid var(--ink);box-shadow:0 3px 0 var(--ink);border-radius:99px;align-items:center;gap:8px;padding:6px 14px;font-size:.95rem;font-weight:700;display:inline-flex}button.chip{padding:6px 14px}.chip small{color:var(--muted);font-weight:600}.chip .meter-bar{width:80px;height:10px}.chip.hot{background:#ffe1c4}.calm *,.calm :before,.calm :after{transition:none!important;animation:none!important}.calm .flake{display:none}.menu .buddy{margin-top:6px}.tip-line{color:var(--ink);margin-top:4px;font-size:.88rem;font-weight:600;display:block}.no-scenery .scenery{display:none}.modal{z-index:40;background:#1d164073;place-items:center;padding:16px;animation:.2s fade;display:grid;position:fixed;inset:0}@keyframes fade{0%{opacity:0}}.modal-panel{text-align:left;width:min(560px,100%);max-height:90vh;animation:.25s pop;position:relative;overflow:auto}.modal-panel h2{margin-top:0}.modal-panel h3{margin:18px 0 4px}.modal-x{padding:4px 10px;position:absolute;top:12px;right:12px}.set-row{border-bottom:2px dashed #e3def5;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;font-weight:600;display:flex}.seg{flex-wrap:wrap;gap:6px;display:inline-flex}.seg button{box-shadow:0 2px 0 var(--ink);padding:4px 12px;font-size:.9rem}.seg button.on{background:var(--accent)}button.danger{background:#ffd6d4}.rain .field{background-color:#0000;background-image:radial-gradient(70px 34px at 6% 0,#fff 96%,#0000 100%),radial-gradient(90px 40px at 22% 0,#fff 96%,#0000 100%),radial-gradient(80px 36px at 40% 0,#fff 96%,#0000 100%),radial-gradient(100px 42px at 60% 0,#fff 96%,#0000 100%),radial-gradient(80px 36px at 78% 0,#fff 96%,#0000 100%),radial-gradient(90px 40px at 95% 0,#fff 96%,#0000 100%);background-position:0 0,0 0,0 0,0 0,0 0,0 0;background-repeat:no-repeat;background-size:auto,auto,auto,auto,auto,auto;background-attachment:scroll,scroll,scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box,border-box,border-box}.rain .drop.landed:after{content:"💦";font-size:1.4rem;position:absolute;bottom:-14px;left:50%;translate:-50%}.rain .hud .combo:not(:empty){animation:.6s ease-in-out infinite alternate combo-pulse}@keyframes combo-pulse{to{transform:scale(1.12)}}.mode.locked:disabled{opacity:1;color:var(--muted)}.mode.locked .mode-icon{filter:grayscale(.7);opacity:.6}
