/* Cinematic pack unlock, adapted from the accepted /play/puzzle-packs-preview. */
.puzzle-reward-dialog{border:0;padding:0;background:#fff;color:#19273c;border-radius:26px;width:min(530px,calc(100vw - 28px));max-width:none;max-height:min(90dvh,680px);box-shadow:0 25px 100px #050b296e;overflow:auto}
.puzzle-reward-dialog::backdrop{background:#101a31c2;backdrop-filter:blur(5px)}
.puzzle-reward-dialog .reward-surface{position:relative;text-align:center;padding:34px 25px 28px;background:radial-gradient(circle at 50% 23%,#fff0c4,transparent 48%),linear-gradient(145deg,#fff,#f4f0ff)}
.puzzle-reward-dialog .reward-icon{display:grid;place-items:center;width:90px;height:90px;border-radius:28px;margin:0 auto 14px;background:linear-gradient(135deg,#fff2cf,#f2bc5d);font-size:42px;color:#624ea1;box-shadow:0 15px 32px #f2bd6560}
.puzzle-reward-dialog .reward-kicker{font-size:11px;letter-spacing:.16em;font-weight:800;color:#8470b6;margin:0 0 10px}
.puzzle-reward-dialog h2{font-size:clamp(30px,4vw,44px);letter-spacing:-.055em;line-height:1.12;margin:0 0 14px}
.puzzle-reward-dialog .reward-description{margin:0 auto 22px;max-width:440px;line-height:1.55;color:#64728a}
.puzzle-reward-dialog .reward-primary{display:block;margin:auto;background:linear-gradient(120deg,#ffe4a1,#f5bb64);color:#362a43;border:0;border-radius:12px;padding:15px 20px;min-height:50px;max-width:340px;width:100%;font-weight:800;font-size:15px}
.puzzle-reward-dialog .reward-later{margin:10px auto 0;border:0;background:transparent;padding:10px;color:#79849a}
.puzzle-reward-dialog .reward-sparkles{font-size:28px;letter-spacing:1.1em;color:#ad91e9;margin:4px 0 16px;animation:puzzle-reward-sparkle 1.8s infinite alternate}
.puzzle-reward-dialog.milestone{position:fixed;inset:0;width:100vw;height:100dvh;max-height:none;border-radius:0;margin:0;overflow:hidden;background:#070d27;color:#fff}
.puzzle-reward-dialog.milestone .reward-surface{position:relative;display:grid;place-items:center;width:100%;height:100%;min-height:100%;padding:25px 20px calc(20px + env(safe-area-inset-bottom,0px));background:radial-gradient(circle at 50% 40%,#263766 0%,#101737 43%,#070d27 85%);isolation:isolate}
.puzzle-reward-dialog .reward-glow{position:fixed;left:50%;top:43%;width:min(90vw,800px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#9e74fd33 0%,#56bbee13 42%,transparent 70%);pointer-events:none}
.puzzle-reward-dialog .reward-fireworks{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.puzzle-reward-dialog.milestone .reward-content{position:relative;z-index:2;width:100%;max-width:620px;display:flex;flex-direction:column;align-items:center}
.puzzle-reward-dialog.milestone .reward-icon{width:78px;height:78px;margin:0 0 16px;border-radius:25px;color:#ffebb4;background:linear-gradient(145deg,#a18afc55,#edc8793c);border:1px solid #fff4b554;box-shadow:0 0 50px #ba9cfa3a;animation:puzzle-reward-pop .7s both}
.puzzle-reward-dialog.milestone .reward-kicker{color:#f8dc9c;font-size:12px;letter-spacing:.21em}
.puzzle-reward-dialog.milestone h2{font-size:clamp(43px,7.5vw,76px);font-weight:850;line-height:1.04;letter-spacing:-.07em;margin:0 0 18px;text-shadow:0 10px 40px #0008}
.puzzle-reward-dialog.milestone h2 em{font-style:normal;background:linear-gradient(110deg,#fff1ba,#f7c66b,#ffaee8);color:transparent;background-clip:text;-webkit-background-clip:text}
.puzzle-reward-dialog.milestone .reward-description{font-size:clamp(15px,2.4vw,20px);line-height:1.5;color:#d8deee;max-width:500px}
.puzzle-reward-dialog .reward-gallery{height:134px;width:min(100%,420px);position:relative;margin:0 auto 20px}
.puzzle-reward-dialog .reward-gallery img{position:absolute;top:16px;left:calc(50% - 66px);width:132px;height:106px;object-fit:cover;border:4px solid #fff9e7;border-radius:15px;box-shadow:0 12px 36px #0008}
.puzzle-reward-dialog .reward-gallery img:nth-child(1){transform:translate(-92px,12px) rotate(-13deg)}
.puzzle-reward-dialog .reward-gallery img:nth-child(2){transform:translate(92px,12px) rotate(13deg)}
.puzzle-reward-dialog .reward-gallery img:nth-child(3){transform:translateY(-7px) scale(1.06)}
.puzzle-reward-dialog.milestone .reward-later{color:#d4d9eb}
.puzzle-reward-dialog .reward-close{position:fixed;right:calc(14px + env(safe-area-inset-right,0px));top:calc(12px + env(safe-area-inset-top,0px));z-index:3;background:#ffffff1e;color:#fff;border:1px solid #ffffff3d;width:40px;height:40px;border-radius:50%;font-size:26px}
.puzzle-reward-dialog button:focus-visible{outline:3px solid #f9dc94;outline-offset:4px}
@keyframes puzzle-reward-pop{from{transform:scale(.35) rotate(-17deg);opacity:0}65%{transform:scale(1.12)}to{transform:scale(1);opacity:1}}
@keyframes puzzle-reward-sparkle{from{opacity:.55;transform:translateY(4px)}to{opacity:1;transform:translateY(-4px)}}
@media(max-height:680px){.puzzle-reward-dialog.milestone .reward-icon{width:55px;height:55px;font-size:27px;margin-bottom:8px}.puzzle-reward-dialog.milestone h2{font-size:clamp(34px,6vw,52px)}.puzzle-reward-dialog .reward-gallery{height:102px}.puzzle-reward-dialog .reward-gallery img{width:105px;height:78px;left:calc(50% - 52px)}}
@media(prefers-reduced-motion:reduce){.puzzle-reward-dialog *{animation:none!important;transition:none!important}}

/* Preview-only cue; inserted into the real reward dialog without changing game state. */
.puzzle-reward-dialog .reward-preview-note{display:inline-block;max-width:460px;margin:-5px auto 16px;padding:8px 13px;border:1px solid rgba(255,232,163,.55);border-radius:999px;background:rgba(12,21,55,.55);color:#f9e9bd!important;font-size:11px;font-weight:750;letter-spacing:.025em;line-height:1.35}
@media(max-height:680px){.puzzle-reward-dialog .reward-preview-note{margin:0 auto 8px;padding:5px 9px;font-size:10px}}