html,body{height:100%;margin:0;background-color:#212529;overflow:hidden;overflow-y:auto;user-select:none;-webkit-user-drag:none}body::-webkit-scrollbar{display:none}body{-ms-overflow-style:none;scrollbar-width:none}.game-container{display:flex;flex-direction:column;height:100%;width:100%;max-width:1280px;margin:0 auto;position:relative}.yut-top-section{flex-shrink:0;width:100%;max-width:480px;margin:0 auto;padding:12px 16px 6px;box-sizing:border-box}.yut-score-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.35rem .5rem;min-height:clamp(3.5rem,12vw,4.25rem)}.yut-sum-slot{display:flex;align-items:center;justify-content:center;min-width:min(42vw,9rem);min-height:clamp(3rem,10vw,3.75rem)}#resultSum{display:none;margin:0;padding:0 .15em;color:#f8f9fa;font-weight:700;font-size:clamp(2.35rem,9vw,3.35rem);line-height:1;letter-spacing:-0.02em;text-shadow:0 2px 14px rgba(0,0,0,.45);white-space:nowrap}#resultSumBreakdown{height:1.35em;margin:.4rem auto 0;padding:0 8px;max-width:100%;box-sizing:border-box;text-align:center;color:rgba(255,255,255,.62);font-size:clamp(.78rem,2.4vw,.92rem);font-weight:500;line-height:1.35;letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}.yut-container-wrapper{flex-grow:1;display:flex;justify-content:center;align-items:center;width:100%;position:relative;min-height:0;overflow:hidden}#yutContainer{width:90%;max-width:1280px;height:100%;cursor:pointer;outline:none}#yutContainer canvas{display:block}#yut-hint{position:absolute;top:10%;left:0;right:0;padding:0 16px;text-align:center;color:rgba(255,255,255,.72);font-size:clamp(13px,3.4vw,16px);line-height:1.3;pointer-events:none;visibility:hidden}.game-container.show-hint #yut-hint{visibility:visible;animation:yut-hint-breathe 2.4s ease-in-out infinite}@keyframes yut-hint-breathe{0%,100%{opacity:.55}50%{opacity:1}}.yut-backdo{justify-self:end;position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:56px;min-height:44px;padding:0 10px;color:#f1f3f5;background:none;border:none;border-radius:10px;font:inherit;font-size:15px;font-weight:700;line-height:1;cursor:pointer;opacity:1;transition:opacity .22s ease,transform .12s ease}.yut-backdo::after{content:"";position:absolute;left:8px;right:8px;top:50%;height:2px;margin-top:-1px;background:currentColor;border-radius:1px;transform:scaleX(0);transform-origin:right center;transition:transform .24s ease}.yut-backdo[aria-pressed=false]{opacity:.5}.yut-backdo[aria-pressed=false]::after{transform:scaleX(1);transform-origin:left center}.yut-backdo:active{transform:scale(0.96)}.yut-backdo:focus{outline:none}.yut-backdo:focus-visible{outline:2px solid #5aa9ff;outline-offset:2px}.yut-score-pad{min-width:56px}#resultSum.is-pop{animation:yut-pop .5s cubic-bezier(0.2, 1.8, 0.4, 1)}#resultSum.is-big{color:#ffd34d}#resultSum.is-big.is-pop{animation:yut-pop-big .7s cubic-bezier(0.2, 1.8, 0.4, 1)}#resultSum.is-back{color:#ff8a80}@keyframes yut-pop{0%{transform:scale(0.3);opacity:.3}60%{transform:scale(1.18);opacity:1}100%{transform:scale(1)}}@keyframes yut-pop-big{0%{transform:scale(0.2) rotate(-8deg);opacity:.3}55%{transform:scale(1.45) rotate(3deg);opacity:1}100%{transform:scale(1) rotate(0)}}.yut-pop{position:absolute;left:0;top:0;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;border:4px solid #ff2a1a;box-shadow:0 0 18px rgba(255,42,26,.6),inset 0 0 12px rgba(255,42,26,.5);pointer-events:none;opacity:0;transform:scale(0.2)}.yut-pop.is-on{animation:yut-pop-ring .42s ease-out forwards}.yut-pop.is-on::after{content:"";position:absolute;inset:30%;border-radius:50%;background:#ff2a1a;animation:yut-pop-dot .22s ease-out forwards}@keyframes yut-pop-ring{0%{opacity:1;transform:scale(0.2)}100%{opacity:0;transform:scale(1.35)}}@keyframes yut-pop-dot{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(0.2)}}#yutContainer canvas.yut-shake-1{animation:yut-shake .28s ease-out;--amp: 4px}#yutContainer canvas.yut-shake-2{animation:yut-shake .4s ease-out;--amp: 8px}#yutContainer canvas.yut-shake-3{animation:yut-shake .55s ease-out;--amp: 13px}@keyframes yut-shake{0%,100%{transform:translate(0, 0)}15%{transform:translate(calc(var(--amp) * -1), calc(var(--amp) * 0.4))}35%{transform:translate(var(--amp), calc(var(--amp) * -0.5))}55%{transform:translate(calc(var(--amp) * -0.6), calc(var(--amp) * 0.3))}75%{transform:translate(calc(var(--amp) * 0.3), 0)}}.yut-confetti{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:1001;display:none}@media(prefers-reduced-motion: reduce){#resultSum.is-pop,#resultSum.is-big.is-pop,#yutContainer canvas{animation:none !important}.game-container.show-hint #yut-hint{animation:none}}.yut-burst{--bz: min(165vw, 120vh);position:fixed;left:50%;top:50%;width:var(--bz);height:var(--bz);margin:calc(var(--bz)/-2) 0 0 calc(var(--bz)/-2);pointer-events:none;mix-blend-mode:screen;z-index:1000;visibility:hidden}@media(min-width: 900px),(min-aspect-ratio: 4/3)and (min-width: 600px){.yut-burst{--bz: 112vmin}}.yut-burst img{position:absolute;inset:0;width:100%;height:100%;opacity:0;will-change:transform,opacity;-webkit-mask-image:radial-gradient(closest-side, #000 62%, transparent 100%);mask-image:radial-gradient(closest-side, #000 62%, transparent 100%)}.yut-burst.is-on{visibility:visible}.yut-burst.is-on .yut-burst-main{animation:yut-burst .82s cubic-bezier(0.15, 0.9, 0.3, 1) both}.yut-burst.is-on .yut-burst-ghost{animation:yut-burst-ghost .82s ease-out both}.yut-burst.is-do{--bs: .78}.yut-burst.is-gae{--bs: .88}.yut-burst.is-geol{--bs: .95}.yut-burst.is-yut{--bs: 1.05}.yut-burst.is-mo{--bs: 1.12}@media(min-width: 900px),(min-aspect-ratio: 4/3)and (min-width: 600px){.yut-burst.is-mo{--bs: 1.3}.yut-burst.is-yut{--bs: 1.12}}.yut-burst.is-do.is-on img{animation-duration:.64s}.yut-burst.is-mo.is-on img{animation-duration:1s}.yut-burst.is-backdo{--bs: .9}.yut-burst.is-backdo.is-on .yut-burst-main{animation-name:yut-burst-back}.yut-burst.is-backdo.is-on .yut-burst-ghost{animation-name:yut-burst-ghost-back}@keyframes yut-burst{0%{opacity:0;transform:scale(calc(var(--bs, 1) * 0.35)) rotate(-14deg)}16%{opacity:1;transform:scale(calc(var(--bs, 1) * 1.08)) rotate(2deg)}32%{opacity:1;transform:scale(var(--bs, 1)) rotate(0)}68%{opacity:.85;transform:scale(calc(var(--bs, 1) * 1.04)) rotate(1deg)}100%{opacity:0;transform:scale(calc(var(--bs, 1) * 1.22)) rotate(4deg)}}@keyframes yut-burst-ghost{0%,10%{opacity:0;transform:scale(calc(var(--bs, 1) * 0.6)) rotate(-20deg)}24%{opacity:.42;transform:scale(calc(var(--bs, 1) * 1.2)) rotate(-6deg)}100%{opacity:0;transform:scale(calc(var(--bs, 1) * 1.7)) rotate(10deg)}}@keyframes yut-burst-back{0%{opacity:0;transform:scale(calc(var(--bs, 1) * 1.3)) rotate(40deg)}18%{opacity:1;transform:scale(var(--bs, 1)) rotate(-4deg)}70%{opacity:.85;transform:scale(calc(var(--bs, 1) * 0.92)) rotate(-18deg)}100%{opacity:0;transform:scale(calc(var(--bs, 1) * 0.55)) rotate(-60deg)}}@keyframes yut-burst-ghost-back{0%,10%{opacity:0;transform:scale(calc(var(--bs, 1) * 1.6)) rotate(60deg)}26%{opacity:.4;transform:scale(calc(var(--bs, 1) * 1.15)) rotate(20deg)}100%{opacity:0;transform:scale(calc(var(--bs, 1) * 0.7)) rotate(-30deg)}}@media(prefers-reduced-motion: reduce){.yut-burst.is-on .yut-burst-main{animation:yut-burst-fade .5s ease both !important}.yut-burst.is-on .yut-burst-ghost{animation:none !important;opacity:0}}@keyframes yut-burst-fade{0%{opacity:0;transform:scale(var(--bs, 1))}30%{opacity:.85;transform:scale(var(--bs, 1))}100%{opacity:0;transform:scale(var(--bs, 1))}}
