:root{--bg:#050608;--panel:#0d1015;--panel2:#151923;--line:#282f3d;--red:#e32323;--silver:#d9dde5;--muted:#8a93a3;--rare:#3da3ff;--epic:#b85cff;--legendary:#ffb526;--mythic:#ff4fd8;--success:#62d68a;--danger:#ff6262}
*{box-sizing:border-box}html,body{margin:0;background:#000;color:#f6f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}body{min-height:100vh;background:radial-gradient(circle at 50% -10%,#291010 0,#0b0d12 28%,#030405 68%)}button{font:inherit;color:inherit}#app{width:min(100%,480px);min-height:100vh;margin:auto;background:linear-gradient(180deg,rgba(8,10,14,.96),rgba(3,4,6,.99));position:relative;overflow:hidden;padding-bottom:84px;box-shadow:0 0 70px #000}
.topbar{position:sticky;top:0;z-index:20;background:rgba(5,6,8,.93);backdrop-filter:blur(16px);border-bottom:1px solid #252832;padding:12px 14px 10px}.brandrow{display:flex;align-items:center;justify-content:space-between;gap:10px}.brand{font-weight:1000;font-style:italic;letter-spacing:.4px;font-size:21px}.brand span{color:var(--red)}.resources{display:flex;gap:7px}.chip{font-size:12px;font-weight:900;background:#141820;border:1px solid #2c3340;border-radius:99px;padding:6px 9px}.chip b{color:#fff}.seasonbar{display:flex;justify-content:space-between;margin-top:8px;color:var(--muted);font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.7px}.screen{display:none;padding:14px}.screen.active{display:block}.hero{border:1px solid #343947;border-radius:20px;overflow:hidden;position:relative;background:#10141c;margin-bottom:14px;min-height:230px}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,6,8,.05),rgba(5,6,8,.7) 58%,rgba(5,6,8,.95));pointer-events:none}.hero img{width:100%;height:240px;object-fit:cover;object-position:center 20%;filter:saturate(1.08) contrast(1.05)}.hero-copy{position:absolute;right:15px;top:18px;z-index:2;text-align:right;width:54%}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:1.3px;color:#ff7c7c;font-weight:950}.hero h1{font-size:30px;line-height:.94;margin:8px 0}.hero p{font-size:12px;color:#c9ced8;line-height:1.4}.btn{border:0;background:linear-gradient(180deg,#f13a32,#bd1616);font-weight:1000;text-transform:uppercase;letter-spacing:.5px;padding:12px 14px;border-radius:12px;box-shadow:0 8px 25px rgba(227,35,35,.22);cursor:pointer}.btn.secondary{background:#171c25;border:1px solid #333b49;box-shadow:none}.btn.gold{background:linear-gradient(180deg,#ffc84d,#c98000);color:#171000}.btn:disabled{opacity:.35;cursor:not-allowed}.section-title{display:flex;align-items:end;justify-content:space-between;margin:18px 2px 9px}.section-title h2{margin:0;font-size:18px;text-transform:uppercase;font-style:italic}.section-title small{color:var(--muted);font-size:11px}.card{background:linear-gradient(180deg,#121720,#0b0e13);border:1px solid #282f3a;border-radius:16px;padding:14px}.idle{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.idle .big{font-size:26px;font-weight:1000}.muted{color:var(--muted)}.rewardline{font-size:12px;margin-top:4px}.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.quick{padding:14px;border-radius:14px;background:#10151d;border:1px solid #272f3c;min-height:100px}.quick b{display:block;font-size:26px}.quick span{font-size:11px;color:var(--muted);text-transform:uppercase;font-weight:900}.lineup-list{display:grid;gap:9px}.player-row{display:grid;grid-template-columns:50px 1fr auto;align-items:center;gap:10px;background:#0f131a;border:1px solid #282e38;border-radius:14px;padding:8px;cursor:pointer}.player-row img,.avatar{width:50px;height:58px;border-radius:10px;object-fit:cover;border:1px solid #3a4050;background:#181c24}.player-row .name{font-weight:950}.player-row .sub{font-size:11px;color:var(--muted);margin-top:2px}.ovr{font-size:22px;font-weight:1000;font-style:italic}.rarity-Rare{color:var(--rare)}.rarity-Epic{color:var(--epic)}.rarity-Legendary{color:var(--legendary)}.rarity-Mythic{color:var(--mythic)}.scout-banner{position:relative;overflow:hidden;padding:0;min-height:315px}.scout-banner img{width:100%;height:315px;object-fit:cover}.scout-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(5,5,8,.2) 35%,rgba(5,5,8,.97) 80%)}.banner-copy{position:absolute;left:15px;right:15px;bottom:14px;z-index:2}.banner-copy h2{font-size:28px;margin:4px 0}.banner-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}.pity{font-size:11px;color:#d5d8df}.progress{height:6px;background:#262b35;border-radius:99px;overflow:hidden;margin-top:5px}.progress>div{height:100%;background:linear-gradient(90deg,#8237ff,#ff4fd8);width:0}.result-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:10px}.pull-card{position:relative;border:1px solid #353b49;border-radius:14px;overflow:hidden;background:#0c0f14;min-height:215px}.pull-card img{width:100%;height:150px;object-fit:cover}.pull-card .info{padding:8px}.pull-card b{display:block;font-size:13px}.pull-card small{color:var(--muted)}.rarity-strip{height:3px}.strip-Rare{background:var(--rare)}.strip-Epic{background:var(--epic)}.strip-Legendary{background:var(--legendary)}.strip-Mythic{background:var(--mythic)}.matchup{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;text-align:center;gap:9px;padding:18px 8px}.team-badge{width:72px;height:72px;border-radius:20px;margin:auto;display:grid;place-items:center;font-weight:1000;font-size:24px;border:1px solid #454c5c;background:linear-gradient(145deg,#222835,#0c0f14)}.vs{font-weight:1000;color:var(--red);font-size:18px}.score{font-size:30px;font-weight:1000}.game-log{max-height:230px;overflow:auto;display:grid;gap:7px}.logitem{padding:10px;border-left:3px solid #4d5564;background:#11151c;border-radius:8px;font-size:12px}.logitem.win{border-color:var(--success)}.logitem.loss{border-color:var(--danger)}.table{width:100%;border-collapse:collapse;font-size:12px}.table th,.table td{padding:9px 5px;border-bottom:1px solid #272d37;text-align:left}.table th{font-size:10px;color:var(--muted);text-transform:uppercase}.nav{position:fixed;z-index:30;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,480px);height:74px;display:grid;grid-template-columns:repeat(5,1fr);background:rgba(7,9,12,.97);border-top:1px solid #2d333f;backdrop-filter:blur(18px)}.nav button{background:none;border:0;color:#7d8797;font-size:10px;font-weight:950;text-transform:uppercase;display:grid;place-items:center;padding:8px 2px;cursor:pointer}.nav button span{font-size:22px;line-height:1}.nav button.active{color:white}.nav button.active span{filter:drop-shadow(0 0 8px rgba(227,35,35,.8))}.modal{position:fixed;z-index:80;inset:0;background:rgba(0,0,0,.84);display:none;align-items:end;justify-content:center}.modal.open{display:flex}.sheet{width:min(100%,480px);max-height:88vh;overflow:auto;background:#0b0e13;border:1px solid #343a47;border-radius:24px 24px 0 0;padding:16px}.detail-hero{aspect-ratio:1/1;max-height:360px;border-radius:18px;overflow:hidden;position:relative;display:flex;align-items:flex-end;justify-content:center;background:radial-gradient(circle at center top,#1a2230 0%,#0b0e13 72%)}.detail-hero img{width:100%;height:100%;object-fit:contain;object-position:center top;filter:saturate(1.05) contrast(1.02)}.detail-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(11,14,19,.92) 100%)}.detail-name{position:absolute;z-index:2;left:14px;right:14px;bottom:12px}.detail-name h2{margin:0;font-size:25px;line-height:1.02}.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.stat{background:#121720;border:1px solid #262d39;border-radius:11px;padding:10px}.stat small{color:var(--muted);text-transform:uppercase}.stat b{display:block;font-size:18px}.toast{position:fixed;z-index:100;left:50%;transform:translateX(-50%);top:86px;width:min(calc(100% - 32px),440px);background:#181d26;border:1px solid #3c4554;border-radius:12px;padding:11px 14px;opacity:0;pointer-events:none;transition:.25s;font-weight:850;font-size:13px}.toast.show{opacity:1;transform:translate(-50%,8px)}.empty{text-align:center;color:var(--muted);padding:25px 10px;font-size:13px}.mini-label{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);font-weight:900}.stars{letter-spacing:1px}.divider{height:1px;background:#272d37;margin:12px 0}
@media(min-width:481px){body{padding:16px 0}#app{border:1px solid #222731;border-radius:28px;min-height:calc(100vh - 32px)}.nav{bottom:16px;border-radius:0 0 28px 28px}}
.result-head{border-radius:18px;padding:18px;text-align:center;border:1px solid #303744;background:linear-gradient(180deg,#151a23,#0c0f14)}.result-head.result-win{box-shadow:inset 0 0 0 1px rgba(98,214,138,.2)}.result-head.result-loss{box-shadow:inset 0 0 0 1px rgba(255,98,98,.18)}.result-head h2{margin:4px 0 12px;font-size:28px;font-style:italic}.result-win h2{color:var(--success)}.result-loss h2{color:var(--danger)}.final-score{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center}.final-score div{display:grid;gap:3px}.final-score small{font-size:10px;color:var(--muted);font-weight:900}.final-score b{font-size:42px;line-height:1}.final-score span{font-size:24px;color:var(--muted);font-weight:900}.mvp-card{display:grid;grid-template-columns:104px 1fr;gap:12px;align-items:center;margin-top:12px;background:#10151d;border:1px solid #2b3340;border-radius:16px;padding:10px}.mvp-card img{width:104px;height:104px;object-fit:cover;border-radius:12px;border:1px solid #3a4250}.mvp-card h3{margin:3px 0 7px;font-size:20px}.mvp-stats{display:flex;flex-wrap:wrap;gap:5px}.mvp-stats span{font-size:10px;font-weight:900;background:#1d2330;border:1px solid #303949;border-radius:999px;padding:5px 7px}.section-title.compact{margin-top:13px}.result-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.result-stats div{background:#111720;border:1px solid #29313e;border-radius:11px;padding:9px 5px;text-align:center}.result-stats small,.reward-card small{display:block;color:var(--muted);font-size:9px;font-weight:900;text-transform:uppercase}.result-stats b{font-size:18px}.reward-card{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.reward-card>div{background:#121820;border:1px solid #2c3441;border-radius:12px;padding:11px}.reward-card b{display:block;margin-top:3px;font-size:16px}@media(max-width:390px){.mvp-card{grid-template-columns:88px 1fr}.mvp-card img{width:88px;height:88px}.result-stats{grid-template-columns:1fr 1fr}}
/* V6 economy + fun systems */
.full{width:100%;margin-top:10px}.two-btn{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.btn.mini{padding:8px 10px;font-size:10px;box-shadow:none}.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:10px 0 2px}.hub-action{border:1px solid #2d3440;background:linear-gradient(180deg,#151a23,#0d1118);color:#fff;border-radius:15px;padding:14px;text-align:left}.hub-action span{font-size:24px;display:block}.hub-action b{display:block;margin:6px 0 2px}.hub-action small{color:var(--muted);font-size:10px}.prep-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.prep-card{background:#11161e;border:1px solid #2b3340;color:#fff;border-radius:14px;padding:12px;text-align:left;min-height:130px}.prep-card.selected{border-color:#e32323;background:#191318}.prep-card:disabled:not(.selected){opacity:.5}.prep-icon{font-size:22px}.prep-card b,.prep-card small,.prep-card strong{display:block}.prep-card small{color:var(--muted);font-size:10px;line-height:1.3;margin:4px 0 8px}.prep-card strong{font-size:11px;color:#ffd36a}.scouting-report{margin-top:9px;border-color:#725a25}.readiness{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;margin:10px 2px;font-size:11px}.meter{height:7px;background:#252b35;border-radius:10px;overflow:hidden}.meter i{display:block;height:100%;background:linear-gradient(90deg,#e32323,#56d88a)}.mission-list{display:grid;gap:7px}.mission{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:9px;border-bottom:1px solid #252b35}.mission:last-child{border:0}.mission b,.mission small{display:block}.mission small{color:var(--muted);margin-top:2px}.shop-free,.facility{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px}.shop-free small{display:block;color:var(--muted);font-size:10px}.pack-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pack{background:#111720;border:1px solid #313947;color:#fff;border-radius:13px;padding:13px;text-align:left}.pack b,.pack strong,.pack small{display:block}.pack strong{font-size:17px;margin:5px 0;color:#ffd15a}.pack small{color:var(--muted)}.store-note{font-size:11px}.sheet-title h2{margin:2px 0 12px}.facility{grid-template-columns:44px 1fr auto;border-bottom:1px solid #282f3a;padding:12px 0}.facility-icon{font-size:28px}.facility small,.facility p{display:block;color:var(--muted);font-size:10px;margin:2px 0}.purchase-demo{text-align:center;padding:8px}.big-icon{font-size:58px}.purchase-coins{font-size:32px;font-weight:1000;color:#ffd15a}.play-big{font-size:17px;margin-top:14px}.moment-head{text-align:center;padding:8px 8px 2px}.moment-head h2{font-size:28px;margin:6px 0}.moment-head p{color:var(--muted)}.moment-score{display:flex;justify-content:space-between;background:#151b24;border:1px solid #303846;padding:12px;border-radius:12px;margin:10px 0}.choice-list{display:grid;gap:9px}.choice{background:linear-gradient(180deg,#171d27,#10141b);border:1px solid #343d4b;color:#fff;border-radius:14px;padding:15px;text-align:left}.choice b,.choice small{display:block}.choice small{color:var(--muted);margin-top:4px}.moment-dots{display:flex;justify-content:center;gap:6px;margin:14px}.moment-dots i{width:22px;height:4px;background:#303643;border-radius:4px}.moment-dots i.active{background:#e32323}.moment-dots i.done{background:#52d486}.moment-result{text-align:center;padding:20px 6px}.moment-result.success h2{color:#5ce493}.moment-result.fail h2{color:#ff6d6d}.decision-recap{display:grid;gap:6px}.decision{display:flex;align-items:center;gap:9px;background:#11161d;padding:9px;border-radius:9px;border-left:3px solid #555}.decision.good{border-color:#54d68d}.decision.bad{border-color:#f05a5a}.decision span{font-size:18px}.decision b,.decision small{display:block}.decision small{color:var(--muted)}
