/* A short, skippable field-honours reveal. No grant depends on an animation. */
.celebrate { isolation:isolate; border:1px solid color-mix(in srgb,var(--rc),#101215 35%); background:radial-gradient(ellipse at 50% 20%,color-mix(in srgb,var(--rc),transparent 84%),transparent 65%),linear-gradient(145deg,#252a2e,#101315 65%); box-shadow:0 20px 80px #000b,inset 0 1px #ffffff20; }
.reward-stage { position:relative; width:100%; min-height:180px; display:grid; place-items:center; perspective:700px; margin:4px 0 8px; }
.reward-beams,.reward-orbit,.reward-glint { position:absolute; pointer-events:none; }
.reward-beams { inset:-40px; background:conic-gradient(from 20deg,transparent 0 12%,var(--rc) 13% 14%,transparent 15% 38%,var(--rc) 39% 40%,transparent 41% 63%,var(--rc) 64% 65%,transparent 66% 87%,var(--rc) 88% 89%,transparent 90%); opacity:.08; mask-image:radial-gradient(ellipse,#0004,transparent 68%); animation:reward-light 1.2s ease-out both; }
.reward-orbit { width:180px; height:180px; border:1px solid var(--rc); border-radius:50%; opacity:.15; transform:rotateX(66deg); box-shadow:0 0 35px color-mix(in srgb,var(--rc),transparent 60%); animation:reward-ring 1s ease-out both; }
.reward-gallery { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px; width:100%; z-index:1; }
.reward-item { flex:0 1 130px; min-width:0; display:grid; justify-items:center; gap:6px; animation:reward-arrive .85s cubic-bezier(.15,.75,.2,1) both; animation-delay:calc(var(--ri,0)*60ms); }
.reward-item img { width:140px; max-width:100%; height:110px; object-fit:contain; filter:drop-shadow(0 10px 10px #0009); }.reward-item b { font:400 19px/1.1 var(--display); color:#f1e7cd; text-wrap:balance; }.reward-item .huge { margin:0; animation:none; }
.reward-stage.many .reward-item { padding:8px; border:1px solid #ffffff14; background:linear-gradient(#ffffff06,#0002); }
.reward-glint { inset:0; background:linear-gradient(110deg,transparent 35%,#fff1 48%,#fff5 50%,transparent 53%); animation:reward-sweep .9s .25s ease-out both; mix-blend-mode:screen; }
.celebrate h2 { color:var(--rc); animation:reward-title .55s .15s both; }.celebrate .amt { font-size:clamp(36px,10vw,56px); }.celebrate #cel-ok { position:relative; z-index:2; width:100%; margin-inline:0; box-shadow:inset 0 1px #ffffff45,0 3px #0009; }.celebrate #cel-ok:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.founder-grid>div,.founder-grid>button { animation:reward-arrive .8s cubic-bezier(.15,.75,.2,1) both; }.founder-grid>:nth-child(2){animation-delay:.08s}.founder-grid>:nth-child(3){animation-delay:.16s}.founder-grid>:nth-child(4){animation-delay:.24s}.founder-grid .medal-art { height:90px; width:60px; }.founder-sheet { --rc:#f2b705; background:radial-gradient(ellipse at 50% 15%,#a67d2430,transparent 70%),#17191b; }
@keyframes reward-arrive { 0%{opacity:0;transform:translateY(24px) rotateX(12deg) scale(.8);filter:brightness(1.5)} 65%{opacity:1;transform:translateY(-3px) rotateX(0) scale(1.025)} 100%{opacity:1;transform:none;filter:brightness(1)} }
@keyframes reward-ring { from{opacity:0;transform:rotateX(66deg) scale(.4)} to{opacity:.15;transform:rotateX(66deg) scale(1.2)} }
@keyframes reward-light { from{opacity:0;transform:rotate(-25deg)} 40%{opacity:.15} to{opacity:.08;transform:rotate(0)} }
@keyframes reward-sweep { from{opacity:0;transform:translateX(-90%)} 30%{opacity:1} to{opacity:0;transform:translateX(90%)} }
@keyframes reward-title { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }
.calm .reward-stage *,.calm .celebrate h2,.calm .founder-grid>* { animation:none!important; }.calm .reward-glint { display:none; }
@media(prefers-reduced-motion:reduce){.reward-stage *,.celebrate h2,.founder-grid>*{animation:none!important}.reward-glint{display:none}}
/* Short phones must always offer an exit, including three starter items or a large bundle. */
.celebrate { overflow-x:hidden; overflow-y:auto; }
.celebrate #cel-ok { flex-shrink:0; position:sticky; bottom:0; }
@media(max-height:700px) {
  .reward-stage { min-height:120px; }
  .reward-stage.many .reward-gallery { display:grid; grid-template-columns:repeat(auto-fit,minmax(68px,1fr)); gap:6px; }
  .reward-stage.many .reward-item { padding:5px; }
  .reward-item img { height:78px; }.reward-item b { font-size:16px; max-width:100%; overflow-wrap:anywhere; }
  .reward-item .huge { width:88px; height:88px; }
  .celebrate .amt { font-size:36px; }.celebrate h2 { font-size:32px; }
  .founder-grid { gap:6px; }.founder-grid>div,.founder-grid>button { min-height:92px; padding:8px; gap:5px; }
  .founder-grid img { height:58px; }.founder-grid .medal-art { height:64px; width:43px; }
}