/* A game reward plaque, sized independently of the Phaser resolution. */
.achievement-notifications { position:fixed; inset:max(12px,env(safe-area-inset-top)) 12px auto; z-index:100100; pointer-events:none; display:flex; justify-content:center; font-family:Manrope,sans-serif; }
.achievement-notice { --tier:#d9a16b; position:relative; isolation:isolate; width:100%; max-width:420px; display:grid; grid-template-columns:70px minmax(0,1fr); align-items:center; column-gap:13px; padding:18px 17px 17px 12px; border:1px solid #c6a66d; border-bottom:3px solid #826039; border-radius:20px; background:radial-gradient(ellipse at 0 40%,#386052 0,transparent 65%),#0b303b; box-shadow:0 8px 0 -4px #021720,0 15px 36px #0007; color:#f8edcd; pointer-events:auto; touch-action:none; animation:achievement-enter .42s cubic-bezier(.17,.86,.3,1.15) both; }
.achievement-notice[data-tier=silver] { --tier:#c5dfeb; }
.achievement-notice[data-tier=gold] { --tier:#ffcf62; }
.achievement-notice[data-tier=diamond] { --tier:#8af1e5; }
.achievement-emblem { position:relative; width:70px; display:flex; flex-direction:column; align-items:center; justify-content:center; align-self:center; }
.achievement-halo { position:absolute; inset:-16px -17px 4px; border-radius:50%; background:radial-gradient(ellipse,var(--tier),transparent 68%); opacity:.2; animation:achievement-glow .85s ease-out; }
.achievement-medal { position:relative; display:block; width:70px; height:78px; overflow:hidden; filter:drop-shadow(0 5px 4px #0006); animation:achievement-medal .55s .12s cubic-bezier(.2,.8,.3,1.15) both; }
.achievement-tier { position:relative; margin-top:7px; color:var(--tier); font-size:9px; font-weight:800; letter-spacing:.7px; text-transform:uppercase; }
.achievement-copy { min-width:0; }
.achievement-kicker { margin:0 22px 7px 0; color:#9fcaba; font-size:8px; font-weight:800; line-height:1.5; letter-spacing:1px; }
.achievement-copy h2 { margin:0 0 6px; font-size:20px; font-weight:800; line-height:1.18; letter-spacing:-.4px; color:#ffe7af; overflow-wrap:anywhere; text-wrap:balance; }
.achievement-description { margin:0; color:#b2cfc9; font-size:11px; line-height:1.5; text-wrap:pretty; }
.achievement-reward { display:flex; align-items:center; gap:10px; margin-top:11px; color:#9ec0b7; font-size:10px; line-height:1.3; }
.achievement-coins { display:inline-flex; align-items:center; gap:4px; flex:none; min-height:29px; padding:3px 8px 3px 5px; border:1px solid #b9975145; border-radius:9px; background:#061e26; color:#ffda83; }
.achievement-coins svg { display:block; width:23px; height:23px; overflow:hidden; }.achievement-coins b{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}
.achievement-dismiss { position:absolute; top:1px; right:1px; display:grid; place-items:center; width:44px; height:44px; border:0; border-radius:0 19px 0 13px; background:transparent; color:#9dbcaf; cursor:pointer; touch-action:manipulation; transition:background .12s,color .12s; }
.achievement-dismiss svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.achievement-dismiss:focus-visible{outline:2px solid #ffda83;outline-offset:-5px}
.achievement-dismiss:active{background:#ffffff12}.achievement-dismiss:hover{color:#ffe5ab}
.achievement-sparks { position:absolute; width:74px; height:74px; left:-2px; top:0; pointer-events:none; }
.achievement-sparks i { position:absolute; left:35px; top:35px; width:5px; height:5px; background:var(--tier); border-radius:1px; animation:achievement-spark .7s .26s ease-out both; }
.achievement-notice.is-leaving { animation:achievement-leave .22s ease-in both; pointer-events:none; }
@keyframes achievement-enter { from{opacity:0;transform:translateY(-35px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)} }
@keyframes achievement-medal { from{opacity:0;transform:scale(.65) rotate(-14deg)}65%{opacity:1;transform:scale(1.08) rotate(4deg)}to{opacity:1;transform:scale(1) rotate(0)} }
@keyframes achievement-glow { from{opacity:0;transform:scale(.6)}45%{opacity:.4}to{opacity:.2;transform:scale(1)} }
@keyframes achievement-spark { from{opacity:0;transform:rotate(calc(var(--spark)*60deg)) translateY(-20px) scale(.3)}25%{opacity:1}to{opacity:0;transform:rotate(calc(var(--spark)*60deg)) translateY(-56px) scale(0)} }
@keyframes achievement-leave { to{opacity:0;transform:translateY(-22px) scale(.98)} }
@media(min-width:700px){.achievement-notifications{left:50%;right:auto;width:calc(var(--desktop-game-width) - 24px);transform:translateX(-50%)}}
@media(max-width:359px){.achievement-notifications{left:9px;right:9px}.achievement-notice{grid-template-columns:57px minmax(0,1fr);column-gap:10px;padding:15px 13px 14px 10px;border-radius:17px}.achievement-emblem{width:57px}.achievement-medal{width:57px;height:66px}.achievement-copy h2{font-size:17px}.achievement-kicker{font-size:7px;letter-spacing:.65px;margin-bottom:6px}.achievement-description{font-size:10px}.achievement-reward{gap:7px;font-size:9px;margin-top:9px}.achievement-tier{font-size:8px}.achievement-sparks{left:-9px}}
@media(prefers-reduced-motion:reduce){.achievement-notice,.achievement-notice *{animation:none!important;transition:none!important}.achievement-notice.is-leaving{opacity:0}.achievement-sparks{display:none}}
/* Reserve the close target even when a long title wraps beside it. */
.achievement-copy h2 { padding-right:34px; }

.achievement-notice{background:var(--game-panel,#10343e);color:var(--game-ink,#fff1cb)}
.achievement-copy h2{color:var(--game-ink,#fff1cb)}
.achievement-copy p{color:var(--game-muted,#97b8b8)}