:root{
 --bg:#070a0d;--panel:#0f1419;--panel2:#121920;--line:#26313a;--text:#f1f4f3;--muted:#7e8b92;
 --green:#b7ff31;--gold:#f2c866;--red:#ff4d5f;--orange:#ff9e43;--blue:#54b6ff;
 --shadow:0 20px 60px rgba(0,0,0,.35);--radius:18px;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 50% -10%,#18311c 0,#0b1014 32%,var(--bg) 68%);color:var(--text);font-family:Rajdhani,Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer}body{overflow-x:hidden}
.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid var(--line);background:rgba(7,10,13,.92);backdrop-filter:blur(16px);position:sticky;top:0;z-index:30}
.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:42px;height:42px;border:1px solid #5e7a48;background:linear-gradient(135deg,#1b2616,#111a11);display:grid;place-items:center;font-weight:800;color:var(--green);clip-path:polygon(12% 0,88% 0,100% 12%,100% 88%,50% 100%,0 88%,0 12%)}.brand strong{display:block;font-size:17px;letter-spacing:.08em}.brand span{display:block;color:var(--muted);font-size:10px;letter-spacing:.18em}.club-name{font-weight:700;letter-spacing:.14em;color:#dfe7e4}.wallet{display:flex;gap:22px}.wallet div{min-width:72px;text-align:right}.wallet small{display:block;color:var(--muted);font-size:9px;letter-spacing:.14em}.wallet b{font-size:18px;color:var(--gold)}
.app-shell{display:grid;grid-template-columns:220px 1fr;min-height:calc(100vh - 72px)}.sidebar{border-right:1px solid var(--line);background:rgba(10,14,18,.82);padding:18px 12px;display:flex;flex-direction:column;justify-content:space-between}.sidebar nav{display:flex;flex-direction:column;gap:7px}.sidebar button{width:100%;text-align:left;border:1px solid transparent;background:transparent;color:#9ba6ad;padding:14px;border-radius:12px;font-weight:700;letter-spacing:.04em}.sidebar button:hover{background:#121920;color:#fff}.sidebar button.active{background:#172116;border-color:#2c4c1f;color:#fff;box-shadow:inset 3px 0 0 var(--green)}.ghost{border:1px solid var(--line)!important;background:#0e1419!important}.view{padding:24px;min-width:0}.page{animation:fade .24s ease}.grid{display:grid;gap:16px}.grid3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid4{grid-template-columns:repeat(4,minmax(0,1fr))}.panel{background:linear-gradient(180deg,#12191f,#0d1318);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:15px;margin:0 0 15px}.section-head h1,.section-head h2{margin:0}.sub{color:var(--muted);margin:.3rem 0 0}.hero{padding:28px;background:linear-gradient(120deg,rgba(183,255,49,.08),transparent 45%),linear-gradient(135deg,#10171d,#0a0f13);overflow:hidden;position:relative}.hero:after{content:"";position:absolute;right:-90px;top:-110px;width:300px;height:300px;border:1px solid rgba(255,255,255,.04);border-radius:50%}.hero h1{margin:0;font-size:38px;letter-spacing:.04em}.hero p{max-width:650px;color:var(--muted);line-height:1.45}.action{border:0;padding:11px 16px;border-radius:10px;font-weight:800;background:linear-gradient(135deg,var(--green),#7bb700);color:#0b0d0a}.action:hover{filter:brightness(1.08);transform:translateY(-1px)}.secondary{border:1px solid var(--line);padding:11px 16px;border-radius:10px;font-weight:700;background:#151c22;color:#fff}.secondary:hover{border-color:#42515c}
.squad-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(310px,.7fr);gap:16px}.pitch-panel{padding:14px}.pitch{min-height:670px;position:relative;overflow:hidden;border-radius:14px;border:1px solid #315b32;background:repeating-linear-gradient(90deg,#125523 0 85px,#145d28 85px 170px)}.pitch .line{position:absolute;background:rgba(255,255,255,.55)}.pitch .outer{inset:28px;border:2px solid rgba(255,255,255,.55);position:absolute}.pitch .mid{left:28px;right:28px;top:50%;height:2px}.pitch .circle{width:145px;height:145px;left:50%;top:50%;transform:translate(-50%,-50%);border:2px solid rgba(255,255,255,.55);border-radius:50%;position:absolute}.slot{position:absolute;transform:translate(-50%,-50%);width:110px;transition:.2s;z-index:3}.slot:hover{transform:translate(-50%,-54%) scale(1.03)}.empty-slot{width:90px;height:125px;border:1px dashed #638070;background:rgba(5,10,7,.38);clip-path:polygon(12% 0,88% 0,100% 11%,100% 88%,50% 100%,0 88%,0 11%);display:grid;place-items:center;color:#b8c4be;font-size:26px}.chem-line{position:absolute;height:3px;transform-origin:left center;z-index:1;opacity:.75}
.ut-card{position:relative;aspect-ratio:.72;clip-path:polygon(10% 0,90% 0,100% 10%,100% 88%,50% 100%,0 88%,0 10%);filter:drop-shadow(0 12px 14px rgba(0,0,0,.35))}.ut-card.gold{background:linear-gradient(150deg,#ffe8a2,#c39119 48%,#6a4a0c)}.ut-card.silver{background:linear-gradient(150deg,#f1f5f6,#84909a 52%,#4c555e)}.ut-card.bronze{background:linear-gradient(150deg,#df9d6a,#96562b 52%,#4b2714)}.ut-card.rare:after{content:"";position:absolute;inset:-7px;border-radius:inherit;box-shadow:0 0 28px rgba(242,200,102,.4);pointer-events:none}.ut-inner{position:absolute;inset:2px;clip-path:inherit;padding:9px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(0,0,0,.23));display:flex;flex-direction:column}.top-line{display:flex;justify-content:space-between;align-items:flex-start}.ovr{font-size:25px;font-weight:800;line-height:1}.pos{font-size:10px;font-weight:700;opacity:.9}.nation{font-size:12px}.avatar{flex:1;display:grid;place-items:center;font-size:42px;text-shadow:0 4px 10px rgba(0,0,0,.35)}.name{text-align:center;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;text-transform:uppercase}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:5px;text-align:center;font-size:8px}.stats b{display:block;font-size:9px}
.side-card{padding:18px}.big-ovr{display:flex;justify-content:space-between;align-items:end}.big-ovr strong{font-size:65px;line-height:.8}.big-ovr span{color:var(--muted);font-size:10px;letter-spacing:.14em}.metric{margin-top:11px}.metric-row{display:flex;gap:8px;align-items:center;font-size:10px;color:#b8c2c7}.metric-row .bar{height:6px;background:#222c33;border-radius:20px;flex:1;overflow:hidden}.metric-row .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--green),#d9ff96);border-radius:inherit}.club-list{max-height:510px;overflow:auto;display:flex;flex-direction:column;gap:8px;margin-top:12px}.list-item{display:flex;align-items:center;gap:9px;border:1px solid #202b32;background:#0f161b;padding:8px;border-radius:10px}.mini{width:40px}.list-meta{min-width:0;flex:1}.list-meta strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.list-meta span{font-size:9px;color:var(--muted)}.tiny-actions{display:flex;gap:5px}.tiny-actions button{width:28px;height:28px;border:1px solid var(--line);background:#171f25;color:#fff;border-radius:7px}
.pack{padding:18px}.pack-art{height:220px;display:grid;place-items:center;border-radius:14px;background:radial-gradient(circle at 50% 24%,rgba(255,255,255,.14),transparent 32%),#151a1f;margin-bottom:15px}.pack-art .ut-card{width:130px}.pack h3{margin:0}.pack p{color:var(--muted);font-size:13px;min-height:38px}.pack-foot{display:flex;justify-content:space-between;align-items:center;gap:10px}.price{color:var(--gold);font-weight:800}.packlock{opacity:.65}
.filters{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:14px}.filters input,.filters select{background:#0f161b;color:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 12px;outline:none}.market-card{padding:12px}.market-card .ut-card{width:100%}.market-info{padding:10px 2px}.market-info strong{display:block}.muted{color:var(--muted);font-size:11px}.market-meta{display:flex;justify-content:space-between;align-items:center;gap:7px;margin-top:8px}.sniper{color:var(--orange);font-weight:800}.expiry{font-size:10px;color:#a8b3b8}.table-list{display:flex;flex-direction:column;gap:8px}.trade-row{display:grid;grid-template-columns:1.2fr .6fr .6fr .7fr auto;gap:8px;align-items:center;padding:11px 12px;border:1px solid var(--line);background:#0f161b;border-radius:10px}.trade-row small{color:var(--muted)}
.match-wrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px}.match-panel{padding:14px}.scorebar{display:flex;justify-content:space-between;align-items:center;padding:13px 15px;margin-bottom:12px;background:#0d1318;border:1px solid var(--line);border-radius:12px}.score{font-size:34px;font-weight:800}.match-canvas{width:100%;aspect-ratio:16/9;display:block;border-radius:13px;border:1px solid #294d30;background:#145421}.commentary{height:260px;overflow:auto;margin-top:12px;border:1px solid var(--line);border-radius:12px;padding:10px;background:#0b1115}.comment{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid #1a242b;font-size:12px}.comment b{color:var(--green);min-width:36px}.match-side{padding:18px}.match-side h3{margin-top:0}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.stat-box{border:1px solid var(--line);background:#0f161b;border-radius:10px;padding:12px}.stat-box small{color:var(--muted)}.stat-box strong{display:block;font-size:22px}
.overlay{position:fixed;inset:0;z-index:80;display:none;place-items:center;background:rgba(0,0,0,.78);backdrop-filter:blur(12px);padding:20px}.overlay.show{display:grid}.modal{width:min(1000px,96vw);max-height:92vh;overflow:auto;background:linear-gradient(180deg,#131b21,#0b1116);border:1px solid #33414b;border-radius:22px;box-shadow:0 30px 100px rgba(0,0,0,.6);padding:22px}.modal-head{display:flex;justify-content:space-between;align-items:center}.modal-head h2{margin:0}.close{border:1px solid var(--line);background:#171f25;color:#fff;border-radius:9px;padding:8px 10px}.reveal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:20px}.reveal-card{perspective:900px;cursor:pointer}.flip{position:relative;transform-style:preserve-3d;transition:transform .8s}.reveal-card.revealed .flip{transform:rotateY(180deg)}.face{backface-visibility:hidden}.front{transform:rotateY(180deg);margin-top:-100%}.back{aspect-ratio:.72;border-radius:15px;border:1px solid #34434d;background:radial-gradient(circle at 50% 30%,rgba(183,255,49,.2),transparent 28%),#111820;display:grid;place-items:center;font-size:48px}.walkout{min-height:520px;display:grid;place-items:center;text-align:center;position:relative;overflow:hidden}.walkout .flag{font-size:76px;opacity:0;transform:translateY(-80px);animation:flagDrop .7s forwards}.walkout .phase{margin-top:12px;font-size:18px;color:#b3c0c6}.walkout .walkout-card{width:260px;margin:22px auto;opacity:0;transform:scale(.65) rotateY(40deg);animation:cardIn .9s 5.1s forwards}.flash{position:absolute;inset:0;background:#fff;opacity:0;animation:flash 1s 3.9s}.hidden{display:none!important}.toast{position:fixed;left:50%;bottom:20px;z-index:100;transform:translate(-50%,20px);opacity:0;background:#151e24;border:1px solid #384650;color:#fff;padding:11px 15px;border-radius:10px;transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes fade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}@keyframes flagDrop{to{opacity:1;transform:none}}@keyframes cardIn{to{opacity:1;transform:none}}@keyframes flash{0%{opacity:0}50%{opacity:.95}100%{opacity:0}}
@media(max-width:1050px){.sidebar{width:78px}.app-shell{grid-template-columns:78px 1fr}.sidebar button span{display:none}.sidebar button{text-align:center}.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid3{grid-template-columns:1fr}.squad-layout,.match-wrap{grid-template-columns:1fr}}
@media(max-width:700px){.topbar{padding:0 12px}.club-name{display:none}.view{padding:14px}.sidebar{position:fixed;left:0;right:0;bottom:0;width:auto;height:66px;z-index:40;border-right:0;border-top:1px solid var(--line);padding:7px;background:rgba(8,11,14,.96)}.app-shell{display:block;min-height:calc(100vh - 72px);padding-bottom:66px}.sidebar nav{flex-direction:row;justify-content:space-around}.sidebar button{padding:9px 5px;flex:1}.sidebar-foot{display:none}.grid4{grid-template-columns:1fr}.pitch{min-height:540px}.slot{width:82px}.hero h1{font-size:29px}.reveal-grid{grid-template-columns:1fr}.trade-row{grid-template-columns:1fr 1fr}.wallet{gap:8px}.wallet div{min-width:52px}}
