@font-face{font-family:Victory;src:url('Fredoka.ttf') format('truetype');font-weight:300 700;font-display:block}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:transparent;font-family:Victory,sans-serif} .hidden{display:none!important}
.level-complete{position:fixed;inset:0;display:flex;align-items:safe center;justify-content:center;padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));overflow:auto;background:#19372d59}
.level-complete-card{flex:none;width:min(100%,350px);padding:16px 22px 20px;border:1px solid #d7dfcd;border-radius:24px;text-align:center;color:#183c2d;background:radial-gradient(ellipse at 50% 0,#fff6d4,#fffef8 65%);box-shadow:0 18px 55px #17372b33}
.eyebrow{font-size:10px;font-weight:600;letter-spacing:.15em;color:#54705b}h1{font-size:32px;font-weight:600;line-height:1.1;margin:6px 0 14px;color:#12573c}p{margin:8px 0 0;font-size:13px;color:#5c7062}
.level-coins{display:inline-block;padding:9px 20px;border-radius:30px;background:linear-gradient(100deg,#fff0b4,#f4cf73);color:#654116;font-size:18px;font-weight:600;margin:12px 0 16px}
.next-status{font-size:11px;color:#647466;grid-column:1 / -1}.time-track{height:3px;max-width:140px;margin:9px auto 0;background:#e4eadc;border-radius:3px;overflow:hidden}.time-track i{display:block;height:100%;background:#1f7a55;transform-origin:left}
.unlock-mark { position:relative; width:min(100%,240px); height:auto; aspect-ratio:1; margin:10px auto 0; isolation:isolate; }
.unlock-mark .victory-lock { position:relative; z-index:2; width:100%; height:100%; stroke:none; overflow:visible; }
.unlock-halo { position:absolute; inset:4%; border-radius:50%; background:radial-gradient(circle,#f6d06c38,transparent 65%); }
.unlock-orbit { position:absolute; inset:14%; border-radius:50%; border:1px solid #ffe4a050; box-shadow:0 0 0 16px #f3d98509,0 0 0 38px #f3d98505; }
.unlock-object { transform-origin:120px 160px; }
.unlock-shackle { transform-origin:82px 112px; transform:translateY(-22px) rotate(-25deg); }
.unlock-glint { transform-origin:164px 126px; }
.unlock-burst { position:absolute; inset:0; z-index:3; pointer-events:none; }
.coin-flight { opacity:0; animation-fill-mode:forwards; }
.unlock-burst i { position:absolute; left:50%; top:48%; width:6px; height:10px; border-radius:2px; background:var(--confetti); opacity:0; }
.victory-word { display:flex; gap:6px; justify-content:center; margin:0 auto; }
.victory-word b { display:grid; place-items:center; width:clamp(30px,9vw,43px); aspect-ratio:1; border:1px solid #c8ecc180; border-radius:8px; background:linear-gradient(#369467,#1f7554); color:#fff9df; font-size:20px; box-shadow:0 4px 0 #052d20,inset 0 1px 0 #fff5c733; }
.level-complete:not(.hidden) .unlock-object { animation:lock-arrive 3200ms both; }
.level-complete:not(.hidden) .unlock-shackle { animation:lock-open 3200ms both; }
.level-complete:not(.hidden) .unlock-halo { animation:lock-aura 3200ms both; }
.level-complete:not(.hidden) .unlock-orbit { animation:lock-ring 2600ms 750ms both; }
.level-complete:not(.hidden) .unlock-glint { animation:lock-glint 1600ms 1200ms both; }
.level-complete:not(.hidden) .unlock-burst i { animation:lock-confetti 2100ms var(--delay) cubic-bezier(.16,.7,.25,1) both; }
.level-complete:not(.hidden) .victory-word b { animation:reward-rise 650ms var(--tile-delay) cubic-bezier(.2,1.4,.4,1) both; }
.level-complete:not(.hidden) h1 { animation:reward-rise 700ms 1100ms both; }
.level-complete:not(.hidden) .level-coins { animation:reward-rise 700ms 1850ms both; }
@keyframes lock-arrive { 0%{transform:translateY(35px) scale(.4);opacity:0} 15%{transform:translateY(-5px) scale(1.04);opacity:1} 22%{transform:rotate(-5deg)} 25%{transform:rotate(5deg)} 28%{transform:rotate(-3deg)} 34%{transform:translateY(0) rotate(0) scale(1)} 48%{transform:translateY(-8px) scale(1.06)} 100%{transform:translateY(0) scale(1)} }
@keyframes lock-open { 0%,28%{transform:translateY(0) rotate(0)} 45%{transform:translateY(-27px) rotate(-30deg)} 58%,100%{transform:translateY(-22px) rotate(-25deg)} }
@keyframes lock-aura { 0%,25%{transform:scale(.5);opacity:.2} 45%{transform:scale(1.3);opacity:1} 100%{transform:scale(1);opacity:.65} }
@keyframes lock-ring { from{transform:scale(.55);opacity:0} 25%{opacity:1} to{transform:scale(1.2);opacity:.3} }
@keyframes lock-glint { 0%,100%{transform:scale(.7);opacity:.4} 35%{transform:scale(1.6) rotate(90deg);opacity:1} }
@keyframes lock-confetti { 0%{transform:rotate(var(--angle)) translateY(5px) scale(.2);opacity:0} 8%{opacity:1} 65%{opacity:.9} 100%{transform:rotate(var(--angle)) translateY(calc(-1 * var(--distance))) rotate(230deg) scale(.6);opacity:0} }
@keyframes reward-rise { from{transform:translateY(14px) scale(.88);opacity:0} to{transform:translateY(0) scale(1);opacity:1} }

.unlock-mark{width:160px;margin:3px auto 0}
.victory-word b{width:34px;font-size:19px;box-shadow:0 3px 0 #105237,inset 0 1px 0 #ffffff44}
@media(max-height:520px) and (min-width:540px){.level-complete-card{width:min(100%,520px);display:grid;grid-template-columns:150px minmax(0,1fr);column-gap:16px;padding:18px 20px}.level-complete-card>*{grid-column:2}.level-complete-card .unlock-mark{grid-column:1;grid-row:1 / 7;width:150px;align-self:center;margin:0}.level-complete-card h1{font-size:28px;margin:5px 0 10px}.level-complete-card .next-status{grid-column:2}}
@media(max-width:350px){.level-complete-card{padding:14px 16px 18px}.unlock-mark{width:140px}h1{font-size:28px}.victory-word{gap:5px}.victory-word b{width:30px}.level-coins{font-size:17px}}
@media(max-height:460px) and (max-width:539px){.unlock-mark{width:110px}h1{font-size:26px}.level-complete-card{padding:12px 16px}.level-coins{margin:9px 0}p{margin-top:5px}}
@media(prefers-reduced-motion:reduce){.level-complete *,.level-complete:not(.hidden) *{animation:none!important}.unlock-burst{display:none}}
.reduced *,.reduced:not(.hidden) *{animation:none!important}.reduced .unlock-burst{display:none}
