*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#07130c;--surface:#0d1d13;--surface2:#14281b;--border:#1e3526;--green:#2ee06e;--green-bg:#2ee06e14;--gold:#ffce3a;--gold-soft:#e8b92e;--gold-bg:#ffce3a17;--text:#f7f5ec;--muted:#8aa291;--dimmer:#45584c}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button{font-family:inherit}.screen{flex-direction:column;align-items:center;min-height:100vh;display:flex}.screen-landing{text-align:center;justify-content:center;gap:1.25rem;padding:2rem}.eyebrow{letter-spacing:.2em;color:var(--gold);text-transform:uppercase;font-size:.7rem;font-weight:700}.landing-title{letter-spacing:-.04em;font-size:clamp(3.5rem,10vw,6.5rem);font-weight:900;line-height:.92}.landing-sub{color:var(--muted);max-width:340px;font-size:.95rem;line-height:1.6}.mode-row{flex-direction:column;align-items:center;gap:.5rem;margin-top:.5rem;display:flex}.mode-label{color:var(--dimmer);letter-spacing:.15em;text-transform:uppercase;font-size:.65rem}.mode-toggle{border:1px solid var(--border);display:flex}.mode-btn{letter-spacing:.06em;cursor:pointer;color:var(--muted);background:0 0;border:none;padding:.5rem 1.5rem;font-size:.78rem;font-weight:700;transition:all .15s}.mode-btn.active{background:var(--surface2);color:var(--text)}.mode-hint{color:var(--dimmer);text-align:center;max-width:260px;font-size:.7rem;line-height:1.5}.btn-cta{background:var(--gold);color:#14210f;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;text-align:center;border:none;margin-top:.75rem;padding:.9rem 3.5rem;font-size:.85rem;font-weight:800;text-decoration:none;transition:background .15s;display:inline-block}.btn-cta:hover{background:#ffdf6e}.btn-cta.flush{margin-top:0}.btn-ghost{color:var(--muted);border:1px solid var(--border);letter-spacing:.05em;cursor:pointer;text-align:center;background:0 0;padding:.6rem 1.5rem;font-size:.75rem;text-decoration:none;transition:all .15s}.btn-ghost:hover{color:var(--text);border-color:var(--gold-soft)}.screen-game{gap:1rem;width:100%;max-width:1040px;margin:0 auto;padding:0 1rem 2rem}.game-body{align-items:flex-start;gap:1.5rem;width:100%;display:flex}.game-left{flex-direction:column;flex:1;gap:.85rem;min-width:0;display:flex}.game-right{flex:1.05;min-width:0}@media (max-width:820px){.game-body{flex-direction:column-reverse;align-items:stretch}.game-right{width:100%}}@media (min-width:821px){.pitch-outer{padding:1.5rem .75rem}.formation{gap:1.05rem}.pos-circle{width:54px;height:54px;font-size:.68rem}.pos-slot{width:80px}.pos-slot-label{width:80px;font-size:.62rem}.form-row{gap:.6rem}}.game-topbar{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;width:100%;padding:.85rem 0 .25rem;display:flex}.game-wordmark{letter-spacing:.18em;color:var(--gold);text-transform:uppercase;font-size:.72rem;font-weight:900}.slot-pill{color:var(--muted);letter-spacing:.05em;background:var(--surface);border:1px solid var(--border);padding:.3rem .75rem;font-size:.7rem;font-weight:600}.pitch-outer{background:linear-gradient(160deg,#0b2615 0%,#082011 55%,#0a2a17 100%);border:1px solid #265c36;border-radius:3px;width:100%;padding:.85rem .5rem;position:relative;overflow:hidden}.pitch-outer:after{content:"";pointer-events:none;border:1px solid #ffffff0f;border-radius:50%;width:52px;height:52px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.pitch-outer:before{content:"";background:#ffffff0f;height:1px;position:absolute;top:50%;left:6%;right:6%;transform:translateY(-50%)}.formation{z-index:1;flex-direction:column;gap:.45rem;display:flex;position:relative}.form-row{justify-content:center;gap:.35rem;display:flex}.pos-slot{text-align:center;width:68px}.pos-circle{border:2px solid var(--border);width:46px;height:46px;color:var(--muted);letter-spacing:.04em;cursor:default;background:#00000073;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;margin:0 auto .2rem;font-size:.62rem;font-weight:800;transition:border-color .2s,background .2s;display:flex;position:relative}.pos-circle.filled{border-color:var(--green);background:var(--green-bg);color:var(--green)}.pos-circle.active{color:#fff;background:#ffffff14;border-color:#fff;animation:1.6s infinite glow}@keyframes glow{0%,to{box-shadow:0 0 #ffffff40}50%{box-shadow:0 0 0 5px #fff0}}.pos-circle.placeable{border-color:var(--gold);background:var(--gold-bg);color:var(--gold);cursor:pointer;animation:1.4s infinite gold-glow}.pos-circle.placeable:hover{background:#ffce3a38;transform:scale(1.08)}@keyframes gold-glow{0%,to{box-shadow:0 0 #ffce3a66}50%{box-shadow:0 0 0 6px #ffce3a00}}.pos-slot-label{color:var(--dimmer);letter-spacing:.07em;white-space:nowrap;text-overflow:ellipsis;text-align:center;width:68px;font-size:.58rem;font-weight:600;overflow:hidden}.pos-slot-label.filled{color:#555}.spin-zone{flex-direction:column;align-items:center;gap:.75rem;width:100%;display:flex}.spin-hint{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:.7rem}.combo-duo{gap:.75rem;width:100%;display:flex}.combo-box{background:var(--surface);border:2px solid var(--border);text-align:center;border-radius:8px;flex-direction:column;flex:1;align-items:center;gap:.3rem;min-width:0;padding:.85rem .75rem;transition:border-color .25s,box-shadow .25s;display:flex}.combo-label{letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-size:.62rem;font-weight:800}.combo-value{letter-spacing:-.02em;white-space:nowrap;text-overflow:ellipsis;max-width:100%;min-height:1.5rem;font-size:1.25rem;font-weight:900;overflow:hidden}.box-team.landed{border-color:var(--gold);box-shadow:0 0 18px #ffce3a1f}.box-team.landed .combo-label{color:var(--gold)}.box-era.landed{border-color:var(--green);box-shadow:0 0 18px #2ee06e1f}.box-era.landed .combo-label,.box-era .combo-value{color:var(--green)}.combo-fill{color:var(--muted);letter-spacing:.04em;min-height:1em;font-size:.68rem}.reroll-row{gap:.75rem;width:100%;display:flex}.btn-reroll{border:1px solid var(--border);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;background:0 0;border-radius:6px;flex:1;padding:.5rem .6rem;font-size:.68rem;font-weight:800;transition:all .15s}.reroll-team{color:var(--gold);border-color:#ffce3a73}.reroll-team:hover:not(:disabled){background:var(--gold-bg);border-color:var(--gold)}.reroll-era{color:var(--green);border-color:#2ee06e73}.reroll-era:hover:not(:disabled){background:var(--green-bg);border-color:var(--green)}.btn-reroll:disabled{color:var(--dimmer);border-color:var(--border);cursor:default;text-decoration:line-through}.btn-spin{background:var(--gold);color:#14210f;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;border:none;width:100%;padding:.875rem;font-size:.85rem;font-weight:800;transition:background .15s}.btn-spin:hover:not(:disabled){background:#ffdf6e}.btn-spin:disabled{background:var(--surface2);color:var(--dimmer);cursor:default}.placing-bar{background:var(--gold-bg);border:1px solid var(--gold-soft);text-align:center;flex-direction:column;align-items:center;gap:.25rem;width:100%;padding:.85rem 1rem;display:flex}.placing-name{letter-spacing:-.01em;color:var(--gold);font-size:1.05rem;font-weight:900}.placing-hint{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:.68rem}.placing-cancel{cursor:pointer;color:var(--dimmer);letter-spacing:.05em;background:0 0;border:none;margin-top:.2rem;font-size:.65rem;text-decoration:underline}.placing-cancel:hover{color:var(--muted)}.pick-area{flex-direction:column;gap:.6rem;width:100%;display:flex}.pick-header{justify-content:space-between;align-items:baseline;width:100%;display:flex}.pick-title{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:.7rem;font-weight:700}.pick-count{color:var(--dimmer);font-size:.65rem}.players-list{flex-direction:column;gap:.4rem;width:100%;max-height:56vh;padding-right:2px;display:flex;overflow-y:auto}.players-list::-webkit-scrollbar{width:3px}.players-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.player-card{background:var(--surface);border:1px solid var(--border);cursor:pointer;width:100%;color:inherit;text-align:left;justify-content:space-between;align-items:center;gap:.75rem;padding:.75rem 1rem;transition:border-color .12s,background .12s;display:flex}.player-card:hover{border-color:var(--gold-soft);background:var(--surface2)}.p-info{flex-direction:column;gap:.2rem;min-width:0;display:flex}.p-name{letter-spacing:-.01em;white-space:nowrap;text-overflow:ellipsis;font-size:.92rem;font-weight:700;overflow:hidden}.p-meta{color:var(--muted);font-size:.67rem}.p-stats{flex-shrink:0;gap:.5rem;display:flex}.stat-block{flex-direction:column;align-items:center;gap:.05rem;display:flex}.stat-num{font-size:.82rem;font-weight:700}.stat-lbl{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-size:.52rem}.stat-blind{color:var(--dimmer);font-size:.78rem;font-style:italic}.simulate-bar{width:100%}.btn-simulate{background:var(--green);color:#000;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;border:none;width:100%;padding:1rem;font-size:.9rem;font-weight:800;transition:opacity .15s}.btn-simulate:hover{opacity:.88}.screen-results{text-align:center;justify-content:flex-start;gap:1.25rem;width:100%;max-width:520px;margin:0 auto;padding:2rem 1.25rem 3rem}.res-eyebrow{letter-spacing:.2em;color:var(--muted);text-transform:uppercase;font-size:.65rem;font-weight:700}.res-record{letter-spacing:-.04em;white-space:nowrap;font-size:clamp(2.8rem,12vw,5.5rem);font-weight:900;line-height:1}.res-record.legendary{color:var(--gold);text-shadow:0 0 40px #ffce3a59}.res-record.dominant{color:var(--green)}.res-record.great{color:#6ee7b7}.res-record.solid{color:#fbbf24}.res-record.below{color:#f87171}.res-tier{letter-spacing:.2em;color:var(--muted);text-transform:uppercase;font-size:.75rem;font-weight:700}.res-desc{color:var(--muted);max-width:360px;font-size:.88rem;line-height:1.6}.res-points{color:var(--dimmer);letter-spacing:.08em;text-transform:uppercase;font-size:.72rem}.strength-wrap{width:100%}.strength-row{color:var(--muted);letter-spacing:.04em;justify-content:space-between;margin-bottom:.4rem;font-size:.68rem;display:flex}.strength-track{background:var(--surface2);border-radius:2px;height:4px;overflow:hidden}.strength-fill{background:linear-gradient(90deg, var(--green), var(--gold));border-radius:2px;width:0;height:100%;transition:width 1.2s}.xi-section{width:100%}.xi-title{color:var(--muted);letter-spacing:.1em;text-transform:uppercase;text-align:left;margin-bottom:.6rem;font-size:.68rem;font-weight:700}.xi-list{flex-direction:column;gap:.3rem;display:flex}.xi-row{background:var(--surface);border:1px solid var(--border);align-items:center;gap:.75rem;padding:.55rem .85rem;display:flex}.xi-pos{color:var(--green);letter-spacing:.05em;text-align:left;flex-shrink:0;width:36px;font-size:.65rem;font-weight:800}.xi-name{text-align:left;flex:1;font-size:.85rem;font-weight:600}.xi-combo{color:var(--muted);white-space:nowrap;font-size:.65rem}.res-actions{flex-direction:column;gap:.6rem;width:100%;display:flex}.btn-share{width:100%;color:var(--gold);border:1px solid var(--gold-soft);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;background:0 0;padding:.85rem;font-size:.8rem;font-weight:800;transition:all .15s}.btn-share:hover{background:var(--gold-bg)}.share-note{color:var(--dimmer);letter-spacing:.04em;min-height:1em;font-size:.68rem}.modal-overlay{z-index:100;background:#000000d9;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:fixed;inset:0}.modal-box{background:var(--surface);border:1px solid var(--border);width:100%;max-width:400px;padding:2rem}.modal-title{letter-spacing:-.02em;margin-bottom:1.25rem;font-size:1.1rem;font-weight:900}.modal-step{align-items:flex-start;gap:1rem;margin-bottom:1rem;display:flex}.step-num{color:var(--gold);flex-shrink:0;width:20px;padding-top:1px;font-size:.7rem;font-weight:800}.step-text{color:var(--muted);font-size:.82rem;line-height:1.5}.step-text strong{color:#fff}.modal-divider{border:none;border-top:1px solid var(--border);margin:1.25rem 0}.modal-modes{gap:1.5rem;margin-bottom:1.5rem;display:flex}.modal-mode-label{color:var(--text);margin-bottom:.2rem;font-size:.7rem;font-weight:800}.modal-mode-desc{color:var(--muted);font-size:.72rem;line-height:1.4}.modal-cta{width:100%;padding:.75rem}