@import"https://fonts.googleapis.com/css2?family=Fredoka:wght@400;600;700&family=Baloo+2:wght@600;800&display=swap";:root{--font-body: "Fredoka", "Comic Sans MS", "Segoe UI Rounded", system-ui, sans-serif;--font-title: "Baloo 2", "Fredoka", "Comic Sans MS", system-ui, sans-serif;--sky: #7ec8ff;--sky-deep: #4a9fe8;--sun: #ffd93d;--grass: #6dd66d;--coral: #ff8a80;--berry: #b388ff;--ink: #2d3a53;--paper: #fffdf5;--card: #ffffff;--shadow: 0 6px 0 rgba(45, 58, 83, .12), 0 12px 24px rgba(45, 58, 83, .14);--radius: 20px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0}body{font-family:var(--font-body);color:var(--ink);background:linear-gradient(180deg,#bfe6ff,#eafaf0);min-height:100vh;overflow-x:hidden}h1,h2,h3{font-family:var(--font-title);margin:0}.btn{font-family:var(--font-title);font-size:1.25rem;font-weight:800;color:#fff;background:var(--sky-deep);border:none;border-radius:var(--radius);min-width:48px;min-height:56px;padding:10px 26px;cursor:pointer;box-shadow:0 5px #0000002e;transition:transform .12s ease,box-shadow .12s ease,filter .12s ease;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn:hover{filter:brightness(1.07);transform:translateY(-2px)}.btn:active{transform:translateY(3px) scale(.97);box-shadow:0 2px #0000002e}.btn.big{font-size:1.7rem;min-height:72px;padding:14px 44px}.btn.green{background:#43b76a}.btn.orange{background:#ff9d3f}.btn.purple{background:var(--berry)}.btn.coral{background:var(--coral)}.btn.ghost{background:#fff;color:var(--ink);box-shadow:0 5px #2d3a5326}.btn.round{border-radius:50%;width:60px;height:60px;min-width:60px;padding:0;font-size:1.6rem}.btn:disabled{opacity:.5;cursor:default;transform:none}.corner-chrome{position:fixed;top:14px;right:14px;z-index:900;display:flex;gap:10px}.corner-chrome .btn.round{font-size:1.5rem}.card{background:var(--card);border-radius:26px;box-shadow:var(--shadow);padding:22px}.pick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:18px;max-width:900px;margin:0 auto}.pick-card{background:#fff;border:4px solid transparent;border-radius:24px;box-shadow:var(--shadow);padding:18px 10px;text-align:center;cursor:pointer;transition:transform .15s ease,border-color .15s ease;min-height:140px}.pick-card:hover{transform:translateY(-4px) scale(1.03)}.pick-card:active{transform:scale(.96)}.pick-card.selected{border-color:var(--sun);background:#fffbe6}.pick-card .emoji{font-size:3.4rem;line-height:1.2;display:block}.pick-card .label{font-family:var(--font-title);font-weight:800;font-size:1.15rem;margin-top:6px;display:block}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#2d3a5373;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal{background:var(--paper);border-radius:28px;box-shadow:var(--shadow);max-width:620px;width:100%;padding:28px;text-align:center;animation:modal-pop .25s ease}@keyframes modal-pop{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}.modal h2{font-size:2rem;margin-bottom:14px}.howto-steps{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin:18px 0}.howto-step{flex:1 1 150px;background:#fff;border-radius:20px;padding:16px 10px;box-shadow:var(--shadow)}.howto-step .pic{font-size:3rem}.howto-step .txt{font-size:1.05rem;font-weight:600;margin-top:8px}.keyart-title.keyart-title{--kt-sky: #8fdcff;--kt-tint: 120,200,255;--kt-shade: 40,30,80;--kt-play-a: #8ff07a;--kt-play-b: #43b76a;--kt-play-c: #2f9a52;--kt-play-d: #1f7a3c;--kt-art-pos: center 62%;position:fixed;top:0;right:0;bottom:0;left:0;z-index:600;display:none;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;min-height:100vh;margin:0;padding:0;gap:0;overflow:hidden;background-color:var(--kt-sky);background-position:var(--kt-art-pos);background-size:cover;background-repeat:no-repeat}.keyart-title.keyart-title.active{display:flex}.keyart-title:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(180deg,rgba(var(--kt-tint),.55),rgba(var(--kt-tint),0) 34%,rgba(var(--kt-shade),0) 70%,rgba(var(--kt-shade),.28))}.keyart-title .glow{position:absolute;left:50%;top:4vh;width:min(62vw,720px);height:34vh;transform:translate(-50%);pointer-events:none;background:radial-gradient(ellipse at 50% 45%,#ffffffbf,#fff0 68%)}.keyart-title.dark .glow{background:radial-gradient(ellipse at 50% 45%,#ffffff47,#fff0 68%)}.keyart-title .sparkle{position:absolute;width:14px;height:14px;pointer-events:none;color:#fff;font-size:22px;line-height:1;text-shadow:0 0 10px #fff,0 0 20px #ffd93d;animation:kt-twinkle 2.6s ease-in-out infinite}@keyframes kt-twinkle{0%,to{opacity:0;transform:scale(.4) rotate(0)}50%{opacity:1;transform:scale(1) rotate(25deg)}}.keyart-title .cloud{position:absolute;width:140px;height:50px;background:#fff;border-radius:40px;opacity:.9;animation:kt-drift 26s linear infinite;filter:drop-shadow(0 6px 10px rgba(0,0,0,.08));pointer-events:none}.keyart-title .cloud:before{content:"";position:absolute;left:30px;top:-28px;width:60px;height:60px;background:#fff;border-radius:50%}.keyart-title .cloud:after{content:"";position:absolute;left:70px;top:-18px;width:50px;height:50px;background:#fff;border-radius:50%}.keyart-title.dark .cloud{opacity:.18}@keyframes kt-drift{0%{transform:translate(-30vw)}to{transform:translate(110vw)}}.keyart-title>*{position:relative;z-index:2}.keyart-title .logo{width:min(46vw,440px);min-width:250px;height:auto;margin-top:max(9vh,74px);animation:kt-logo-float 4s ease-in-out infinite;filter:drop-shadow(0 10px 0 rgba(255,255,255,.55)) drop-shadow(0 18px 22px rgba(45,58,83,.28))}.keyart-title.dark .logo{filter:drop-shadow(0 10px 0 rgba(255,255,255,.35)) drop-shadow(0 18px 26px rgba(0,0,0,.5))}@keyframes kt-logo-float{0%,to{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(1.5deg)}}.keyart-title .sub{font-size:clamp(1rem,1.6vw,1.25rem);max-width:44ch;color:var(--ink);font-weight:700;margin:8px 0 0;background:#ffffffd1;border-radius:999px;padding:8px 20px;box-shadow:0 6px 18px #2d3a5326;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.keyart-title .feats{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:12px 0 0}.keyart-title .feats span{background:#2d3a53b8;color:#fff;border-radius:999px;padding:5px 13px;font-size:.86rem;font-weight:700;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.keyart-title .btn.kt-play{margin-top:18px;font-size:clamp(1.5rem,3vw,2.2rem);padding:14px 54px;min-height:76px;border-radius:999px;letter-spacing:.04em;background:linear-gradient(180deg,var(--kt-play-a),var(--kt-play-b) 60%,var(--kt-play-c));border:5px solid #fff;color:#fff;text-shadow:0 3px 0 rgba(0,0,0,.25);box-shadow:0 8px 0 var(--kt-play-d),0 18px 34px #00000047,inset 0 3px #ffffff8c;animation:kt-play-pulse 1.8s ease-in-out infinite}.keyart-title .btn.kt-play:hover{transform:translateY(-3px) scale(1.04)}.keyart-title .btn.kt-play:active{transform:translateY(4px);box-shadow:0 3px 0 var(--kt-play-d),0 8px 20px #00000047}@keyframes kt-play-pulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.12)}}.keyart-title .kt-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:12px}.keyart-title .kt-row .btn{min-height:50px;font-size:1.05rem;padding:8px 20px;border-radius:999px;background:#ffffffe6;color:var(--ink);box-shadow:0 4px #2d3a532e,0 8px 18px #2d3a5329;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.keyart-title .kt-row .btn.accent{background:linear-gradient(180deg,#fff1a8,#ffd93d)}.keyart-title .hint{font-size:.95rem;margin-top:10px;color:#fff;text-shadow:0 2px 0 rgba(45,58,83,.45),0 0 12px rgba(45,58,83,.5);font-weight:700}.keyart-title .shots{position:absolute;top:11vh;display:flex;align-items:flex-start;pointer-events:none}.keyart-title .shots.l{left:2vw}.keyart-title .shots.r{right:2vw;top:13vh}.keyart-title .shots figure{margin:0;background:#fff;padding:7px 7px 26px;border-radius:8px;box-shadow:0 12px 26px #2d3a5359;width:clamp(130px,14vw,200px);position:relative;transform:rotate(var(--r)) translateY(var(--y));animation:kt-shot-in .8s cubic-bezier(.2,1.4,.4,1) both;animation-delay:var(--d)}.keyart-title .shots figure+figure{margin-left:-18px}.keyart-title .shots img{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover;border-radius:4px;background:#dfe6f0}.keyart-title .shots figcaption{position:absolute;left:0;right:0;bottom:5px;font-family:var(--font-title);font-weight:800;font-size:.78rem;color:var(--ink)}.keyart-title .shots figure:after{content:"";position:absolute;left:50%;top:-9px;width:46px;height:16px;margin-left:-23px;background:#ffd93dd9;transform:rotate(-3deg);border-radius:2px}@keyframes kt-shot-in{0%{opacity:0;transform:rotate(var(--r)) translateY(-40px)}to{opacity:1;transform:rotate(var(--r)) translateY(var(--y))}}.keyart-title .grownups{position:absolute}.keyart-title.dark .grownups summary{color:#cfe6ff}@media (max-width: 900px),(max-height: 560px){.keyart-title .shots{display:none}.keyart-title .logo{margin-top:max(7vh,70px)}.keyart-title .feats{display:none}}@media (max-height: 640px){.keyart-title .logo{width:min(34vw,320px);min-width:200px;margin-top:60px}.keyart-title .sub{display:none}.keyart-title .btn.kt-play{margin-top:10px;min-height:64px}}@media (prefers-reduced-motion: reduce){.keyart-title .logo,.keyart-title .cloud,.keyart-title .sparkle,.keyart-title .btn.kt-play,.keyart-title .shots figure{animation:none}}.title-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;padding:30px;text-align:center}.bubble-title{font-family:var(--font-title);font-weight:800;font-size:clamp(2.6rem,7vw,5rem);color:#fff;text-shadow:0 4px 0 rgba(45,58,83,.25),0 0 0 6px transparent;-webkit-text-stroke:2px rgba(45,58,83,.2);letter-spacing:1px}.grownups{position:fixed;bottom:8px;left:12px;z-index:800;font-size:.85rem}.grownups summary{cursor:pointer;opacity:.65;font-weight:600;list-style:none}.grownups[open] summary{opacity:1}.grownups p{background:#fff;border-radius:12px;padding:8px 12px;box-shadow:var(--shadow);max-width:420px;margin:6px 0 0}.toast{position:fixed;left:50%;bottom:90px;transform:translate(-50%);background:#fff;color:var(--ink);border-radius:999px;padding:12px 28px;font-family:var(--font-title);font-weight:800;font-size:1.2rem;box-shadow:var(--shadow);z-index:950;animation:toast-in .3s ease;pointer-events:none}@keyframes toast-in{0%{transform:translate(-50%,30px);opacity:0}to{transform:translate(-50%);opacity:1}}#confetti-canvas{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:990}@media (prefers-reduced-motion: reduce){*{animation-duration:.01s!important;transition-duration:.01s!important}}@media print{.corner-chrome,.grownups,.btn,.toast{display:none!important}}#kg-chip{position:fixed;top:14px;left:50%;transform:translate(-50%);z-index:910;display:flex;align-items:center;gap:8px;background:#ffffffeb;border-radius:999px;padding:7px 16px;text-decoration:none;color:var(--ink);font-family:var(--font-title);font-weight:800;font-size:1rem;box-shadow:var(--shadow);transition:transform .15s ease}#kg-chip:hover{transform:translate(-50%) scale(1.05)}#kg-chip .av{font-size:1.4rem}#kg-chip .lv{background:var(--sun);border-radius:999px;padding:2px 10px;font-size:.85rem}#kg-chip .bar{width:74px;height:10px;background:#e4e9f2;border-radius:999px;overflow:hidden}#kg-chip .bar i{display:block;height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,#43b76a,#9be15d);transition:width .4s ease}.kg-levelup{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1200;pointer-events:none;display:flex;align-items:center;justify-content:center;animation:lvl-in .4s ease}.kg-levelup .burst{position:absolute;width:46vmin;height:46vmin;border-radius:50%;background:radial-gradient(circle,rgba(255,217,61,.85),rgba(255,157,63,.35) 55%,transparent 70%);animation:burst-grow 2.4s ease-out forwards}.kg-levelup .txt{position:relative;text-align:center;font-family:var(--font-title)}.kg-levelup .up{font-size:3rem;animation:up-bounce .7s ease infinite alternate}.kg-levelup .big{font-size:clamp(3rem,9vw,6rem);font-weight:800;color:#fff;-webkit-text-stroke:3px #d88a00;text-shadow:0 6px 0 rgba(160,90,0,.4),0 14px 34px rgba(0,0,0,.3);animation:big-pop .5s cubic-bezier(.2,2.2,.4,1)}.kg-levelup .sub{font-size:1.5rem;font-weight:800;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.45)}.kg-levelup.out{opacity:0;transition:opacity .6s ease}@keyframes lvl-in{0%{opacity:0}}@keyframes burst-grow{0%{transform:scale(.2);opacity:1}to{transform:scale(2.4);opacity:0}}@keyframes big-pop{0%{transform:scale(.3)}}@keyframes up-bounce{0%{transform:translateY(0)}to{transform:translateY(-14px)}}.kg-badge-banner{position:fixed;top:74px;left:50%;transform:translate(-50%);z-index:1100;display:flex;align-items:center;gap:14px;background:linear-gradient(120deg,#fff8dc,#ffe9b8);border:3px solid #ffd93d;border-radius:20px;padding:14px 26px;font-family:var(--font-title);font-size:1.05rem;color:var(--ink);box-shadow:0 12px 30px #78500059;animation:badge-in .5s cubic-bezier(.2,1.6,.4,1)}.kg-badge-banner .bemoji{font-size:2.4rem;animation:badge-spin .8s ease}.kg-badge-banner.out{opacity:0;transform:translate(-50%) translateY(-24px);transition:all .5s ease}@keyframes badge-in{0%{transform:translate(-50%) translateY(-70px);opacity:0}}@keyframes badge-spin{0%{transform:rotate(-360deg) scale(.3)}}#kg-chip .ring{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:3px}#kg-chip .ring .av{width:100%;height:100%;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:1.25rem}.kg-xpfloat{position:fixed;z-index:960;transform:translate(-50%);font-family:var(--font-title);font-weight:800;font-size:1.1rem;color:#1d7a43;text-shadow:0 1px 0 #fff,0 2px 6px rgba(0,0,0,.2);pointer-events:none;animation:xpfloat 1.5s ease-out forwards}@keyframes xpfloat{0%{opacity:0;margin-top:0;transform:translate(-50%) scale(.6)}20%{opacity:1;transform:translate(-50%) scale(1.15)}to{opacity:0;margin-top:46px;transform:translate(-50%) scale(1)}}.kg-levelup .scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at center,#1e143c40,#140c288c);animation:lvl-in .4s ease}.kg-levelup .rays{position:absolute;width:130vmin;height:130vmin;border-radius:50%;background:repeating-conic-gradient(rgba(255,222,89,.28) 0deg 12deg,transparent 12deg 24deg);animation:rays-spin 9s linear infinite;-webkit-mask-image:radial-gradient(circle,#000 0%,transparent 62%);mask-image:radial-gradient(circle,#000 0%,transparent 62%)}@keyframes rays-spin{to{transform:rotate(360deg)}}.kg-levelup .fly{position:absolute;font-size:2.2rem;left:50%;top:50%;animation:star-fly 1.6s ease-out var(--d) forwards}@keyframes star-fly{0%{transform:translate(-50%,-50%) rotate(var(--a)) translateY(0) scale(.3);opacity:0}15%{opacity:1}to{transform:translate(-50%,-50%) rotate(var(--a)) translateY(-46vmin) scale(1.25);opacity:0}}.kg-levelup .medallion{width:110px;height:110px;margin:0 auto 10px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:3.4rem;background:radial-gradient(circle at 32% 28%,#fff8dc,#ffd93d 60%,#e8a400);border:6px solid #fff;box-shadow:0 0 0 5px #e8a400,0 0 40px #ffd93de6,0 14px 30px #50280066;animation:medallion-pop .6s cubic-bezier(.2,2,.4,1)}@keyframes medallion-pop{0%{transform:scale(0) rotate(-180deg)}}.kg-levelup .ribbon{margin-top:14px;display:inline-block;background:linear-gradient(180deg,#8f6bff,#6c3fe0);color:#fff;font-weight:800;font-size:1.05rem;letter-spacing:1px;padding:8px 26px;border-radius:999px;box-shadow:0 5px #4a2aa8,0 10px 24px #00000059;animation:big-pop .6s cubic-bezier(.2,2.2,.4,1) .15s backwards}.kg-badge-banner{overflow:hidden;padding:16px 30px 16px 20px}.kg-badge-banner .medal{position:relative;width:66px;height:66px;flex:none;display:flex;align-items:center;justify-content:center}.kg-badge-banner .medal .mface{width:58px;height:58px;border-radius:50%;z-index:2;display:flex;align-items:center;justify-content:center;font-size:1.9rem;background:radial-gradient(circle at 32% 28%,#fff8dc,#ffd93d 62%,#e8a400);border:4px solid #fff;box-shadow:0 0 0 3px #e8a400,0 6px 14px #78500066;animation:medal-flip .9s cubic-bezier(.2,1.4,.4,1)}@keyframes medal-flip{0%{transform:rotateY(540deg) scale(.2)}}.kg-badge-banner .medal .rib{position:absolute;top:44px;width:16px;height:30px;z-index:1;background:linear-gradient(180deg,#ff8a80,#d84a3e);clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%)}.kg-badge-banner .medal .rib.l{left:10px;transform:rotate(14deg)}.kg-badge-banner .medal .rib.r{right:10px;transform:rotate(-14deg)}.kg-badge-banner .btxt b{font-size:1.05rem;letter-spacing:.5px;color:#8a6d00}.kg-badge-banner .shine{position:absolute;top:-60%;left:-30%;width:40%;height:220%;background:linear-gradient(75deg,transparent,rgba(255,255,255,.8),transparent);transform:rotate(8deg);animation:banner-shine 1.6s ease .3s;pointer-events:none}@keyframes banner-shine{0%{left:-40%}to{left:130%}}.trophy-case .tc-count{font-family:var(--font-title);font-weight:800;color:#8a6d00;background:#fff3b8;border-radius:999px;display:inline-block;padding:6px 20px;margin-bottom:8px}.trophy-case .tc-game{font-family:var(--font-title);font-weight:800;font-size:1.15rem;margin:14px 0 6px;text-align:left}.trophy-case .tc-row{display:flex;gap:12px;flex-wrap:wrap}.trophy-case .tc-badge{width:104px;padding:10px 6px;border-radius:16px;text-align:center;background:linear-gradient(180deg,#fff,#fff3d6);border:3px solid #ffd93d;box-shadow:0 5px 14px #7850002e;position:relative;overflow:hidden}.trophy-case .tc-badge.won:after{content:"";position:absolute;top:-60%;left:-40%;width:40%;height:220%;background:linear-gradient(75deg,transparent,rgba(255,255,255,.85),transparent);transform:rotate(8deg);animation:banner-shine 2.6s ease infinite}.trophy-case .tc-badge.locked{filter:grayscale(1);opacity:.55;border-color:#c8cdd8;background:#f2f4f8}.trophy-case .tcb{font-size:2rem;display:block}.trophy-case .tcn{font-size:.78rem;font-weight:700;display:block;margin-top:4px;line-height:1.2}.trophy-case{max-height:74vh;overflow-y:auto}.trophy-case .tc-progress{height:14px;background:#eee3c0;border-radius:999px;overflow:hidden;margin:10px auto 4px;max-width:380px;box-shadow:inset 0 2px 4px #78500033}.trophy-case .tc-progress i{display:block;height:100%;background:linear-gradient(90deg,#ffd93d,#ff9d3f);border-radius:999px;transition:width .8s cubic-bezier(.2,1.2,.4,1)}.trophy-case .tc-badge.won:hover{animation:tc-wobble .5s ease}@keyframes tc-wobble{0%,to{transform:rotate(0)}25%{transform:rotate(-5deg) scale(1.06)}75%{transform:rotate(5deg) scale(1.06)}}
