/* Crystal charged: the same short reward in every game, including the Mini. */
.diamond-celebration{box-sizing:border-box;width:min(660px,calc(100vw - 28px));max-width:none;max-height:calc(100dvh - 28px);padding:0 0 16px;margin:auto;overflow:hidden;border:2px solid #fffdf6;background:#111;color:#fffdf6;text-align:center;box-shadow:0 18px 90px #0009;isolation:isolate}
.diamond-celebration::backdrop{background:#080810b8}
.diamond-celebration .scene{position:relative;height:min(350px,calc(100dvh - 115px));min-height:240px;perspective:750px;isolation:isolate}
.diamond-celebration .mug-wrap{position:absolute;width:240px;height:240px;top:14px;left:50%;margin-left:-120px;transform-origin:50% 78%;z-index:3}
.diamond-celebration .mug,.diamond-celebration .piece{display:block;width:100%;height:100%;object-fit:contain}
.diamond-celebration .pieces,.diamond-celebration .effects{position:absolute;inset:0;pointer-events:none}
.diamond-celebration .piece{position:absolute;inset:0}
.diamond-celebration .shine{position:absolute;inset:0;background:linear-gradient(115deg,transparent 38%,#fff9 48%,#fff 50%,transparent 61%);mask:url('/games/mugs/diamond.png') center/contain no-repeat;-webkit-mask:url('/games/mugs/diamond.png') center/contain no-repeat;opacity:0;z-index:5}
.diamond-celebration .verdict{position:absolute;top:250px;left:16px;right:16px;z-index:4;text-align:center}
.diamond-celebration .verdict h2{font:48px/1 Anton,Impact,sans-serif;letter-spacing:.5px;margin:0 0 10px;color:#fffdf6}
.diamond-celebration .caption{font:15px/1.4 Inter,Arial,sans-serif;margin:0;color:#ddd}
.diamond-celebration .spark{position:absolute;left:50%;top:47%;width:7px;height:11px;background:#9be8ff;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);opacity:0}
.diamond-celebration .charge-core{position:absolute;left:50%;top:42%;width:280px;height:280px;margin:-140px;background:radial-gradient(ellipse,#ffffffcc 0,#96e9ff77 12%,#8277ff40 32%,transparent 65%);opacity:0;mix-blend-mode:screen}
.diamond-celebration .crystal-cage{position:absolute;left:50%;top:42%;width:230px;height:230px;margin:-115px;opacity:0;color:#a6eaff;filter:drop-shadow(0 0 5px #62cfff)}
.diamond-celebration .light-bloom{position:absolute;inset:-80px;background:radial-gradient(ellipse at 50% 45%,#eaffffb3 0,#95dbff66 16%,#937bff40 32%,transparent 62%);mix-blend-mode:screen;opacity:0}
.diamond-celebration .prism-wave{position:absolute;left:50%;top:42%;width:180px;height:180px;margin:-90px;border-radius:50%;background:conic-gradient(#81f3ff,#c3a2ff,#ffb2e7,#ffeea9,#81f3ff);mask:radial-gradient(transparent 61%,#000 64%,#000 66%,transparent 69%);-webkit-mask:radial-gradient(transparent 61%,#000 64%,#000 66%,transparent 69%);opacity:0}
.diamond-celebration .light-streak{position:absolute;left:50%;top:42%;height:2px;width:65px;background:linear-gradient(90deg,transparent,#bbf7ff);transform-origin:left;opacity:0}
.diamond-celebration .lens{position:absolute;left:10%;right:10%;top:42%;height:2px;background:linear-gradient(90deg,transparent,#b4a9ff,#fff,#8fefff,transparent);box-shadow:0 0 20px 4px #9deaff60;opacity:0}
@media(max-height:460px){.diamond-celebration .scene{min-height:180px;height:calc(100dvh - 100px)}.diamond-celebration .mug-wrap{width:150px;height:150px;margin-left:-75px;top:0}.diamond-celebration .verdict{top:145px}.diamond-celebration .verdict h2{font-size:30px}.diamond-celebration .caption{font-size:12px}}

/* ---- Gold. Every shape behind the mug is recoloured here rather than in the
   routines, so the Diamond's own effects are untouched: same primitives, gold
   light. A gold mug in a cyan light show was the wrong prize in the wrong
   envelope (Steel, Sep 24). ---- */
.diamond-celebration.is-gold .shine{mask-image:url('/games/mugs/gold.png');-webkit-mask-image:url('/games/mugs/gold.png');background:linear-gradient(115deg,transparent 38%,#fff6c980 48%,#fff 50%,transparent 61%)}
.diamond-celebration.is-gold .verdict h2{color:#ffd400}
.diamond-celebration.is-gold .spark{background:#ffd400}
.diamond-celebration.is-gold .light-bloom{background:radial-gradient(ellipse at 50% 45%,#fff8d8cc 0,#ffd40066 16%,#c8912840 32%,transparent 62%)}
.diamond-celebration.is-gold .prism-wave{background:conic-gradient(#fff3b0,#ffd400,#c89128,#ffe98a,#fff3b0)}
.diamond-celebration.is-gold .light-streak{background:linear-gradient(90deg,transparent,#ffe98a)}
.diamond-celebration.is-gold .lens{background:linear-gradient(90deg,transparent,#c89128,#fff6cf,#ffd400,transparent);box-shadow:0 0 20px 4px #ffd4005c}
.diamond-celebration.is-gold .charge-core{background:radial-gradient(ellipse,#fff8d8cc 0,#ffd40077 12%,#c8912840 32%,transparent 65%)}
/* bullion: the ring the landing sends out */
.diamond-celebration .gold-ring{position:absolute;top:50%;left:50%;width:250px;height:250px;margin:0;border:3px solid #ffd400;border-radius:50%;transform:translate(-50%,-50%);opacity:0;z-index:2;box-shadow:0 0 30px #ffd40066,inset 0 0 20px #ffd4004d}
/* molten: the pour it rises out of */
.diamond-celebration .gold-pool{position:absolute;top:56%;left:50%;width:300px;height:78px;margin:0;border-radius:50%;transform:translateX(-50%);opacity:0;z-index:1;background:radial-gradient(ellipse,#fff3b0 0,#ffd400 42%,#b8860b 78%,transparent 92%);filter:blur(1px)}

/* On a phone it takes the screen. The undocked reveal was a 660px card inset
   by 14px with a border round it, which on a 375px screen is a big moment
   played in a box; there is nothing behind it worth keeping in view. The scene
   grows with the screen rather than staying capped at 350px, and the mug and
   the word move with it. */
@media(max-width:700px){
 .diamond-celebration:not(.is-docking){width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;padding:0;border:0}
 .diamond-celebration:not(.is-docking) .scene{height:100%;min-height:0}
 .diamond-celebration:not(.is-docking) .mug-wrap{width:270px;height:270px;top:calc(50% - 165px);margin-left:-135px}
 .diamond-celebration:not(.is-docking) .verdict{top:calc(50% + 105px)}
 .diamond-celebration:not(.is-docking) .charge-core,.diamond-celebration:not(.is-docking) .crystal-cage,.diamond-celebration:not(.is-docking) .prism-wave,.diamond-celebration:not(.is-docking) .light-streak,.diamond-celebration:not(.is-docking) .lens,.diamond-celebration:not(.is-docking) .spark{top:calc(50% - 30px)}
}

/* Mini: reveal across the result sheet, then land in its actual mug slot. */
.diamond-celebration.is-docking{position:fixed;inset:auto;margin:0;padding:0;max-height:none;border:0;box-shadow:none;background:rgba(17,17,17,.96)}
.diamond-celebration.is-docking::backdrop{background:transparent}
.diamond-celebration.is-docking .scene{height:100%;min-height:0}
.diamond-celebration.is-docking .mug-wrap{width:280px;height:280px;top:calc(50% - 170px);margin-left:-140px;transform-origin:center}
.diamond-celebration.is-docking .verdict{top:calc(50% + 110px)}
.diamond-celebration.is-docking .charge-core,.diamond-celebration.is-docking .crystal-cage,.diamond-celebration.is-docking .prism-wave,.diamond-celebration.is-docking .light-streak,.diamond-celebration.is-docking .lens,.diamond-celebration.is-docking .spark{top:calc(50% - 30px)}
@media(max-height:460px){
 .diamond-celebration.is-docking .mug-wrap{width:180px;height:180px;top:calc(50% - 110px);margin-left:-90px}
 .diamond-celebration.is-docking .verdict{top:calc(50% + 70px)}
}