.dd{--ink:#16314f;--teal:#0a7066;--mint:#6ff5df;color:#fff;height:100svh;font-family:var(--mg-font,system-ui), system-ui, -apple-system, "Segoe UI", sans-serif;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;background:#9fd6fb;position:relative;overflow:clip}.dd,.dd *,.dd :before,.dd :after{box-sizing:border-box}.dd-stage{touch-action:none;cursor:crosshair;position:absolute;inset:0}.dd[data-phase=poster] .dd-stage{cursor:default}.dd-sky{display:block;position:absolute;inset:0}.dd-may{left:calc(50% - var(--may) / 2);bottom:calc(env(safe-area-inset-bottom,0px) + max(4vh, 22px) + 64px);width:var(--may);height:var(--may);transform-origin:0 100%;pointer-events:none;transition:left .7s cubic-bezier(.3,1.2,.5,1),bottom .7s cubic-bezier(.3,1.2,.5,1),transform .7s cubic-bezier(.3,1.2,.5,1);position:absolute}.dd[data-phase=play] .dd-may,.dd[data-phase=dying] .dd-may,.dd[data-phase=over] .dd-may{left:max(0px, env(safe-area-inset-left,0px));bottom:env(safe-area-inset-bottom,0px);transform:scale(.62)}.dd-fx{pointer-events:none;position:absolute;inset:0;overflow:hidden}.dd-pop{letter-spacing:-.02em;white-space:nowrap;color:#fff;text-shadow:0 2px 0 var(--ink), 0 4px 14px #16314f80;font-size:30px;font-weight:800;animation:.9s ease-out forwards dd-rise;position:absolute;transform:translate(-50%,-50%)}.dd-pop[data-kind=near]{color:#ffd84d;text-shadow:0 4px #c2410c,0 8px 26px #781e0073;font-size:clamp(44px,12vw,76px);animation:1.3s cubic-bezier(.2,1.4,.4,1) forwards dd-near}.dd-hud{top:max(12px, env(safe-area-inset-top,0px));pointer-events:none;justify-content:center;display:flex;position:absolute;left:0;right:0}.dd-score{color:var(--ink);text-shadow:0 0 22px #ffffffe6,0 1px #ffffffb3;align-items:baseline;gap:8px;margin:0;padding:0 24px;display:flex}.dd-score b{letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-size:clamp(50px,13vw,74px);font-weight:800;line-height:1;animation:.35s ease-out dd-bump;display:inline-block}.dd-score span{font-size:19px;font-weight:700}.dd-mute{pointer-events:auto;top:0;right:max(12px, env(safe-area-inset-right,0px));width:46px;height:46px;color:var(--ink);cursor:pointer;background:#fffc;border:0;border-radius:50%;place-items:center;display:grid;position:absolute}.dd[data-phase=over] .dd-mute{visibility:hidden}.dd-hint{left:50%;top:calc(max(12px, env(safe-area-inset-top,0px)) + 88px);text-align:center;text-wrap:balance;width:max-content;max-width:calc(100% - 32px);color:var(--ink);text-shadow:0 0 16px #fffffff2;pointer-events:none;margin:0;font-size:17px;font-weight:700;animation:2.2s ease-in-out infinite dd-breathe;position:absolute;transform:translate(-50%)}.dd-poster{text-align:center;pointer-events:none;flex-direction:column;justify-content:space-between;align-items:center;padding:max(9vh,56px) 16px max(4vh,22px);animation:.6s ease-out dd-in;display:flex;position:absolute;inset:0}.dd-poster:before{content:"";z-index:-1;background:linear-gradient(#16314f57,#16314f00);height:42%;position:absolute;inset:0 0 auto}.dd-poster>*{pointer-events:auto}.dd-head{pointer-events:none;flex-direction:column;align-items:center;display:flex}.dd-poster h1{letter-spacing:-.04em;text-shadow:0 .06em 0 var(--ink), 0 .14em .5em #16314f8c;flex-wrap:wrap;justify-content:center;gap:0 .22em;margin:0;font-size:clamp(42px,13vw,84px);font-weight:800;line-height:1;display:flex}.dd-poster h1 span{animation:3.2s ease-in-out infinite dd-glide;display:inline-block}.dd-poster h1 span[data-i="1"]{animation-delay:-.6s}.dd-poster h1 span[data-last=true]{color:#ffd84d;animation-delay:-1.2s}.dd-trail{opacity:.85;filter:drop-shadow(0 2px 3px #16314f73);width:min(300px,70vw);height:auto;margin-top:6px}.dd-trail path{animation:1.1s linear infinite dd-march}.dd-head>p{text-wrap:balance;text-shadow:0 1px 2px #16314fe6,0 1px 12px #16314fe6;max-width:30ch;margin:10px 0 0;font-size:clamp(15px,2.1vh,19px);font-weight:700;line-height:1.4}.dd-go{flex-direction:column;align-items:center;gap:10px;display:flex}.dd-btn{background:var(--teal);color:#fff;min-height:54px;font:inherit;white-space:nowrap;cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;padding:0 30px;font-size:17px;font-weight:700;text-decoration:none;transition:transform .15s;display:inline-flex;box-shadow:0 12px 26px -12px #053c37e6}.dd-btn:hover{transform:translateY(-1px)}.dd-btn:active{transform:scale(.97)}.dd-play{background:var(--mint);color:#06302c;gap:10px;min-width:220px;min-height:72px;padding:0 44px 0 36px;font-size:28px;font-weight:800;animation:1.8s ease-in-out infinite dd-nudge;position:relative;box-shadow:0 6px #0a7066,0 18px 34px -10px #05283ccc}.dd-play:active{transform:translateY(4px);box-shadow:0 2px #0a7066,0 10px 20px -10px #05283ccc}.dd-play:after{content:"";border-radius:inherit;border:3px solid var(--mint);pointer-events:none;animation:1.8s ease-out infinite dd-ring;position:absolute;inset:0}.dd-btn:focus-visible,.dd-mute:focus-visible,.dd-link:focus-visible{outline-offset:3px;outline:3px solid #fff}.dd-ghost{box-shadow:none;background:#ffffff29}.dd-posterbest{text-shadow:0 1px 12px #16314fcc;margin:0;font-size:15px;font-weight:700}.dd-over{background:linear-gradient(#0e1e3c00 30%,#0e1e3ca8 55%,#0e1e3ceb);flex-direction:column;align-items:center;animation:.45s ease-out dd-in;display:flex;position:absolute;inset:0;overflow-y:auto}.dd-result{text-shadow:0 2px 14px #0e1e3c99;width:min(100%,440px);padding:16px 20px max(26px, env(safe-area-inset-bottom,0px));text-align:center;margin-top:auto}.dd-result h2{color:var(--mint);margin:0;font-size:22px;font-weight:800}.dd-big{letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin:2px 0 0;font-size:clamp(80px,24vw,112px);font-weight:800;line-height:1}.dd-landed{margin:0;font-size:17px;font-weight:700}.dd-bestline{color:#ffffffc7;margin:6px 0 18px;font-size:15px;font-weight:600}.dd-row{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.dd-card{-webkit-user-select:auto;user-select:auto;-webkit-touch-callout:default;border-radius:18px;width:min(48%,190px);height:auto;margin:16px auto 0;display:block}.dd-note{color:#ffffffd9;margin:10px 0 0;font-size:14px;font-weight:600}.dd-cta{color:#ffffffd1;text-wrap:balance;margin:22px 0 0;font-size:15px;font-weight:600}.dd-link{color:var(--mint);text-underline-offset:3px;font-weight:800;text-decoration:underline}@keyframes dd-in{0%{opacity:0}}@keyframes dd-rise{0%{opacity:1;transform:translate(-50%,-50%)}to{opacity:0;transform:translate(-50%,-150%)}}@keyframes dd-near{0%{opacity:0;transform:translate(-50%,-50%)scale(.3)rotate(-8deg)}18%{opacity:1;transform:translate(-50%,-50%)scale(1.1)rotate(-4deg)}70%{opacity:1;transform:translate(-50%,-70%)scale(1)rotate(-4deg)}to{opacity:0;transform:translate(-50%,-110%)scale(.95)rotate(-4deg)}}@keyframes dd-bump{40%{transform:scale(1.18)}}@keyframes dd-breathe{50%{opacity:.55}}@keyframes dd-glide{0%,to{transform:translateY(0)rotate(-1.5deg)}50%{transform:translateY(-.08em)rotate(1.5deg)}}@keyframes dd-march{to{stroke-dashoffset:-18px}}@keyframes dd-nudge{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes dd-ring{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.35,1.6)}}@media (max-height:520px){.dd-poster{padding-top:14px}.dd-poster h1{font-size:clamp(32px,9vh,44px)}.dd-trail{width:200px}.dd-head>p{margin-top:4px;font-size:14px}.dd-play{min-height:60px;font-size:24px}.dd-hint{top:calc(max(8px, env(safe-area-inset-top,0px)) + 64px);font-size:15px}.dd[data-phase=poster] .dd-may{left:calc(50% - 150px - var(--may) * .75);bottom:0;transform:scale(.75)}}@media (prefers-reduced-motion:reduce){.dd-poster h1 span,.dd-trail path,.dd-play,.dd-play:after,.dd-hint{animation:none}}
