@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#292338;--muted:#82798e;--pink:#f17ba9;--rose:#ffe8f1;--violet:#8d71c8;--line:#f1e7ef;--surface:#fff;--bg:#fff9fc;--shadow:0 12px 34px rgba(98,53,94,.09)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:14px}.app-shell{max-width:760px;margin:0 auto;min-height:100vh;padding:0 16px 30px;background:linear-gradient(180deg,#fff7fb 0,#fff 330px,#fff 100%)}button,input,select{font:inherit}button{cursor:pointer}.topbar{height:70px;display:flex;align-items:center;gap:11px;position:sticky;top:0;z-index:5;background:rgba(255,249,252,.92);backdrop-filter:blur(12px);border-bottom:1px solid #f6eaf1}.brand-mark{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#f7a4c4,#9a7de0);color:white;font:800 24px Manrope;box-shadow:0 6px 16px #e6b0d1}.brand-copy{display:flex;flex-direction:column;gap:2px}.brand-copy strong{font:800 16px Manrope;letter-spacing:1px}.brand-copy span{font-size:10px;color:var(--muted);letter-spacing:1.7px}.icon-button{margin-left:auto;border:0;border-radius:13px;width:42px;height:42px;background:#fff;color:#a25b8a;font-size:25px}.hero{position:relative;overflow:hidden;border-radius:25px;margin:17px 0 14px;padding:24px 21px;min-height:230px;background:linear-gradient(120deg,#ffe2ef 0%,#f4e8ff 53%,#e8e9ff 100%);box-shadow:var(--shadow)}.hero-glow{position:absolute;width:200px;height:200px;right:-60px;top:-55px;border-radius:50%;background:radial-gradient(circle,#fff 0,#f6a8cc 25%,#c9b1f1 65%,transparent 70%);opacity:.8}.hero-copy{position:relative;z-index:1;max-width:77%}.eyebrow{font-size:9px;letter-spacing:1.8px;font-weight:800;color:#9b5786}.hero h1{font:800 clamp(27px,7vw,38px)/1.08 Manrope;margin:11px 0 9px;letter-spacing:-1.4px}.hero h1 em{font-style:normal;color:#a260b6}.hero p{font-size:12px;line-height:1.55;color:#6e617e;margin:0 0 17px;max-width:310px}.hero-orb{position:absolute;right:17px;bottom:30px;width:68px;height:68px;border-radius:23px;display:grid;place-items:center;font-size:38px;color:#fff;background:linear-gradient(145deg,#e990bc,#9d81d9);transform:rotate(9deg);box-shadow:0 12px 22px #d6a4d0}.primary{border:0;border-radius:12px;background:#30243e;color:white;padding:11px 15px;font-size:12px;font-weight:700;box-shadow:0 6px 14px #a994ba44}.primary span{margin-left:9px}.status-banner{padding:11px 13px;border-radius:12px;background:#fff0d9;color:#82531d;margin:12px 0;font-size:12px}.quick-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:13px 0 18px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:14px 13px;box-shadow:0 5px 18px #9b63820b}.stat-card span{display:block;font-size:9px;letter-spacing:1.1px;font-weight:800;color:#93889b}.stat-card strong{display:block;font:800 25px Manrope;margin:5px 0 3px;letter-spacing:-.6px}.stat-card small{font-size:10px;color:var(--muted)}.stat-card.pink{background:linear-gradient(135deg,#fff0f6,#fff 85%)}.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:5px;background:#f8eff5;border-radius:15px;margin:0 0 22px}.tab{border:0;background:transparent;border-radius:11px;padding:9px 3px;color:#918397;display:flex;align-items:center;justify-content:center;gap:6px;font-size:16px}.tab span{font-size:11px;font-weight:700}.tab.active{background:#fff;color:#a65d91;box-shadow:0 3px 10px #6c42620e}.section-head{display:flex;align-items:end;justify-content:space-between;margin:8px 0 13px}.section-head h2{font:800 21px Manrope;margin:4px 0 0;letter-spacing:-.6px}.section-head p{margin:5px 0 0;color:var(--muted);font-size:11px}.kicker{font-size:9px;font-weight:800;letter-spacing:1.5px;color:#c16e9d}.search{width:100%;border:1px solid var(--line);border-radius:13px;padding:13px 14px;background:#fff;outline:none;margin:0 0 13px}.search:focus,input:focus,select:focus{border-color:#e3a1c4;box-shadow:0 0 0 3px #fbe6f1}.category-row{display:flex;gap:7px;overflow-x:auto;padding:1px 0 12px;scrollbar-width:none}.category-row::-webkit-scrollbar{display:none}.chip{border:1px solid #f0e4ee;background:#fff;color:#82748b;border-radius:999px;padding:8px 12px;white-space:nowrap;font-size:11px;font-weight:700}.chip.active{background:#38283f;color:white;border-color:#38283f}.game-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.game-card{overflow:hidden;background:white;border:1px solid var(--line);border-radius:17px;box-shadow:0 6px 20px #6f426b08}.game-visual{height:95px;display:grid;place-items:center;font-size:42px;position:relative;background:linear-gradient(135deg,#ffe2ee,#e8dcff)}.game-card:nth-child(3n+2) .game-visual{background:linear-gradient(135deg,#d9f6f0,#e7e4ff)}.game-card:nth-child(3n) .game-visual{background:linear-gradient(135deg,#fff0ce,#ffd9e6)}.game-visual small{position:absolute;left:9px;top:9px;font-size:8px;letter-spacing:.8px;color:#8b648d;background:#ffffffb8;padding:5px 7px;border-radius:999px;font-weight:800}.game-info{padding:12px}.game-info h3{font:800 13px Manrope;margin:0 0 5px}.game-info p{margin:0 0 11px;color:var(--muted);font-size:10px}.game-info button{width:100%;border:0;border-radius:10px;padding:10px 8px;background:#fff0f6;color:#a04f83;font-size:11px;font-weight:800}.empty{padding:30px 14px;text-align:center;color:var(--muted);background:#fff;border:1px dashed #eadbe8;border-radius:16px}.list-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:14px;margin-bottom:10px}.row-between{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.list-card h3{font:800 13px Manrope;margin:0 0 6px}.list-card p{margin:3px 0;color:var(--muted);font-size:11px;line-height:1.5}.price{font:800 16px Manrope;color:#a5578d;white-space:nowrap}.pill{display:inline-block;border-radius:999px;padding:5px 8px;background:#f6edf8;color:#8560a5;font-size:9px;font-weight:800}.pill.completed{background:#e6f7ed;color:#34845a}.pill.pending{background:#fff3df;color:#a06a20}.reward-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.reward-card{background:linear-gradient(140deg,#fff0f7,#fff);border:1px solid #f0dce9;border-radius:17px;padding:15px}.reward-card .gift{font-size:25px}.reward-card strong{display:block;font:800 23px Manrope;margin:7px 0 2px}.reward-card p{font-size:11px;color:var(--muted);margin:0 0 12px}.reward-card button,.secondary{width:100%;border:1px solid #ead6e7;background:white;color:#a45a8c;border-radius:10px;padding:10px;font-weight:800;font-size:11px}.reward-card button:disabled{opacity:.45;cursor:not-allowed}.profile-box{padding:18px;border-radius:18px;background:linear-gradient(130deg,#fff0f7,#f3edff);margin-bottom:12px}.avatar{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(145deg,#ee9dc2,#a68bdf);color:#fff;font:800 23px Manrope;margin-bottom:12px}.profile-box h2{font:800 20px Manrope;margin:0 0 4px}.profile-box p{margin:0;color:var(--muted);font-size:11px}.form-field{display:block;margin:12px 0}.form-field span{display:block;font-size:11px;font-weight:700;margin-bottom:6px}.form-field input,.form-field select{width:100%;border:1px solid var(--line);border-radius:11px;padding:12px;background:#fff;outline:none}.full{width:100%;margin-top:8px}.modal-backdrop{position:fixed;inset:0;background:#24172e88;z-index:20;display:flex;align-items:flex-end;justify-content:center;padding:12px}.modal{width:min(100%,500px);max-height:90vh;overflow:auto;border-radius:22px 22px 17px 17px;background:#fff;padding:20px;box-shadow:0 20px 80px #22132b44}.modal-top{display:flex;justify-content:space-between;align-items:center}.modal h2{font:800 20px Manrope;margin:0}.close{border:0;background:#f8eff5;border-radius:10px;width:34px;height:34px;color:#8e6485;font-size:20px}.modal .muted{color:var(--muted);font-size:11px;line-height:1.5}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:50;background:#30243e;color:#fff;padding:12px 16px;border-radius:12px;font-size:12px;max-width:90vw;transition:.2s;box-shadow:var(--shadow)}.toast.show{opacity:1;transform:translate(-50%,0)}footer{text-align:center;color:#b3a5b5;font-size:9px;letter-spacing:1px;padding:28px 0 8px}footer span{display:block;margin-top:5px;letter-spacing:0}@media(min-width:600px){.app-shell{padding:0 25px 35px}.hero{padding:30px 28px}.game-visual{height:125px}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.game-visual{overflow:hidden;isolation:isolate}.game-visual .game-banner{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62;z-index:0}.game-visual .game-icon{width:56px;height:56px;object-fit:contain;filter:drop-shadow(0 4px 8px #34203b55);z-index:1}.game-visual small{z-index:2}.game-visual span{z-index:1}
