:root{--bg-0: #12151a;--bg-1: #1a1f27;--bg-2: #242b36;--ink: #e8e2d6;--ink-dim: #a39e92;--accent: #c45c26;--accent-soft: #e08a4f;--line: rgba(232, 226, 214, .12);--core: #d4a017;--situational: #6b8f9c;--danger: #c96b6b;--font-display: "Bebas Neue", Impact, sans-serif;--font-body: "Source Sans 3", "Segoe UI", sans-serif}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%}body{font-family:var(--font-body);color:var(--ink);background:radial-gradient(1200px 600px at 10% -10%,#2a2218 0%,transparent 55%),radial-gradient(900px 500px at 100% 0%,#1c2430 0%,transparent 50%),linear-gradient(180deg,var(--bg-0),#0d0f13 100%);line-height:1.5}a{color:var(--accent-soft);text-decoration-thickness:1px;text-underline-offset:.18em}a:hover{color:var(--ink)}.app-shell{max-width:48rem;margin:0 auto;padding:1.5rem 1.25rem 4rem}.app-shell-wide{max-width:none;width:100%;padding:1rem 2.7rem 3rem}@media(min-width:900px){.app-shell-wide{padding:1.1rem 4rem 3.5rem}}.site-header{margin-bottom:2.5rem;border-bottom:1px solid var(--line);padding-bottom:1.25rem}.site-header-compact{margin-bottom:1.25rem;padding-bottom:.85rem}.site-header-compact .brand{font-size:clamp(1.85rem,5vw,2.6rem)}.brand-heading{margin:0;font-size:inherit;font-weight:inherit}.brand{font-family:var(--font-display);font-size:clamp(2.5rem,8vw,3.75rem);letter-spacing:.04em;color:var(--ink);text-decoration:none;line-height:.95;display:inline-block;font-weight:400}.brand:hover{color:var(--accent-soft)}.tagline{margin:.5rem 0 0;color:var(--ink-dim);font-size:1.05rem}.page-title{font-family:var(--font-display);font-size:clamp(2rem,6vw,2.75rem);letter-spacing:.03em;margin:0;font-weight:400}.page-lead{color:var(--ink-dim);margin:.5rem 0 1.5rem}.page-lead-compact{margin:.35rem 0 0;font-size:.95rem}.page-draft .page-title{font-size:clamp(1.65rem,4vw,2.15rem)}.search input,.variant-filter select{width:100%;padding:.85rem 1rem;border:1px solid var(--line);border-radius:2px;background:var(--bg-1);color:var(--ink);font:inherit;font-size:1.1rem}.search input:focus,.variant-filter select:focus{outline:2px solid var(--accent);outline-offset:2px}.hero-list{list-style:none;padding:0;margin:1.5rem 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem .75rem}.hero-list-compact{margin-top:.75rem;grid-template-columns:repeat(auto-fill,minmax(5.5rem,1fr));gap:.35rem .3rem}.hero-list .empty{grid-column:1 / -1}.hero-link,.hero-pick{display:flex;flex-direction:column;align-items:center;gap:.45rem;padding:.45rem .4rem .65rem;background:color-mix(in srgb,var(--bg-1) 88%,transparent);border:1px solid var(--line);color:var(--ink);text-decoration:none;text-align:center;transition:border-color .16s ease,transform .16s ease,background .16s ease}.hero-pick{width:100%;gap:.25rem;padding:.3rem .2rem .4rem;font:inherit;cursor:pointer;position:relative}.hero-link:hover,.hero-pick:hover{border-color:var(--accent);background:var(--bg-2);transform:translateY(-2px);color:var(--ink)}.hero-pick.is-enemy{border-color:color-mix(in srgb,var(--accent) 75%,var(--line));background:color-mix(in srgb,var(--accent) 16%,var(--bg-1))}.hero-thumb{width:100%;aspect-ratio:280 / 380;height:auto;object-fit:cover;object-position:top center;background:var(--bg-2);display:block}.hero-list-compact .hero-thumb{aspect-ratio:3 / 4}.hero-thumb-fallback{display:block}.hero-link-name{font-size:.95rem;font-weight:700;line-height:1.2}.hero-list-compact .hero-link-name{font-size:.68rem;font-weight:650;line-height:1.15;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hero-pick-badge{position:absolute;top:.2rem;left:.2rem;font-size:.58rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:.1rem .28rem;background:var(--situational);color:#0d0f13;line-height:1.1}.hero-pick-badge-enemy{background:var(--accent);color:var(--ink)}.page-draft>.page-lead-compact{margin-bottom:.75rem}.clear-btn{padding:.2rem .55rem;border:1px solid color-mix(in srgb,var(--danger) 65%,var(--line));background:color-mix(in srgb,var(--danger) 22%,var(--bg-0));color:#f0b4b4;font:inherit;font-weight:700;font-size:.7rem;cursor:pointer}.clear-btn:hover:not(:disabled){border-color:var(--danger);background:color-mix(in srgb,var(--danger) 38%,var(--bg-0));color:#ffd0d0}.clear-btn:disabled{opacity:.4;cursor:not-allowed}.draft-board{display:grid;gap:.4rem;padding:.55rem .65rem;border:1px solid var(--line);background:color-mix(in srgb,var(--bg-1) 80%,transparent);margin-bottom:.45rem}.draft-board-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.35rem .5rem}.draft-label{display:block;font-size:.65rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim);margin:0;line-height:1.2}.draft-enemy-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;min-height:2.15rem}.draft-enemy-chip-wrap{position:relative}.draft-chip{display:inline-flex;align-items:center;gap:.35rem;min-height:2.15rem;padding:.2rem .45rem .2rem .2rem;border:1px dashed var(--line);background:var(--bg-0);color:var(--ink-dim);font:inherit;cursor:pointer}.draft-chip.is-filled{border-style:solid;color:var(--ink)}.draft-chip.is-targeting{border-color:color-mix(in srgb,var(--accent-soft) 65%,var(--line))}.draft-chip.is-active-enemy{border-color:var(--accent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 55%,transparent)}.draft-chip .draft-slot-thumb{width:1.9rem;height:auto;aspect-ratio:3 / 4;flex-shrink:0}.draft-chip-add{min-width:4.5rem;justify-content:flex-start;padding-left:.2rem}.draft-chip-add-mark{width:1.9rem;height:2.45rem;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.1rem;font-weight:700;line-height:1;color:var(--accent-soft);background:var(--bg-2)}.draft-slot-thumb{width:100%;aspect-ratio:3 / 4;object-fit:cover;object-position:top center;background:var(--bg-2);display:block}.draft-slot-empty{background:repeating-linear-gradient(-45deg,var(--bg-2),var(--bg-2) 4px,var(--bg-1) 4px,var(--bg-1) 8px)}.draft-chip-name{font-size:.78rem;font-weight:700;line-height:1.15;max-width:7rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.draft-slot-remove{position:absolute;top:-.35rem;right:-.35rem;width:1.05rem;height:1.05rem;border:1px solid var(--line);border-radius:999px;background:var(--bg-2);color:var(--ink);font-size:.9rem;line-height:1;padding:0;cursor:pointer}.draft-slot-remove:hover{border-color:var(--danger);color:var(--danger)}.draft-guide{margin:0 0 .45rem;padding-left:1.15rem;color:var(--ink-dim);font-size:.82rem;line-height:1.35}.draft-guide li{margin:.1rem 0}.draft-hint{margin:0 0 .65rem;color:var(--ink-dim);font-size:.85rem}.team-results{margin-top:2rem;padding-top:1.25rem;border-top:1px solid var(--line)}.team-results-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.5rem .75rem;margin-bottom:.65rem}.team-results-title{font-family:var(--font-display);font-size:1.75rem;letter-spacing:.04em;font-weight:400;margin:0;color:var(--accent-soft)}.team-results-you{margin:0 0 .85rem;color:var(--ink-dim);font-size:.95rem}.opponent-tabs{list-style:none;margin:0 0 1rem;padding:0;display:flex;flex-wrap:wrap;align-items:stretch;gap:.4rem}.opponent-tabs>li{display:flex}.opponent-tab-wrap{position:relative}.opponent-tab{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--bg-1);color:var(--ink-dim);font:inherit;font-weight:700;cursor:pointer}.opponent-tab-team{height:100%;min-height:100%;min-width:4.35rem;max-width:5.25rem;padding:.45rem .5rem;font-size:.85rem;letter-spacing:.02em;text-align:center;line-height:1.2;box-sizing:border-box}.opponent-tab-hero{flex-direction:column;align-items:center;gap:.25rem;min-width:4.35rem;max-width:5.25rem;padding:.3rem .3rem .4rem}.opponent-tab-hero .hero-thumb{width:100%;aspect-ratio:3 / 4}.opponent-tab-name{font-size:.68rem;font-weight:650;line-height:1.15;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}.opponent-tab.is-active{border-color:var(--accent);color:var(--ink);background:color-mix(in srgb,var(--accent) 14%,var(--bg-1))}.team-summary-lead{margin:0 0 1rem;color:var(--ink-dim);font-size:.95rem}.team-summary-list{list-style:none;margin:0;padding:0}.team-summary-item{padding:1rem 0 1.15rem;border-top:1px solid var(--line)}.team-summary-header{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem 1rem;margin-bottom:.65rem}.team-summary-header h3{margin:0;font-size:1.35rem}.meta-tags li[data-kind=coverage]{color:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 45%,transparent)}.team-summary-against-label{margin:0 0 .35rem;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim)}.team-summary-against{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}.team-summary-hero{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .5rem .2rem .2rem;border:1px solid var(--line);background:var(--bg-1);color:var(--ink);font:inherit;font-size:.85rem;font-weight:600;cursor:pointer}.team-summary-hero:hover{border-color:var(--accent)}.team-summary-hero .draft-slot-thumb{width:1.65rem;height:auto;aspect-ratio:3 / 4}.team-enemy-heading{display:flex;gap:.85rem;align-items:flex-start;margin-bottom:1rem}.team-enemy-heading .hero-thumb{width:5.5rem;aspect-ratio:3 / 4;flex-shrink:0;border:1px solid var(--line)}.team-enemy-name{font-family:var(--font-display);font-size:1.85rem;letter-spacing:.03em;font-weight:400;margin:0;line-height:.95}.team-section-title{font-family:var(--font-display);font-size:1.45rem;letter-spacing:.04em;font-weight:400;margin:0 0 .75rem;color:var(--accent-soft)}@media(max-width:640px){.hero-list-compact{grid-template-columns:repeat(auto-fill,minmax(4.75rem,1fr))}.app-shell-wide{padding-left:1.7rem;padding-right:1.7rem}}@media(max-width:520px){.hero-list:not(.hero-list-compact){grid-template-columns:repeat(2,minmax(0,1fr))}}.crumb{color:var(--ink-dim);margin:0 0 .75rem;font-size:.95rem}.hero-heading{display:flex;flex-wrap:nowrap;align-items:stretch;gap:1rem 1.25rem;margin-bottom:1.5rem}.hero-card{width:6.5rem;height:8.8rem;object-fit:cover;object-position:top center;border:1px solid var(--line);background:var(--bg-2);flex-shrink:0}.hero-heading-text{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;min-height:8.8rem;padding-top:0;gap:.5rem}.hero-heading-text .page-title{margin:0;line-height:.95;align-self:flex-start}.hero-heading-foot{display:flex;flex-direction:column;gap:.15rem;margin-top:auto}.hero-tagline{margin:0;color:var(--ink-dim);font-size:.95rem;line-height:1.25}.counter-title{display:flex;align-items:center;gap:.75rem;min-width:0}.item-icon{width:3rem;height:3rem;object-fit:contain;flex-shrink:0;background:var(--bg-2);border:1px solid var(--line)}.also-against{display:flex;flex-wrap:wrap;gap:.5rem}.also-against-link{display:inline-flex;align-items:center;gap:.4rem;padding:.25rem .55rem .25rem .25rem;border:1px solid var(--line);background:var(--bg-1);color:var(--ink);text-decoration:none;font-weight:600}.also-against-link.is-selected-enemy{border-color:color-mix(in srgb,var(--accent) 75%,var(--line));background:color-mix(in srgb,var(--accent) 16%,var(--bg-1));color:var(--ink)}.also-against-link:hover{border-color:var(--accent);color:var(--ink)}.also-against-link img{width:1.35rem;height:1.8rem;object-fit:cover;object-position:top center}.reviewed{margin:0;color:var(--ink-dim);font-size:.9rem;font-style:italic;line-height:1.2}.variant-filter{display:grid;gap:.4rem;margin-bottom:2rem;color:var(--ink-dim);font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em}.counter-section{margin-top:2.25rem}.counter-section h2{font-family:var(--font-display);font-size:1.75rem;letter-spacing:.04em;font-weight:400;margin:0 0 1rem;color:var(--accent-soft)}.counter{padding:1.15rem 0 1.35rem;border-top:1px solid var(--line)}.counter-header{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem 1rem;margin-bottom:.85rem}.counter-header h3{margin:0;font-size:1.35rem}.meta-tags{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:0}.meta-tags li{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.2rem .45rem;border:1px solid var(--line);color:var(--ink-dim)}.meta-tags li[data-kind=priority]{color:var(--core);border-color:color-mix(in srgb,var(--core) 45%,transparent)}.meta-tags li[data-kind=phase]{color:var(--situational);border-color:color-mix(in srgb,var(--situational) 45%,transparent)}.advice{margin:0;display:grid;gap:.75rem}.advice div{display:grid;gap:.15rem}.advice dt{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim)}.advice dd{margin:0}.advice .watch-out dd{color:color-mix(in srgb,var(--danger) 75%,var(--ink))}.empty{color:var(--ink-dim)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.site-footer{margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--line)}.site-footer-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 1.25rem}.tip-link{font-weight:700;color:var(--accent-soft);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--accent) 55%,transparent)}.tip-link:hover{color:var(--ink)}.footer-nav{display:flex;gap:1rem;font-size:.95rem}.footer-note{margin:.85rem 0 0;color:var(--ink-dim);font-size:.85rem}.ad-slot{margin:2rem 0 0;min-height:0;border-top:1px solid var(--line);padding-top:1rem}.legal-body{color:var(--ink-dim);display:grid;gap:.85rem;margin-top:1rem}.legal-body h2{margin:.75rem 0 0;font-family:var(--font-display);font-size:1.4rem;font-weight:400;letter-spacing:.04em;color:var(--ink)}.legal-body p{margin:0}@media(prefers-reduced-motion:reduce){.hero-link,.hero-pick{transition:none}}
