:root{--bg-body:#f5f5f7;--bg-card:#ffffffb8;--bg-card-hover:#ffffffd9;--bg-input:#7676801f;--primary:#0071e3;--primary-hover:#0077ed;--secondary:#ff2d55;--accent:#5e5ce6;--text-primary:#1d1d1f;--text-secondary:#86868b;--text-muted:#a1a1a6;--success:#34c759;--warning:#ff9f0a;--radius-lg:18px;--radius-md:12px;--radius-sm:8px;--radius-full:9999px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 12px 24px #0000001f;--shadow-floating:0 20px 40px #00000026;--transition-smooth:.4s cubic-bezier(.25,1,.5,1);--font-system:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--font-heading:var(--font-system);--font-body:var(--font-system)}@media (prefers-color-scheme:dark){:root{--bg-body:#000;--bg-card:#1c1c1eb8;--bg-card-hover:#2c2c2ed9;--bg-input:#7676803d;--text-primary:#f5f5f7;--text-secondary:#86868b}}body{background-color:var(--bg-body);color:var(--text-primary);font-family:var(--font-body);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 0 0,#ff2d5526,#0000 40%),radial-gradient(circle at 100% 0,#0071e326,#0000 40%),radial-gradient(circle at 100% 100%,#5e5ce626,#0000 40%),radial-gradient(circle at 0 100%,#34c75926,#0000 40%);background-attachment:fixed;min-height:100vh;margin:0;line-height:1.5}#root{text-align:center;max-width:1080px;margin:0 auto;padding:1.5rem 2rem 2rem}@keyframes popIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}h1,h2,h3,h4{font-family:var(--font-heading);letter-spacing:-.02em;font-weight:700}h1{background:linear-gradient(135deg,var(--text-primary)0%,var(--text-secondary)100%);-webkit-text-fill-color:transparent;text-align:center;-webkit-background-clip:text;background-clip:text;margin-bottom:2rem;font-size:3.5rem}a{color:var(--primary);text-decoration:none;transition:opacity .2s}a:hover{opacity:.7}.site-logo-link{z-index:100;background:0 0;border:none;align-items:center;gap:.6rem;padding:0;transition:opacity .2s;display:flex;position:fixed;top:1.25rem;left:1.5rem}.site-logo-link:hover{opacity:.7}.site-logo{width:auto;height:1.8rem}.site-logo-link span{color:var(--text-primary);letter-spacing:-.01em;font-size:.95rem;font-weight:600}.mode-toggle{background:var(--bg-input);border-radius:9px;margin-bottom:3rem;padding:3px;display:inline-flex;position:relative}.mode-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:7px;padding:.5rem 1.5rem;font-size:.9rem;font-weight:500;transition:all .25s}.mode-btn:hover{color:var(--text-primary)}.mode-btn.active{background:var(--primary);color:#fff;font-weight:600;box-shadow:0 2px 8px #0071e359}.spin-button{background:var(--primary);color:#fff;border-radius:var(--radius-full);cursor:pointer;transition:var(--transition-smooth);box-shadow:var(--shadow-md);letter-spacing:-.01em;border:none;padding:1rem 2.5rem;font-size:1.1rem;font-weight:600}.spin-button:hover:not(:disabled){background:var(--primary-hover);box-shadow:var(--shadow-floating);transform:scale(1.02)}.spin-button:disabled{background:var(--bg-input);color:var(--text-secondary);cursor:not-allowed;box-shadow:none}.hero-result{background:var(--bg-card);-webkit-backdrop-filter:blur(25px)saturate(180%);box-shadow:var(--shadow-lg);border:1px solid #0000000f;border-radius:24px;flex-direction:column;align-items:center;width:100%;max-width:420px;margin-top:.25rem;padding:3rem 2rem;transition:box-shadow .3s,border-color .3s;display:flex;position:relative}@media (prefers-color-scheme:dark){.hero-result{border-color:#ffffff1a}}.hero-result.spinning{animation:.6s ease-in-out infinite alternate spinPulse}@keyframes spinPulse{0%{box-shadow:var(--shadow-lg);border-color:#0071e31a}to{box-shadow:0 0 20px #0071e333,var(--shadow-lg);border-color:#0071e34d}}.hero-role{text-transform:uppercase;color:var(--text-secondary);letter-spacing:.05em;background:var(--bg-input);border-radius:var(--radius-full);margin-bottom:2rem;padding:6px 14px;font-size:.8rem;font-weight:700;transition:opacity .25s}.hero-image{object-fit:contain;filter:drop-shadow(0 15px 30px #00000026);width:260px;height:260px;transition:var(--transition-smooth);content-visibility:auto;margin-bottom:1.5rem}.hero-result.spinning .hero-image{animation:80ms ease-out heroShuffle}@keyframes heroShuffle{0%{opacity:.7;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.hero-result:hover .hero-image{filter:drop-shadow(0 25px 50px #0003);transform:scale(1.03)translateY(-5px)}.hero-name{color:var(--text-primary);letter-spacing:-.02em;margin:.5rem 0;font-size:2.5rem;font-weight:700;transition:opacity .25s}.hero-result.spinning .hero-name{opacity:.7}.hero-result.spinning .hero-role{opacity:.5}.player-count-selector{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);box-shadow:var(--shadow-sm);border:1px solid #0000000f;border-radius:20px;width:100%;margin-bottom:1.5rem;padding:1.5rem}.team-mode>.player-count-selector{max-width:600px}@media (prefers-color-scheme:dark){.player-count-selector{border-color:#ffffff14}}.player-count-row{justify-content:space-between;align-items:center;display:flex}.selector-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;font-size:.8rem;font-weight:600}.count-options{background:var(--bg-input);border-radius:9px;padding:3px;display:inline-flex}.count-btn{width:38px;height:32px;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:7px;font-size:.85rem;font-weight:500;transition:all .25s}.count-btn:hover{color:var(--text-primary)}.count-btn.active{background:var(--primary);color:#fff;font-weight:600;box-shadow:0 2px 8px #0071e359}.custom-teams-container{grid-template-columns:1fr 1fr;gap:2rem;width:100%;display:grid}.custom-team-column{-webkit-backdrop-filter:blur(10px);box-shadow:var(--shadow-sm);background:#ffffff80;border:1px solid #0000000f;border-radius:20px;padding:1.5rem}@media (prefers-color-scheme:dark){.custom-team-column{background:#2c2c2e66}}.team-header{color:var(--text-primary);letter-spacing:-.02em;margin-bottom:1.5rem;font-size:1.8rem;font-weight:700}.team-1-header{color:var(--primary)}.team-2-header{color:var(--secondary)}.player-row{background:var(--bg-card);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);transition:var(--transition-smooth);align-items:center;margin-bottom:.8rem;padding:.8rem 1.2rem;display:flex}.player-row:hover{background:var(--bg-card-hover);transform:translate(4px)}.player-number{color:var(--text-muted);width:30px;font-size:.9rem;font-weight:600}.player-input{color:var(--text-primary);border-radius:var(--radius-sm);background:0 0;border:none;width:100%;padding:.5rem;font-size:1rem;font-weight:500}.player-input:focus{background:var(--bg-input);outline:none}.lock-btn{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;font-size:1.1rem;transition:color .2s}.lock-btn:hover,.lock-btn.locked{color:var(--primary)}.hero-info-mini{text-align:right;margin-right:1rem}.hero-name-mini{color:var(--text-primary);font-size:.95rem;font-weight:600;display:block}.hero-role-mini{color:var(--text-secondary);font-size:.75rem;font-weight:500}.hero-image-row{object-fit:contain;background:var(--bg-input);border-radius:12px;width:52px;height:52px;padding:4px}.hero-image-row.placeholder{opacity:.3}.role-btn{background:var(--bg-input);border-radius:var(--radius-full);color:var(--text-primary);cursor:pointer;border:1.5px solid #0000001a;padding:.5rem 1.25rem;font-size:.9rem;font-weight:500;transition:all .2s}@media (prefers-color-scheme:dark){.role-btn{border-color:#ffffff1f}}.role-btn:hover:not(:disabled){background:#76768033}.role-btn.active:hover{background:var(--primary-hover);color:#fff;border-color:var(--primary-hover);box-shadow:0 4px 12px #0071e366}.role-btn:disabled{opacity:.35;cursor:not-allowed}.role-btn.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 2px 8px #0071e34d}.role-selector{border-bottom:1px solid var(--bg-input);justify-content:space-between;align-items:center;padding:.8rem 0;display:flex}.role-selector:last-child{border-bottom:none}.role-counter{align-items:center;gap:1rem;display:flex}.counter-btn{border:1px solid var(--text-secondary);width:28px;height:28px;color:var(--text-primary);cursor:pointer;background:0 0;border-radius:50%;justify-content:center;align-items:center;line-height:0;transition:all .2s;display:flex}.counter-btn:hover:not(:disabled){background:var(--text-primary);color:var(--bg-body);border-color:#0000}.counter-btn:disabled{opacity:.3;cursor:default;border-color:var(--bg-input)}.home-page{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:80vh;display:flex}.home-logo{filter:drop-shadow(0 20px 40px #0000001a);margin-bottom:2rem;transition:transform .5s}.home-logo:hover{transform:scale(1.05)}.game-buttons{margin-top:3rem}.game-button{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);color:var(--text-primary);transition:var(--transition-smooth);box-shadow:var(--shadow-lg);opacity:1;border:1px solid #0000000f;border-radius:28px;flex-direction:column;align-items:center;gap:1rem;min-width:280px;padding:2.5rem 3rem;text-decoration:none;display:flex}@media (prefers-color-scheme:dark){.game-button{border-color:#ffffff14}}.game-button:hover{box-shadow:var(--shadow-floating);opacity:1;transform:translateY(-6px)}.game-button-logo{object-fit:contain;width:100px;height:100px}.game-button-text{color:var(--text-primary);flex-direction:column;align-items:center;gap:.2rem;font-size:1.1rem;font-weight:600;display:flex}.game-button-text span:last-child{color:var(--text-secondary);font-size:.85rem;font-weight:400}.marvel-rivals-page{flex-direction:column;align-items:center;width:100%;animation:.2s ease-out fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.mode-content{flex-direction:column;align-items:center;width:100%;animation:.5s ease-out popIn;display:flex}.solo-role-filter{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);width:100%;max-width:420px;box-shadow:var(--shadow-sm);border:1px solid #0000000f;border-radius:16px;margin-bottom:2rem;padding:1rem 1.25rem}@media (prefers-color-scheme:dark){.solo-role-filter{border-color:#ffffff14}}.solo-filter-row{justify-content:space-between;align-items:center;display:flex}.solo-filter-label-group{flex-direction:column;gap:2px;display:flex}.solo-filter-hint{color:var(--text-tertiary);font-size:.65rem;font-weight:500}.solo-role-segmented{background:var(--bg-input);border-radius:9px;gap:2px;padding:3px;display:inline-flex}.solo-seg-btn{height:32px;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:7px;justify-content:center;align-items:center;gap:4px;padding:0 14px;font-size:.8rem;font-weight:500;transition:all .25s;display:flex}.solo-seg-btn:hover:not(:disabled){color:var(--text-primary)}.solo-seg-btn.active{background:var(--primary);color:#fff;font-weight:600;box-shadow:0 2px 8px #0071e359}.solo-seg-btn:disabled{opacity:.3;cursor:not-allowed}.solo-seg-icon{object-fit:contain;filter:brightness(0)invert(.5);width:16px;height:16px;transition:filter .25s}.solo-seg-btn.active .solo-seg-icon{filter:brightness(0)invert()}.solo-seg-label{letter-spacing:.02em;font-size:.7rem}.team-grid{grid-template-columns:1fr;gap:1rem;width:100%;max-width:800px;display:grid}.team-grid.two-columns{grid-template-columns:1fr 1fr}.filter-header{flex-direction:column;align-items:center;gap:.25rem;margin-bottom:1.25rem;display:flex}.filter-label{color:var(--text-primary);font-size:1rem;font-weight:600}.role-options-container{flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;display:flex}@media (max-width:768px){#root{padding:1.25rem}h1{font-size:2rem}.custom-teams-container,.team-grid.two-columns{grid-template-columns:1fr}.site-logo-link{top:.75rem;left:1rem}.site-logo-link span{display:none}.hero-result{max-width:100%;padding:2rem 1.25rem}.hero-image{width:200px;height:200px}.hero-name{font-size:2rem}.game-button{width:100%;min-width:unset;padding:2rem}.spin-button{padding:.8rem 2rem;font-size:1rem}.mode-toggle{margin-bottom:2rem}.mode-btn{padding:.4rem 1rem;font-size:.85rem}.heroes-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:1rem}.role-options-container{flex-direction:column;align-items:center}.specific-roles{flex-wrap:wrap;justify-content:center}}img{max-width:100%}.hero-stats{border-top:1px solid var(--bg-input);color:var(--text-muted);text-align:center;width:100%;margin-top:4rem;padding-top:2rem;font-size:.9rem}.hero-stats p{margin:.4rem 0}.role-link{font-weight:600;transition:opacity .2s}.role-link:hover{opacity:.7}.back-link{color:var(--primary);transition:var(--transition-smooth);margin-bottom:1.5rem;font-size:1rem;font-weight:500;display:inline-block}.back-link:hover{opacity:.7}.role-description{color:var(--text-secondary);margin-bottom:2rem;font-size:1.1rem}.heroes-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1.5rem;width:100%;display:grid}.hero-card{background:var(--bg-card);-webkit-backdrop-filter:blur(10px);transition:var(--transition-smooth);box-shadow:var(--shadow-sm);border:1px solid #0000000a;border-radius:20px;flex-direction:column;align-items:center;padding:1.5rem 1rem;display:flex}@media (prefers-color-scheme:dark){.hero-card{border-color:#ffffff0d}}.hero-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-6px)}.hero-card-image{aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 4px 8px #0000001a);width:100%;margin-bottom:.75rem}.hero-card-name{text-align:center;color:var(--text-primary);letter-spacing:-.01em;margin:0;font-size:1rem;font-weight:600}.filter-toggle-row{border-top:1px solid #8080801f;justify-content:space-between;align-items:center;margin-top:.75rem;padding-top:.75rem;display:flex}.filter-toggle-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;font-size:.8rem;font-weight:600}.filter-toggle-right{align-items:center;gap:.5rem;display:flex}.toggle-switch{cursor:pointer;background:#78788052;border:none;border-radius:9999px;flex-shrink:0;width:44px;height:26px;padding:0;transition:background .25s;position:relative}.toggle-switch.active{background:var(--primary)}.toggle-knob{background:#fff;border-radius:50%;width:22px;height:22px;transition:transform .25s cubic-bezier(.4,0,.2,1);position:absolute;top:2px;left:2px;box-shadow:0 1px 3px #0003}.toggle-switch.active .toggle-knob{transform:translate(18px)}.role-summary-strip{justify-content:center;align-items:center;gap:.5rem;margin-top:.5rem;padding:.4rem 0;animation:.25s ease-out popIn;display:flex}.role-summary-chip{background:var(--bg-input);border-radius:var(--radius-full);border:1.5px solid;align-items:center;gap:.3rem;padding:.2rem .6rem .2rem .35rem;display:flex}.role-chip-icon{object-fit:contain;width:18px;height:18px}.role-chip-label{font-size:.85rem;line-height:1}.role-chip-count{font-size:.8rem;font-weight:700}.role-summary-total{margin-left:.25rem;font-size:.75rem;font-weight:600}.filter-edit-btn{background:var(--bg-input);color:var(--primary);border-radius:var(--radius-full);cursor:pointer;border:none;margin-left:auto;padding:3px 10px;font-size:.75rem;font-weight:600;transition:all .2s}.filter-edit-btn:hover{background:var(--primary);color:#fff}.clear-tags-row{justify-content:flex-end;margin-bottom:.5rem;display:flex}.clear-tags-btn{color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-full);background:0 0;border:none;padding:4px 10px;font-size:.75rem;font-weight:600;transition:all .2s}.clear-tags-btn:hover:not(:disabled){background:var(--secondary);color:#fff}.clear-tags-btn:disabled{color:var(--text-tertiary);cursor:default;opacity:.5}.modal-overlay{-webkit-backdrop-filter:blur(8px);z-index:1000;background:#0006;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:fixed;inset:0}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.modal-card{background:var(--bg-body);border:1px solid #00000014;border-radius:20px;width:90%;max-width:380px;padding:1.5rem 2rem;animation:.3s cubic-bezier(.19,1,.22,1) slideUp;box-shadow:0 24px 60px #00000040}@media (prefers-color-scheme:dark){.modal-card{background:#1c1c1e;border-color:#ffffff1a}}.modal-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.modal-title{color:var(--text-primary);letter-spacing:-.02em;margin:0;font-size:1.15rem;font-weight:700}.modal-close{background:var(--bg-input);cursor:pointer;width:28px;height:28px;color:var(--text-secondary);border:none;border-radius:50%;justify-content:center;align-items:center;font-size:.85rem;transition:all .2s;display:flex}.modal-close:hover{background:var(--text-primary);color:var(--bg-body)}.modal-card .filter-info{margin:0 0 .75rem}.modal-card .role-selectors{margin-bottom:1.25rem}.modal-done-btn{background:var(--primary);color:#fff;border-radius:var(--radius-md);cursor:pointer;border:none;width:100%;padding:.7rem;font-size:.95rem;font-weight:600;transition:all .2s}.modal-done-btn:hover{background:var(--primary-hover)}.filter-info{color:var(--text-secondary);text-align:center;margin:.5rem 0;font-size:.85rem}.valid{color:var(--success);font-weight:700}.invalid{color:var(--secondary);font-weight:700}.role-filter{border-top:1px solid var(--bg-input);margin-top:1rem;padding-top:1rem}.role-selectors{flex-direction:column;display:flex}.role-label{font-size:.95rem;font-weight:600}.counter-value{text-align:center;min-width:1.5ch;font-size:1.1rem;font-weight:700}.filter-hint{color:var(--text-muted);font-size:.8rem;font-weight:400}.role-divider{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;padding:0 .25rem;font-size:.75rem;font-weight:500}.specific-roles{gap:.5rem;display:flex}.home-header{flex-direction:column;align-items:center;gap:.5rem;margin-bottom:1rem;display:flex}.player-input-section{flex:1;align-items:center;gap:.5rem;min-width:0;display:flex}.player-hero-section{flex-shrink:0;justify-content:flex-end;align-items:center;width:180px;display:flex}.input-with-lock{align-items:center;gap:.5rem;width:100%;display:flex}.lock-btn{flex-shrink:0}
:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*,:before,:after{box-sizing:border-box}html{width:100%;overflow-x:hidden}body{width:100%;min-height:100vh;margin:0;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.1}a{color:inherit;text-decoration:none}button{font-family:inherit}