.fee-game{--fee-primary:#6C4CF1;--fee-accent:#FFB703;--fee-ink:#19324a;--fee-soft:#f6f8ff;--fee-good:#21a179;--fee-bad:#e85d75;max-width:980px;margin:24px auto;font-family:Nunito,"Segoe UI",Arial,sans-serif;color:var(--fee-ink);box-sizing:border-box}
.fee-game *{box-sizing:border-box}
.fee-game button,.fee-game input{font:inherit}
.fee-loading{min-height:360px;display:flex;align-items:center;justify-content:center;gap:12px;border-radius:28px;background:linear-gradient(135deg,#efeaff,#fff6d6);font-weight:800;box-shadow:0 18px 55px rgba(46,39,104,.14)}
.fee-loading-orb{font-size:34px;animation:feePulse 1.2s infinite alternate}
@keyframes feePulse{to{transform:scale(1.2) rotate(10deg)}}
.fee-shell{position:relative;overflow:hidden;border-radius:30px;min-height:610px;background:radial-gradient(circle at 12% 8%,rgba(255,255,255,.9) 0 8%,transparent 9%),radial-gradient(circle at 88% 12%,rgba(255,255,255,.65) 0 6%,transparent 7%),linear-gradient(155deg,#dff8ff 0,#eee7ff 42%,#fff7cf 100%);box-shadow:0 24px 70px rgba(50,41,105,.18);border:1px solid rgba(108,76,241,.12)}
.fee-shell:before,.fee-shell:after{content:"";position:absolute;border-radius:50%;filter:blur(1px);opacity:.32;pointer-events:none}.fee-shell:before{width:280px;height:280px;background:#70d6ff;left:-120px;bottom:-110px}.fee-shell:after{width:250px;height:250px;background:#ffcf70;right:-100px;top:-90px}
.fee-topbar{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;padding:18px 22px;background:rgba(255,255,255,.72);backdrop-filter:blur(12px);border-bottom:1px solid rgba(108,76,241,.12)}
.fee-brand{display:flex;align-items:center;gap:12px;min-width:0}.fee-logo{width:52px;height:52px;border-radius:16px;object-fit:contain;background:#fff;padding:5px;box-shadow:0 5px 15px rgba(25,50,74,.12)}
.fee-brand-badge{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,var(--fee-primary),#9a7cff);color:#fff;font-size:27px;box-shadow:0 7px 18px rgba(108,76,241,.25)}
.fee-brand h2{margin:0;font-size:clamp(18px,2.3vw,28px);line-height:1.05;color:#33236f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fee-brand small{display:block;margin-top:4px;color:#617087;font-weight:700}
.fee-stats{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.fee-pill{background:#fff;border:1px solid rgba(108,76,241,.12);border-radius:999px;padding:8px 11px;font-weight:900;box-shadow:0 4px 12px rgba(33,30,74,.07);font-size:14px}.fee-pill strong{color:#4b35b4}.fee-hearts{letter-spacing:2px}
.fee-progress-wrap{position:relative;z-index:2;padding:14px 22px 0}.fee-progress{height:12px;background:rgba(255,255,255,.7);border-radius:999px;overflow:hidden;border:1px solid rgba(108,76,241,.12)}.fee-progress > i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--fee-primary),#9a7cff,var(--fee-accent));border-radius:999px;transition:width .45s ease}.fee-map{display:flex;justify-content:space-between;gap:8px;margin-top:9px}.fee-map span{font-size:11px;font-weight:900;color:#718096;text-align:center;flex:1}.fee-map span.is-active{color:#4a33b5}
.fee-stage{position:relative;z-index:2;padding:24px;min-height:500px}.fee-panel{background:rgba(255,255,255,.92);border-radius:26px;padding:clamp(18px,3.5vw,34px);box-shadow:0 18px 45px rgba(52,42,106,.11);border:1px solid rgba(108,76,241,.10)}
.fee-hero{text-align:center;padding:14px 6px}.fee-hero-art{display:flex;justify-content:center;gap:8px;align-items:flex-end;font-size:clamp(48px,8vw,82px);filter:drop-shadow(0 12px 15px rgba(45,38,93,.13))}.fee-hero-art span:nth-child(2){transform:translateY(-12px) scale(1.12)}.fee-kicker{display:inline-block;margin:14px 0 6px;padding:7px 12px;border-radius:999px;background:#f0edff;color:#5d43d4;font-weight:900;font-size:13px;letter-spacing:.04em;text-transform:uppercase}.fee-hero h1{font-size:clamp(31px,5vw,52px);line-height:1.03;margin:7px auto 12px;max-width:760px;color:#2d225e}.fee-hero p{max-width:720px;margin:0 auto 16px;font-size:17px;line-height:1.7;color:#53657a}.fee-input-row{display:flex;gap:10px;max-width:570px;margin:20px auto 8px}.fee-input{flex:1;border:2px solid #d8d5f5;border-radius:17px;padding:14px 16px;background:#fff;outline:none;font-weight:800;color:#2d3550}.fee-input:focus{border-color:var(--fee-primary);box-shadow:0 0 0 4px rgba(108,76,241,.12)}
.fee-btn{appearance:none;border:0;border-radius:16px;padding:13px 18px;font-weight:900;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease;display:inline-flex;align-items:center;justify-content:center;gap:8px}.fee-btn:hover{transform:translateY(-2px)}.fee-btn:active{transform:translateY(0)}.fee-btn-primary{background:linear-gradient(135deg,var(--fee-primary),#8f74ff);color:#fff;box-shadow:0 10px 24px rgba(108,76,241,.28)}.fee-btn-accent{background:linear-gradient(135deg,var(--fee-accent),#ff8a00);color:#4d2b00;box-shadow:0 10px 22px rgba(255,183,3,.24)}.fee-btn-soft{background:#f0edff;color:#4c37b6}.fee-btn-ghost{background:#fff;color:#4c37b6;border:2px solid #dcd7ff}.fee-btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
.fee-feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:730px;margin:24px auto 0}.fee-feature{padding:14px;border-radius:18px;background:linear-gradient(180deg,#fff,#f9f8ff);border:1px solid #ebe8ff;text-align:left}.fee-feature b{display:block;margin:4px 0 3px;color:#39296f}.fee-feature span{font-size:13px;color:#6a7686;line-height:1.4}
.fee-mission-head{display:flex;gap:16px;align-items:center;margin-bottom:18px}.fee-avatar{width:74px;height:74px;border-radius:22px;display:grid;place-items:center;font-size:46px;background:linear-gradient(135deg,#fff4cc,#f0e9ff);box-shadow:inset 0 0 0 1px rgba(108,76,241,.1)}.fee-mission-head h3{margin:0 0 6px;font-size:clamp(22px,3.5vw,32px);color:#30245f}.fee-mission-head p{margin:0;color:#607188;line-height:1.55}.fee-story{background:linear-gradient(135deg,#f8fbff,#fffaf1);border-left:5px solid var(--fee-accent);padding:16px 18px;border-radius:16px;margin:16px 0;font-size:16px;line-height:1.65;color:#43556b}.fee-question{font-size:20px;font-weight:900;color:#263a52;margin:20px 0 12px}.fee-options{display:grid;grid-template-columns:1fr 1fr;gap:11px}.fee-option{border:2px solid #e4e3f6;background:#fff;padding:14px;border-radius:17px;text-align:left;cursor:pointer;font-weight:800;color:#3f5063;min-height:66px;transition:.16s ease}.fee-option:hover{border-color:#b8adff;transform:translateY(-1px);box-shadow:0 7px 18px rgba(61,47,133,.08)}.fee-option.is-correct{background:#e9fff6;border-color:#53c69c;color:#156748}.fee-option.is-wrong{background:#fff0f3;border-color:#ef8ca0;color:#8b3044}.fee-option:disabled{cursor:default}
.fee-feedback{margin-top:14px;padding:13px 15px;border-radius:15px;font-weight:800;line-height:1.5}.fee-feedback.good{background:#e8fff5;color:#1b6a50}.fee-feedback.bad{background:#fff0f4;color:#8b3246}.fee-next{margin-top:16px;display:flex;justify-content:flex-end}
.fee-sort-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.fee-item{position:relative;min-height:130px;padding:16px 12px;border:2px solid #e6e3f8;border-radius:20px;background:#fff;text-align:center;cursor:pointer;transition:.18s ease}.fee-item:hover{transform:translateY(-3px);box-shadow:0 10px 23px rgba(64,48,140,.1)}.fee-item .emoji{display:block;font-size:38px;margin-bottom:8px}.fee-item b{display:block;color:#34475c}.fee-item.is-picked{border-color:#50c69a;background:#eafff6}.fee-item.is-bad{border-color:#ef8da3;background:#fff2f5}.fee-counter{text-align:center;font-weight:900;color:#5c48be;margin:10px 0}
.fee-memory{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0}.fee-mem{height:106px;border:0;border-radius:18px;cursor:pointer;position:relative;perspective:800px;background:transparent;padding:0}.fee-mem-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .34s ease}.fee-mem.is-open .fee-mem-inner,.fee-mem.is-match .fee-mem-inner{transform:rotateY(180deg)}.fee-mem-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:18px;display:grid;place-items:center;padding:8px;text-align:center;font-weight:900;border:2px solid #ddd8ff;box-shadow:0 7px 15px rgba(55,43,119,.08)}.fee-mem-back{background:linear-gradient(135deg,var(--fee-primary),#9b81ff);color:#fff;font-size:31px}.fee-mem-front{transform:rotateY(180deg);background:#fff;color:#33495d;font-size:13px}.fee-mem-front .big{font-size:30px;display:block;margin-bottom:4px}.fee-mem.is-match .fee-mem-front{background:#eafff6;border-color:#4fc797}
.fee-tap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.fee-tap{border:2px solid #e2dff7;background:#fff;border-radius:20px;min-height:105px;padding:12px;cursor:pointer;text-align:center;font-weight:900;color:#3d5063}.fee-tap .emoji{display:block;font-size:34px;margin-bottom:7px}.fee-tap.is-good{border-color:#55c79b;background:#eafff5}.fee-tap.is-bad{border-color:#ef8da2;background:#fff1f4}.fee-timer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:15px;background:#f5f2ff;font-weight:900;color:#513ab8}.fee-timerbar{height:9px;flex:1;border-radius:99px;background:#ddd8ff;overflow:hidden}.fee-timerbar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#45c994,var(--fee-accent));transition:width 1s linear}
.fee-finish{text-align:center}.fee-trophy{font-size:78px;filter:drop-shadow(0 11px 12px rgba(75,55,152,.14));animation:feeFloat 2s ease-in-out infinite alternate}@keyframes feeFloat{to{transform:translateY(-8px)}}.fee-finish h2{font-size:clamp(28px,4.5vw,45px);margin:8px 0;color:#30245f}.fee-score-ring{width:145px;height:145px;border-radius:50%;margin:18px auto;display:grid;place-items:center;background:conic-gradient(var(--fee-primary) var(--score-angle),#e8e5f8 0);position:relative}.fee-score-ring:after{content:"";position:absolute;width:112px;height:112px;border-radius:50%;background:white}.fee-score-ring strong{z-index:1;font-size:33px;color:#3f2f92}.fee-score-ring small{z-index:1;position:absolute;margin-top:47px;font-weight:900;color:#78859a}.fee-reward-card{max-width:520px;margin:22px auto;padding:22px;border-radius:25px;background:linear-gradient(145deg,#2f2265,#654bd3 55%,#ffb703 145%);color:white;text-align:left;box-shadow:0 18px 40px rgba(45,31,106,.26);position:relative;overflow:hidden}.fee-reward-card:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:rgba(255,255,255,.12);right:-55px;top:-75px}.fee-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.fee-card-rarity{font-size:11px;font-weight:1000;letter-spacing:.12em;text-transform:uppercase;background:rgba(255,255,255,.16);padding:6px 9px;border-radius:999px}.fee-card-animal{font-size:78px;margin:10px 0;text-align:center;filter:drop-shadow(0 10px 8px rgba(0,0,0,.15))}.fee-card-name{font-size:26px;font-weight:1000}.fee-card-power{margin-top:4px;color:#fff4bd;font-weight:900}.fee-card-desc{font-size:14px;line-height:1.55;margin-top:10px;color:#f1edff}.fee-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:18px}.fee-note{font-size:12px;color:#758298;line-height:1.5;margin-top:12px}.fee-footer{position:relative;z-index:2;padding:14px 22px 18px;text-align:center;color:#617087;font-size:12px;font-weight:700}
.fee-confetti{position:absolute;z-index:20;top:-12px;width:10px;height:16px;border-radius:3px;animation:feeFall 2.4s linear forwards;pointer-events:none}@keyframes feeFall{to{transform:translateY(720px) rotate(720deg);opacity:.2}}
.fee-toast{position:absolute;left:50%;bottom:18px;z-index:30;transform:translate(-50%,20px);background:#25344c;color:#fff;padding:10px 14px;border-radius:999px;font-weight:900;opacity:0;transition:.2s ease;pointer-events:none}.fee-toast.show{opacity:1;transform:translate(-50%,0)}
.fee-certificate-preview{border:10px double #6c4cf1;border-radius:15px;background:#fffdf6;padding:28px;margin:20px auto;max-width:760px;text-align:center;box-shadow:0 13px 33px rgba(58,43,125,.12)}.fee-certificate-preview h3{font-family:Georgia,serif;font-size:32px;color:#3c2a88;margin:6px 0}.fee-certificate-preview .cert-name{font-family:Georgia,serif;font-size:30px;color:#172c45;border-bottom:2px solid #e4c35a;display:inline-block;padding:3px 20px 6px;margin:10px 0}.fee-certificate-preview p{line-height:1.6;color:#56667a}.fee-certificate-preview .cert-score{font-size:21px;font-weight:1000;color:#4e38ba}.fee-cert-sign{margin-top:28px;display:flex;justify-content:flex-end}.fee-cert-sign div{width:270px}.fee-cert-sign b{display:block;margin-top:34px}
@media (max-width:760px){.fee-topbar{grid-template-columns:1fr}.fee-stats{justify-content:flex-start}.fee-feature-row,.fee-options{grid-template-columns:1fr}.fee-sort-grid,.fee-tap-grid{grid-template-columns:1fr 1fr}.fee-memory{grid-template-columns:repeat(3,1fr)}.fee-input-row{flex-direction:column}.fee-brand h2{white-space:normal}.fee-map span{font-size:9px}.fee-stage{padding:14px}.fee-panel{padding:18px}.fee-mission-head{align-items:flex-start}.fee-avatar{width:62px;height:62px;font-size:38px}.fee-shell{border-radius:20px}.fee-cert-sign{justify-content:center}}
@media (max-width:480px){.fee-sort-grid,.fee-tap-grid{grid-template-columns:1fr}.fee-memory{grid-template-columns:repeat(2,1fr)}.fee-topbar{padding:14px}.fee-progress-wrap{padding:10px 14px 0}.fee-brand-badge,.fee-logo{width:44px;height:44px}.fee-stats{gap:5px}.fee-pill{font-size:12px;padding:6px 8px}.fee-card-animal{font-size:65px}}
@media (prefers-reduced-motion:reduce){.fee-game *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}