.compare-player-search{display:flex;align-items:center;width:210px;background:#fff;border-radius:8px;padding:3px}.compare-player-search span{color:#111525;font-weight:900;padding-left:7px}.compare-player-search input{min-width:0;width:100%;border:0;outline:0;padding:8px;color:#111525;font-size:9px;font-weight:900}.compare-player-search button{border:0;border-radius:6px;background:var(--yellow);padding:8px 11px;font-weight:900}.compare-shell{max-width:1240px;margin:auto;padding:26px 28px 80px}.compare-breadcrumb{display:flex;gap:10px;align-items:center;color:#65708e;font-size:8px;font-weight:900;letter-spacing:.12em}.compare-breadcrumb a{color:var(--yellow);text-decoration:none}.compare-hero{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:45px;align-items:center;padding:54px 0 38px}.compare-kicker{color:var(--yellow);font-size:9px;font-weight:900;letter-spacing:.19em}.compare-hero h1{max-width:800px;font:clamp(43px,6vw,72px)/.95 var(--display);letter-spacing:-.055em;margin:15px 0}.compare-hero p{max-width:720px;color:#929cb8;line-height:1.65;font-size:13px}.compare-hero-badge{position:relative;overflow:hidden;border:1px solid #3b4664;border-radius:16px;background:radial-gradient(circle at 75% 20%,rgba(255,210,46,.18),transparent 45%),#11172a;padding:25px}.compare-hero-badge>span{position:absolute;right:13px;top:7px;font:55px var(--display);color:rgba(255,255,255,.06)}.compare-hero-badge strong,.compare-hero-badge small{position:relative;display:block}.compare-hero-badge strong{font:20px var(--display);color:var(--yellow);margin-top:27px}.compare-hero-badge small{color:#78839f;font-size:8px;margin-top:7px}.compare-builder{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr) 175px;gap:12px;align-items:end;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,#12192d,#0d1222);padding:17px}.compare-input-card label{display:block;color:#77829f;font-size:7px;font-weight:900;letter-spacing:.14em;margin-bottom:7px}.compare-input-card>small{display:block;color:#515d78;font-size:7px;margin-top:6px}.compare-tag-input{display:flex;align-items:center;height:49px;border:1px solid #34405e;border-radius:9px;background:#080d1c;transition:.15s}.compare-tag-input:focus-within{border-color:var(--yellow);box-shadow:0 0 0 3px rgba(255,210,46,.08)}.compare-tag-input span{padding-left:14px;color:var(--yellow);font:16px var(--display)}.compare-tag-input input{min-width:0;width:100%;height:100%;border:0;outline:0;background:transparent;color:#fff;padding:0 13px;font-size:11px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.compare-swap{position:relative;width:52px;height:52px;justify-self:center;margin-bottom:17px;border:1px solid #4d5876;border-radius:50%;background:#171f35;color:#fff}.compare-swap i{position:absolute;inset:-5px;border:1px dashed #3f4b69;border-radius:50%;transition:.25s}.compare-swap:hover i{transform:rotate(90deg);border-color:var(--yellow)}.compare-swap span{font:13px var(--display)}.compare-submit{height:49px;margin-bottom:17px;display:flex;align-items:center;justify-content:space-between;border:0;border-radius:9px;background:var(--yellow);color:#10131d;padding:0 16px;font-size:7px;font-weight:950;letter-spacing:.08em}.compare-submit b{font-size:17px}.compare-submit:disabled{opacity:.55;cursor:wait}.compare-form-error{position:absolute;left:17px;bottom:-28px;color:#ff719f;font-size:8px;font-weight:800}.saved-compare{display:flex;align-items:center;gap:25px;margin-top:16px;border:1px solid var(--line);border-radius:13px;background:#0d1222;padding:13px 16px}.saved-compare>div:first-child{min-width:175px}.saved-compare>div:first-child span{display:block;color:var(--yellow);font-size:7px;font-weight:900;letter-spacing:.14em}.saved-compare>div:first-child small{display:block;color:#66728f;font-size:7px;line-height:1.5;margin-top:5px}.saved-compare-list{display:flex;gap:7px;flex-wrap:wrap}.saved-compare button{display:flex;align-items:center;gap:8px;border:1px solid #303b59;border-radius:9px;background:#151c30;color:#fff;padding:8px 10px}.saved-compare button b{font-size:8px}.saved-compare button small{color:#71809d;font-size:6px}.saved-avatar{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;background:linear-gradient(135deg,var(--pink),#7657ff);font:8px var(--display)}
.compare-content{padding-top:43px}.compare-empty{min-height:350px;display:grid;place-content:center;justify-items:center;text-align:center;border:1px dashed #303a57;border-radius:16px;background:radial-gradient(circle at 50% 50%,rgba(54,200,255,.06),transparent 36%)}.compare-empty>span{display:grid;place-items:center;width:76px;height:76px;border:1px solid #465372;border-radius:50%;background:#11182b;font:21px var(--display);color:var(--yellow)}.compare-empty h2{font:25px var(--display);margin:19px 0 8px}.compare-empty p{max-width:520px;color:#747f9c;font-size:9px;line-height:1.65;margin:0 20px}.compare-loading{min-height:390px;display:grid;place-content:center;justify-items:center;gap:14px;color:#727d99}.compare-loading i{width:38px;height:38px;border:4px solid #242d46;border-top-color:var(--yellow);border-radius:50%;animation:compareSpin .8s linear infinite}@keyframes compareSpin{to{transform:rotate(360deg)}}.compare-loading strong{font-size:9px;letter-spacing:.12em}.compare-error{margin-top:25px;border:1px solid #71304a;background:#351421;border-radius:14px;padding:25px;text-align:center;color:#ff91b8}.compare-error strong,.compare-error span{display:block}.compare-error span{margin-top:8px;font-size:9px}.comparison-result{--left:#36c8ff;--right:#ff4f9b}.comparison-actions{display:flex;align-items:end;justify-content:space-between;margin-bottom:18px}.comparison-actions>div>span{color:var(--yellow);font-size:7px;font-weight:900;letter-spacing:.16em}.comparison-actions h2{font:30px var(--display);margin:7px 0 0}.comparison-actions>div:last-child{display:flex;gap:8px}.comparison-actions button{border:1px solid #34405e;border-radius:8px;background:#171e33;color:#fff;padding:10px 13px;font-size:7px;font-weight:900;letter-spacing:.07em}.comparison-head{display:grid;grid-template-columns:1fr 100px 1fr;gap:13px;align-items:stretch}.compare-player-card{position:relative;overflow:hidden;min-width:0;border:1px solid #303b59;border-radius:16px;background:linear-gradient(145deg,#141b30,#0d1325);padding:22px}.compare-player-card:first-child{border-color:color-mix(in srgb,var(--left) 50%,#303b59)}.compare-player-card:last-child{border-color:color-mix(in srgb,var(--right) 50%,#303b59)}.compare-player-card:after{content:"";position:absolute;width:130px;height:130px;border-radius:50%;right:-45px;top:-50px;background:var(--accent);opacity:.1}.compare-player-identity{position:relative;z-index:2;display:grid;grid-template-columns:67px minmax(0,1fr);gap:14px;align-items:center}.compare-profile-icon{position:relative;display:grid;place-items:center;overflow:hidden;width:67px;height:67px;border:2px solid var(--accent);border-radius:15px;background:#090e1d}.compare-profile-icon b{font:20px var(--display);color:#52607f}.compare-profile-icon img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.compare-player-card span.player-label{display:block;color:var(--accent);font-size:6px;font-weight:900;letter-spacing:.14em}.compare-player-card h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:24px var(--display);margin:5px 0 4px}.compare-player-card p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6f7b99;font-size:8px;margin:0}.compare-player-club{display:inline-block;margin-top:9px;border:1px solid #303a57;border-radius:99px;color:#9aa4bd;padding:6px 9px;font-size:7px}.comparison-versus{display:grid;place-items:center}.comparison-versus span{display:grid;place-items:center;width:66px;height:66px;border:1px solid #56617d;border-radius:50%;background:#151d32;font:18px var(--display);color:var(--yellow);box-shadow:0 0 0 7px #0a0f1e}.comparison-score{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin:13px 0;border:1px solid #303a57;border-radius:14px;background:#101629;padding:17px 22px}.comparison-score>div:first-child{text-align:right}.comparison-score strong{font:38px var(--display)}.comparison-score>div:first-child strong{color:var(--left)}.comparison-score>div:last-child strong{color:var(--right)}.comparison-score small{display:block;color:#6f7a97;font-size:6px;font-weight:900;letter-spacing:.12em}.comparison-score>span{padding:0 35px;color:#65708e;font-size:7px;font-weight:900;letter-spacing:.12em}.comparison-winner{text-align:center;color:#a4aec6;font-size:9px;margin:0 0 16px}.comparison-winner b{color:var(--yellow)}.comparison-stats{overflow:hidden;border:1px solid #2c3652;border-radius:14px;background:#101629}.compare-stat-row{display:grid;grid-template-columns:minmax(120px,1fr) minmax(150px,260px) minmax(120px,1fr);align-items:center;min-height:76px;padding:12px 20px;border-top:1px solid #27314a}.compare-stat-row:first-child{border:0}.compare-stat-value{display:flex;align-items:center;gap:8px}.compare-stat-value.left{justify-content:flex-end;text-align:right}.compare-stat-value.right{justify-content:flex-start}.compare-stat-value b{font:22px var(--display);color:#75809d}.compare-stat-value.winner b{color:var(--green)}.compare-stat-value.tie b{color:var(--yellow)}.compare-stat-value i{width:7px;height:7px;border-radius:50%;background:#3a4562}.compare-stat-value.winner i{background:var(--green);box-shadow:0 0 0 4px rgba(78,227,138,.1)}.compare-stat-center{text-align:center}.compare-stat-center strong{display:block;font-size:8px;letter-spacing:.08em}.compare-stat-center small{display:block;color:#66728f;font-size:6px;margin-top:5px}.compare-stat-bar{display:flex;height:4px;margin-top:8px;border-radius:5px;overflow:hidden;background:#252f49}.compare-stat-bar i:first-child{background:var(--left)}.compare-stat-bar i:last-child{background:var(--right)}.roster-comparison{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:13px}.roster-card{min-width:0;border:1px solid #303a57;border-radius:14px;background:#11172a;padding:18px}.roster-card>span{display:block;color:#6f7a97;font-size:6px;font-weight:900;letter-spacing:.13em}.roster-card>strong{display:block;font:34px var(--display);margin-top:10px}.roster-card.shared strong{color:var(--green)}.roster-card.left strong{color:var(--left)}.roster-card.right strong{color:var(--right)}.roster-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#75819d;font-size:7px;margin-top:5px}.best-brawlers{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:13px}.best-brawler-card{display:grid;grid-template-columns:75px minmax(0,1fr) auto;align-items:center;gap:14px;border:1px solid #303a57;border-radius:14px;background:#11172a;padding:15px}.best-brawler-image{width:72px;height:72px;position:relative;display:grid;place-items:center}.best-brawler-image img{position:absolute;width:100%;height:100%;object-fit:contain}.best-brawler-image b{font:17px var(--display);color:#53607d}.best-brawler-card>div:nth-child(2)>span{display:block;color:#6f7a97;font-size:6px;font-weight:900;letter-spacing:.12em}.best-brawler-card h3{font:17px var(--display);margin:6px 0 4px}.best-brawler-card small{color:#73809c;font-size:7px}.best-brawler-card>strong{display:flex;align-items:center;gap:5px;font:18px var(--display);color:var(--yellow)}.best-brawler-card>strong img{width:20px;height:20px;object-fit:contain}.compare-info{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:54px}.compare-info article{display:flex;gap:15px;border-top:1px solid var(--line);padding-top:20px}.compare-info article>span{font:22px var(--display);color:#303b57}.compare-info h3{font:11px var(--display);margin:1px 0 7px}.compare-info p{color:#737e99;font-size:8px;line-height:1.6;margin:0}
@media(max-width:1050px){.compare-player-search{display:none}.compare-builder{grid-template-columns:1fr 64px 1fr}.compare-submit{grid-column:1/-1;margin:0}.compare-swap{margin-bottom:17px}.comparison-head{grid-template-columns:1fr 76px 1fr}.compare-stat-row{grid-template-columns:1fr 190px 1fr}}
@media(max-width:760px){.compare-shell{padding:18px 14px 55px}.compare-hero{grid-template-columns:1fr;padding:38px 0 26px;gap:20px}.compare-hero h1{font-size:43px}.compare-hero-badge{display:none}.compare-builder{grid-template-columns:1fr}.compare-swap{margin:0;transform:rotate(90deg)}.compare-submit{grid-column:auto}.saved-compare{align-items:flex-start;flex-direction:column}.comparison-actions{align-items:start;gap:15px}.comparison-actions>div:last-child{flex-direction:column}.comparison-head{grid-template-columns:1fr 48px 1fr;gap:7px}.compare-player-card{padding:13px}.compare-player-identity{grid-template-columns:1fr;text-align:center}.compare-profile-icon{margin:auto;width:55px;height:55px}.compare-player-card h3{font-size:16px}.compare-player-club{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.comparison-versus span{width:44px;height:44px;font-size:12px;box-shadow:0 0 0 4px #0a0f1e}.comparison-score{padding:14px}.comparison-score>span{padding:0 16px}.comparison-score strong{font-size:30px}.compare-stat-row{grid-template-columns:1fr 105px 1fr;padding:11px 10px;min-height:69px}.compare-stat-value b{font-size:16px}.compare-stat-center strong{font-size:7px}.compare-stat-center small{display:none}.roster-comparison{grid-template-columns:1fr}.best-brawlers{grid-template-columns:1fr}.compare-info{grid-template-columns:1fr}}
@media(max-width:430px){.comparison-actions button:first-child{display:none}.compare-player-card p{font-size:6px}.compare-stat-row{grid-template-columns:1fr 88px 1fr}.compare-stat-value b{font-size:14px}.compare-stat-value i{display:none}.best-brawler-card{grid-template-columns:58px minmax(0,1fr) auto}.best-brawler-image{width:56px;height:56px}}
.saved-avatar{position:relative;overflow:hidden}.saved-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.comparison-share-card-bottom{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;margin-top:18px;border:1px solid #6f5d18;border-radius:10px;background:linear-gradient(90deg,#ffd22e,#ffb823);color:#10131d;font-size:8px;font-weight:950;letter-spacing:.1em}.comparison-share-card-bottom:hover{filter:brightness(1.08);transform:translateY(-1px)}
