*,*::before,*::after{box-sizing:border-box}body{margin:0}button,input{font:inherit}img{max-width:100%}:root { font-family: Inter, Arial, sans-serif; color: rgb(244, 244, 244); background: rgb(0, 0, 0); font-synthesis: none; --orange: #ff6600; --muted: #b6b6b6; --panel: #141414; --line: #343434; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body { margin: 0px; background: rgb(0, 0, 0); color: rgb(244, 244, 244); }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: 0.6; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
img { max-width: 100%; display: block; }
p { line-height: 1.65; }
h1, h2, h3, p { margin: 0px; }
h1, h2 { font-weight: 850; letter-spacing: -0.055em; line-height: 1.04; }
h3 { letter-spacing: -0.025em; }
button:focus-visible, a:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: rgb(255, 153, 79) solid 3px; outline-offset: 4px; }
::selection { background: rgb(255, 102, 0); color: rgb(0, 0, 0); }
.spx { overflow-x: clip; padding-bottom: 76px; }
.skip { position: fixed; top: 8px; left: 8px; z-index: 100; background: rgb(255, 255, 255); color: rgb(0, 0, 0); padding: 14px; transform: translateY(-200%); }
.skip:focus { transform: none; }
.site-header { height: 76px; padding: 10px 20px; border-bottom: 1px solid rgb(38, 38, 38); display: flex; align-items: center; justify-content: space-between; gap: 16px; background: rgb(5, 5, 5); position: relative; z-index: 5; }
.brand { display: block; width: 151px; background: rgb(255, 255, 255); padding: 3px 7px; border-radius: 3px; }
.brand img { width: 100%; height: auto; }
.header-access { border: 0px; background: transparent; font-size: 12px; font-weight: 700; white-space: nowrap; padding: 12px 0px; min-height: 44px; }
.header-access span { color: var(--orange); font-size: 20px; margin-left: 6px; }
.desktop-nav { display: none; }
.arena-hero { position: relative; isolation: isolate; min-height: 680px; background: rgb(0, 0, 0); }
.hero-media { position: absolute; inset: 0px; z-index: -1; overflow: hidden; }
.hero-media > img, .hero-media > video { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%; }
.hero-scrim { position: absolute; inset: 0px; background: linear-gradient(rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.08) 23%, rgba(0, 0, 0, 0.76) 52%, rgb(0, 0, 0) 99%); }
.hero-content { padding: 270px 22px 48px; max-width: 720px; }
.hero-label, .kicker, .hero-caption, .timestamp, .card-meta, .ticket-index { font-family: "JetBrains Mono", monospace; }
.hero-label { font-size: 10px; letter-spacing: 0.08em; margin-bottom: 18px; color: rgb(226, 226, 226); }
.hero-content h1 { font-size: clamp(38px, 10vw, 62px); font-weight: 900; letter-spacing: -0.065em; line-height: 0.97; }
.hero-content h1 span, .method-copy h2 span, .account-page h1 span { color: var(--orange); }
.hero-sub { font-size: 15px; max-width: 370px; color: rgb(210, 210, 210); line-height: 1.6; margin-top: 20px; }
.hero-action { width: 100%; border: 0px; border-radius: 5px; background: var(--orange); color: rgb(18, 8, 0); min-height: 56px; display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; font-weight: 800; font-size: 15px; margin-top: 25px; transition: background 0.2s, transform 0.2s; }
.hero-action:hover { background: rgb(255, 139, 62); }
.hero-action:active { transform: translateY(2px); }
.hero-action span { font-size: 24px; }
.hero-record { display: inline-flex; align-items: center; gap: 32px; min-height: 48px; font-size: 13px; font-weight: 600; margin-top: 9px; }
.hero-record span { color: var(--orange); }
.hero-note { font-size: 10px; color: rgb(170, 170, 170); margin-top: 8px; }
.film-toggle { position: absolute; right: 16px; top: 18px; border: 1px solid rgba(255, 255, 255, 0.44); background: rgba(8, 8, 8, 0.7); padding: 12px 15px; border-radius: 30px; font-size: 10px; font-weight: 700; backdrop-filter: blur(8px); z-index: 1; min-height: 44px; }
.hero-caption { display: none; }
.section { padding: 56px 20px; max-width: 1220px; margin: auto; }
.section-heading { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 28px; }
.section-heading h2 { font-size: 36px; }
.section-heading p { font-size: 14px; color: var(--muted); }
.kicker { font-size: 10px; letter-spacing: 0.13em; color: var(--orange); margin-bottom: 16px; }
.text-arrow { display: inline-flex; align-items: center; min-height: 44px; border: 0px; background: transparent; padding: 0px; color: rgb(243, 243, 243); font-size: 13px; font-weight: 700; }
.text-arrow:hover { color: var(--orange); }
.preview-section { border-top: 1px solid var(--line); }
.preview-grid { display: grid; gap: 34px; }
.empty-state { border: 1px solid var(--line); background: linear-gradient(150deg, rgb(25, 25, 25), rgb(11, 11, 11)); padding: 28px 23px; border-radius: 14px; min-height: 235px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.empty-symbol { font-family: "JetBrains Mono", monospace; color: var(--orange); font-size: 34px; letter-spacing: 0.1em; margin-bottom: 20px; }
.empty-state h3 { font-size: 21px; line-height: 1.25; max-width: 300px; }
.empty-state p { color: var(--muted); font-size: 14px; margin-top: 12px; max-width: 420px; }
.empty-action { display: flex; align-items: center; justify-content: space-between; width: 100%; border-right: 0px; border-bottom: 0px; border-left: 0px; border-image: none; border-top: 1px solid var(--line); background: transparent; min-height: 50px; padding: 19px 0px 0px; margin-top: 26px; font-weight: 600; font-size: 13px; }
.empty-action span { color: var(--orange); font-size: 20px; }
.empty-state.results { min-height: 170px; background: rgb(16, 16, 16); }
.empty-state.results .empty-symbol { display: none; }
.evidence-notes { display: grid; gap: 26px; }
.evidence-notes > div { padding-left: 40px; position: relative; }
.evidence-notes > div > span { position: absolute; left: 0px; top: 3px; color: var(--orange); font-size: 11px; font-family: "JetBrains Mono", monospace; }
.evidence-notes h3 { font-size: 18px; }
.evidence-notes p { font-size: 14px; color: var(--muted); margin-top: 8px; }
.method-section { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); display: grid; max-width: 1440px; margin: auto; background: rgb(10, 10, 10); }
.method-image { overflow: hidden; }
.method-image img { width: 100%; height: 300px; object-fit: cover; }
.method-copy { padding: 38px 22px 48px; }
.method-copy h2 { font-size: 34px; }
.method-copy > p { font-size: 14px; color: var(--muted); margin-top: 24px; max-width: 480px; }
.cadence { padding: 0px; margin: 28px 0px; list-style: none; border-top: 1px solid var(--line); }
.cadence li { display: grid; grid-template-columns: 78px 1fr; gap: 10px; padding: 17px 0px; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.5; }
.cadence b { font-size: 13px; color: rgb(238, 238, 238); }
.cadence span { color: var(--muted); }
.method-copy small { font-size: 10px; color: rgb(153, 153, 153); line-height: 1.6; display: block; }
.muted { color: var(--muted); font-size: 14px; margin-bottom: 24px; }
.record-preview { padding-top: 62px; }
.membership { border-top: 1px solid var(--line); }
.plan-grid { display: grid; gap: 16px; }
.plan-ticket { border: 1px solid var(--line); background: rgb(16, 16, 16); padding: 25px; border-radius: 12px; position: relative; }
.plan-pro { border-color: rgb(186, 75, 0); background: linear-gradient(155deg, rgb(37, 20, 8), rgb(14, 14, 14)); }
.ticket-index { font-size: 9px; letter-spacing: 0.1em; color: rgb(153, 153, 153); }
.plan-ticket h3 { font-size: 21px; margin: 19px 0px; }
.plan-price { font-size: 51px; font-weight: 750; letter-spacing: -0.06em; line-height: 1.1; }
.plan-price span { font-size: 12px; font-weight: 400; letter-spacing: 0px; color: var(--muted); margin-left: 8px; }
.plan-ticket > p { font-size: 13px; color: var(--muted); margin-top: 14px; }
.plan-ticket ul { padding: 0px; list-style: none; margin: 24px 0px; font-size: 13px; color: rgb(221, 221, 221); display: grid; gap: 14px; }
.plan-ticket li::before { content: "✓"; color: var(--orange); margin-right: 10px; }
.plan-ticket button { display: flex; justify-content: space-between; align-items: center; border-width: 1px 0px 0px; border-style: dashed none none; border-color: rgb(85, 85, 85) currentcolor currentcolor; border-image: none; background: transparent; width: 100%; padding: 22px 0px 0px; min-height: 52px; font-size: 13px; font-weight: 700; }
.plan-ticket button span { color: var(--orange); font-size: 24px; }
.plan-ticket button:hover { color: var(--orange); }
.membership-note { margin-top: 18px; color: rgb(153, 153, 153); font-size: 11px; line-height: 1.6; }
.closing { padding: 52px 22px; background: var(--orange); color: rgb(8, 4, 0); text-align: left; }
.closing p { font-size: 28px; font-weight: 700; letter-spacing: -0.04em; line-height: 1.2; max-width: 1200px; margin: auto; }
.closing button { margin-top: 24px; min-height: 50px; padding: 13px 21px; background: rgb(8, 8, 8); border: 0px; border-radius: 4px; color: rgb(255, 255, 255); display: flex; gap: 30px; align-items: center; font-weight: 600; font-size: 13px; }
.closing button span { color: var(--orange); font-size: 20px; }
.site-footer { padding: 40px 22px; color: rgb(148, 148, 148); background: rgb(8, 8, 8); }
.footer-word { font-weight: 900; color: rgb(245, 245, 245); letter-spacing: -0.05em; font-size: 23px; }
.footer-word span { color: var(--orange); }
.site-footer p { font-size: 11px; max-width: 440px; margin: 16px 0px; }
.site-footer > div { display: flex; gap: 24px; flex-wrap: wrap; font-size: 12px; }
.site-footer a { min-height: 40px; display: inline-flex; align-items: center; }
.site-footer small { display: block; font-size: 10px; margin-top: 24px; }
.bottom-nav { position: fixed; z-index: 10; left: 0px; right: 0px; bottom: 0px; display: grid; grid-template-columns: repeat(4, 1fr); background: rgba(17, 17, 17, 0.96); backdrop-filter: blur(18px); border-top: 1px solid rgb(51, 51, 51); padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); }
.bottom-nav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-height: 49px; font-size: 10px; color: rgb(155, 155, 155); }
.bottom-nav a[aria-current="page"] { color: var(--orange); }
.board-page { min-height: 75vh; padding-top: 38px; }
.page-intro h1 { font-size: 42px; max-width: 680px; }
.page-intro > p:not(.kicker):not(.timestamp) { font-size: 15px; color: var(--muted); margin-top: 16px; max-width: 520px; }
.timestamp { font-size: 9px; color: rgb(157, 157, 157); line-height: 1.6; margin-top: 16px; }
.filter-row, .result-filters { display: flex; gap: 8px; overflow-x: auto; padding: 4px 1px 14px; scrollbar-width: thin; scrollbar-color: rgb(68, 68, 68) transparent; }
.filter-row { margin-top: 25px; }
.filter-row button, .result-filters button { flex: 0 0 auto; min-height: 44px; border: 1px solid rgb(60, 60, 60); color: rgb(191, 191, 191); background: rgb(21, 21, 21); padding: 10px 17px; border-radius: 30px; font-size: 12px; font-weight: 600; }
.filter-row button[aria-pressed="true"] { color: rgb(16, 7, 0); border-color: var(--orange); background: var(--orange); }
.result-filters { margin-bottom: 14px; gap: 5px; }
.result-filters button { border: 0px; border-radius: 5px; padding: 9px 12px; font-size: 11px; background: transparent; }
.result-filters button[aria-pressed="true"] { background: rgb(37, 37, 37); color: rgb(255, 255, 255); }
.audit-grid { display: grid; gap: 20px; }
.pick-card { border: 1px solid rgb(115, 64, 24); background: linear-gradient(140deg, rgb(33, 21, 11), rgb(17, 17, 17) 60%); padding: 24px 20px; border-radius: 14px; box-shadow: rgba(255, 102, 0, 0.035) 0px 2px 32px; }
.card-meta { display: flex; justify-content: space-between; gap: 8px; text-transform: uppercase; letter-spacing: 0.03em; font-size: 9px; color: rgb(179, 163, 150); margin-bottom: 22px; }
.card-meta span:first-child { color: var(--orange); }
.pick-card h3 { font-size: 19px; }
.pick-name { color: var(--orange); font-weight: 750; line-height: 1.2; margin-top: 12px; font-size: 26px !important; }
.price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; border-top: 1px solid rgb(75, 55, 40); border-bottom: 1px solid rgb(75, 55, 40); padding: 18px 0px; margin: 22px 0px; }
.price-grid dt { font-size: 9px; color: rgb(185, 170, 160); line-height: 1.5; }
.price-grid dd { font: 500 17px "JetBrains Mono", monospace; margin: 9px 0px 0px; }
.pick-card details summary { font-weight: 650; font-size: 13px; min-height: 40px; cursor: pointer; }
.pick-card ol, .result-row ol { padding-left: 18px; line-height: 1.65; font-size: 13px; color: rgb(199, 199, 199); margin: 4px 0px 20px; }
.pick-card li + li, .result-row li + li { margin-top: 9px; }
.pick-card small { font-size: 9px; color: rgb(170, 170, 170); }
.data-note { border-top: 1px solid rgb(51, 51, 51); padding-top: 20px; margin-top: 32px; font-size: 11px; color: rgb(153, 153, 153); max-width: 750px; }
.results-summary { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); padding: 22px 18px 14px; margin: 26px 0px 8px; border-radius: 12px; background: rgb(17, 17, 17); gap: 12px; }
.results-summary > div { border-right: 1px solid rgb(51, 51, 51); }
.results-summary > div:nth-child(3) { border: 0px; }
.results-summary span { display: block; font-size: 9px; color: rgb(179, 179, 179); margin-bottom: 13px; }
.results-summary strong { display: block; font: 500 29px "JetBrains Mono", monospace; letter-spacing: -0.05em; }
.results-summary > p { grid-column: 1 / -1; color: rgb(148, 148, 148); font-size: 9px; margin-top: 10px; border-top: 1px solid rgb(44, 44, 44); padding-top: 12px; line-height: 1.5; }
.ledger-list { display: grid; gap: 0px; border-top: 1px solid var(--line); }
.result-row { display: grid; grid-template-columns: 1fr auto; gap: 18px; padding: 24px 0px; border-bottom: 1px solid var(--line); }
.result-sport { color: rgb(136, 136, 136); font: 10px "JetBrains Mono", monospace; }
.result-row h3 { font-size: 16px; margin: 9px 0px; }
.result-row p { font-size: 12px; color: var(--muted); }
.result-badge { padding: 7px 12px; border: 1px solid rgb(102, 102, 102); height: fit-content; font-size: 10px; font-weight: 650; border-radius: 4px; }
.result-badge.win { color: rgb(163, 216, 188); border-color: rgb(62, 96, 76); background: rgb(20, 35, 26); }
.result-badge.loss { color: rgb(232, 168, 158); border-color: rgb(113, 70, 62); background: rgb(38, 24, 22); }
.result-row details { grid-column: 1 / -1; }
.result-row summary { cursor: pointer; min-height: 30px; font-size: 11px; color: rgb(187, 187, 187); }
.result-row details p { margin: 10px 0px; }
.loading-state { padding: 50px 22px; color: rgb(170, 170, 170); font-size: 14px; border: 1px solid var(--line); border-radius: 12px; }
.account-page { max-width: 820px; padding-top: 38px; }
.account-page h1 { font-size: 54px; line-height: 1; letter-spacing: -0.06em; }
.profile-welcome { display: flex; align-items: center; gap: 16px; padding: 26px 0px; margin: 5px 0px 8px; }
.profile-avatar { width: 62px; height: 62px; border-radius: 19px; background: var(--orange); display: flex; align-items: center; justify-content: center; color: rgb(8, 8, 8); font-size: 34px; font-weight: 900; position: relative; }
.profile-avatar span { font-size: 18px; position: absolute; right: 8px; top: 6px; }
.profile-welcome h2 { font-size: 21px; letter-spacing: -0.035em; }
.profile-welcome p { font-size: 12px; color: var(--muted); margin-top: 6px; }
.account-panel { padding: 24px 20px; border: 1px solid var(--line); border-radius: 14px; background: rgb(20, 20, 20); margin-bottom: 18px; }
.panel-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.panel-title h2, .account-panel h2 { font-size: 23px; letter-spacing: -0.045em; }
.panel-title > span { font-size: 10px; color: rgb(170, 170, 170); }
.account-panel > p { font-size: 13px; color: var(--muted); margin-top: 12px; }
.sports-preferences { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 20px 0px; }
.sports-preferences button { background: rgb(32, 32, 32); border: 1px solid rgb(58, 58, 58); border-radius: 9px; min-height: 56px; display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; font-size: 13px; font-weight: 700; }
.sports-preferences button[aria-pressed="true"] { background: rgb(51, 32, 14); border-color: var(--orange); color: rgb(255, 143, 68); }
.account-panel small { font-size: 10px; color: rgb(153, 153, 153); display: block; line-height: 1.6; }
.beta-badge { font: 9px "JetBrains Mono", monospace; color: var(--orange); display: inline-block; letter-spacing: 0.08em; margin-bottom: 16px; }
.account-membership { background: linear-gradient(140deg, rgb(33, 20, 9), rgb(17, 17, 17)); border-color: rgb(91, 52, 27); }
.account-button { background: var(--orange); color: rgb(20, 9, 0); border: 0px; min-height: 50px; border-radius: 5px; padding: 14px 18px; display: flex; justify-content: space-between; font-size: 13px; font-weight: 700; width: 100%; margin: 20px 0px 14px; }
.account-links { border-top: 1px solid var(--line); margin-top: 32px; }
.account-links a { display: flex; align-items: center; gap: 16px; padding: 22px 2px; border-bottom: 1px solid var(--line); font-size: 13px; }
.account-links a > span:last-child { margin-left: auto; color: var(--orange); }
.account-links svg { color: rgb(153, 153, 153); }
.access-dialog { border: 1px solid rgb(85, 85, 85); border-radius: 18px; padding: 0px; max-width: 480px; width: calc(100% - 28px); max-height: 88dvh; background: rgb(20, 20, 20); color: rgb(244, 244, 244); overflow: auto; box-shadow: rgba(0, 0, 0, 0.533) 0px 30px 100px; margin: auto; }
.access-dialog::backdrop { background: rgba(0, 0, 0, 0.667); backdrop-filter: blur(7px); }
.dialog-body { padding: 36px 22px 26px; position: relative; }
.dialog-close { position: absolute; right: 12px; top: 7px; border: 0px; background: transparent; font-size: 30px; min-width: 44px; min-height: 44px; color: rgb(187, 187, 187); }
.dialog-body h2 { font-size: 38px; letter-spacing: -0.05em; margin: 15px 0px; }
.dialog-body > p, .request-success p { font-size: 13px; color: var(--muted); margin-bottom: 24px; }
form label { display: block; font-size: 12px; font-weight: 600; margin: 17px 0px; color: rgb(231, 231, 231); }
form label > span { font-weight: 400; color: rgb(153, 153, 153); }
input:not([type="checkbox"]), select, textarea { display: block; width: 100%; border: 1px solid rgb(74, 74, 74); background: rgb(34, 34, 34); color: rgb(255, 255, 255); border-radius: 6px; padding: 12px 13px; margin-top: 8px; min-height: 48px; font-size: 16px; }
textarea { min-height: 95px; resize: vertical; }
.form-pair { display: grid; gap: 0px 12px; grid-template-columns: 1fr; }
.consent { display: flex; align-items: flex-start; gap: 12px; line-height: 1.6; font-size: 11px; margin-top: 23px; }
.consent input { flex: 0 0 auto; margin-top: 3px; width: 18px; height: 18px; accent-color: var(--orange); }
.consent a { text-decoration: underline; color: rgb(221, 221, 221); }
.form-message { color: rgb(255, 189, 150); font-size: 12px; min-height: 8px; }
.submit-access { min-height: 52px; display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 14px 18px; background: var(--orange); color: rgb(19, 7, 0); border: 0px; border-radius: 6px; font-weight: 750; font-size: 14px; margin-top: 16px; }
.request-success { padding: 22px 0px; }
.success-mark { display: flex; width: 60px; height: 60px; justify-content: center; align-items: center; border-radius: 50%; background: rgba(255, 102, 0, 0.15); color: var(--orange); font-size: 30px; }
.request-success button { border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgb(119, 119, 119); border-image: none; background: transparent; min-height: 48px; font-size: 13px; }
.privacy-page { max-width: 800px; min-height: 70vh; }
.privacy-page h1 { font-size: 40px; margin-bottom: 28px; }
.privacy-page p { font-size: 15px; color: var(--muted); margin-bottom: 22px; }
.admin-page { max-width: 1100px; min-height: 80vh; }
.admin-page h1 { font-size: 40px; margin: 24px 0px; }
.admin-page h2 { font-size: 25px; margin: 26px 0px 16px; }
.admin-page h3 { font-size: 19px; }
.admin-page p { color: rgb(187, 187, 187); font-size: 14px; }
.admin-page button { border: 1px solid rgb(102, 102, 102); background: rgb(37, 37, 37); padding: 12px 17px; border-radius: 6px; min-height: 44px; font-size: 13px; }
.admin-page button[type="submit"] { background: var(--orange); border: 0px; color: rgb(16, 7, 0); font-weight: 700; }
.admin-page button:disabled { opacity: 0.45; }
.admin-form { border: 1px solid rgb(51, 51, 51); border-radius: 12px; background: rgb(17, 17, 17); padding: 24px; margin: 22px 0px; }
.admin-page label { display: block; margin: 16px 0px; font-size: 13px; }
.admin-page input[type="checkbox"] { width: 19px; height: 19px; accent-color: var(--orange); margin-right: 10px; }
.admin-page code { color: rgb(255, 155, 89); overflow-wrap: anywhere; }
.admin-page article, .admin-card { border-bottom: 1px solid rgb(51, 51, 51); padding: 22px 0px; }
.admin-page table { width: 100%; border-collapse: collapse; display: block; overflow: auto; font-size: 12px; margin: 20px 0px; }
.admin-page td, .admin-page th { text-align: left; padding: 12px; border-bottom: 1px solid rgb(51, 51, 51); }
.admin-page nav { display: flex; gap: 10px; flex-wrap: wrap; }
.admin-message { color: rgb(255, 181, 126) !important; margin: 16px 0px !important; }
@media (min-width: 620px) {
  .site-header { padding: 12px 32px; }
  .hero-content { padding: 310px 38px 60px; }
  .hero-content h1 { font-size: 64px; }
  .hero-action { max-width: 380px; }
  .hero-sub { font-size: 17px; }
  .section { padding: 70px 34px; }
  .section-heading { flex-direction: row; justify-content: space-between; align-items: flex-end; }
  .section-heading h2 { font-size: 43px; }
  .section-heading p { max-width: 300px; }
  .method-copy { padding: 45px 34px; }
  .method-copy h2 { font-size: 46px; }
  .audit-grid, .form-pair { grid-template-columns: 1fr 1fr; }
  .dialog-body { padding: 40px 30px 30px; }
  .plan-grid { grid-template-columns: repeat(3, 1fr); gap: 12px; }
  .plan-ticket { padding: 22px 18px; display: flex; flex-direction: column; }
  .plan-ticket h3 { font-size: 18px; }
  .plan-price { font-size: 43px; }
  .plan-price span { font-size: 10px; margin-left: 4px; }
  .plan-ticket ul { font-size: 11px; flex: 1 1 0%; }
  .plan-ticket button { font-size: 11px; gap: 8px; }
  .closing { padding: 50px 34px; }
  .closing p { font-size: 36px; }
  .account-page h1 { font-size: 64px; }
  .account-panel { padding: 28px; }
  .profile-welcome { padding: 32px 0px; }
  .sports-preferences { grid-template-columns: repeat(4, 1fr); }
  .page-intro h1 { font-size: 60px; }
  .results-summary { max-width: 760px; padding: 28px; }
  .results-summary strong { font-size: 38px; }
  .results-summary span { font-size: 11px; }
  .results-summary > p { font-size: 11px; }
}
@media (min-width: 960px) {
  .spx { padding-bottom: 0px; }
  .site-header { height: 90px; padding: 14px max(40px, -610px + 50vw); }
  .brand { width: 174px; }
  .header-access { font-size: 13px; }
  .desktop-nav { display: flex; gap: 32px; margin-left: auto; margin-right: 34px; font-size: 13px; color: rgb(191, 191, 191); }
  .desktop-nav a { padding: 14px 0px; }
  .desktop-nav a:hover { color: rgb(255, 255, 255); }
  .bottom-nav { display: none; }
  .arena-hero { min-height: 770px; max-width: 1600px; margin: auto; }
  .hero-content { padding: 125px max(40px, -610px + 50vw) 65px; max-width: 1000px; width: 80%; }
  .hero-content h1 { font-size: 82px; letter-spacing: -0.06em; }
  .hero-label { font-size: 11px; margin-bottom: 25px; }
  .hero-sub { font-size: 17px; max-width: 390px; }
  .hero-media { left: 32%; }
  .hero-media > img, .hero-media > video { object-position: 50% 30%; }
  .hero-scrim { background: linear-gradient(90deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 20%, transparent 60%), linear-gradient(0deg, rgb(0, 0, 0), transparent 40%); }
  .film-toggle { top: 34px; right: 40px; }
  .hero-caption { display: block; position: absolute; right: 40px; bottom: 30px; font-size: 9px; letter-spacing: 0.15em; color: rgb(188, 188, 188); }
  .section { padding: 86px 40px; }
  .section-heading { margin-bottom: 38px; }
  .section-heading h2 { font-size: 49px; }
  .preview-grid { grid-template-columns: 1.1fr 1fr; gap: 70px; align-items: center; }
  .evidence-notes { gap: 28px; }
  .empty-state { padding: 40px; min-height: 300px; }
  .empty-state h3 { font-size: 26px; }
  .method-section { grid-template-columns: 1fr 1fr; align-items: stretch; }
  .method-image img { height: 100%; min-height: 580px; object-fit: cover; }
  .method-copy { padding: 72px 60px; }
  .method-copy h2 { font-size: 46px; }
  .plan-grid { gap: 22px; }
  .plan-ticket { padding: 32px; }
  .plan-ticket h3 { font-size: 23px; }
  .plan-price { font-size: 58px; }
  .plan-ticket ul { font-size: 13px; gap: 16px; margin: 28px 0px 36px; }
  .plan-ticket button { font-size: 13px; }
  .closing { padding: 62px max(40px, -570px + 50vw); display: flex; align-items: center; justify-content: space-between; gap: 40px; }
  .closing p { margin: 0px; font-size: 40px; }
  .closing button { margin: 0px; white-space: nowrap; }
  .site-footer { padding: 50px max(40px, -570px + 50vw); }
  .board-page { padding-top: 65px; }
  .board-page .audit-grid { grid-template-columns: repeat(3, 1fr); }
  .account-page { padding-top: 60px; max-width: 900px; }
  .account-page h1 { font-size: 76px; }
  .account-page .account-panel { padding: 30px; }
  .page-intro h1 { font-size: 68px; }
  .results-summary { margin-top: 36px; }
  .privacy-page { max-width: 800px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, ::before, ::after { transition: none !important; animation: auto ease 0s 1 normal none running none !important; }
}
#sample { scroll-margin-top: 24px; }
.film-toggle { z-index: 3; }
.preview-grid > .educational-sample { align-self: start; }
.playbook-views { display: flex; gap: 8px; flex-wrap: wrap; margin: 0px 0px 28px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.playbook-views button { min-height: 48px; padding: 12px 18px; border: 1px solid var(--line); background: rgb(20, 20, 20); color: rgb(221, 221, 221); font-size: 14px; font-weight: 750; text-align: left; }
.playbook-views button[aria-pressed="true"] { background: var(--orange); border-color: var(--orange); color: rgb(16, 16, 16); }
.playbook-views button span { margin-left: 10px; }
.board-page > .educational-sample { max-width: 790px; }
.sample-invitation { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 28px 0px 10px; }
.sample-invitation h2 { font-size: 28px; letter-spacing: -0.04em; margin: 10px 0px; }
.sample-invitation p { font-size: 15px; color: var(--muted); line-height: 1.65; max-width: 440px; margin: 0px; }
.sample-invitation button { display: flex; align-items: center; justify-content: space-between; gap: 22px; min-height: 48px; padding: 14px 18px; white-space: nowrap; color: rgb(17, 17, 17); background: var(--orange); font-weight: 750; font-size: 14px; border: 0px; }
.record-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin: 24px 0px; }
.record-toolbar label { display: flex; flex-direction: column; gap: 9px; font-size: 12px; color: var(--muted); font-weight: 650; min-width: 190px; }
.record-toolbar select { min-height: 48px; background: rgb(23, 23, 23); border: 1px solid rgb(82, 82, 82); color: rgb(255, 255, 255); padding: 10px 32px 10px 13px; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 14px; }
.record-toolbar p { font-size: 13px; line-height: 1.6; color: var(--muted); max-width: 300px; margin: 0px 0px 8px; }
.record-guide { margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--line); }
.record-guide h2 { font-size: clamp(25px, 4vw, 36px); line-height: 1.2; letter-spacing: -0.04em; margin: 14px 0px 24px; }
.record-guide ol { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 24px; padding: 0px; margin: 0px; }
.record-guide li { display: flex; flex-direction: column; gap: 12px; border-top: 1px solid rgb(69, 69, 69); padding-top: 18px; }
.record-guide b { font-size: 14px; font-weight: 750; color: rgb(244, 244, 244); }
.record-guide li span { font-size: 14px; line-height: 1.65; color: var(--muted); }
.signup-preferences { margin: 18px 0px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.signup-preferences summary { cursor: pointer; min-height: 48px; padding: 15px 0px; font-size: 13px; font-weight: 700; color: rgb(231, 231, 231); }
.signup-preferences summary span { font-weight: 400; color: var(--muted); }
.signup-preferences .form-pair { padding: 4px 0px 18px; }
@media (max-width: 959px) {
  .hero-content { padding-top: clamp(140px, 24svh, 270px); }
  .hero-content h1 { font-size: clamp(32px, 8.6vw, 60px); line-height: 1.02; }
  .arena-hero { min-height: 0px; }
  .hero-content { padding-bottom: 60px; }
  .hero-sub { max-width: 33ch; }
  .hero-caption { bottom: 16px; }
}
@media (max-width: 619px) {
  .sample-invitation { align-items: stretch; flex-direction: column; }
  .record-toolbar { align-items: stretch; flex-direction: column; gap: 10px; }
  .record-toolbar p { max-width: none; }
  .record-guide ol { grid-template-columns: 1fr; gap: 20px; }
  .playbook-views button { flex: 1 1 auto; }
  .signup-preferences .form-pair { grid-template-columns: 1fr; }
  .hero-note { margin-top: 18px; }
  .hero-content h1 { letter-spacing: -0.055em; }
}
.results-summary .record-counts { display: flex; gap: 14px; flex-wrap: wrap; }
.results-summary .record-counts span { display: flex; align-items: baseline; gap: 3px; color: inherit; font: inherit; letter-spacing: inherit; margin: 0px; }
.results-summary .record-counts small { font: 600 11px Inter, sans-serif; color: rgb(179, 179, 179); letter-spacing: 0px; }
@media (max-width: 619px) {
  .results-summary { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
  .results-summary strong { font-size: clamp(18px, 5vw, 29px); }
  .results-summary .record-counts { flex-direction: column; gap: 3px; }
  .results-summary > p { font-size: 11px; }
}
.educational-sample { --sample-orange: #ff6600; --sample-ink: #171717; --sample-paper: #f4f4f4; background: rgb(21, 21, 21); border: 1px solid rgb(57, 57, 57); color: rgb(255, 255, 255); padding: clamp(18px, 4vw, 36px); min-width: 0px; width: 100%; margin: 0px; font-family: Inter, Arial, sans-serif; }
.educational-sample .sample-intro { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.educational-sample .sample-eyebrow { font-size: 11px; font-weight: 750; letter-spacing: 0.13em; line-height: 1.5; color: rgb(255, 133, 51); margin: 0px 0px 10px; }
.educational-sample .sample-title { font-family: Inter, Arial, sans-serif; font-size: clamp(27px, 4vw, 40px); font-weight: 850; letter-spacing: -0.045em; line-height: 1.1; text-transform: none; margin: 0px; color: rgb(255, 255, 255); }
.educational-sample .sample-index { font-family: "JetBrains Mono", monospace; font-size: 10px; white-space: nowrap; color: rgb(169, 169, 169); padding-top: 4px; letter-spacing: 0.06em; }
.educational-sample .sample-description { max-width: 56ch; color: rgb(191, 191, 191); font-size: 15px; line-height: 1.65; margin: 15px 0px 24px; }
.educational-sample .sample-paper { background: var(--sample-paper); color: var(--sample-ink); border-top: 4px solid var(--sample-orange); box-shadow: rgba(0, 0, 0, 0.133) 0px 12px 28px; min-width: 0px; }
.educational-sample .sample-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 16px 22px; border-bottom: 1px solid rgb(211, 211, 211); }
.educational-sample .sample-badge { display: inline-flex; align-items: center; min-height: 24px; padding: 4px 7px; border: 1px solid rgb(164, 63, 0); background: rgb(255, 243, 233); color: rgb(129, 50, 0); font-size: 10px; font-weight: 850; letter-spacing: 0.075em; line-height: 1.3; }
.educational-sample .sample-not-live { font-size: 11px; line-height: 1.4; color: rgb(84, 84, 84); }
.educational-sample .sample-matchup { padding: 24px 22px 20px; }
.educational-sample .sample-caption { font-size: 10px; font-weight: 800; line-height: 1.5; letter-spacing: 0.1em; color: rgb(92, 92, 92); margin: 0px 0px 9px; text-transform: uppercase; }
.educational-sample .sample-teams { font-family: Inter, Arial, sans-serif; font-size: clamp(18px, 2.9vw, 24px); font-weight: 800; letter-spacing: -0.035em; line-height: 1.35; margin: 0px; color: rgb(21, 21, 21); }
.educational-sample .sample-teams span { font-weight: 500; font-size: 0.65em; color: rgb(106, 106, 106); padding: 0px 5px; letter-spacing: 0px; }
.educational-sample .sample-fiction { font-size: 12px; line-height: 1.55; color: rgb(89, 89, 89); margin: 9px 0px 0px; max-width: 50ch; }
.educational-sample .sample-controls { display: grid; grid-template-columns: 1fr 0.8fr 1.4fr; padding: 0px 16px; gap: 2px; border-bottom: 1px solid rgb(202, 202, 202); background: rgb(233, 233, 233); }
.educational-sample .sample-controls button { appearance: none; background: transparent; color: rgb(75, 75, 75); border-width: 0px 0px 3px; border-style: none none solid; border-color: currentcolor currentcolor transparent; border-image: none; border-radius: 0px; font-family: inherit; font-size: 12px; font-weight: 750; line-height: 1.3; text-align: center; padding: 12px 5px 9px; min-height: 48px; min-width: 0px; cursor: pointer; transition: color 0.12s, background 0.12s; }
.educational-sample .sample-controls button[aria-pressed="true"] { color: rgb(22, 22, 22); border-bottom-color: rgb(212, 75, 0); background: rgb(244, 244, 244); }
.educational-sample .sample-controls button:hover { background: rgb(222, 222, 222); color: rgb(17, 17, 17); }
.educational-sample .sample-controls button:focus-visible { outline: rgb(165, 59, 0) solid 3px; outline-offset: -4px; }
.educational-sample .sample-view { padding: 24px 22px; min-width: 0px; }
.educational-sample .sample-view[hidden] { display: none; }
.educational-sample .sample-pick { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-family: Inter, Arial, sans-serif; font-size: clamp(23px, 3.2vw, 30px); font-weight: 850; letter-spacing: -0.04em; line-height: 1.2; color: rgb(161, 60, 0); margin: 0px 0px 14px; }
.educational-sample .sample-pick span { display: flex; align-items: center; justify-content: center; background: rgb(255, 102, 0); color: rgb(21, 21, 21); min-width: 30px; height: 30px; font-size: 23px; font-weight: 600; letter-spacing: 0px; }
.educational-sample .sample-body { color: rgb(77, 77, 77); font-size: 14px; line-height: 1.65; margin: 0px 0px 20px; }
.educational-sample .sample-numbers { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); padding: 18px 0px; border-top: 1px solid rgb(206, 206, 206); border-bottom: 1px solid rgb(206, 206, 206); margin: 20px 0px 13px; gap: 12px; }
.educational-sample .sample-numbers > div + div { border-left: 1px solid rgb(208, 208, 208); padding-left: 12px; }
.educational-sample .sample-numbers dt { font-size: 10px; line-height: 1.5; color: rgb(86, 86, 86); margin: 0px 0px 9px; min-height: 30px; }
.educational-sample .sample-numbers dd { font-family: "JetBrains Mono", monospace; font-weight: 600; letter-spacing: -0.08em; line-height: 1.1; color: rgb(23, 23, 23); font-size: clamp(25px, 4vw, 35px); margin: 0px; white-space: nowrap; }
.educational-sample .sample-numbers dd span { font-size: 0.5em; letter-spacing: -0.02em; margin-left: 2px; }
.educational-sample .sample-math { font-size: 11px; line-height: 1.65; color: rgb(90, 90, 90); margin: 0px; }
.educational-sample .sample-panel-title { font-family: Inter, Arial, sans-serif; color: rgb(23, 23, 23); font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -0.035em; margin: 0px 0px 18px; max-width: 22ch; }
.educational-sample .sample-reasons { list-style: none; padding: 0px; margin: 0px; }
.educational-sample .sample-reasons li { display: flex; align-items: flex-start; gap: 13px; padding: 17px 0px; border-top: 1px solid rgb(208, 208, 208); }
.educational-sample .sample-reasons li:last-child { padding-bottom: 0px; }
.educational-sample .sample-reason-number { font-family: "JetBrains Mono", monospace; font-size: 11px; line-height: 1.6; min-width: 20px; color: rgb(161, 60, 0); font-weight: 600; }
.educational-sample .sample-reasons h4 { font-family: inherit; color: rgb(23, 23, 23); font-size: 15px; line-height: 1.4; font-weight: 800; letter-spacing: -0.02em; margin: 0px 0px 5px; }
.educational-sample .sample-reasons p { font-size: 13px; line-height: 1.6; color: rgb(80, 80, 80); margin: 0px; }
.educational-sample .sample-changes { list-style: none; padding: 0px; margin: 0px; border-top: 1px solid rgb(206, 206, 206); }
.educational-sample .sample-changes li { display: flex; flex-direction: column; gap: 4px; padding: 13px 0px; border-bottom: 1px solid rgb(206, 206, 206); font-size: 13px; line-height: 1.55; }
.educational-sample .sample-changes strong { font-weight: 800; color: rgb(23, 23, 23); }
.educational-sample .sample-changes span { color: rgb(80, 80, 80); }
.educational-sample .sample-uncertainty { font-size: 12px; line-height: 1.6; color: rgb(69, 69, 69); background: rgb(229, 229, 229); border-left: 3px solid rgb(161, 60, 0); padding: 12px 13px; margin: 18px 0px 0px; }
.educational-sample .sample-footer { display: flex; align-items: flex-start; gap: 10px; padding: 16px 22px; border-top: 1px solid rgb(208, 208, 208); color: rgb(86, 86, 86); }
.educational-sample .sample-footer > span { color: rgb(161, 60, 0); line-height: 1.5; font-size: 18px; }
.educational-sample .sample-footer p { font-size: 11px; line-height: 1.6; color: inherit; margin: 0px; }
@media (max-width: 380px) {
  .educational-sample { padding: 16px 12px; }
  .educational-sample .sample-status, .educational-sample .sample-matchup, .educational-sample .sample-view, .educational-sample .sample-footer { padding-left: 15px; padding-right: 15px; }
  .educational-sample .sample-controls { padding: 0px 8px; }
  .educational-sample .sample-controls button { font-size: 11px; }
  .educational-sample .sample-numbers { gap: 8px; }
  .educational-sample .sample-numbers > div + div { padding-left: 8px; }
  .educational-sample .sample-index { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .educational-sample .sample-controls button { transition: none; }
}
.site-menu-toggle { display: grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; min-height: 44px; padding: 0px; border: 1px solid rgb(85, 85, 85); border-radius: 50%; background: transparent; color: inherit; font-size: 23px; line-height: 1; }
.site-mobile-menu { display: grid; gap: 0px; background: rgb(21, 21, 21); color: rgb(244, 240, 233); padding: 8px 22px 16px; border-bottom: 1px solid rgb(68, 68, 68); position: relative; z-index: 5; }
.site-mobile-menu[hidden] { display: none !important; }
.site-mobile-menu a { display: flex; align-items: center; min-height: 48px; font-size: 15px; border-bottom: 1px solid rgb(56, 56, 56); }
.site-mobile-menu a:last-child { border: 0px; }
.arena-site { --arena-paper: #f3f0e9; --arena-ink: #121212; --arena-orange: #ff6600; background: rgb(9, 9, 9); color: rgb(245, 243, 239); }
.arena-site .site-header { background: rgb(245, 243, 239); color: rgb(18, 18, 18); height: 78px; border-bottom: 1px solid rgb(210, 206, 197); padding: 12px 22px; gap: 14px; }
.arena-site .brand { width: 158px; background: rgb(255, 255, 255); padding: 2px 6px; border-radius: 2px; flex: 0 0 auto; }
.arena-site .site-menu-toggle { border-color: rgb(184, 181, 175); }
.arena-site .site-mobile-menu { background: rgb(245, 243, 239); color: rgb(18, 18, 18); border-color: rgb(210, 206, 197); }
.arena-site .site-mobile-menu a { border-color: rgb(210, 206, 197); }
.arena-site .header-access { background: rgb(17, 17, 17); color: rgb(245, 243, 239); border-radius: 2px; padding: 13px 16px; font-size: 12px; min-height: 44px; }
.arena-site .header-access span { color: rgb(255, 132, 52); }
.arena-site .desktop-nav { color: rgb(86, 84, 79); }
.arena-site .desktop-nav a:hover, .arena-site .desktop-nav a[aria-current="page"] { color: rgb(17, 17, 17); }
.arena-site .desktop-nav a[aria-current="page"] { text-decoration: underline 2px rgb(255, 102, 0); text-underline-offset: 8px; }
.arena-home { background: rgb(9, 9, 9); color: rgb(245, 243, 239); --ar-orange: #ff6600; --ar-paper: #f3f0e9; }
.arena-home [hidden] { display: none !important; }
.arena-home button, .arena-home a, .arena-home summary { touch-action: manipulation; }
.arena-home button:active { transform: translateY(1px); }
.arena-home .ar-container { width: 100%; max-width: 1224px; margin-inline: auto; padding-inline: 22px; }
.arena-home .ar-hero { position: relative; isolation: isolate; min-height: 565px; padding: 255px 22px 34px; display: flex; align-items: flex-end; overflow: hidden; background: rgb(9, 9, 9); }
.arena-home .ar-hero-art { position: absolute; inset: 0px; z-index: -1; overflow: hidden; }
.arena-home .ar-hero-art img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; }
.arena-home .ar-hero-art::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(rgba(9, 9, 9, 0) 8%, rgba(9, 9, 9, 0.03) 25%, rgba(9, 9, 9, 0.72) 48%, rgba(9, 9, 9, 0.97) 83%, rgb(9, 9, 9)); }
.arena-home .ar-hero-inner { width: 100%; position: relative; }
.arena-home .ar-eyebrow { font-size: 10px; letter-spacing: 0.135em; font-weight: 750; color: rgb(255, 139, 67); margin: 0px 0px 14px; line-height: 1.5; }
.arena-home .ar-hero h1 { font: 800 clamp(68px, 20vw, 104px) / 0.83 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.026em; margin: 0px; }
.arena-home .ar-hero h1 span { color: var(--ar-orange); }
.arena-home .ar-hero-copy { font-size: 15px; line-height: 1.55; color: rgb(211, 208, 204); margin: 20px 0px 23px; max-width: 30ch; }
.arena-home .ar-hero-actions { display: flex; flex-direction: column; gap: 9px; align-items: stretch; max-width: 370px; }
.arena-home .ar-explore { display: flex; justify-content: space-between; align-items: center; gap: 22px; min-height: 54px; padding: 16px 18px; background: var(--ar-orange); color: rgb(18, 18, 18); border: 0px; border-radius: 2px; font-size: 14px; font-weight: 800; }
.arena-home .ar-explore > span { font-size: 23px; line-height: 1; }
.arena-home .ar-explore:hover { background: rgb(255, 133, 51); }
.arena-home .ar-watch { display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 10px 0px; border: 0px; background: transparent; color: rgb(238, 234, 228); font-size: 13px; font-weight: 600; text-align: left; }
.arena-home .ar-play-symbol { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid rgb(130, 120, 111); border-radius: 50%; font-size: 17px; color: rgb(255, 139, 67); line-height: 1; }
.arena-home .ar-hero-edition { display: none; }
.arena-home .ar-chapters { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); max-width: 1224px; margin: auto; padding: 0px 22px; border-bottom: 1px solid rgb(52, 49, 46); border-top: 1px solid rgb(52, 49, 46); }
.arena-home .ar-chapters a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 64px; font: 500 10px "JetBrains Mono", monospace; color: rgb(189, 187, 182); white-space: nowrap; }
.arena-home .ar-chapters span { color: rgb(255, 132, 52); }
.arena-home .ar-chapters b { display: none; }
.arena-home .ar-chapters a + a { border-left: 1px solid rgb(52, 49, 46); }
.arena-home .ar-chapters a:hover { color: rgb(255, 255, 255); background: rgb(18, 16, 14); }
.arena-home .ar-inside { padding-top: 48px; padding-bottom: 54px; scroll-margin-top: 24px; }
.arena-home .ar-section-title { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 25px; }
.arena-home .ar-section-title h2 { font-size: 34px; line-height: 1.1; font-weight: 800; letter-spacing: -0.055em; }
.arena-home .ar-section-title > span { font: 500 9px / 1.7 "JetBrains Mono", monospace; color: rgb(166, 161, 154); text-align: right; max-width: 100px; }
.arena-home .ar-inside-grid { display: grid; gap: 34px; }
.arena-home .ar-sample-wrap { min-width: 0px; }
.arena-home .ar-pick-switch { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); border-width: 1px 1px 0px; border-style: solid solid none; border-color: rgb(85, 80, 74) rgb(85, 80, 74) currentcolor; border-image: none; border-radius: 3px 3px 0px 0px; overflow: hidden; background: rgb(23, 21, 18); }
.arena-home .ar-pick-switch button { background: transparent; border-width: 0px 0px 3px; border-style: none none solid; border-color: currentcolor currentcolor transparent; border-image: none; color: rgb(197, 192, 184); font-size: 11px; line-height: 1.3; font-weight: 650; min-height: 51px; padding: 10px 5px; }
.arena-home .ar-pick-switch button[aria-pressed="true"] { color: rgb(255, 139, 67); border-bottom-color: rgb(255, 102, 0); background: rgb(36, 26, 18); }
.arena-home .ar-sample { background: var(--ar-paper); color: rgb(18, 18, 18); padding: 20px; border-top: 3px solid rgb(255, 102, 0); border-radius: 0px 0px 3px 3px; }
.arena-home .ar-sample-meta { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 9px; line-height: 1.5; color: rgb(98, 93, 85); letter-spacing: 0.025em; }
.arena-home .ar-sample-meta b { font-size: 9px; letter-spacing: 0.035em; border: 1px solid rgb(163, 90, 42); padding: 4px 6px; color: rgb(129, 52, 0); flex: 0 0 auto; }
.arena-home .ar-matchup { display: grid; grid-template-columns: minmax(0px, 1fr) 30px minmax(0px, 1fr); gap: 8px; align-items: center; text-align: center; margin: 25px 0px; }
.arena-home .ar-matchup > div { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.arena-home .ar-team { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; font-size: 20px; font-weight: 850; letter-spacing: -0.075em; }
.arena-home .ar-east { background: rgb(22, 22, 22); color: rgb(244, 240, 233); }
.arena-home .ar-metro { background: rgb(231, 209, 189); color: rgb(123, 54, 14); }
.arena-home .ar-matchup strong { font-size: 13px; font-weight: 750; }
.arena-home .ar-versus { font: 500 10px "JetBrains Mono", monospace; color: rgb(119, 113, 105); }
.arena-home .ar-selection { display: grid; grid-template-columns: minmax(0px, 1fr) auto; align-items: center; gap: 14px; border-block: 1px solid rgb(203, 198, 189); padding: 19px 0px; }
.arena-home .ar-selection > div > span { font-size: 9px; line-height: 1.4; display: block; color: rgb(106, 99, 89); letter-spacing: 0.04em; margin-bottom: 6px; }
.arena-home .ar-selection h3 { font-size: 19px; line-height: 1.2; font-weight: 800; letter-spacing: -0.04em; overflow-wrap: anywhere; }
.arena-home .ar-selection small { display: block; font-size: 10px; line-height: 1.6; color: rgb(116, 108, 97); margin-top: 5px; }
.arena-home .ar-sample-price { text-align: right; }
.arena-home .ar-sample-price strong { font: 500 22px "JetBrains Mono", monospace; color: rgb(145, 64, 0); }
.arena-home .ar-sample-price > span { max-width: 70px; }
.arena-home .ar-reason-toggle { display: flex; align-items: center; gap: 11px; min-height: 55px; padding: 14px 0px; width: 100%; background: transparent; border: 0px; text-align: left; color: rgb(38, 34, 28); font-size: 12px; font-weight: 750; }
.arena-home .ar-reason-toggle > span { font-size: 20px; color: rgb(148, 81, 23); font-weight: 500; }
.arena-home .ar-reasoning p { font-size: 13px; color: rgb(92, 85, 75); line-height: 1.7; }
.arena-home .ar-reasoning h4 { font-size: 12px; font-weight: 750; margin: 17px 0px 7px; }
.arena-home .ar-sample-note { font-size: 10px; line-height: 1.55; color: rgb(119, 112, 100); margin-top: 8px; }
.arena-home .ar-published { display: flex; align-items: center; justify-content: space-between; min-height: 51px; margin-top: 8px; border-bottom: 1px solid rgb(85, 80, 75); color: rgb(221, 216, 208); font-size: 13px; font-weight: 600; }
.arena-home .ar-published span { color: rgb(255, 132, 52); font-size: 20px; }
.arena-home .ar-inside-aside { display: grid; gap: 25px; align-content: start; }
.arena-home .ar-principle { display: grid; grid-template-columns: 27px 1fr; gap: 12px; }
.arena-home .ar-principle > span { font: 500 11px "JetBrains Mono", monospace; color: rgb(255, 132, 52); padding-top: 4px; }
.arena-home .ar-principle h3 { font-size: 20px; line-height: 1.25; letter-spacing: -0.035em; font-weight: 700; margin-bottom: 9px; }
.arena-home .ar-principle p { color: rgb(182, 176, 166); font-size: 14px; line-height: 1.65; max-width: 32ch; }
.arena-home .ar-pack-preview { display: grid; grid-template-columns: 34% 1fr; min-height: 195px; width: 100%; padding: 0px; overflow: hidden; position: relative; background: rgb(21, 17, 13); border: 1px solid rgb(80, 64, 53); border-radius: 3px; color: rgb(243, 237, 229); text-align: left; }
.arena-home .ar-pack-preview > img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 49%; max-height: 238px; }
.arena-home .ar-pack-preview-copy { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 21px 16px; }
.arena-home .ar-pack-preview-copy > span:first-child { font-size: 8px; letter-spacing: 0.09em; line-height: 1.5; color: rgb(201, 161, 126); font-weight: 650; }
.arena-home .ar-pack-preview-copy > strong { font: 700 38px / 0.95 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.02em; margin: 10px 0px 22px; }
.arena-home .ar-pack-preview-link { font-size: 11px; display: flex; align-items: center; gap: 15px; font-weight: 700; }
.arena-home .ar-pack-preview-link b { color: rgb(255, 132, 52); font-size: 20px; }
.arena-home .ar-pack-preview:hover { border-color: rgb(255, 102, 0); }
.arena-home .ar-why { display: grid; border-block: 1px solid rgb(51, 44, 37); background: rgb(16, 14, 12); scroll-margin-top: 24px; }
.arena-home .ar-why-photo { overflow: hidden; min-width: 0px; }
.arena-home .ar-why-photo img { width: 100%; height: 300px; object-fit: cover; object-position: center center; }
.arena-home .ar-why-copy { padding: 40px 22px 45px; }
.arena-home .ar-why h2 { font: 800 64px / 0.87 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.025em; }
.arena-home .ar-why h2 span { color: rgb(255, 102, 0); }
.arena-home .ar-why-copy > p { color: rgb(184, 176, 166); font-size: 15px; line-height: 1.7; max-width: 43ch; margin-top: 24px; }
.arena-home .ar-why-copy > a { display: inline-flex; align-items: center; justify-content: space-between; gap: 45px; min-height: 49px; border-bottom: 1px solid rgb(121, 97, 75); font-size: 13px; font-weight: 650; margin-top: 24px; }
.arena-home .ar-why-copy > a > span { font-size: 21px; color: rgb(255, 132, 52); }
.arena-home .ar-record { display: grid; gap: 29px; padding-top: 53px; padding-bottom: 56px; scroll-margin-top: 24px; }
.arena-home .ar-record h2 { font-size: 35px; line-height: 1.06; font-weight: 800; letter-spacing: -0.055em; }
.arena-home .ar-record > div > p { font-size: 14px; color: rgb(182, 176, 166); line-height: 1.7; margin-top: 20px; max-width: 39ch; }
.arena-home .ar-record-link { display: inline-flex; align-items: center; gap: 45px; min-height: 49px; border-bottom: 1px solid rgb(106, 91, 75); font-size: 13px; font-weight: 600; margin-top: 18px; }
.arena-home .ar-record-link span { font-size: 21px; color: rgb(255, 132, 52); }
.arena-home .ar-record-content { min-width: 0px; }
.arena-home .ar-record-empty { border: 1px solid rgb(76, 68, 59); padding: 28px 24px; background: rgb(17, 16, 14); min-height: 250px; }
.arena-home .ar-record-line { font: 500 10px "JetBrains Mono", monospace; color: rgb(192, 151, 114); letter-spacing: 0.1em; }
.arena-home .ar-record-empty h3 { font-size: 25px; line-height: 1.12; letter-spacing: -0.04em; font-weight: 750; margin-top: 20px; }
.arena-home .ar-record-empty > p { font-size: 13px; color: rgb(184, 176, 166); line-height: 1.7; margin-top: 15px; max-width: 42ch; }
.arena-home .ar-record-caption { display: block; font-size: 10px; color: rgb(148, 139, 127); line-height: 1.6; margin-top: 20px; }
.arena-home .ar-record-empty button { border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgb(135, 103, 68); border-image: none; background: transparent; color: rgb(238, 226, 214); min-height: 44px; margin-top: 15px; font-size: 13px; }
.arena-home .ar-record-loading { padding: 25px; border: 1px solid rgb(60, 53, 46); min-height: 230px; }
.arena-home .ar-record-loading > span { display: block; height: 28px; background: rgb(38, 33, 28); margin: 0px 0px 18px; width: 85%; }
.arena-home .ar-record-loading > span:nth-child(2) { width: 65%; }
.arena-home .ar-record-loading > span:nth-child(3) { width: 75%; }
.arena-home .ar-record-loading p { color: rgb(173, 162, 150); font-size: 12px; }
.arena-home .ar-record-list { border-top: 1px solid rgb(80, 66, 55); }
.arena-home .ar-record-list > a { display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center; padding: 24px 0px; border-bottom: 1px solid rgb(80, 66, 55); }
.arena-home .ar-record-list a > div { min-width: 0px; display: flex; flex-direction: column; gap: 6px; }
.arena-home .ar-record-list small { color: rgb(255, 139, 67); font: 500 10px "JetBrains Mono", monospace; }
.arena-home .ar-record-list strong { font-size: 16px; line-height: 1.4; }
.arena-home .ar-record-list span { font-size: 12px; color: rgb(172, 162, 152); }
.arena-home .ar-record-list b { border: 1px solid rgb(112, 96, 80); padding: 7px 10px; font-size: 10px; color: rgb(229, 214, 196); letter-spacing: 0.02em; }
.arena-home .ar-membership { background: rgb(255, 102, 0); color: rgb(17, 17, 17); scroll-margin-top: 24px; }
.arena-home .ar-membership-inner { width: 100%; max-width: 1224px; margin: auto; padding: 45px 22px; display: grid; gap: 36px; }
.arena-home .ar-membership-heading h2 { font: 800 61px / 0.88 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.026em; }
.arena-home .ar-membership-heading > p { max-width: 31ch; font-size: 14px; color: rgb(57, 34, 20); line-height: 1.65; margin-top: 20px; }
.arena-home .ar-membership-selector { min-width: 0px; }
.arena-home .ar-plan-switch { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 5px; border-bottom: 1px solid rgb(102, 50, 13); padding-bottom: 11px; }
.arena-home .ar-plan-switch button { min-height: 45px; font-size: 13px; font-weight: 750; border: 1px solid transparent; background: transparent; color: rgb(53, 32, 13); border-radius: 2px; }
.arena-home .ar-plan-switch button[aria-pressed="true"] { color: rgb(244, 240, 233); background: rgb(17, 17, 17); border-color: rgb(17, 17, 17); }
.arena-home .ar-plan-switch button:hover { border-color: rgb(61, 33, 13); }
.arena-home .ar-plan-detail { padding: 24px 0px 4px; }
.arena-home .ar-plan-detail > div { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.arena-home .ar-plan-detail h3 { font-size: 23px; font-weight: 800; letter-spacing: -0.04em; line-height: 1.15; margin-top: 5px; }
.arena-home .ar-plan-detail > div > span { font-size: 43px; font-weight: 850; letter-spacing: -0.06em; line-height: 1; text-align: right; white-space: nowrap; }
.arena-home .ar-plan-detail small { font-size: 10px; font-weight: 500; letter-spacing: 0px; display: block; line-height: 1.5; margin-top: 6px; }
.arena-home .ar-plan-detail > p { font-size: 13px; line-height: 1.6; margin-top: 18px; color: rgb(57, 34, 20); }
.arena-home .ar-plan-detail ul { list-style: none; padding: 0px; margin: 20px 0px 25px; display: grid; gap: 12px; }
.arena-home .ar-plan-detail li { display: flex; gap: 10px; font-size: 13px; line-height: 1.55; color: rgb(38, 23, 13); }
.arena-home .ar-plan-detail li > span { font-weight: 750; }
.arena-home .ar-membership-action { width: 100%; display: flex; justify-content: space-between; align-items: center; min-height: 52px; background: rgb(17, 17, 17); color: rgb(245, 240, 233); border: 0px; border-radius: 2px; padding: 14px 18px; font-size: 14px; font-weight: 750; }
.arena-home .ar-membership-action span { color: rgb(255, 132, 52); font-size: 22px; }
.arena-home .ar-membership-action:hover { background: rgb(43, 28, 16); }
.arena-home .ar-membership-note { font-size: 11px; color: rgb(73, 37, 13); line-height: 1.65; margin-top: 15px; }
.arena-home .ar-pack-dialog { border: 1px solid rgb(119, 96, 76); border-radius: 8px; padding: 0px; background: rgb(16, 14, 12); color: rgb(245, 240, 233); width: calc(100% - 24px); max-width: 850px; max-height: 92dvh; margin: auto; overflow: auto; box-shadow: rgba(0, 0, 0, 0.667) 0px 30px 100px; }
.arena-home .ar-pack-dialog::backdrop { background: rgba(0, 0, 0, 0.733); backdrop-filter: blur(8px); }
.arena-home .ar-pack-dialog-inner { display: grid; position: relative; min-width: 0px; }
.arena-home .ar-pack-close { position: absolute; right: 9px; top: 9px; z-index: 2; width: 44px; height: 44px; display: grid; place-items: center; padding: 0px; background: rgba(21, 17, 14, 0.918); color: rgb(243, 237, 230); border: 1px solid rgb(118, 104, 88); border-radius: 50%; font-size: 28px; line-height: 1; }
.arena-home .ar-pack-screen { display: grid; place-items: center; background: rgb(5, 5, 4); min-width: 0px; overflow: hidden; }
.arena-home .ar-pack-screen > video, .arena-home .ar-pack-screen > img { display: block; width: 100%; max-height: 54dvh; object-fit: contain; aspect-ratio: 9 / 16; margin: 0px auto; }
.arena-home .ar-pack-info { padding: 27px 22px; }
.arena-home .ar-pack-label { font: 500 9px / 1.7 "JetBrains Mono", monospace; color: rgb(202, 165, 130); letter-spacing: 0.06em; max-width: 26ch; }
.arena-home .ar-pack-info h2 { font: 750 50px / 0.93 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.02em; margin-top: 15px; }
.arena-home .ar-pack-info h2 span { color: rgb(255, 132, 52); }
.arena-home .ar-pack-info > p:not(.ar-pack-label) { font-size: 13px; line-height: 1.7; color: rgb(185, 175, 162); margin-top: 15px; }
.arena-home .ar-pack-info ol { list-style: none; padding: 0px; margin: 22px 0px; border-top: 1px solid rgb(75, 61, 49); }
.arena-home .ar-pack-info li { display: flex; align-items: center; gap: 14px; border-bottom: 1px solid rgb(75, 61, 49); padding: 13px 0px; }
.arena-home .ar-pack-info li > span { font: 500 10px "JetBrains Mono", monospace; color: rgb(255, 132, 52); }
.arena-home .ar-pack-info li > div { display: flex; flex-direction: column; gap: 5px; }
.arena-home .ar-pack-info li small { color: rgb(173, 159, 144); font-size: 10px; }
.arena-home .ar-pack-info li strong { font-size: 14px; font-weight: 650; letter-spacing: -0.02em; }
.arena-home .ar-pack-actions { display: flex; flex-direction: column; gap: 8px; }
.arena-home .ar-pack-actions button { background: rgb(255, 102, 0); color: rgb(23, 11, 2); border: 0px; padding: 13px 16px; min-height: 48px; font-size: 13px; font-weight: 750; display: flex; justify-content: space-between; align-items: center; border-radius: 2px; }
.arena-home .ar-pack-actions a { display: flex; align-items: center; min-height: 44px; font-size: 12px; color: rgb(229, 214, 197); }
.arena-home .ar-pack-actions p { font-size: 12px; color: rgb(213, 180, 145); line-height: 1.6; }
.arena-home .ar-pack-disclaimer { display: block; color: rgb(161, 150, 135); font-size: 10px; line-height: 1.6; margin-top: 12px; }
@media (max-width: 959px) {
  .site-header .header-access { display: none; }
}
@media (max-width: 359px) {
  .arena-home .ar-container { padding-inline: 18px; }
  .arena-home .ar-hero { padding-inline: 18px; padding-top: 230px; }
  .arena-home .ar-chapters { padding-inline: 12px; }
  .arena-home .ar-chapters a { font-size: 9px; gap: 5px; }
  .arena-home .ar-section-title h2 { font-size: 31px; }
  .arena-home .ar-sample { padding: 16px; }
  .arena-home .ar-selection { gap: 8px; }
  .arena-home .ar-selection h3 { font-size: 17px; }
  .arena-home .ar-sample-price strong { font-size: 19px; }
  .arena-home .ar-reason-toggle { font-size: 11px; gap: 7px; }
  .arena-home .ar-membership-heading h2 { font-size: 54px; }
  .arena-home .ar-pack-preview-copy > strong { font-size: 33px; }
  .arena-home .ar-pack-preview-copy { padding-inline: 12px; }
}
@media (min-width: 620px) {
  .arena-home .ar-container { padding-inline: 34px; }
  .arena-home .ar-hero { padding: 275px 34px 45px; min-height: 660px; }
  .arena-home .ar-hero h1 { font-size: 112px; }
  .arena-home .ar-hero-actions { flex-direction: row; max-width: none; align-items: center; gap: 25px; }
  .arena-home .ar-explore { min-width: 235px; }
  .arena-home .ar-chapters { padding-inline: 34px; }
  .arena-home .ar-chapters a { font-size: 12px; min-height: 72px; gap: 15px; }
  .arena-home .ar-inside { padding-top: 65px; padding-bottom: 65px; }
  .arena-home .ar-section-title h2 { font-size: 44px; }
  .arena-home .ar-section-title > span { max-width: none; font-size: 10px; }
  .arena-home .ar-sample { padding: 30px; }
  .arena-home .ar-selection h3 { font-size: 25px; }
  .arena-home .ar-sample-price strong { font-size: 29px; }
  .arena-home .ar-sample-meta { font-size: 10px; }
  .arena-home .ar-team { width: 61px; height: 61px; font-size: 25px; }
  .arena-home .ar-matchup { margin: 30px 0px; }
  .arena-home .ar-reason-toggle { font-size: 14px; }
  .arena-home .ar-inside-aside { grid-template-columns: 1fr 1fr; column-gap: 30px; }
  .arena-home .ar-pack-preview { grid-column: 1 / -1; max-width: 480px; }
  .arena-home .ar-why-copy { padding: 48px 34px; }
  .arena-home .ar-why h2 { font-size: 78px; }
  .arena-home .ar-why-photo img { height: 380px; }
  .arena-home .ar-record { padding-block: 68px; }
  .arena-home .ar-record h2 { font-size: 43px; }
  .arena-home .ar-record-empty { padding: 36px; }
  .arena-home .ar-membership-inner { padding: 58px 34px; }
  .arena-home .ar-membership-heading h2 { font-size: 78px; }
  .arena-home .ar-membership-selector { max-width: 530px; width: 100%; }
  .arena-home .ar-pack-dialog-inner { grid-template-columns: 46% 54%; }
  .arena-home .ar-pack-screen > video, .arena-home .ar-pack-screen > img { max-height: 82dvh; min-height: 490px; height: 100%; aspect-ratio: 9 / 16; }
  .arena-home .ar-pack-info { padding: 47px 28px 31px; align-self: center; }
  .arena-home .ar-pack-info h2 { font-size: 54px; }
  .arena-home .ar-pack-info li { padding: 16px 0px; }
}
@media (min-width: 960px) {
  .site-menu-toggle, .site-mobile-menu { display: none; }
  .arena-site .site-header { height: 80px; padding: 12px max(34px, -590px + 50vw); gap: 20px; }
  .arena-site .brand { width: 168px; }
  .arena-site .desktop-nav { gap: 21px; margin-right: 12px; margin-left: auto; font-size: 12px; white-space: nowrap; }
  .arena-site .header-access { font-size: 12px; padding-inline: 14px; white-space: nowrap; }
  .arena-home .ar-container { padding-inline: 34px; }
  .arena-home .ar-hero { height: 654px; min-height: 654px; padding: 0px max(34px, -578px + 50vw); align-items: center; }
  .arena-home .ar-hero-art { left: 38%; right: 0px; }
  .arena-home .ar-hero-art img { object-position: 50% 20%; }
  .arena-home .ar-hero-art::after { background: linear-gradient(90deg, rgb(9, 9, 9), rgba(9, 9, 9, 0.68) 10%, rgba(9, 9, 9, 0.04) 40%, rgba(9, 9, 9, 0) 80%), linear-gradient(0deg, rgb(9, 9, 9), rgba(9, 9, 9, 0) 28%); }
  .arena-home .ar-hero-inner { max-width: 560px; padding-bottom: 5px; }
  .arena-home .ar-eyebrow { font-size: 11px; letter-spacing: 0.14em; margin-bottom: 24px; }
  .arena-home .ar-hero h1 { font-size: clamp(120px, 10.6vw, 152px); }
  .arena-home .ar-hero-copy { font-size: 17px; line-height: 1.65; margin: 28px 0px; }
  .arena-home .ar-hero-actions { gap: 25px; }
  .arena-home .ar-explore { font-size: 14px; min-height: 55px; min-width: 245px; padding-inline: 20px; }
  .arena-home .ar-watch { font-size: 12px; }
  .arena-home .ar-hero-edition { display: block; position: absolute; right: 35px; bottom: 25px; font: 500 9px "JetBrains Mono", monospace; letter-spacing: 0.15em; color: rgb(199, 184, 167); }
  .arena-home .ar-chapters { padding: 0px 34px; }
  .arena-home .ar-chapters a { justify-content: flex-start; min-height: 78px; padding-left: 30px; gap: 15px; }
  .arena-home .ar-chapters a:first-child { padding-left: 0px; }
  .arena-home .ar-chapters b { display: block; font-size: 20px; font-weight: 400; color: rgb(128, 112, 96); margin-left: auto; margin-right: 32px; }
  .arena-home .ar-inside { padding-block: 88px; }
  .arena-home .ar-section-title { margin-bottom: 32px; }
  .arena-home .ar-section-title h2 { font-size: 51px; }
  .arena-home .ar-inside-grid { grid-template-columns: minmax(0px, 1.08fr) minmax(0px, 0.92fr); gap: 70px; align-items: start; }
  .arena-home .ar-pick-switch button { min-height: 53px; font-size: 12px; }
  .arena-home .ar-inside-aside { grid-template-columns: 1fr; gap: 31px; padding-top: 12px; }
  .arena-home .ar-principle { grid-template-columns: 31px 1fr; gap: 14px; }
  .arena-home .ar-principle h3 { font-size: 24px; }
  .arena-home .ar-principle p { font-size: 15px; }
  .arena-home .ar-pack-preview { margin-top: 4px; min-height: 216px; max-width: none; }
  .arena-home .ar-pack-preview-copy { padding: 25px 22px; }
  .arena-home .ar-pack-preview-copy > strong { font-size: 46px; }
  .arena-home .ar-pack-preview-copy > span:first-child { font-size: 9px; }
  .arena-home .ar-pack-preview-link { font-size: 12px; }
  .arena-home .ar-why { grid-template-columns: 1.03fr 1fr; }
  .arena-home .ar-why-photo img { height: 100%; min-height: 586px; object-position: 45% 50%; }
  .arena-home .ar-why-copy { padding: 70px min(6.4vw, 92px); align-self: center; }
  .arena-home .ar-why h2 { font-size: clamp(78px, 7vw, 101px); }
  .arena-home .ar-why-copy > p { font-size: 16px; }
  .arena-home .ar-record { grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 70px; padding-block: 92px; align-items: center; }
  .arena-home .ar-record h2 { font-size: 48px; }
  .arena-home .ar-record > div > p { font-size: 15px; }
  .arena-home .ar-record-empty { padding: 37px; min-height: 290px; }
  .arena-home .ar-record-empty h3 { font-size: 32px; }
  .arena-home .ar-record-empty > p { font-size: 14px; }
  .arena-home .ar-membership-inner { grid-template-columns: minmax(0px, 1fr) minmax(0px, 0.85fr); gap: 86px; padding: 76px 34px; align-items: center; }
  .arena-home .ar-membership-heading h2 { font-size: clamp(78px, 7.5vw, 108px); }
  .arena-home .ar-membership-heading > p { font-size: 16px; margin-top: 28px; }
  .arena-home .ar-plan-detail h3 { font-size: 27px; }
  .arena-home .ar-plan-detail > div > span { font-size: 51px; }
  .arena-home .ar-plan-detail li { font-size: 14px; }
  .arena-home .ar-membership-note { max-width: 46ch; }
  .arena-site .site-footer { background: rgb(9, 9, 9); }
}
@media (min-width: 1280px) {
  .arena-site .desktop-nav { font-size: 13px; gap: 27px; margin-right: 22px; }
  .arena-home .ar-hero-art { left: 39%; right: 0px; }
  .arena-home .ar-hero-art img { object-position: 50% 21%; }
  .arena-home .ar-inside-grid { gap: 86px; }
}
@media (prefers-reduced-motion: reduce) {
  .arena-home * { scroll-behavior: auto !important; transition: none !important; animation: auto ease 0s 1 normal none running none !important; }
  .arena-home button:active { transform: none; }
}
.spx-enroll, .spx-member { --join-orange: #ff6600; --join-cream: #f4f0e9; --join-ink: #10100e; font-family: Inter, Arial, sans-serif; color: var(--join-cream); line-height: 1.5; box-sizing: border-box; }
.spx-enroll *, .spx-member * { box-sizing: border-box; }
.spx-enroll { background: rgb(9, 9, 9); min-height: 100dvh; }
.spx-enroll a, .spx-member a { color: inherit; text-decoration: none; }
.spx-enroll button, .spx-member button { font: inherit; cursor: pointer; }
.spx-enroll button:disabled, .spx-member button:disabled { cursor: wait; opacity: 0.6; }
.spx-enroll button:focus-visible, .spx-enroll a:focus-visible, .spx-member button:focus-visible, .spx-member a:focus-visible { outline: rgb(255, 132, 52) solid 3px; outline-offset: 4px; }
.spx-enroll h1, .spx-enroll h2, .spx-enroll h3, .spx-enroll p, .spx-member h1, .spx-member h2, .spx-member h3, .spx-member p { margin: 0px; }
.join-header { background: var(--join-cream); color: rgb(17, 17, 17); min-height: 80px; padding: 18px max(24px, 50% - 580px); display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.join-header > a:first-child { display: flex; align-items: center; flex: 0 1 174px; }
.join-header img { object-fit: contain; width: 100%; height: auto; max-height: 40px; }
.join-header-back { font-size: 12px; font-weight: 650; display: flex; align-items: center; gap: 24px; white-space: nowrap; }
.join-header-back span { font-size: 24px; }
.join-main { max-width: 1224px; margin: auto; padding: 58px 32px 86px; }
.join-intro { margin-bottom: 43px; position: relative; }
.join-eyebrow { display: block; font: 500 10px / 1.6 "JetBrains Mono", monospace; letter-spacing: 0.1em; color: rgb(182, 162, 143); }
.join-intro h1 { font: 800 clamp(70px, 7vw, 108px) / 0.86 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.025em; margin: 19px 0px 21px; }
.join-intro h1 span { color: var(--join-orange); }
.join-intro > p { font-size: 15px; color: rgb(183, 176, 167); }
.join-layout { display: grid; grid-template-columns: minmax(0px, 1.45fr) minmax(0px, 1fr); align-items: start; gap: 52px; }
.join-flow { min-width: 0px; background: var(--join-cream); color: var(--join-ink); border: 1px solid rgb(227, 219, 208); border-radius: 3px; overflow: hidden; }
.join-steps { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); list-style: none; margin: 0px; padding: 0px 32px; background: rgb(233, 227, 217); border-bottom: 1px solid rgb(207, 199, 187); }
.join-steps li { display: flex; gap: 9px; align-items: center; min-height: 72px; border-bottom: 3px solid transparent; font-size: 12px; color: rgb(114, 107, 97); justify-content: center; padding: 10px 0px 7px; }
.join-steps li span { display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid rgb(179, 170, 156); border-radius: 50%; font: 500 10px "JetBrains Mono", monospace; flex-shrink: 0; }
.join-steps li strong { font-weight: 650; }
.join-steps li.is-current { color: rgb(21, 19, 16); border-bottom-color: var(--join-orange); }
.join-steps li.is-current span { background: rgb(17, 17, 17); color: rgb(255, 255, 255); border-color: rgb(17, 17, 17); }
.join-steps li.is-done span { color: rgb(32, 20, 9); background: rgb(255, 193, 139); border-color: rgb(220, 154, 98); }
.join-flow-content { padding: 34px; scroll-margin-top: 22px; outline: none; }
.join-section-heading { margin-bottom: 26px; }
.join-flow .join-eyebrow, .join-account-auth .join-eyebrow { color: rgb(133, 96, 71); }
.join-section-heading h2 { font-size: 31px; font-weight: 750; letter-spacing: -0.05em; line-height: 1.14; margin: 10px 0px 11px; }
.join-section-heading p { font-size: 13px; line-height: 1.65; color: rgb(102, 94, 84); max-width: 46ch; }
.join-form { display: grid; gap: 20px; }
.join-name-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.join-form label { font-size: 12px; font-weight: 650; display: flex; flex-direction: column; gap: 8px; min-width: 0px; }
.join-form input:not([type="radio"]) { width: 100%; min-width: 0px; height: 48px; background: rgb(255, 253, 250); border: 1px solid rgb(183, 174, 161); border-radius: 3px; padding: 12px 13px; color: rgb(28, 23, 18); font: 400 14px / 1.4 Inter, Arial, sans-serif; outline: none; box-shadow: none; }
.join-form input:focus { border-color: rgb(168, 66, 0); box-shadow: rgba(255, 102, 0, 0.12) 0px 0px 0px 3px; }
.join-form input::placeholder { color: rgb(137, 128, 119); }
.join-form label small { font-size: 10px; font-weight: 400; color: rgb(116, 107, 96); line-height: 1.55; }
.join-password { position: relative; display: flex; align-items: center; }
.join-password input:not([type="radio"]) { padding-right: 64px; }
.join-password button { position: absolute; right: 3px; top: 3px; bottom: 3px; min-width: 53px; background: transparent; border: 0px; color: rgb(94, 73, 55); font-size: 11px; font-weight: 650; }
.join-text-button { padding: 0px; background: none; border: 0px; color: rgb(109, 57, 15); min-height: 30px; text-align: left; text-decoration: underline; text-underline-offset: 3px; font-size: 12px !important; font-weight: 650 !important; }
.join-forgot { justify-self: end; margin-top: -11px; }
.join-back { margin-top: 20px; }
.join-primary { min-height: 51px; background: rgb(17, 17, 17); display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 15px 18px; border: 1px solid rgb(17, 17, 17); border-radius: 3px; text-align: left; width: 100%; color: rgb(250, 246, 239) !important; font-size: 13px !important; font-weight: 700 !important; }
.join-primary > span { color: rgb(255, 132, 52); font-size: 21px; line-height: 1; }
.join-primary:hover { background: rgb(52, 33, 19); }
.join-secondary { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 11px 16px; border: 1px solid rgb(185, 173, 158); border-radius: 3px; background: transparent; color: inherit; width: 100%; margin-top: 12px; font-size: 12px !important; font-weight: 600 !important; }
.join-secondary:hover { background: rgba(143, 103, 70, 0.07); }
.join-fine-print { max-width: 52ch; font-size: 10px !important; line-height: 1.7 !important; color: rgb(118, 108, 97) !important; }
.join-fine-print a { text-decoration: underline; text-underline-offset: 3px; }
.join-auth-switch { font-size: 12px; text-align: center; color: rgb(108, 98, 87); margin-top: 25px !important; }
.join-auth-switch button { border: 0px; padding: 6px 2px; background: none; font-size: 12px; color: rgb(108, 54, 13); font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.join-auth-switch a { color: rgb(108, 54, 13); font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.join-alert { padding: 14px 15px; background: rgb(255, 230, 215); color: rgb(121, 52, 18); border-width: 1px 1px 1px 3px; border-style: solid; border-color: rgb(216, 148, 110) rgb(216, 148, 110) rgb(216, 148, 110) rgb(183, 72, 15); border-image: none; border-radius: 3px; font-size: 12px; line-height: 1.65; margin-bottom: 16px; outline: none; overflow-wrap: anywhere; }
.join-form > .join-alert { margin: 0px; }
.join-alert:focus { box-shadow: rgba(216, 148, 110, 0.333) 0px 0px 0px 2px; }
.join-alert.is-success { background: rgb(231, 234, 220); border-color: rgb(132, 147, 100); color: rgb(51, 69, 35); }
.join-loading { display: flex; align-items: center; gap: 12px; padding: 20px 0px; color: rgb(140, 125, 109); font-size: 13px !important; line-height: 1.7 !important; }
.join-loading span { width: 17px; height: 17px; border-width: 2px; border-style: solid; border-color: rgb(183, 79, 10) rgba(171, 147, 131, 0.2) rgba(171, 147, 131, 0.2); border-image: none; border-radius: 50%; animation: 0.8s linear 0s infinite normal none running join-spin; flex-shrink: 0; }
@keyframes join-spin { 
  100% { transform: rotate(360deg); }
}
.join-summary { min-width: 0px; border: 1px solid rgb(75, 60, 46); background: rgb(17, 16, 14); border-radius: 3px; overflow: hidden; }
.join-summary-photo { height: 245px; position: relative; overflow: hidden; background: rgb(17, 17, 17); }
.join-summary-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 21%; }
.join-summary-photo::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(90deg, rgba(9, 9, 9, 0.667), transparent 80%), linear-gradient(0deg, rgb(17, 16, 14), transparent 65%); }
.join-summary-photo > span { position: absolute; z-index: 1; bottom: 25px; left: 30px; font: 800 47px / 0.9 "Barlow Condensed", Impact, sans-serif; color: rgb(244, 240, 233); letter-spacing: -0.02em; }
.join-summary-body { padding: 12px 30px 27px; }
.join-summary-price { display: flex; justify-content: space-between; gap: 15px; align-items: center; margin-top: 16px; padding-bottom: 24px; border-bottom: 1px solid rgb(75, 60, 46); }
.join-summary-price h2 { font-size: 25px; font-weight: 750; letter-spacing: -0.04em; }
.join-summary-price p { display: flex; flex-direction: column; text-align: right; }
.join-summary-price strong { font: 800 45px / 0.95 "Barlow Condensed", Impact, sans-serif; color: rgb(255, 132, 52); }
.join-summary-price small { font-size: 9px; color: rgb(184, 170, 155); margin-top: 5px; }
.join-summary ul { list-style: none; display: grid; gap: 16px; margin: 25px 0px; padding: 0px; }
.join-summary li { display: flex; align-items: flex-start; gap: 13px; color: rgb(215, 203, 189); font-size: 12px; line-height: 1.55; }
.join-summary li span { color: rgb(255, 132, 52); flex-shrink: 0; }
.join-summary-note { font-size: 11px; color: rgb(166, 152, 135); line-height: 1.7; padding: 21px 0px; border-top: 1px solid rgb(75, 60, 46); }
.join-summary-footer { display: flex; justify-content: space-between; gap: 8px; color: rgb(143, 120, 100); font: 400 8px / 1.5 "JetBrains Mono", monospace; }
.join-plans { padding: 0px; border: 0px; min-width: 0px; display: grid; gap: 12px; margin: 0px 0px 22px; }
.join-plan { display: grid; grid-template-columns: 18px minmax(0px, 1fr) auto; gap: 11px; padding: 20px 17px; border: 1px solid rgb(185, 176, 163); border-radius: 3px; cursor: pointer; background: rgb(248, 244, 238); }
.join-plan.is-selected { border-color: rgb(173, 75, 11); box-shadow: rgb(173, 75, 11) 0px 0px 0px 1px; background: rgb(255, 246, 233); }
.join-plan > input { accent-color: rgb(166, 74, 15); margin: 6px 0px 0px; width: 16px; height: 16px; }
.join-plan h3 { font-size: 17px; font-weight: 750; letter-spacing: -0.025em; }
.join-plan-copy > div > p { font-size: 11px; color: rgb(108, 97, 85); margin-top: 3px; }
.join-plan ul { display: grid; gap: 7px; list-style: none; margin: 15px 0px 0px; padding: 0px; }
.join-plan li { font-size: 11px; line-height: 1.5; color: rgb(98, 84, 67); display: flex; gap: 9px; }
.join-plan li span { color: rgb(160, 77, 22); }
.join-plan-price { display: flex; flex-direction: column; text-align: right; gap: 3px; white-space: nowrap; }
.join-plan-price strong { font: 750 30px / 1.1 "Barlow Condensed", Impact, sans-serif; }
.join-plan-price small { font-size: 8px; color: rgb(111, 96, 81); }
.join-recurrence { color: rgb(111, 98, 84); font-size: 11px !important; line-height: 1.75 !important; margin: 20px 0px !important; }
.join-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.join-stripe { min-width: 0px; width: 100%; }
.join-stripe[hidden] { display: none !important; }
.join-stripe:empty { min-height: 0px; }
.join-unavailable, .join-pending { border: 1px solid rgb(201, 187, 168); background: rgb(246, 237, 224); padding: 26px 22px; border-radius: 3px; }
.join-status-icon { display: grid; place-items: center; width: 40px; height: 40px; background: rgb(230, 214, 194); border-radius: 50%; font-size: 20px; color: rgb(118, 66, 16); margin-bottom: 17px; }
.join-unavailable h3, .join-pending h3 { font-size: 23px; line-height: 1.15; font-weight: 750; letter-spacing: -0.04em; }
.join-unavailable p, .join-pending p { font-size: 13px; line-height: 1.7; color: rgb(117, 99, 78); margin: 13px 0px 24px; }
.join-test-note { padding: 12px; background: rgb(255, 222, 151); border: 1px solid rgb(187, 136, 57); color: rgb(99, 69, 14); font-size: 12px; margin-bottom: 18px !important; }
.join-complete-check { display: grid; place-items: center; width: 56px; height: 56px; background: rgb(207, 220, 191); color: rgb(56, 82, 32); font-size: 27px; border-radius: 50%; margin-bottom: 28px; }
.join-complete h2 { font: 800 72px / 0.9 "Barlow Condensed", Impact, sans-serif; margin-top: 15px; }
.join-complete p { font-size: 14px; color: rgb(109, 98, 85); line-height: 1.7; margin: 19px 0px 28px; }
.join-footer { border-top: 1px solid rgb(51, 45, 38); max-width: 1160px; margin: auto; display: flex; gap: 25px; align-items: center; padding: 25px 0px 35px; font-size: 10px; color: rgb(164, 150, 135); }
.join-footer > span { margin-right: auto; }
.join-footer a { text-decoration: underline; text-underline-offset: 4px; }
.spx-member { max-width: 1180px; margin: auto; padding: 58px 32px 90px; min-height: 70dvh; }
.join-account-intro { margin-bottom: 38px; }
.join-account-intro h1 { font: 800 clamp(58px, 6vw, 86px) / 0.9 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.02em; margin: 18px 0px 22px; }
.join-account-intro > p { font-size: 14px; color: rgb(188, 176, 162); }
.join-account-auth { background: var(--join-cream); color: var(--join-ink); padding: 36px; max-width: 540px; border: 1px solid rgb(210, 199, 184); border-radius: 3px; }
.join-account-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
.join-account-details, .join-account-membership { padding: 32px; background: rgb(20, 18, 15); border: 1px solid rgb(74, 63, 50); border-radius: 3px; min-width: 0px; }
.join-account-details h2, .join-account-membership h2 { font-size: 29px; line-height: 1.1; font-weight: 750; letter-spacing: -0.04em; margin: 18px 0px 24px; }
.join-account-details dl { margin: 0px; }
.join-account-details dl > div { padding: 17px 0px; border-bottom: 1px solid rgb(62, 53, 43); }
.join-account-details dt { font-size: 10px; color: rgb(164, 145, 125); margin-bottom: 5px; }
.join-account-details dd { font-size: 14px; margin: 0px; color: rgb(228, 215, 198); overflow-wrap: anywhere; }
.join-account-details > .join-secondary { margin-top: 25px; }
.join-account-membership { background: rgb(244, 240, 233); color: rgb(21, 17, 11); }
.join-account-membership > .join-eyebrow { color: rgb(137, 99, 73); }
.join-membership-status { display: inline-flex; margin-top: 22px; padding: 7px 10px; border: 1px solid rgb(203, 188, 167); border-radius: 20px; font-size: 10px; color: rgb(112, 83, 50); background: rgb(237, 225, 209); line-height: 1.3; }
.join-membership-status.is-active { background: rgb(225, 234, 215); color: rgb(61, 84, 48); border-color: rgb(173, 190, 156); }
.join-account-membership > p { font-size: 13px; color: rgb(115, 100, 84); line-height: 1.8; margin: 0px 0px 24px; }
.join-account-plan-price strong { font-size: 31px; color: rgb(50, 33, 20); font-weight: 750; letter-spacing: -0.04em; }
.join-account-membership > .join-period { font-size: 11px; margin-top: -8px; }
.join-account-membership > .join-fine-print { margin: 20px 0px 0px; }
.join-sport-preferences { margin: 25px 0px; }
.join-sport-preferences h3 { font-size: 14px; line-height: 1.5; font-weight: 650; }
.join-sport-preferences > p { font-size: 10px; color: rgb(169, 151, 128); line-height: 1.6; margin: 7px 0px 13px; }
.join-sport-buttons { display: flex; flex-wrap: wrap; gap: 7px; }
.join-sport-buttons button { border: 1px solid rgb(120, 99, 76); background: transparent; color: rgb(223, 207, 186); padding: 10px 12px; min-height: 43px; border-radius: 3px; font-size: 11px; font-weight: 650; }
.join-sport-buttons button[aria-pressed="true"] { background: rgb(255, 102, 0); color: rgb(24, 16, 8); border-color: rgb(255, 102, 0); }
@media (min-width: 1100px) {
  .join-intro > p { position: absolute; right: 0px; bottom: 4px; max-width: 24ch; text-align: right; font-size: 17px; line-height: 1.7; }
  .join-summary { position: sticky; top: 24px; }
}
@media (max-width: 959px) {
  .join-main { padding: 40px 24px 65px; }
  .join-layout { gap: 24px; grid-template-columns: minmax(0px, 1.3fr) minmax(0px, 1fr); }
  .join-flow-content { padding: 26px 24px; }
  .join-steps { padding-inline: 15px; }
  .join-steps li { font-size: 11px; gap: 6px; min-height: 65px; }
  .join-summary-body { padding: 14px 21px 24px; }
  .join-summary-photo { height: 215px; }
  .join-summary-photo > span { font-size: 40px; left: 21px; }
  .join-summary-price { flex-direction: column; align-items: flex-start; gap: 14px; }
  .join-summary-price p { text-align: left; }
  .join-summary ul { gap: 13px; }
  .join-plan { grid-template-columns: 17px minmax(0px, 1fr); padding: 17px 13px; gap: 10px; }
  .join-plan-price { grid-column: 2; flex-direction: row; gap: 7px; align-items: baseline; text-align: left; }
  .join-plan ul { margin-top: 11px; }
  .join-footer { margin-inline: 24px; }
  .spx-member { padding: 40px 24px 70px; }
  .join-account-grid { gap: 20px; }
  .join-account-details, .join-account-membership { padding: 26px 23px; }
}
@media (max-width: 719px) {
  .join-header { min-height: 70px; padding: 17px 21px; gap: 25px; }
  .join-header > a:first-child { flex-basis: 155px; }
  .join-header-back { font-size: 10px; gap: 9px; }
  .join-header-back span { font-size: 20px; }
  .join-main { padding: 34px 20px 50px; }
  .join-intro { margin-bottom: 31px; }
  .join-intro h1 { font-size: 79px; margin-top: 19px; }
  .join-intro > p { font-size: 12px; }
  .join-layout { grid-template-columns: minmax(0px, 1fr); gap: 25px; }
  .join-flow-content { padding: 27px 24px; }
  .join-steps { padding-inline: 20px; }
  .join-steps li { font-size: 11px; min-height: 65px; gap: 8px; }
  .join-plan { grid-template-columns: 17px minmax(0px, 1fr) auto; padding: 19px 15px; }
  .join-plan-price { grid-column: auto; flex-direction: column; align-items: flex-end; gap: 3px; }
  .join-summary { display: block; }
  .join-summary-photo { height: 177px; }
  .join-summary-photo img { object-position: 50% 26%; }
  .join-summary-photo > span { font-size: 42px; bottom: 20px; left: 24px; }
  .join-summary-body { padding: 16px 24px 23px; }
  .join-summary-price { flex-direction: row; align-items: center; margin-top: 13px; padding-bottom: 21px; }
  .join-summary-price p { text-align: right; }
  .join-summary ul { margin-block: 22px; gap: 12px; }
  .join-summary-note { padding-block: 18px; }
  .join-footer { margin-inline: 20px; flex-wrap: wrap; gap: 16px; padding: 23px 0px 28px; font-size: 9px; }
  .join-footer > span { flex-basis: 100%; margin: 0px; }
  .spx-member { padding: 35px 20px 85px; }
  .join-account-intro h1 { font-size: 63px; }
  .join-account-intro > p { font-size: 12px; }
  .join-account-auth { padding: 28px 23px; }
  .join-account-grid { grid-template-columns: 1fr; gap: 22px; }
  .join-account-details, .join-account-membership { padding: 27px 25px; }
  .join-account-details h2, .join-account-membership h2 { font-size: 28px; }
  .join-form input:not([type="radio"]) { font-size: 16px; }
  .join-password button { font-size: 12px; }
}
@media (max-width: 389px) {
  .join-header { padding-inline: 17px; gap: 16px; }
  .join-header > a:first-child { flex-basis: 137px; }
  .join-header-back { font-size: 9px; gap: 6px; }
  .join-main { padding-inline: 16px; }
  .join-intro h1 { font-size: 69px; }
  .join-flow-content { padding: 25px 18px; }
  .join-steps { padding-inline: 12px; }
  .join-steps li { font-size: 10px; gap: 6px; }
  .join-steps li span { width: 23px; height: 23px; font-size: 9px; }
  .join-name-fields { gap: 10px; }
  .join-form input:not([type="radio"]) { padding-inline: 10px; }
  .join-form label { font-size: 11px; }
  .join-section-heading h2 { font-size: 28px; }
  .join-section-heading p { font-size: 12px; }
  .join-plan { grid-template-columns: 16px minmax(0px, 1fr); padding: 16px 12px; gap: 9px; }
  .join-plan-price { grid-column: 2; flex-direction: row; align-items: baseline; gap: 7px; }
  .join-unavailable, .join-pending { padding: 23px 17px; }
  .join-summary-body { padding-inline: 20px; }
  .join-summary-photo > span { left: 20px; }
  .join-summary-price h2 { font-size: 24px; }
  .spx-member { padding-inline: 16px; }
  .join-account-auth { padding: 25px 18px; }
  .join-account-intro h1 { font-size: 56px; }
  .join-account-details, .join-account-membership { padding: 25px 20px; }
  .join-password input:not([type="radio"]) { padding-right: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  .join-loading span { animation: auto ease 0s 1 normal none running none; }
  .spx-enroll *, .spx-member * { scroll-behavior: auto !important; transition: none !important; }
}
.spx-enroll .join-form, .spx-member .join-form { margin: 0px; padding: 0px; gap: 20px; }
.spx-enroll .join-form label, .spx-member .join-form label { margin: 0px; color: rgb(40, 35, 31); }
.spx-enroll .join-form label small, .spx-member .join-form label small { color: rgb(116, 107, 96); }
.spx-enroll .join-form input:not([type="radio"]), .spx-member .join-form input:not([type="radio"]) { margin: 0px; }
.join-login-main { max-width: 1120px; margin: auto; padding: 94px 32px 112px; display: grid; grid-template-columns: minmax(0px, 1fr) minmax(360px, 460px); align-items: center; gap: 80px; min-height: calc(100dvh - 172px); }
.join-login-intro h1 { font: 800 clamp(62px, 6vw, 88px) / 0.92 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.02em; margin: 22px 0px !important; }
.join-login-intro h1 span { color: rgb(255, 113, 11); }
.join-login-intro > p { font-size: 14px; color: rgb(174, 176, 184); line-height: 1.8; max-width: 35ch; }
.join-login-flow { width: 100%; box-shadow: rgba(0, 0, 0, 0.4) 0px 20px 60px; }
.spx-login .join-footer { max-width: 1056px; }
@media (max-width: 959px) {
  .join-login-main { gap: 36px; padding: 64px 24px 80px; grid-template-columns: minmax(0px, 1fr) minmax(320px, 420px); }
  .join-login-intro h1 { font-size: 66px; }
}
@media (max-width: 719px) {
  .join-login-main { padding: 35px 20px 55px; display: flex; flex-direction: column; gap: 29px; align-items: stretch; min-height: calc(100dvh - 185px); }
  .join-login-intro h1 { font-size: 60px; margin: 16px 0px !important; }
  .join-login-intro > p { font-size: 12px; max-width: 38ch; }
  .join-login-flow { max-width: 510px; width: 100%; margin: auto; }
  .spx-login .join-footer { margin-inline: 20px; }
}
@media (max-width: 389px) {
  .join-login-main { padding-inline: 16px; }
  .join-login-intro h1 { font-size: 52px; }
  .spx-login .join-header > a:first-child { flex-basis: 145px; }
}
.spx-enroll { --join-orange: #ff7300; --join-cream: #f3f5f7; --join-ink: #f3f5f7; color-scheme: dark; position: relative; isolation: isolate; overflow-x: clip; background: rgb(2, 2, 2); color: rgb(243, 245, 247); }
.spx-enroll .join-scene-art { position: absolute; z-index: -1; inset: 0px 0px auto; height: 1000px; max-height: 100%; overflow: hidden; pointer-events: none; }
.spx-enroll .join-scene-art img { width: 100%; height: 100%; object-fit: cover; object-position: center top; opacity: 0.72; }
.spx-enroll .join-scene-art::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(90deg, rgba(2, 2, 2, 0.7), rgba(2, 2, 2, 0.28) 48%, rgba(2, 2, 2, 0.16)), linear-gradient(0deg, rgb(2, 2, 2), rgba(2, 2, 2, 0.4) 27%, transparent 70%); }
.spx-enroll .join-header { min-height: 94px; padding: 28px clamp(24px, 3.2vw, 64px); background: transparent; color: rgb(237, 240, 243); gap: 24px; }
.spx-enroll .join-header > a:first-child { flex: 0 0 auto; }
.spx-enroll .join-header .ch-wordmark { font-size: 45px; letter-spacing: -0.035em; filter: drop-shadow(rgb(0, 0, 0) 0px 2px 7px); }
.spx-enroll .ch-wordmark > span { color: transparent; background: linear-gradient(rgb(255, 255, 255), rgb(224, 231, 236) 25%, rgb(124, 137, 149) 49%, rgb(239, 244, 248) 54%, rgb(255, 255, 255) 70%, rgb(137, 151, 164)) text; }
.spx-enroll .join-header-back { font: 500 12px / 1.4 "JetBrains Mono", monospace; gap: 14px; min-height: 44px; }
.spx-enroll .join-header-back span { color: rgb(255, 139, 52); font-size: 22px; }
.spx-enroll .join-main { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(420px, 540px); grid-template-rows: auto 1fr; gap: 38px clamp(38px, 6vw, 104px); max-width: 1500px; padding: 64px clamp(24px, 3.2vw, 64px) 96px; margin: auto; align-items: start; }
.spx-enroll .join-layout { display: contents; }
.spx-enroll .join-intro { grid-area: 1 / 1; margin: 22px 0px 0px; }
.spx-enroll .join-eyebrow { color: rgb(179, 189, 199); font-size: 10px; letter-spacing: 0.13em; }
.spx-enroll .join-intro h1, .spx-enroll .join-login-intro h1 { font: 900 clamp(40px, 4.15vw, 64px) / 1.04 Inter, Arial, sans-serif; letter-spacing: -0.05em; text-shadow: rgba(0, 0, 0, 0.533) 0px 3px 20px; margin: 22px 0px 25px !important; }
.spx-enroll .join-intro h1 span, .spx-enroll .join-login-intro h1 span { color: rgb(255, 115, 0); }
.spx-enroll .join-intro > p { position: static; max-width: 38ch; text-align: left; color: rgb(184, 190, 197); font-size: 14px; line-height: 1.8; }
.spx-enroll .join-flow { grid-area: 1 / 2 / span 2; border: 1px solid transparent; border-radius: 14px; background: linear-gradient(155deg, rgba(32, 36, 42, 0.93), rgba(12, 14, 17, 0.97) 42%, rgba(17, 20, 24, 0.97)) padding-box padding-box, linear-gradient(140deg, rgba(228, 235, 241, 0.7), rgba(88, 97, 111, 0.6) 19%, rgb(37, 42, 48) 49%, rgba(188, 198, 209, 0.533) 80%, rgb(70, 76, 85)) border-box border-box; color: rgb(237, 240, 244); box-shadow: rgba(0, 0, 0, 0.533) 0px 22px 60px, rgba(255, 255, 255, 0.07) 0px 1px inset; }
.spx-enroll .join-steps { padding-inline: 28px; background: linear-gradient(rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.008)); border-color: rgba(196, 210, 226, 0.17); }
.spx-enroll .join-steps li { min-height: 68px; color: rgb(146, 158, 172); font-size: 11px; gap: 8px; }
.spx-enroll .join-steps li span { color: rgb(168, 179, 191); border-color: rgb(101, 113, 126); background: rgb(16, 19, 23); }
.spx-enroll .join-steps li.is-current { color: rgb(242, 245, 247); border-bottom-color: rgb(255, 115, 0); }
.spx-enroll .join-steps li.is-current span { color: rgb(19, 16, 13); background: linear-gradient(135deg, rgb(255, 172, 96), rgb(255, 115, 0) 75%); border-color: rgb(255, 154, 66); box-shadow: rgba(255, 115, 0, 0.133) 0px 0px 16px; }
.spx-enroll .join-steps li.is-done { color: rgb(216, 222, 229); }
.spx-enroll .join-steps li.is-done span { color: rgb(255, 171, 102); border-color: rgb(170, 97, 45); background: rgba(255, 115, 0, 0.07); }
.spx-enroll .join-flow-content { padding: 32px; }
.spx-enroll .join-section-heading { margin-bottom: 26px; }
.spx-enroll .join-flow .join-eyebrow { color: rgb(255, 151, 71); }
.spx-enroll .join-section-heading h2 { color: rgb(241, 244, 246); font-size: 30px; letter-spacing: -0.045em; margin: 10px 0px 12px; }
.spx-enroll .join-section-heading p { color: rgb(174, 182, 192); font-size: 13px; }
.spx-enroll .join-form { gap: 19px; }
.spx-enroll .join-form label { color: rgb(227, 232, 238); font-size: 12px; gap: 8px; }
.spx-enroll .join-form input:not([type="radio"]) { height: 49px; border: 1px solid rgb(100, 112, 125); border-radius: 5px; background: rgb(8, 11, 14); color: rgb(245, 247, 249); padding: 12px 14px; font-size: 16px; box-shadow: rgba(0, 0, 0, 0.333) 0px 1px 4px inset; transition: border-color 0.15s, box-shadow 0.15s; }
.spx-enroll .join-form input:not([type="radio"]):hover:not(:disabled) { border-color: rgb(153, 166, 181); }
.spx-enroll .join-form input:not([type="radio"]):focus { border-color: rgb(255, 147, 64); box-shadow: rgba(255, 115, 0, 0.16) 0px 0px 0px 3px; }
.spx-enroll .join-form input:not([type="radio"]):user-invalid { border-color: rgb(241, 141, 117); }
.spx-enroll .join-form input:not([type="radio"]):disabled { color: rgb(168, 177, 188); background: rgb(23, 27, 32); opacity: 0.7; cursor: wait; }
.spx-enroll .join-form input::placeholder { color: rgb(120, 133, 145); opacity: 1; }
.spx-enroll .join-form input:-webkit-autofill { -webkit-text-fill-color: rgb(245, 247, 249); box-shadow: rgb(16, 22, 27) 0px 0px 0px 1000px inset; caret-color: rgb(245, 247, 249); }
.spx-enroll .join-form label small { color: rgb(159, 170, 182); font-size: 11px; line-height: 1.6; }
.spx-enroll .join-password input:not([type="radio"]) { padding-right: 67px; }
.spx-enroll .join-password button { color: rgb(200, 209, 219); min-width: 56px; font-size: 12px; border-radius: 3px; }
.spx-enroll .join-password button:hover { color: rgb(255, 154, 80); background: rgba(255, 255, 255, 0.02); }
.spx-enroll .join-text-button { color: rgb(255, 155, 82); min-height: 40px; }
.spx-enroll .join-primary { min-height: 53px; background: linear-gradient(rgb(255, 133, 37), rgb(255, 115, 0)); border-color: rgb(255, 154, 72); border-radius: 4px; padding: 15px 20px; letter-spacing: 0.015em; box-shadow: rgba(255, 255, 255, 0.145) 0px 1px inset, rgba(255, 115, 0, 0.09) 0px 4px 22px; color: rgb(9, 9, 9) !important; font-family: "JetBrains Mono", monospace !important; font-size: 12px !important; }
.spx-enroll .join-primary > span { color: rgb(17, 17, 17); }
.spx-enroll .join-primary:hover:not(:disabled) { background: rgb(255, 149, 63); border-color: rgb(255, 181, 120); box-shadow: rgba(255, 115, 0, 0.165) 0px 4px 26px; }
.spx-enroll button:disabled { opacity: 0.6; }
.spx-enroll .join-secondary { border-color: rgb(107, 117, 129); background: linear-gradient(140deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.008)); border-radius: 4px; color: rgb(214, 222, 231); min-height: 46px; }
.spx-enroll .join-secondary:hover:not(:disabled) { border-color: rgb(177, 189, 202); background: rgba(255, 255, 255, 0.043); }
.spx-enroll .join-fine-print { color: rgb(158, 171, 184) !important; font-size: 11px !important; }
.spx-enroll .join-fine-print a { color: rgb(209, 219, 229); }
.spx-enroll .join-auth-switch { color: rgb(164, 174, 187); font-size: 12px; }
.spx-enroll .join-auth-switch button, .spx-enroll .join-auth-switch a { color: rgb(235, 239, 244); min-height: 40px; }
.spx-enroll .join-alert { background: rgb(56, 34, 28); color: rgb(255, 208, 191); border-color: rgb(177, 108, 84) rgb(177, 108, 84) rgb(177, 108, 84) rgb(255, 161, 111); border-radius: 5px; }
.spx-enroll .join-alert.is-success { background: rgb(24, 48, 39); color: rgb(196, 235, 210); border-color: rgb(96, 137, 108); }
.spx-enroll .join-loading { color: rgb(178, 191, 203); }
.spx-enroll .join-loading span { border-color: rgb(255, 135, 45) rgba(138, 157, 177, 0.2) rgba(138, 157, 177, 0.2); }
.spx-enroll .join-summary { grid-area: 2 / 1; position: static; max-width: 440px; width: 100%; border: 1px solid transparent; border-radius: 10px; background: linear-gradient(140deg, rgba(20, 26, 33, 0.93), rgba(8, 11, 15, 0.93)) padding-box padding-box, linear-gradient(140deg, rgba(197, 209, 222, 0.48), rgba(83, 96, 112, 0.4) 30%, rgb(39, 48, 57) 60%, rgba(157, 171, 188, 0.4)) border-box border-box; box-shadow: rgba(0, 0, 0, 0.333) 0px 18px 40px, rgba(255, 255, 255, 0.035) 0px 1px inset; }
.spx-enroll .join-summary-body { padding: 25px 27px 22px; }
.spx-enroll .join-summary-price { margin-top: 17px; padding-bottom: 20px; border-color: rgba(101, 120, 142, 0.267); flex-direction: row; align-items: center; }
.spx-enroll .join-summary-price h2 { font-size: 25px; color: rgb(227, 233, 239); }
.spx-enroll .join-summary-price p { text-align: right; }
.spx-enroll .join-summary-price strong { font: 800 40px / 1 Inter, Arial, sans-serif; letter-spacing: -0.055em; color: rgb(255, 139, 49); }
.spx-enroll .join-summary-price small { color: rgb(153, 166, 180); font-size: 10px; }
.spx-enroll .join-summary ul { margin: 22px 0px; gap: 12px; }
.spx-enroll .join-summary li { color: rgb(197, 207, 218); font-size: 12px; }
.spx-enroll .join-summary li span { color: rgb(255, 146, 63); }
.spx-enroll .join-summary-note { color: rgb(162, 173, 186); border-color: rgba(101, 120, 142, 0.267); padding-block: 18px; }
.spx-enroll .join-summary-footer { color: rgb(146, 161, 176); font-size: 8px; letter-spacing: 0.06em; }
.spx-enroll .join-plan { border-color: rgb(98, 109, 121); border-radius: 7px; background: linear-gradient(135deg, rgb(37, 44, 53), rgb(21, 26, 32)); color: rgb(237, 241, 246); padding: 18px 15px; transition: border-color 0.15s, background 0.15s; }
.spx-enroll .join-plan:hover { border-color: rgb(187, 198, 210); }
.spx-enroll .join-plan:focus-within { outline: rgb(242, 177, 126) solid 2px; outline-offset: 3px; }
.spx-enroll .join-plan.is-selected { border-color: rgb(255, 138, 53); background: linear-gradient(135deg, rgb(59, 41, 30), rgb(28, 27, 27) 80%); box-shadow: rgb(255, 115, 0) 3px 0px inset, rgba(255, 115, 0, 0.133) 0px 0px 0px 1px; }
.spx-enroll .join-plan > input { accent-color: rgb(255, 138, 53); }
.spx-enroll .join-plan h3 { color: rgb(240, 243, 247); }
.spx-enroll .join-plan-copy > div > p { color: rgb(169, 180, 192); }
.spx-enroll .join-plan li { color: rgb(195, 204, 215); }
.spx-enroll .join-plan li span { color: rgb(255, 154, 78); }
.spx-enroll .join-plan-price strong { color: rgb(232, 238, 245); font: 800 29px / 1.1 Inter, Arial, sans-serif; letter-spacing: -0.04em; }
.spx-enroll .join-plan-price small { color: rgb(167, 178, 191); font-size: 9px; }
.spx-enroll .join-plan.is-selected .join-plan-price strong { color: rgb(255, 155, 80); }
.spx-enroll .join-recurrence { color: rgb(168, 180, 193); }
.spx-enroll .join-stripe { border-radius: 7px; overflow: hidden; background: rgb(13, 17, 22); }
.spx-enroll .join-stripe:not(:empty) { border: 1px solid rgb(97, 111, 125); }
.spx-enroll .join-unavailable, .spx-enroll .join-pending { color: rgb(229, 237, 244); border-color: rgb(100, 115, 134); border-radius: 7px; background: linear-gradient(145deg, rgb(35, 45, 56), rgb(21, 27, 35)); }
.spx-enroll .join-unavailable p, .spx-enroll .join-pending p, .spx-enroll .join-complete p { color: rgb(179, 190, 203); }
.spx-enroll .join-status-icon { background: rgba(255, 138, 53, 0.14); border: 1px solid rgba(255, 155, 80, 0.4); color: rgb(255, 174, 106); }
.spx-enroll .join-test-note { background: rgb(53, 41, 28); color: rgb(255, 219, 172); border-color: rgb(169, 119, 62); border-radius: 5px; }
.spx-enroll .join-complete-check { color: rgb(201, 239, 220); background: rgb(37, 69, 52); border: 1px solid rgb(106, 158, 128); }
.spx-enroll .join-complete h2 { color: rgb(240, 244, 248); }
.spx-enroll .join-footer { max-width: none; margin-inline: clamp(24px, 3.2vw, 64px); padding: 28px 0px 32px; border-color: rgba(105, 119, 134, 0.267); color: rgb(155, 167, 180); font-family: "JetBrains Mono", monospace; }
.spx-enroll .join-footer-brand { margin-right: auto; display: inline-flex; text-decoration: none; }
.spx-enroll .join-footer .ch-wordmark { font-size: 28px; }
.spx-enroll .join-login-main { max-width: 1420px; grid-template-columns: minmax(0px, 1fr) minmax(360px, 490px); gap: clamp(40px, 8vw, 130px); padding: 80px clamp(24px, 3.2vw, 64px) 112px; min-height: calc(100dvh - 194px); }
.spx-enroll .join-login-flow { grid-area: auto; }
.spx-enroll .join-login-intro > p { color: rgb(184, 190, 197); font-size: 14px; max-width: 36ch; }
@media (min-width: 800px) and (max-width: 1099px) {
  .spx-enroll .join-main { grid-template-columns: minmax(0px, 1fr) minmax(380px, 1.12fr); gap: 32px; padding-top: 48px; }
  .spx-enroll .join-intro h1 { font-size: clamp(32px, 4.05vw, 45px); }
  .spx-enroll .join-flow-content { padding: 28px 24px; }
  .spx-enroll .join-summary-body { padding: 22px; }
  .spx-enroll .join-login-main { grid-template-columns: minmax(0px, 1fr) minmax(360px, 1fr); gap: 36px; }
  .spx-enroll .join-login-intro h1 { font-size: 42px; }
}
@media (max-width: 799px) {
  .spx-enroll .join-header { min-height: 82px; padding: 20px 24px; }
  .spx-enroll .join-header .ch-wordmark { font-size: 39px; }
  .spx-enroll .join-scene-art { height: 820px; }
  .spx-enroll .join-scene-art img { width: 185%; max-width: none; position: absolute; right: -8%; object-position: right top; opacity: 0.7; }
  .spx-enroll .join-scene-art::after { background: linear-gradient(rgba(2, 2, 2, 0.333), rgba(2, 2, 2, 0.4) 24%, rgba(2, 2, 2, 0.7) 46%, rgb(2, 2, 2)); }
  .spx-enroll .join-main { display: flex; flex-direction: column; gap: 28px; max-width: 630px; padding: 40px 24px 64px; }
  .spx-enroll .join-intro { margin: 0px; }
  .spx-enroll .join-intro h1, .spx-enroll .join-login-intro h1 { font-size: clamp(33px, 7.5vw, 54px); margin: 18px 0px 20px !important; }
  .spx-enroll .join-intro > p, .spx-enroll .join-login-intro > p { font-size: 13px; max-width: 38ch; }
  .spx-enroll .join-flow { width: 100%; }
  .spx-enroll .join-flow-content { padding: 28px; }
  .spx-enroll .join-summary { max-width: none; }
  .spx-enroll .join-summary-body { padding: 25px 28px; }
  .spx-enroll .join-plan { grid-template-columns: 17px minmax(0px, 1fr) auto; }
  .spx-enroll .join-plan-price { grid-column: auto; flex-direction: column; align-items: flex-end; }
  .spx-enroll .join-footer { margin-inline: 24px; flex-wrap: wrap; }
  .spx-enroll .join-login-main { display: flex; flex-direction: column; align-items: stretch; gap: 30px; max-width: 630px; padding: 40px 24px 64px; }
  .spx-enroll .join-login-flow { max-width: none; }
}
@media (max-width: 479px) {
  .spx-enroll .join-header { padding-inline: 20px; gap: 14px; }
  .spx-enroll .join-header .ch-wordmark { font-size: 35px; }
  .spx-enroll .join-header-back { font-size: 9px; gap: 6px; }
  .spx-enroll .join-header-back span { font-size: 18px; }
  .spx-enroll .join-main, .spx-enroll .join-login-main { padding: 28px 20px 54px; gap: 27px; }
  .spx-enroll .join-intro h1, .spx-enroll .join-login-intro h1 { font-size: clamp(31px, 8.3vw, 40px); }
  .spx-enroll .join-intro > p, .spx-enroll .join-login-intro > p { font-size: 12px; }
  .spx-enroll .join-flow-content { padding: 26px 21px; }
  .spx-enroll .join-steps { padding-inline: 16px; }
  .spx-enroll .join-steps li { min-height: 63px; font-size: 10px; gap: 6px; }
  .spx-enroll .join-steps li span { width: 24px; height: 24px; }
  .spx-enroll .join-section-heading h2 { font-size: 28px; }
  .spx-enroll .join-form label small { font-size: 10px; }
  .spx-enroll .join-name-fields { gap: 10px; }
  .spx-enroll .join-form input:not([type="radio"]) { padding-inline: 11px; }
  .spx-enroll .join-password input:not([type="radio"]) { padding-right: 63px; }
  .spx-enroll .join-plan { grid-template-columns: 17px minmax(0px, 1fr); gap: 10px; }
  .spx-enroll .join-plan-price { grid-column: 2; flex-direction: row; align-items: baseline; gap: 7px; }
  .spx-enroll .join-summary-body { padding: 23px; }
  .spx-enroll .join-footer { margin-inline: 20px; gap: 18px; }
  .spx-enroll .join-footer-brand { flex-basis: 100%; }
}
@media (max-width: 359px) {
  .spx-enroll .join-header { padding-inline: 16px; }
  .spx-enroll .join-header .ch-wordmark { font-size: 31px; }
  .spx-enroll .join-header-back { font-size: 8px; }
  .spx-enroll .join-header-back span { display: none; }
  .spx-enroll .join-main, .spx-enroll .join-login-main { padding-inline: 16px; }
  .spx-enroll .join-flow-content { padding: 24px 17px; }
  .spx-enroll .join-steps { padding-inline: 12px; }
  .spx-enroll .join-section-heading h2 { font-size: 26px; }
  .spx-enroll .join-form label { font-size: 11px; }
  .spx-enroll .join-footer { margin-inline: 16px; }
}
.join-pro-picker { margin: 25px 0px; }
.join-pro-options { border: 0px; padding: 0px; margin: 0px; min-width: 0px; }
.join-pro-options legend { color: rgb(237, 242, 247); font: 650 15px / 1.5 Inter, Arial, sans-serif; margin-bottom: 8px; }
.spx-enroll .join-pro-help, .spx-member .join-pro-help { color: rgb(179, 190, 203); font: 400 12px / 1.7 Inter, Arial, sans-serif; margin: 0px 0px 15px; }
.join-pro-choices { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 9px; }
.join-pro-choice { display: flex; align-items: center; gap: 8px; min-width: 0px; min-height: 46px; padding: 11px 12px; border: 1px solid rgb(102, 115, 128); border-radius: 5px; background: linear-gradient(135deg, rgb(32, 41, 52), rgb(16, 22, 29)); color: rgb(226, 233, 241); font: 600 12px / 1.5 Inter, Arial, sans-serif; cursor: pointer; }
.join-pro-choice input { width: 16px; height: 16px; flex: 0 0 auto; accent-color: rgb(255, 138, 53); margin: 0px; }
.join-pro-choice.is-selected { border-color: rgb(255, 155, 80); background: linear-gradient(135deg, rgb(61, 43, 32), rgb(32, 29, 27)); color: rgb(255, 244, 233); }
.join-pro-choice.is-unavailable { color: rgb(154, 168, 183); border-color: rgb(69, 83, 98); background: rgb(18, 26, 34); cursor: default; }
.join-pro-choice:not(.is-unavailable):hover { border-color: rgb(189, 204, 217); }
.join-pro-choice:focus-within { outline: rgb(255, 173, 112) solid 2px; outline-offset: 3px; }
.join-pro-check { margin-left: auto; color: rgb(255, 172, 107); font-size: 14px; }
.join-pro-choice.is-unavailable .join-pro-check { color: rgb(145, 160, 175); }
.spx-enroll .join-pro-count, .spx-member .join-pro-count { display: flex; flex-direction: column; gap: 3px; color: rgb(169, 182, 197); font: 400 11px / 1.65 Inter, Arial, sans-serif; margin-top: 13px; }
.join-pro-count strong { color: rgb(212, 221, 231); font-weight: 600; }
.spx-enroll .join-pro-error, .spx-member .join-pro-error { color: rgb(255, 188, 170); background: rgb(53, 32, 27); border: 1px solid rgb(152, 105, 81); padding: 11px 13px; border-radius: 4px; font: 400 12px / 1.6 Inter, Arial, sans-serif; margin-top: 13px; }
.spx-enroll .join-pro-saved, .spx-member .join-pro-saved { color: rgb(186, 232, 209); font: 400 12px / 1.6 Inter, Arial, sans-serif; margin-top: 13px; }
.join-pro-status { font: 400 12px / 1.6 Inter, Arial, sans-serif; color: rgb(179, 190, 203); }
.spx-enroll .join-pro-summary { display: flex; flex-direction: column; gap: 5px; margin: 0px 0px 18px; color: rgb(197, 207, 218); font: 400 12px / 1.7 Inter, Arial, sans-serif; }
.join-pro-summary strong { color: rgb(225, 231, 239); font-weight: 600; }
.join-pro-account { padding: 28px 32px; margin-bottom: 28px; scroll-margin-top: 28px; border: 1px solid transparent; border-radius: 9px; background: linear-gradient(145deg, rgb(32, 41, 51), rgb(17, 23, 30) 65%) padding-box padding-box, linear-gradient(135deg, rgb(186, 198, 209), rgb(75, 89, 103) 30%, rgb(40, 51, 62) 65%, rgb(139, 154, 168)) border-box border-box; box-shadow: rgba(255, 255, 255, 0.047) 0px 1px inset; color: rgb(232, 238, 244); }
.spx-member .join-pro-account h2 { font: 750 28px / 1.15 Inter, Arial, sans-serif; letter-spacing: -0.035em; margin: 13px 0px 12px; }
.spx-member .join-pro-account > p { max-width: 72ch; color: rgb(179, 190, 203); font-size: 13px; line-height: 1.75; }
.join-pro-account .join-pro-picker { max-width: 680px; }
.join-pro-account .join-pro-choices { grid-template-columns: repeat(5, minmax(0px, 1fr)); }
.join-pro-account > .join-primary, .join-pro-account > .join-secondary { max-width: 320px; margin-top: 12px; border-radius: 4px; }
.join-pro-account > .join-primary { background: linear-gradient(rgb(255, 133, 37), rgb(255, 115, 0)); border-color: rgb(255, 154, 72); color: rgb(9, 9, 9); }
.join-pro-account > .join-secondary { border-color: rgb(120, 137, 154); color: rgb(216, 226, 235); background: rgba(255, 255, 255, 0.02); }
.spx-member .join-pro-account > .join-pro-help { margin-top: 18px; }
@media (max-width: 799px) {
  .join-pro-account .join-pro-choices { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@media (max-width: 479px) {
  .join-pro-account { padding: 25px 20px; }
  .join-pro-account .join-pro-choices { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .join-pro-choice { padding: 10px; gap: 7px; }
  .spx-member .join-pro-account h2 { font-size: 25px; }
}
.join-pro-setup { display: flex; align-items: center; justify-content: space-between; gap: 22px; max-width: 1440px; margin: 24px auto; padding: 22px 26px; border: 1px solid rgb(129, 145, 162); border-radius: 8px; background: linear-gradient(135deg, rgb(38, 49, 61), rgb(17, 24, 32)); color: rgb(237, 243, 248); font-family: Inter, Arial, sans-serif; }
.join-pro-setup strong { font-size: 15px; font-weight: 650; line-height: 1.5; }
.join-pro-setup p { color: rgb(185, 197, 210); font-size: 12px; line-height: 1.7; margin: 6px 0px 0px; }
.join-pro-setup a { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 44px; padding: 11px 16px; border: 1px solid rgb(255, 156, 81); border-radius: 4px; background: rgb(255, 133, 38); color: rgb(17, 17, 17); font-size: 12px; font-weight: 700; text-decoration: none; }
.join-pro-setup a:focus-visible { outline: rgb(255, 186, 130) solid 3px; outline-offset: 4px; }
@media (max-width: 619px) {
  .join-pro-setup { flex-direction: column; align-items: stretch; padding: 20px; margin-block: 18px; gap: 16px; }
  .join-pro-setup a { align-self: flex-start; }
}
.join-demo-notice { border-color: rgb(95, 114, 134); background: linear-gradient(135deg, rgb(28, 38, 48), rgb(16, 22, 30)); }
.join-demo-notice a { border-color: rgb(145, 163, 181); background: linear-gradient(140deg, rgb(55, 70, 84), rgb(32, 44, 56)); color: rgb(237, 244, 250); }
.join-demo-notice + .join-pro-setup { margin-top: 12px; }
.spx-member .join-account-membership .join-demo-ended { font-size: 13px; line-height: 1.7; margin: 18px 0px; color: rgb(103, 90, 77); }
.join-renewal-choice { display: flex; align-items: center; gap: 14px; padding: 20px 0px; border-top: 1px solid rgba(255, 255, 255, 0.15); border-bottom: 1px solid rgba(255, 255, 255, 0.15); color: rgb(238, 238, 238); cursor: pointer; }
.join-renewal-choice input { width: 20px; height: 20px; accent-color: rgb(216, 219, 226); }
.join-renewal-choice span { display: grid; gap: 6px; }
.join-renewal-choice small { color: rgb(170, 170, 170); font-size: 13px; line-height: 1.5; }
.chrome-site { --chrome-bg: #0e1114; --chrome-panel: #171b20; --chrome-line: #3f464f; --chrome-muted: #a8b1bb; --chrome-orange: #ff6b00; --orange: #ff6b00; --muted: #a8b1bb; background: rgb(14, 17, 20); color: rgb(244, 246, 248); font-family: Inter, Arial, sans-serif; }
.chrome-site [hidden] { display: none !important; }
.chrome-site .site-header { height: 76px; padding: 12px 22px; background: rgb(16, 20, 25); color: rgb(243, 245, 247); border-bottom: 1px solid rgb(59, 66, 74); gap: 18px; position: relative; z-index: 20; }
.chrome-site .brand { background: transparent; padding: 0px; width: auto; flex: 0 0 auto; border-radius: 0px; }
.chrome-site .brand img { max-width: 158px; }
.ch-wordmark { font: italic 800 35px / 0.95 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.045em; white-space: nowrap; display: inline-flex; align-items: baseline; transform: skew(-3deg); }
.ch-wordmark > span, .ch-wordmark > b { display: block; flex-shrink: 0; padding: 0.12em 0.16em; margin: -0.12em -0.16em; overflow: visible; }
.ch-wordmark > span { background: linear-gradient(rgb(255, 255, 255), rgb(213, 220, 226) 32%, rgb(135, 147, 158) 57%, rgb(244, 247, 249) 77%, rgb(177, 189, 199)) text; color: transparent; }
.ch-wordmark > b { font-weight: 800; background: linear-gradient(rgb(255, 164, 90), rgb(255, 107, 0) 56%, rgb(207, 72, 0)) text; color: transparent; }
.chrome-site .header-access { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 11px 15px; background: linear-gradient(rgb(255, 143, 41), rgb(255, 107, 0) 65%, rgb(216, 76, 0)); color: rgb(25, 14, 5); border-width: 1px; border-style: solid; border-color: rgb(255, 168, 94) rgb(255, 168, 94) rgb(165, 62, 0); border-image: none; border-radius: 5px; font-size: 12px; font-weight: 800; box-shadow: rgba(255, 214, 172, 0.4) 0px 1px inset, rgb(107, 45, 6) 0px 2px; white-space: nowrap; }
.chrome-site .header-access span { color: rgb(37, 17, 4); }
.chrome-site .desktop-nav { color: rgb(174, 183, 193); }
.chrome-site .desktop-nav a:hover, .chrome-site .desktop-nav a[aria-current="page"] { color: rgb(255, 255, 255); }
.chrome-site .desktop-nav a[aria-current="page"] { text-decoration: underline 2px rgb(255, 107, 0); text-underline-offset: 9px; }
.chrome-site .site-menu-toggle { background: rgb(25, 30, 36); color: rgb(215, 223, 230); border-color: rgb(83, 94, 105); border-radius: 7px; }
.chrome-site .site-mobile-menu { background: rgb(20, 25, 31); color: rgb(232, 236, 240); border-bottom-color: rgb(70, 80, 91); }
.chrome-site .site-mobile-menu a { border-color: rgb(51, 60, 69); }
.chrome-site .bottom-nav { background: rgba(17, 23, 30, 0.96); border-top: 1px solid rgb(88, 99, 111); color: rgb(157, 169, 181); }
.chrome-site .bottom-nav a[aria-current="page"] { color: rgb(255, 124, 31); }
.chrome-home-page .desktop-nav { display: none !important; }
.chrome-home-page .header-access { margin-left: auto; }
.chrome-site .ch-shell { display: grid; grid-template-columns: minmax(0px, 1fr); width: 100%; max-width: 1440px; margin: 0px auto; background: rgb(14, 17, 20); min-height: 65vh; }
.chrome-site .ch-dashboard { min-width: 0px; padding: 0px 16px 35px; }
.chrome-site .ch-sidebar { display: none; }
.chrome-site .ch-sports { display: flex; align-items: center; justify-content: center; gap: 23px; border-bottom: 1px solid rgb(61, 69, 78); min-height: 58px; }
.chrome-site .ch-sports button { min-height: 52px; background: transparent; border-width: 0px 0px 3px; border-style: none none solid; border-color: currentcolor currentcolor transparent; border-image: none; padding: 10px 3px; color: rgb(178, 189, 199); font-size: 13px; font-weight: 750; letter-spacing: 0.035em; }
.chrome-site .ch-sports button[aria-pressed="true"] { color: rgb(255, 130, 37); border-bottom-color: rgb(255, 107, 0); }
.chrome-site .ch-sports button:hover { color: rgb(255, 255, 255); }
.chrome-site .ch-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 24px 0px 8px; }
.chrome-site .ch-heading h1 { font: italic 800 clamp(30px, 8.9vw, 42px) / 0.95 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.016em; color: rgb(241, 244, 247); }
.chrome-site .ch-heading small, .chrome-site .ch-heading > span { font-size: 8px; line-height: 1.4; color: rgb(162, 173, 184); letter-spacing: 0.06em; text-align: right; max-width: 66px; }
.chrome-site .ch-hero { display: grid; grid-template-columns: minmax(0px, 1fr); position: relative; overflow: hidden; padding: 0px 0px 26px; }
.chrome-site .ch-hero-copy { order: 2; padding-top: 0px; min-width: 0px; position: relative; z-index: 2; }
.chrome-site .ch-hero-copy h2 { display: none; font: italic 800 76px / 0.87 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.025em; color: rgb(255, 255, 255); margin: 0px 0px 20px; }
.chrome-site .ch-hero-copy h2 span { color: rgb(255, 107, 0); }
.chrome-site .ch-hero-copy > p { font-size: 13px; line-height: 1.6; color: rgb(185, 194, 203); text-align: center; max-width: 32ch; margin: 0px auto 16px; }
.chrome-site .ch-open { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; min-height: 54px; padding: 15px 21px; background: linear-gradient(rgb(255, 145, 49), rgb(255, 107, 0) 42%, rgb(235, 84, 0)); color: rgb(25, 17, 10); border-width: 1px; border-style: solid; border-color: rgb(255, 169, 93) rgb(255, 169, 93) rgb(156, 56, 0); border-image: none; border-radius: 7px; box-shadow: rgba(255, 214, 178, 0.7) 0px 1px inset, rgba(176, 60, 0, 0.25) 0px -2px inset, rgb(112, 48, 8) 0px 3px, rgba(0, 0, 0, 0.4) 0px 8px 20px; font-size: 15px; font-weight: 850; letter-spacing: -0.01em; }
.chrome-site .ch-open > span { font-size: 23px; line-height: 1; }
.chrome-site .ch-open:hover { background: linear-gradient(rgb(255, 163, 76), rgb(255, 126, 22) 55%, rgb(246, 91, 0)); }
.chrome-site .ch-open:active { transform: translateY(2px); box-shadow: rgba(255, 187, 128, 0.4) 0px 1px inset, rgb(112, 48, 8) 0px 1px; }
.chrome-site .ch-hero-link { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; color: rgb(187, 197, 207); font-size: 11px; font-weight: 600; margin-top: 6px; }
.chrome-site .ch-hero-link:hover { color: rgb(255, 255, 255); }
.chrome-site .ch-hero-visual { order: 1; position: relative; height: 345px; width: 100%; isolation: isolate; min-width: 0px; overflow: hidden; background: radial-gradient(at 50% 68%, rgba(154, 67, 13, 0.19), rgba(18, 23, 30, 0) 60%); }
.chrome-site .ch-ring { position: absolute; bottom: 17px; left: 8%; width: 84%; height: 34px; border: 2px solid rgb(255, 125, 24); border-radius: 50%; box-shadow: rgba(255, 103, 0, 0.66) 0px 0px 9px, rgba(255, 103, 0, 0.51) 0px 0px 8px inset, rgba(213, 80, 0, 0.267) 0px 0px 24px; z-index: 0; transform: perspective(500px) rotateX(25deg); }
.chrome-site .ch-pack-image { display: block; position: absolute; left: 50%; top: 24px; transform: translate(-50%) rotate(-2deg); width: 171px; height: 278px; object-fit: contain; z-index: 5; filter: drop-shadow(rgba(0, 0, 0, 0.733) 0px 12px 15px); }
.chrome-site .ch-fan-card { position: absolute; top: 52px; left: 50%; width: 126px; height: 197px; padding: 3px; border-radius: 9px; overflow: hidden; background: linear-gradient(140deg, rgb(255, 255, 255), rgb(130, 144, 157) 16%, rgb(246, 249, 251) 36%, rgb(73, 85, 97) 54%, rgb(209, 217, 223) 80%, rgb(130, 144, 157)); box-shadow: rgba(0, 0, 0, 0.6) 0px 6px 15px; transform-origin: 50% 100%; z-index: 2; }
.chrome-site .ch-fan-card img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; border-radius: 6px; background: rgb(16, 21, 28); }
.chrome-site .ch-fan-0 { transform: translate(-113%) rotate(-18deg); top: 60px; }
.chrome-site .ch-fan-1 { transform: translate(-50%) rotate(1deg); top: 28px; z-index: 1; }
.chrome-site .ch-fan-2 { transform: translate(10%) rotate(18deg); top: 60px; }
.chrome-site .ch-collection { padding-top: 4px; }
.chrome-site .ch-collection-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 16px; }
.chrome-site .ch-collection-heading h2 { font: italic 800 26px / 0.98 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.005em; color: rgb(231, 237, 242); }
.chrome-site .ch-collection-tools { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; justify-content: flex-end; }
.chrome-site .ch-collection-tools button { min-height: 36px; border-width: 0px 0px 2px; border-style: none none solid; border-color: currentcolor currentcolor transparent; border-image: none; background: transparent; color: rgb(168, 179, 189); padding: 7px 6px; font-size: 10px; font-weight: 650; }
.chrome-site .ch-collection-tools button[aria-pressed="true"] { color: rgb(255, 134, 44); border-bottom-color: rgb(255, 107, 0); }
.chrome-site .ch-collection-tools > span { font-size: 9px; color: rgb(133, 147, 160); white-space: nowrap; }
.chrome-site .ch-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 8px; }
.chrome-site .ch-card { position: relative; min-width: 0px; padding: 2px; background: linear-gradient(145deg, rgb(240, 245, 249), rgb(118, 131, 143) 15%, rgb(240, 244, 247) 36%, rgb(92, 104, 116) 55%, rgb(199, 210, 220) 77%, rgb(104, 117, 129)); border-radius: 8px; box-shadow: rgba(0, 0, 0, 0.333) 0px 7px 15px; }
.chrome-site .ch-card-body { min-width: 0px; overflow: hidden; border-radius: 6px; background: rgb(20, 26, 33); height: 100%; display: flex; flex-direction: column; }
.chrome-site .ch-card-photo { position: relative; height: 116px; overflow: hidden; background: rgb(22, 30, 39); flex: 0 0 auto; }
.chrome-site .ch-card-photo > img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
.chrome-site .ch-card-photo::after { content: ""; position: absolute; inset: 0px; pointer-events: none; background: linear-gradient(rgba(15, 21, 27, 0) 55%, rgb(20, 26, 33)); }
.chrome-site .ch-bookmark { position: absolute; right: 2px; top: 2px; z-index: 3; width: 32px; height: 38px; min-height: 38px; display: grid; place-items: center; padding: 0px; border: 0px; border-radius: 5px; background: rgba(19, 26, 34, 0.72); color: rgb(218, 227, 235); backdrop-filter: blur(6px); }
.chrome-site .ch-bookmark svg { width: 16px; height: 16px; }
.chrome-site .ch-bookmark[aria-pressed="true"] { color: rgb(255, 135, 46); background: rgba(31, 24, 15, 0.91); }
.chrome-site .ch-card-copy { padding: 4px 7px 10px; min-width: 0px; flex: 1 1 0%; }
.chrome-site .ch-card-copy > small { display: block; color: rgb(255, 134, 44); font-size: 8px; font-weight: 800; letter-spacing: 0.05em; line-height: 1.4; margin: 0px 0px 5px; }
.chrome-site .ch-card-copy h3 { font-size: 14px; line-height: 1.1; letter-spacing: -0.04em; color: rgb(238, 243, 247); font-weight: 800; overflow-wrap: anywhere; }
.chrome-site .ch-card-copy > strong { font-size: 14px; line-height: 1.15; letter-spacing: -0.035em; color: rgb(255, 255, 255); font-weight: 800; display: block; margin-top: 4px; }
.chrome-site .ch-card-copy > p { font-size: 9px; line-height: 1.5; color: rgb(163, 175, 187); margin-top: 6px; }
.chrome-site .ch-card-detail { display: flex; align-items: center; gap: 5px; width: 100%; min-height: 34px; padding: 8px 0px 0px; background: transparent; border: 0px; color: rgb(210, 220, 229); text-align: left; font-size: 9px; font-weight: 650; }
.chrome-site .ch-card-detail > span { color: rgb(255, 129, 35); font-size: 15px; }
.chrome-site .ch-card-strip { display: flex; align-items: center; justify-content: space-between; gap: 4px; padding: 7px; background: linear-gradient(rgb(229, 235, 238), rgb(161, 173, 184) 44%, rgb(200, 211, 220) 52%, rgb(146, 159, 170)); color: rgb(38, 51, 64); font-size: 8px; font-weight: 800; line-height: 1.2; letter-spacing: 0.08em; border-top: 1px solid rgb(230, 236, 239); }
.chrome-site .ch-card-strip b, .chrome-site .ch-card-strip > span:last-child { color: rgb(216, 73, 0); font-size: 13px; letter-spacing: -0.18em; font-weight: 900; }
.chrome-site .ch-sample-note { text-align: center; font-size: 10px; line-height: 1.7; color: rgb(134, 149, 163); margin: 15px auto 0px; max-width: 54ch; }
.chrome-site .ch-empty { padding: 28px 18px; border-block: 1px solid rgb(57, 67, 78); color: rgb(178, 190, 201); background: rgb(19, 26, 33); font-size: 13px; line-height: 1.7; }
.chrome-site .ch-empty h3 { font-size: 20px; color: rgb(227, 234, 240); margin-bottom: 9px; }
.chrome-site .ch-empty button { min-height: 44px; background: transparent; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgb(128, 80, 50); border-image: none; color: rgb(239, 177, 129); padding: 9px 0px; font-size: 12px; margin-top: 12px; }
.chrome-site .ch-fan-card > span { position: absolute; left: 3px; right: 3px; bottom: 3px; border-radius: 0px 0px 6px 6px; background: rgba(17, 24, 32, 0.91); color: rgb(242, 246, 249); font-size: 8px; font-weight: 800; letter-spacing: 0.08em; text-align: center; padding: 7px 2px; }
.chrome-site .ch-card-copy h3 { font-size: 16px; }
.chrome-site .ch-bottom-grid { display: grid; gap: 24px; margin-top: 32px; padding-top: 28px; border-top: 1px solid rgb(56, 66, 77); }
.chrome-site .ch-bottom-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 20px; }
.chrome-site .ch-bottom-heading h2 { font: italic 800 25px / 1 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.012em; color: rgb(223, 231, 238); }
.chrome-site .ch-bottom-heading > a { font-size: 10px; line-height: 1.5; color: rgb(192, 203, 213); white-space: nowrap; }
.chrome-site .ch-bottom-heading > a:hover { color: rgb(255, 140, 54); }
.chrome-site .ch-record { min-width: 0px; }
.chrome-site .ch-record > p, .chrome-site .ch-record > div[role="alert"] { font-size: 13px; line-height: 1.65; color: rgb(178, 190, 202); }
.chrome-site .ch-record button { min-height: 44px; border: 0px; background: transparent; color: rgb(255, 160, 92); text-decoration: underline; text-underline-offset: 4px; padding: 10px 0px; }
.chrome-site .ch-record-empty { position: relative; padding: 22px 22px 23px 56px; background: rgb(20, 27, 35); border-top: 1px solid rgb(86, 98, 112); border-bottom: 1px solid rgb(53, 65, 78); }
.chrome-site .ch-record-empty > svg { position: absolute; left: 20px; top: 24px; color: rgb(142, 158, 174); width: 19px; height: 19px; }
.chrome-site .ch-record-empty h3 { font-size: 23px; line-height: 1.12; color: rgb(227, 234, 240); font-weight: 700; letter-spacing: -0.04em; }
.chrome-site .ch-record-empty p { font-size: 12px; line-height: 1.65; color: rgb(167, 180, 193); max-width: 35ch; margin-top: 14px; }
.chrome-site .ch-result-list { border-top: 1px solid rgb(75, 87, 99); }
.chrome-site .ch-result-list > a { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 12px; align-items: center; padding: 17px 0px; border-bottom: 1px solid rgb(53, 65, 77); }
.chrome-site .ch-result-list > a > div { display: flex; flex-direction: column; gap: 5px; min-width: 0px; }
.chrome-site .ch-result-list small { color: rgb(255, 140, 54); font-size: 9px; font-weight: 700; letter-spacing: 0.04em; }
.chrome-site .ch-result-list strong { font-size: 14px; line-height: 1.4; color: rgb(237, 242, 246); }
.chrome-site .ch-result-list span { font-size: 11px; line-height: 1.5; color: rgb(156, 171, 184); }
.chrome-site .ch-result-list b { padding: 7px 9px; border: 1px solid rgb(97, 110, 123); color: rgb(210, 221, 230); background: rgb(27, 36, 45); font-size: 10px; border-radius: 3px; }
.chrome-site .ch-membership { min-width: 0px; scroll-margin-top: 90px; }
.chrome-site .ch-plan-switch { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 6px; }
.chrome-site .ch-plan-switch button { background: rgb(23, 31, 40); color: rgb(174, 189, 204); border: 1px solid rgb(71, 85, 97); border-radius: 5px; min-height: 44px; font-size: 12px; font-weight: 750; padding: 9px 5px; }
.chrome-site .ch-plan-switch button[aria-pressed="true"] { border-color: rgb(255, 135, 54); color: rgb(255, 155, 81); background: rgb(57, 36, 19); box-shadow: rgba(206, 127, 53, 0.25) 0px 1px inset; }
.chrome-site .ch-membership-price { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 22px; }
.chrome-site .ch-membership-price h3 { font-size: 21px; color: rgb(227, 235, 242); letter-spacing: -0.045em; font-weight: 750; }
.chrome-site .ch-membership-price > strong { color: rgb(245, 247, 249); font-size: 36px; letter-spacing: -0.065em; font-weight: 800; line-height: 1; text-align: right; }
.chrome-site .ch-membership-price small { font-size: 10px; font-weight: 400; letter-spacing: 0px; color: rgb(158, 175, 189); margin-left: 7px; white-space: nowrap; }
.chrome-site .ch-plan-copy { font-size: 12px; line-height: 1.6; color: rgb(165, 181, 195); min-height: 39px; margin: 13px 0px 20px; }
.chrome-site .ch-join { display: flex; align-items: center; justify-content: space-between; gap: 15px; width: 100%; min-height: 49px; background: linear-gradient(rgb(255, 146, 52), rgb(255, 107, 0) 65%, rgb(223, 81, 0)); border-width: 1px; border-style: solid; border-color: rgb(255, 171, 105) rgb(255, 171, 105) rgb(161, 60, 0); border-image: none; border-radius: 5px; color: rgb(28, 14, 3); font-size: 12px; font-weight: 850; padding: 13px 16px; box-shadow: rgba(255, 194, 139, 0.533) 0px 1px inset, rgb(112, 49, 9) 0px 2px; }
.chrome-site .ch-join > span { font-size: 21px; }
.chrome-site .ch-plan-note { display: block; font-size: 10px; line-height: 1.65; color: rgb(141, 158, 174); margin-top: 12px; }
.chrome-site .ch-join:active { transform: translateY(1px); }
.chrome-site .ch-dialog { position: fixed; padding: 0px; border: 1px solid rgb(127, 141, 154); border-radius: 12px; margin: auto; background: rgb(16, 22, 29); color: rgb(231, 237, 243); width: calc(100% - 24px); max-width: 950px; max-height: 90dvh; overflow: auto; box-shadow: rgba(0, 0, 0, 0.8) 0px 24px 110px, rgba(211, 221, 230, 0.2) 0px 1px inset; }
.chrome-site .ch-dialog::backdrop { background: rgba(5, 8, 11, 0.808); backdrop-filter: blur(9px); }
.chrome-site .ch-modal-close { position: absolute; right: 10px; top: 10px; z-index: 20; width: 44px; height: 44px; min-height: 44px; display: grid; place-items: center; border: 1px solid rgb(106, 120, 134); border-radius: 7px; background: rgba(18, 26, 36, 0.91); color: rgb(233, 240, 246); font-size: 29px; line-height: 1; padding: 0px; }
.chrome-site .ch-pack-modal-inner { padding: 30px 14px 23px; }
.chrome-site .ch-modal-heading { padding-right: 34px; }
.chrome-site .ch-modal-heading > small { display: block; font-size: 9px; color: rgb(166, 181, 195); letter-spacing: 0.09em; font-weight: 650; margin-bottom: 12px; }
.chrome-site .ch-modal-heading h2 { font: italic 800 34px / 0.95 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.025em; color: rgb(243, 247, 250); }
.chrome-site .ch-modal-heading > p { font-size: 12px; line-height: 1.6; color: rgb(164, 180, 195); max-width: 44ch; margin-top: 12px; }
.chrome-site .ch-reveal { height: 350px; position: relative; margin-top: 12px; overflow: hidden; isolation: isolate; background: radial-gradient(at 50% 82%, rgba(140, 64, 11, 0.21), rgba(16, 22, 29, 0) 66%); }
.chrome-site .ch-reveal::after { content: ""; position: absolute; left: 9%; right: 9%; height: 30px; bottom: 16px; border: 2px solid rgb(255, 120, 21); border-radius: 50%; box-shadow: rgba(237, 100, 0, 0.52) 0px 0px 12px; z-index: -1; }
.chrome-site .ch-sealed-pack { position: absolute; top: 10px; left: 50%; width: 195px; height: 295px; transform: translate(-50%); z-index: 5; filter: drop-shadow(rgba(0, 0, 0, 0.733) 0px 15px 18px); pointer-events: none; }
.chrome-site .ch-sealed-pack img { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: contain; transform-origin: 50% 25%; }
.chrome-site .ch-tear-top { clip-path: inset(0px 0px 77%); }
.chrome-site .ch-tear-bottom { clip-path: inset(22.6% 0px 0px); }
.chrome-site .ch-reveal-cards { position: absolute; left: 0px; right: 0px; top: 45px; display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 7px; perspective: 1100px; }
.chrome-site .ch-reveal-cards .ch-card { transform-origin: 50% 90%; backface-visibility: hidden; will-change: transform, opacity; }
.chrome-site .ch-reveal-cards .ch-card-photo { height: 113px; }
.chrome-site .ch-reveal-cards .ch-card-copy { padding-inline: 6px; }
.chrome-site .ch-reveal-cards .ch-card-copy h3 { font-size: 15px; }
.chrome-site .ch-reveal-cards .ch-card-copy > small { font-size: 8px; }
.chrome-site .ch-reveal.stage-opening .ch-tear-top { animation: 0.95s cubic-bezier(0.22, 0.7, 0.26, 1) 0s 1 normal both running ch-foil-top; }
.chrome-site .ch-reveal.stage-opening .ch-tear-bottom { animation: 1.1s cubic-bezier(0.22, 0.7, 0.26, 1) 0.3s 1 normal both running ch-foil-bottom; }
.chrome-site .ch-reveal.stage-opening .ch-card { animation: 0.9s cubic-bezier(0.16, 0.8, 0.25, 1) 1s 1 normal both running ch-card-flip; pointer-events: none; }
.chrome-site .ch-reveal.stage-opening .ch-card:nth-child(1) { animation-name: ch-card-flip-left; animation-delay: 0.85s; }
.chrome-site .ch-reveal.stage-opening .ch-card:nth-child(3) { animation-name: ch-card-flip-right; animation-delay: 1.25s; }
.chrome-site .ch-reveal.stage-revealed .ch-card { transform: none; opacity: 1; }
.chrome-site .ch-reveal-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 15px; padding-top: 4px; }
.chrome-site .ch-reveal-actions p { flex-basis: 100%; font-size: 11px; line-height: 1.6; color: rgb(168, 184, 198); margin-bottom: 7px; }
.chrome-site .ch-reveal-actions button { min-height: 44px; padding: 10px 13px; border: 1px solid rgb(105, 121, 134); border-radius: 5px; background: rgb(32, 44, 55); color: rgb(226, 235, 243); font-size: 12px; font-weight: 650; }
.chrome-site .ch-reveal-actions a { min-height: 44px; display: flex; align-items: center; font-size: 11px; color: rgb(255, 173, 113); }
.chrome-site .ch-film { border-top: 1px solid rgb(61, 75, 87); margin-top: 20px; padding-top: 4px; }
.chrome-site .ch-film summary { min-height: 44px; font-size: 11px; color: rgb(170, 187, 201); padding: 14px 0px; cursor: pointer; }
.chrome-site .ch-film video { display: block; width: 100%; max-height: 50dvh; aspect-ratio: 9 / 16; object-fit: contain; background: rgb(7, 11, 16); border-radius: 5px; margin-top: 8px; }
@keyframes ch-foil-top { 
  0%, 15% { transform: translate(0px) rotate(0deg); opacity: 1; }
  60% { transform: translate(14px, -30px) rotate(-13deg); opacity: 1; }
  100% { transform: translate(35px, -105px) rotate(-21deg); opacity: 0; }
}
@keyframes ch-foil-bottom { 
  0%, 12% { transform: translate(0px) rotate(0deg); opacity: 1; }
  65% { transform: translate(-12px, 80px) rotate(6deg); opacity: 0.85; }
  100% { transform: translate(-25px, 170px) rotate(12deg); opacity: 0; }
}
@keyframes ch-card-flip { 
  0% { transform: translateY(65px) scale(0.72) rotateY(85deg); opacity: 0; }
  30% { opacity: 1; }
  100% { transform: none; opacity: 1; }
}
@keyframes ch-card-flip-left { 
  0% { transform: translate(75%, 65px) scale(0.72) rotate(-17deg) rotateY(85deg); opacity: 0; }
  30% { opacity: 1; }
  100% { transform: none; opacity: 1; }
}
@keyframes ch-card-flip-right { 
  0% { transform: translate(-75%, 65px) scale(0.72) rotate(17deg) rotateY(-85deg); opacity: 0; }
  30% { opacity: 1; }
  100% { transform: none; opacity: 1; }
}
.chrome-site .ch-detail-inner { display: grid; grid-template-columns: minmax(0px, 1fr); }
.chrome-site .ch-detail-photo { position: relative; min-width: 0px; height: 255px; overflow: hidden; background: rgb(11, 16, 23); }
.chrome-site .ch-detail-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 16%; }
.chrome-site .ch-detail-photo::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(rgba(13, 21, 27, 0) 50%, rgb(16, 22, 29)); }
.chrome-site .ch-detail-photo > span { position: absolute; bottom: 19px; left: 20px; color: rgb(255, 151, 72); font-size: 10px; letter-spacing: 0.07em; font-weight: 700; z-index: 1; }
.chrome-site .ch-detail-copy { padding: 23px 20px 27px; min-width: 0px; }
.chrome-site .ch-detail-copy > small { color: rgb(164, 184, 201); font-size: 10px; font-weight: 650; letter-spacing: 0.07em; }
.chrome-site .ch-detail-copy h2 { font: italic 800 39px / 0.98 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.025em; color: rgb(240, 245, 250); margin: 11px 0px 22px; }
.chrome-site .ch-detail-line { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 20px; margin: 0px 0px 23px; padding: 18px 0px; border-block: 1px solid rgb(73, 91, 105); }
.chrome-site .ch-detail-line dt { font-size: 10px; color: rgb(152, 170, 185); line-height: 1.5; }
.chrome-site .ch-detail-line dd { font-size: 17px; font-weight: 700; color: rgb(217, 229, 238); margin: 7px 0px 0px; line-height: 1.25; }
.chrome-site .ch-detail-copy h3 { font-size: 14px; color: rgb(225, 235, 243); font-weight: 750; margin: 20px 0px 8px; letter-spacing: -0.025em; }
.chrome-site .ch-detail-copy > p { font-size: 12px; line-height: 1.75; color: rgb(172, 188, 200); }
.chrome-site .ch-detail-copy .ch-detail-note { font-size: 10px; color: rgb(133, 154, 171); margin-top: 19px; line-height: 1.7; }
.chrome-site .ch-detail-save { display: flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid rgb(141, 103, 73); border-radius: 5px; width: 100%; min-height: 48px; padding: 12px; color: rgb(255, 208, 173); background: rgb(52, 38, 23); font-size: 12px; font-weight: 700; margin-top: 21px; }
.chrome-site .ch-detail-save[aria-pressed="true"] { color: rgb(28, 16, 6); border-color: rgb(255, 174, 111); background: rgb(255, 134, 48); }
.chrome-site .ch-detail-save svg { width: 18px; height: 18px; }
.chrome-site .ch-detail-link { display: flex; align-items: center; justify-content: center; min-height: 44px; margin-top: 7px; font-size: 12px; color: rgb(180, 197, 211); }
.chrome-site .account-page h1, .chrome-site .page-intro h1 { font-family: "Barlow Condensed", Impact, sans-serif; font-style: italic; letter-spacing: -0.02em; font-weight: 800; }
.chrome-site .account-page h1 span { color: rgb(255, 119, 32); }
.chrome-site .account-panel { background: rgb(23, 30, 38); border-color: rgb(76, 88, 101); border-radius: 9px; }
.chrome-site .account-membership { background: linear-gradient(145deg, rgb(36, 46, 55), rgb(21, 29, 37)); border-color: rgb(104, 116, 127); }
.chrome-site .profile-avatar { background: linear-gradient(145deg, rgb(240, 245, 248), rgb(139, 155, 168) 48%, rgb(199, 212, 222)); color: rgb(21, 33, 44); border-radius: 12px; }
.chrome-site .account-panel small, .chrome-site .profile-welcome p { color: rgb(164, 179, 191); }
.chrome-site .sports-preferences button { background: rgb(32, 43, 53); border-color: rgb(80, 96, 109); border-radius: 5px; }
.chrome-site .sports-preferences button[aria-pressed="true"] { color: rgb(255, 158, 87); border-color: rgb(250, 131, 44); background: rgb(51, 39, 25); }
.chrome-site .account-button { background: linear-gradient(rgb(255, 146, 57), rgb(251, 103, 0)); border-width: 1px; border-style: solid; border-color: rgb(255, 167, 95) rgb(255, 167, 95) rgb(170, 69, 0); border-image: none; color: rgb(32, 19, 7); border-radius: 5px; }
.chrome-site .results-summary { background: rgb(23, 31, 40); border-color: rgb(74, 87, 100); border-radius: 8px; }
.chrome-site .pick-card { background: linear-gradient(145deg, rgb(34, 44, 53), rgb(20, 28, 36)); border-color: rgb(101, 115, 128); border-radius: 8px; box-shadow: none; }
.chrome-site .price-grid { border-color: rgb(69, 83, 97); }
.chrome-site .filter-row button { background: rgb(27, 37, 48); border-color: rgb(83, 96, 109); color: rgb(181, 195, 206); }
.chrome-site .filter-row button[aria-pressed="true"] { background: rgb(255, 121, 32); border-color: rgb(255, 156, 85); color: rgb(32, 18, 8); }
.chrome-site .access-dialog { background: rgb(20, 29, 38); border-color: rgb(135, 150, 163); color: rgb(238, 243, 247); border-radius: 10px; }
.chrome-site .dialog-body h2 { font: italic 800 46px / 0.93 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.025em; color: rgb(237, 243, 248); }
.chrome-site .dialog-body .ch-wordmark { font-size: 33px; margin: 6px 0px 13px; }
.chrome-site .dialog-close { color: rgb(206, 218, 228); }
.chrome-site .access-dialog input:not([type="checkbox"]), .chrome-site .access-dialog select { background: rgb(231, 237, 241); color: rgb(27, 41, 53); border-color: rgb(153, 170, 185); border-radius: 5px; }
.chrome-site .access-dialog .consent { color: rgb(185, 200, 212); }
.chrome-site .access-dialog .consent a { color: rgb(225, 235, 242); }
.chrome-site .access-dialog .submit-access { background: linear-gradient(rgb(255, 154, 64), rgb(255, 107, 0)); color: rgb(33, 19, 6); border: 1px solid rgb(255, 165, 95); border-radius: 5px; }
.chrome-site .site-footer { background: rgb(11, 16, 22); border-top: 1px solid rgb(53, 65, 77); color: rgb(142, 158, 172); }
.chrome-site .site-footer .footer-word { color: rgb(225, 234, 242); }
.chrome-site .site-footer .footer-word span { color: rgb(255, 124, 32); }
.chrome-site .signup-page input:not([type="checkbox"]), .chrome-site .signup-page select { background: rgb(231, 237, 241); color: rgb(27, 41, 53); border-color: rgb(153, 170, 185); }
@media (max-width: 359px) {
  .chrome-site .site-header { padding-inline: 17px; }
  .chrome-site .ch-dashboard { padding-inline: 12px; }
  .ch-wordmark { font-size: 31px; }
  .chrome-site .ch-sports { gap: 22px; min-height: 52px; }
  .chrome-site .ch-sports button { min-height: 49px; font-size: 12px; }
  .chrome-site .ch-heading h1 { font-size: 29px; }
  .chrome-site .ch-heading > span { max-width: 55px; font-size: 7px; }
  .chrome-site .ch-heading { padding-top: 20px; }
  .chrome-site .ch-hero-visual { height: 309px; }
  .chrome-site .ch-pack-image { width: 158px; height: 254px; top: 20px; }
  .chrome-site .ch-fan-card { width: 113px; height: 177px; top: 59px; }
  .chrome-site .ch-fan-1 { top: 25px; }
  .chrome-site .ch-ring { bottom: 12px; }
  .chrome-site .ch-collection-heading h2 { font-size: 23px; }
  .chrome-site .ch-collection-tools { gap: 1px; }
  .chrome-site .ch-collection-tools button { font-size: 9px; padding-inline: 4px; }
  .chrome-site .ch-card-grid { gap: 6px; }
  .chrome-site .ch-card-photo { height: 110px; }
  .chrome-site .ch-card-copy { padding-inline: 6px; }
  .chrome-site .ch-card-copy h3 { font-size: 15px; }
  .chrome-site .ch-card-copy > small { font-size: 7px; }
  .chrome-site .ch-card-detail { font-size: 8px; gap: 3px; }
  .chrome-site .ch-card-strip { font-size: 7px; padding-inline: 6px; }
  .chrome-site .ch-modal-heading h2 { font-size: 31px; }
  .chrome-site .ch-pack-modal-inner { padding-inline: 11px; }
  .chrome-site .ch-reveal-cards { gap: 5px; }
  .chrome-site .ch-reveal-cards .ch-card-copy h3 { font-size: 14px; }
  .chrome-site .ch-reveal-cards .ch-card-photo { height: 111px; }
  .chrome-site .ch-reveal-cards .ch-card-copy > small { font-size: 7px; }
  .chrome-site .ch-reveal-actions { gap: 3px 9px; }
  .chrome-site .ch-reveal-actions a { font-size: 10px; }
}
@media (pointer: coarse) {
  .chrome-site .ch-bookmark { width: 44px; height: 44px; min-height: 44px; right: 0px; top: 0px; }
  .chrome-site .ch-card-detail, .chrome-site .ch-collection-tools button { min-height: 44px; }
}
@media (min-width: 620px) {
  .chrome-site .ch-dashboard { padding-inline: 26px; padding-bottom: 55px; }
  .chrome-site .ch-heading { padding-top: 30px; }
  .chrome-site .ch-heading h1 { font-size: 45px; }
  .chrome-site .ch-heading > span { font-size: 9px; max-width: none; }
  .chrome-site .ch-sports { justify-content: flex-start; gap: 35px; min-height: 64px; }
  .chrome-site .ch-sports button { min-height: 61px; font-size: 14px; }
  .chrome-site .ch-hero-visual { height: 405px; }
  .chrome-site .ch-pack-image { width: 212px; height: 335px; top: 24px; }
  .chrome-site .ch-fan-card { width: 163px; height: 239px; top: 75px; }
  .chrome-site .ch-fan-1 { top: 32px; }
  .chrome-site .ch-ring { width: 68%; left: 16%; height: 37px; bottom: 18px; }
  .chrome-site .ch-hero-copy { max-width: 460px; width: 100%; margin: auto; }
  .chrome-site .ch-hero-copy > p { font-size: 15px; }
  .chrome-site .ch-hero-link { font-size: 12px; }
  .chrome-site .ch-collection-heading { margin-bottom: 21px; }
  .chrome-site .ch-collection-heading h2 { font-size: 32px; }
  .chrome-site .ch-collection-tools { gap: 10px; }
  .chrome-site .ch-collection-tools button { font-size: 12px; padding-inline: 9px; }
  .chrome-site .ch-card-grid { gap: 17px; }
  .chrome-site .ch-card { padding: 3px; border-radius: 11px; }
  .chrome-site .ch-card-body { border-radius: 8px; }
  .chrome-site .ch-card-photo { height: 174px; }
  .chrome-site .ch-card-copy { padding: 8px 14px 13px; }
  .chrome-site .ch-card-copy > small { font-size: 9px; margin-bottom: 7px; }
  .chrome-site .ch-card-copy h3 { font-size: 21px; }
  .chrome-site .ch-card-copy > p { font-size: 11px; margin-top: 7px; }
  .chrome-site .ch-card-detail { font-size: 11px; min-height: 39px; gap: 10px; }
  .chrome-site .ch-bookmark { width: 38px; height: 40px; min-height: 40px; right: 7px; top: 7px; }
  .chrome-site .ch-card-strip { font-size: 9px; padding: 9px 14px; }
  .chrome-site .ch-card-strip b { font-size: 17px; }
  .chrome-site .ch-sample-note { font-size: 11px; margin-top: 20px; }
  .chrome-site .ch-bottom-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 30px; margin-top: 43px; padding-top: 32px; }
  .chrome-site .ch-bottom-heading h2 { font-size: 27px; }
  .chrome-site .ch-bottom-heading { align-items: flex-start; }
  .chrome-site .ch-bottom-heading > a { font-size: 10px; }
  .chrome-site .ch-record-empty { padding-left: 47px; padding-right: 18px; }
  .chrome-site .ch-record-empty > svg { left: 17px; }
  .chrome-site .ch-membership-price > strong { font-size: 39px; }
  .chrome-site .ch-membership-price small { display: block; margin: 5px 0px 0px; }
  .chrome-site .ch-plan-copy { min-height: 58px; }
  .chrome-site .ch-pack-modal-inner { padding: 34px 27px 25px; }
  .chrome-site .ch-modal-heading h2 { font-size: 44px; }
  .chrome-site .ch-modal-heading > small { font-size: 10px; }
  .chrome-site .ch-modal-heading > p { font-size: 14px; }
  .chrome-site .ch-reveal { height: 410px; margin-top: 15px; }
  .chrome-site .ch-sealed-pack { width: 236px; height: 355px; top: 12px; }
  .chrome-site .ch-reveal-cards { top: 34px; gap: 15px; }
  .chrome-site .ch-reveal-cards .ch-card-photo { height: 180px; }
  .chrome-site .ch-reveal-cards .ch-card-copy { padding-inline: 12px; }
  .chrome-site .ch-reveal-cards .ch-card-copy h3 { font-size: 22px; }
  .chrome-site .ch-reveal-cards .ch-card-copy > small { font-size: 9px; }
  .chrome-site .ch-reveal-cards .ch-card-detail { font-size: 11px; }
  .chrome-site .ch-reveal-actions p { flex-basis: auto; margin: 0px auto 0px 0px; }
  .chrome-site .ch-reveal-actions a { font-size: 12px; }
  .chrome-site .ch-film summary { font-size: 12px; }
  .chrome-site .ch-detail-inner { grid-template-columns: 40% minmax(0px, 1fr); }
  .chrome-site .ch-detail-photo { height: auto; min-height: 570px; }
  .chrome-site .ch-detail-photo img { height: 100%; object-position: 50% 18%; }
  .chrome-site .ch-detail-copy { padding: 45px 29px 32px; }
  .chrome-site .ch-detail-copy h2 { font-size: 48px; }
  .chrome-site .ch-detail-copy > p { font-size: 13px; }
  .chrome-site .ch-detail-copy > small { font-size: 10px; }
  .chrome-site .ch-detail-copy h3 { font-size: 15px; }
  .chrome-site .ch-detail-line dd { font-size: 19px; }
  .chrome-site .ch-detail-save { font-size: 13px; }
  .chrome-site .ch-detail-note { font-size: 11px !important; }
}
@media (min-width: 960px) {
  .chrome-site .site-header { height: 76px; padding: 12px max(27px, -693px + 50vw); position: sticky; top: 0px; }
  .chrome-site .ch-wordmark { font-size: 39px; }
  .chrome-site .desktop-nav { gap: 23px; font-size: 12px; margin-right: 20px; }
  .chrome-site .header-access { font-size: 12px; padding: 12px 18px; min-height: 44px; }
  .chrome-site .ch-shell { grid-template-columns: 192px minmax(0px, 1fr); }
  .chrome-site .ch-sidebar { display: flex; flex-direction: column; justify-content: space-between; gap: 50px; position: sticky; top: 76px; align-self: start; min-height: 550px; height: calc(100dvh - 76px); max-height: 960px; padding: 27px 14px 25px 17px; border-right: 1px solid rgb(48, 58, 68); background: rgb(16, 22, 29); }
  .chrome-site .ch-sidebar > nav { display: grid; gap: 7px; }
  .chrome-site .ch-rail-item { display: flex; align-items: center; gap: 11px; min-height: 48px; padding: 12px; border: 1px solid transparent; border-radius: 6px; color: rgb(150, 165, 180); font-size: 13px; text-align: left; background: transparent; width: 100%; font-weight: 550; }
  .chrome-site .ch-rail-item svg { width: 19px; height: 19px; flex: 0 0 auto; }
  .chrome-site .ch-rail-item.is-active { color: rgb(255, 151, 73); background: linear-gradient(90deg, rgb(85, 48, 25), rgb(52, 36, 25)); border-color: rgb(135, 80, 43); box-shadow: rgb(255, 121, 32) 3px 0px inset; }
  .chrome-site .ch-rail-item:hover { color: rgb(219, 229, 238); background: rgb(28, 39, 49); }
  .chrome-site .ch-rail-item.is-active:hover { color: rgb(255, 151, 73); background: rgb(59, 40, 27); }
  .chrome-site .ch-saved-rail { margin-top: 19px; border-top: 1px solid rgb(53, 65, 76); border-radius: 0px; padding-top: 22px; font-size: 11px; gap: 8px; align-items: center; }
  .chrome-site .ch-saved-rail small { margin-left: auto; color: rgb(211, 223, 233); font-size: 10px; font-weight: 700; }
  .chrome-site .ch-rail-promo { padding: 22px 10px 0px; border-top: 1px solid rgb(62, 74, 84); }
  .chrome-site .ch-rail-promo > span { font-size: 8px; font-weight: 700; color: rgb(176, 144, 121); letter-spacing: 0.13em; }
  .chrome-site .ch-rail-promo h2 { font: italic 750 30px / 0.98 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.01em; margin: 12px 0px; color: rgb(220, 231, 240); }
  .chrome-site .ch-rail-promo > p { font-size: 11px; line-height: 1.65; color: rgb(128, 148, 165); }
  .chrome-site .ch-rail-promo > a { display: flex; align-items: center; justify-content: space-between; min-height: 46px; border-bottom: 1px solid rgb(90, 70, 55); font-size: 11px; font-weight: 650; color: rgb(255, 155, 84); margin-top: 12px; }
  .chrome-site .ch-rail-promo svg { width: 16px; height: 16px; }
  .chrome-site .ch-dashboard { padding: 0px 29px 55px; }
  .chrome-site .ch-sports { gap: 39px; min-height: 60px; }
  .chrome-site .ch-sports button { min-height: 57px; }
  .chrome-site .ch-heading { padding: 26px 0px 0px; }
  .chrome-site .ch-heading h1 { font-size: 44px; }
  .chrome-site .ch-hero { grid-template-columns: minmax(0px, 40%) minmax(0px, 60%); align-items: center; height: 400px; padding-bottom: 22px; }
  .chrome-site .ch-hero-copy { order: 1; width: 100%; margin: 0px; padding: 9px 0px 0px; max-width: 365px; }
  .chrome-site .ch-hero-copy h2 { display: block; font-size: clamp(64px, 6.6vw, 87px); line-height: 0.9; }
  .chrome-site .ch-hero-copy > p { text-align: left; font-size: 14px; max-width: 25ch; margin: 0px 0px 23px; }
  .chrome-site .ch-open { font-size: 12px; min-height: 53px; padding-inline: 16px; }
  .chrome-site .ch-hero-link { justify-content: flex-start; font-size: 11px; margin-top: 9px; }
  .chrome-site .ch-hero-visual { order: 2; height: 385px; margin-top: 0px; }
  .chrome-site .ch-pack-image { top: 25px; width: 205px; height: 321px; }
  .chrome-site .ch-fan-card { width: 147px; height: 222px; top: 74px; }
  .chrome-site .ch-fan-1 { top: 37px; }
  .chrome-site .ch-fan-0 { transform: translate(-119%) rotate(-18deg); }
  .chrome-site .ch-fan-2 { transform: translate(19%) rotate(18deg); }
  .chrome-site .ch-ring { left: 7%; width: 86%; bottom: 13px; height: 36px; }
  .chrome-site .ch-collection-heading { margin-bottom: 21px; }
  .chrome-site .ch-collection-heading h2 { font-size: 31px; }
  .chrome-site .ch-card-grid { gap: 18px; }
  .chrome-site .ch-card-photo { height: 184px; }
  .chrome-site .ch-card-copy h3 { font-size: 23px; }
  .chrome-site .ch-card-copy > small { font-size: 10px; }
  .chrome-site .ch-card-copy > p { font-size: 12px; }
  .chrome-site .ch-card-detail { font-size: 12px; min-height: 39px; }
  .chrome-site .ch-card-strip { font-size: 10px; padding-block: 10px; }
  .chrome-site .ch-card-copy { padding: 9px 16px 12px; }
  .chrome-site .ch-bottom-grid { gap: 37px; margin-top: 46px; padding-top: 35px; }
  .chrome-site .ch-bottom-heading h2 { font-size: 28px; }
  .chrome-site .ch-bottom-heading > a { font-size: 11px; }
  .chrome-site .ch-record-empty { min-height: 224px; padding: 28px 25px 26px 58px; }
  .chrome-site .ch-record-empty > svg { left: 22px; top: 29px; }
  .chrome-site .ch-record-empty h3 { font-size: 28px; }
  .chrome-site .ch-record-empty p { font-size: 13px; max-width: 38ch; }
  .chrome-site .ch-membership-price small { display: inline; margin-left: 7px; }
  .chrome-site .ch-plan-copy { min-height: 40px; font-size: 13px; }
  .chrome-site .ch-plan-switch button, .chrome-site .ch-join { font-size: 13px; }
  .chrome-site .ch-plan-note { font-size: 11px; }
  .chrome-site .site-footer { padding: 35px max(30px, -610px + 50vw); font-size: 12px; }
  .chrome-site .ch-pack-modal-inner { padding: 37px 31px 28px; }
  .chrome-site .ch-modal-heading h2 { font-size: 49px; }
  .chrome-site .ch-reveal-cards .ch-card-photo { height: 196px; }
  .chrome-site .ch-reveal-cards .ch-card-copy h3 { font-size: 24px; }
}
@media (min-width: 1280px) {
  .chrome-site .ch-dashboard { padding-inline: 38px; }
  .chrome-site .ch-heading h1 { font-size: 49px; }
  .chrome-site .ch-hero { height: 420px; grid-template-columns: minmax(0px, 40%) minmax(0px, 60%); }
  .chrome-site .ch-hero-copy h2 { font-size: 92px; }
  .chrome-site .ch-hero-copy > p { font-size: 16px; max-width: 25ch; }
  .chrome-site .ch-hero-copy { max-width: 390px; }
  .chrome-site .ch-open { font-size: 14px; min-height: 56px; padding-inline: 21px; }
  .chrome-site .ch-hero-visual { height: 405px; }
  .chrome-site .ch-pack-image { width: 225px; height: 349px; top: 18px; }
  .chrome-site .ch-fan-card { width: 164px; height: 245px; top: 74px; }
  .chrome-site .ch-fan-1 { top: 28px; }
  .chrome-site .ch-fan-0 { transform: translate(-124%) rotate(-19deg); }
  .chrome-site .ch-fan-2 { transform: translate(24%) rotate(19deg); }
  .chrome-site .ch-card-photo { height: 211px; }
  .chrome-site .ch-card-copy h3 { font-size: 26px; }
  .chrome-site .ch-collection-heading h2 { font-size: 34px; }
  .chrome-site .ch-bottom-heading h2 { font-size: 32px; }
  .chrome-site .ch-bottom-grid { gap: 50px; }
  .chrome-site .ch-hero-link { font-size: 12px; }
  .chrome-site .ch-ring { bottom: 12px; height: 38px; left: 11%; width: 78%; }
}
@media (prefers-reduced-motion: reduce) {
  .chrome-site .ch-reveal * { will-change: auto; animation: auto ease 0s 1 normal none running none !important; transition: none !important; }
  .chrome-site .ch-sealed-pack { display: none; }
  .chrome-site .ch-reveal-cards .ch-card { transform: none !important; opacity: 1 !important; }
  .chrome-site .ch-open:active, .chrome-site .ch-join:active { transform: none; }
}
@media (max-width: 959px) {
  .chrome-site .header-access { display: none; }
  .chrome-site .site-menu-toggle { margin-left: auto; }
}
.chrome-site .ch-sports { justify-content: flex-start; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: rgb(129, 80, 52) transparent; gap: 22px; max-width: 100%; min-width: 0px; }
.chrome-site .ch-sports button { flex: 0 0 auto; white-space: nowrap; }
.chrome-site .ch-card-copy h3 { min-height: 2.2em; overflow-wrap: normal; }
.chrome-site .ch-card-grid { row-gap: 20px; }
.chrome-site .ch-photo-credits { margin-top: 10px; color: rgb(150, 167, 181); font-size: 11px; line-height: 1.65; }
.chrome-site .ch-photo-credits summary { cursor: pointer; min-height: 38px; display: list-item; padding: 10px 0px; width: fit-content; }
.chrome-site .ch-photo-credits ul { list-style: none; padding: 10px 14px; margin: 0px; border: 1px solid rgb(51, 64, 75); border-radius: 5px; background: rgb(17, 25, 35); }
.chrome-site .ch-photo-credits li + li { margin-top: 7px; }
.chrome-site .ch-photo-credits a { color: rgb(195, 208, 220); text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 1280px) {
  .chrome-site .ch-sports { gap: 25px; }
}
@media (min-width: 960px) {
  .chrome-site .sb-member-playbook .ch-hero { height: auto; min-height: 420px; }
  .chrome-site .sb-member-playbook .ch-hero-copy { padding-bottom: 12px; }
}
.spx-landing { background: rgb(2, 2, 2); color: rgb(250, 250, 250); font-family: Inter, Arial, sans-serif; min-height: 100vh; overflow-x: clip; }
.spx-landing a { color: inherit; text-decoration: none; }
.spx-landing a:focus-visible { outline: rgb(255, 255, 255) solid 3px; outline-offset: 6px; }
.lp-scene { position: relative; isolation: isolate; min-height: max(760px, 100svh); background: rgb(2, 2, 2); overflow: hidden; }
.lp-art { position: absolute; z-index: -2; inset: 0px; width: 100%; height: 100%; object-fit: cover; object-position: center center; user-select: none; pointer-events: none; }
.lp-scene::after { content: ""; position: absolute; z-index: -1; inset: 0px; background: linear-gradient(90deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.2) 33%, transparent 65%); pointer-events: none; }
.lp-header { position: absolute; inset: 0px 0px auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 28px clamp(24px, 3.2vw, 64px); z-index: 2; }
.lp-logo { font: 900 38px / 0.95 Inter, Arial, sans-serif; letter-spacing: -1.8px; white-space: nowrap; }
.lp-logo span { color: rgb(255, 107, 0); }
.lp-login { font: 500 13px / 1.4 "JetBrains Mono", monospace; min-height: 44px; display: flex; align-items: center; gap: 14px; white-space: nowrap; }
.lp-login > span { font-size: 19px; color: rgb(255, 120, 24); }
.lp-hero { padding: clamp(168px, 23.6vh, 246px) clamp(24px, 3.2vw, 64px) 145px; position: relative; z-index: 1; }
.lp-hero h1 { font: 900 clamp(48px, 4.75vw, 82px) / 1.01 Inter, Arial, sans-serif; letter-spacing: -0.04em; text-transform: uppercase; margin: 0px; max-width: 850px; }
.lp-hero h1 span, .lp-hero h1 strong { display: block; font-weight: 900; }
.lp-hero h1 strong { color: rgb(255, 107, 0); }
.lp-actions { display: flex; align-items: stretch; gap: 30px; margin-top: 46px; font: 700 14px / 1.3 "JetBrains Mono", monospace; letter-spacing: 0.07em; }
.lp-signup { min-width: 264px; min-height: 57px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 17px 30px; background: rgb(255, 115, 0); border: 1px solid rgb(255, 142, 36); box-shadow: rgba(255, 107, 0, 0.11) 0px 0px 22px; color: rgb(8, 8, 8) !important; }
.lp-signup:hover { background: rgb(255, 140, 36); box-shadow: rgba(255, 107, 0, 0.2) 0px 0px 30px; }
.lp-signup span { font-size: 25px; font-weight: 400; line-height: 0.8; }
.lp-explore { min-width: 190px; min-height: 57px; display: flex; align-items: center; justify-content: center; padding: 17px 27px; border: 1px solid rgb(237, 237, 237); background: rgba(0, 0, 0, 0.533); }
.lp-explore:hover { color: rgb(255, 140, 36); border-color: rgb(255, 140, 36); }
.lp-scroll { position: absolute; bottom: 25px; left: clamp(24px, 3.2vw, 64px); display: flex; align-items: center; gap: 21px; font: 500 9px / 1.4 "JetBrains Mono", monospace; letter-spacing: 0.16em; padding: 12px 0px; color: rgb(162, 162, 162) !important; }
.lp-scroll b { font-size: 20px; font-weight: 400; color: rgb(255, 117, 10); }
.lp-tiers { padding: 96px clamp(24px, 5vw, 88px) 80px; max-width: 1600px; margin: 0px auto; scroll-margin-top: 28px; border-top: 1px solid rgb(36, 36, 36); }
.lp-tiers-intro { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-bottom: 42px; }
.lp-eyebrow { font: 500 10px / 1.5 "JetBrains Mono", monospace; letter-spacing: 0.12em; color: rgb(255, 137, 48); }
.lp-tiers h2 { font: 850 clamp(30px, 3vw, 46px) / 1.08 Inter, Arial, sans-serif; letter-spacing: -0.05em; margin: 15px 0px 0px; }
.lp-tiers-intro > p { color: rgb(159, 163, 167); font-size: 14px; line-height: 1.7; max-width: 285px; margin: 0px 0px 3px; }
.lp-tier-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 22px; }
.lp-tier { border: 1px solid rgb(56, 56, 56); background: linear-gradient(145deg, rgb(19, 19, 19), rgb(8, 8, 8)); padding: 31px 27px 26px; display: flex; flex-direction: column; min-width: 0px; }
.lp-tier-pro { border-color: rgb(210, 92, 9); background: linear-gradient(145deg, rgb(41, 25, 14), rgb(13, 11, 9) 75%); }
.lp-tier-name { font: 500 11px / 1.4 "JetBrains Mono", monospace; text-transform: uppercase; letter-spacing: 0.08em; color: rgb(210, 210, 210); }
.lp-tier h3 { font: 700 23px / 1.2 Inter, Arial, sans-serif; letter-spacing: -0.04em; margin: 15px 0px 23px; }
.lp-price { display: flex; align-items: baseline; gap: 7px; margin: 0px 0px 22px; }
.lp-price strong { font: 800 55px / 1 Inter, Arial, sans-serif; letter-spacing: -0.055em; }
.lp-price > span { font-size: 12px; color: rgb(155, 155, 155); }
.lp-tier ul { list-style: none; padding: 0px; margin: 0px 0px 28px; display: grid; gap: 14px; font-size: 12px; line-height: 1.6; color: rgb(195, 195, 195); }
.lp-tier li { display: flex; gap: 11px; }
.lp-tier li > span { color: rgb(255, 126, 34); }
.lp-tier > a { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding: 16px 17px; border: 1px solid rgb(90, 90, 90); font-size: 12px; font-weight: 700; min-height: 50px; }
.lp-tier > a:hover { border-color: rgb(255, 116, 18); color: rgb(255, 146, 47); }
.lp-tier-pro > a { background: rgb(255, 117, 11); border-color: rgb(255, 136, 30); color: rgb(10, 10, 10); }
.lp-tier-pro > a:hover { background: rgb(255, 146, 62); color: rgb(10, 10, 10); }
.lp-tier-note { font-size: 11px; line-height: 1.7; color: rgb(126, 133, 141); margin: 22px 0px 0px; }
.lp-footer { padding: 40px clamp(24px, 5vw, 88px); border-top: 1px solid rgb(36, 36, 36); max-width: 1600px; margin: auto; }
.lp-footer .lp-logo { font-size: 24px; letter-spacing: -1px; }
.lp-footer > p { color: rgb(143, 150, 157); font-size: 11px; line-height: 1.7; margin: 21px 0px; }
.lp-footer nav { display: flex; gap: 27px; font-size: 11px; color: rgb(197, 203, 209); flex-wrap: wrap; }
.lp-footer > small { display: block; color: rgb(116, 123, 132); font-size: 10px; margin-top: 30px; }
@media (min-width: 1700px) {
  .lp-art { object-position: center 45%; }
  .lp-hero { padding-top: 25vh; }
  .lp-actions { margin-top: 55px; }
}
@media (max-width: 959px) {
  .lp-header { padding: 24px; }
  .lp-logo { font-size: 31px; letter-spacing: -1.5px; }
  .lp-login { font-size: 11px; gap: 8px; }
  .lp-scene { min-height: max(860px, 100svh); }
  .lp-art { width: 145%; height: 76%; inset: auto -5% 0px auto; object-fit: cover; object-position: right center; }
  .lp-scene::after { background: linear-gradient(rgb(2, 2, 2) 0%, rgb(2, 2, 2) 24%, rgba(2, 2, 2, 0.918) 36%, rgba(0, 0, 0, 0.333) 56%, rgba(0, 0, 0, 0) 72%); }
  .lp-hero { padding: 158px 28px 380px; }
  .lp-hero h1 { font-size: clamp(43px, 6.8vw, 65px); line-height: 1.04; max-width: 680px; }
  .lp-actions { margin-top: 35px; gap: 18px; }
  .lp-tiers-intro { align-items: start; flex-direction: column; gap: 20px; }
  .lp-tiers-intro > p { max-width: 420px; }
  .lp-tier-grid { gap: 14px; }
  .lp-tier { padding: 24px 17px; }
  .lp-tier h3 { font-size: 20px; min-height: 2.4em; }
  .lp-price strong { font-size: 43px; }
  .lp-tier ul { font-size: 11px; }
}
@media (max-width: 619px) {
  .lp-header { padding: 20px; }
  .lp-logo { font-size: 29px; }
  .lp-login { font-size: 10px; gap: 6px; }
  .lp-login > span { display: none; }
  .lp-scene { min-height: max(800px, 100svh); }
  .lp-art { width: 195%; height: 68%; right: -1%; bottom: 0px; object-position: right center; }
  .lp-scene::after { background: linear-gradient(rgb(2, 2, 2) 0%, rgb(2, 2, 2) 22%, rgba(2, 2, 2, 0.92) 37%, rgba(0, 0, 0, 0.333), rgba(0, 0, 0, 0) 65%); }
  .lp-hero { padding: 137px 20px 365px; }
  .lp-hero h1 { font-size: clamp(30px, 8.75vw, 48px); letter-spacing: -0.055em; line-height: 1.07; max-width: 100%; }
  .lp-actions { gap: 12px; margin-top: 31px; font-size: 10px; letter-spacing: 0.035em; }
  .lp-signup { min-width: 0px; flex: 1 1 0%; min-height: 53px; padding: 16px 18px; gap: 12px; }
  .lp-explore { min-width: 0px; flex: 1 1 0%; min-height: 53px; padding: 16px 12px; background: rgba(0, 0, 0, 0.6); }
  .lp-signup span { font-size: 23px; }
  .lp-scroll { bottom: 17px; left: 20px; font-size: 8px; text-shadow: rgb(0, 0, 0) 0px 2px 6px; }
  .lp-tiers { padding: 58px 20px 50px; }
  .lp-tiers-intro { margin-bottom: 28px; }
  .lp-tiers h2 { font-size: 33px; }
  .lp-tier-grid { grid-template-columns: 1fr; gap: 18px; }
  .lp-tier { padding: 26px; }
  .lp-tier h3 { font-size: 25px; min-height: 0px; margin-bottom: 22px; }
  .lp-tier ul { font-size: 13px; }
  .lp-price strong { font-size: 56px; }
  .lp-tier > a { font-size: 13px; }
  .lp-footer { padding: 33px 20px; }
  .lp-tiers-intro > p { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .spx-landing * { scroll-behavior: auto !important; }
}
.spx-landing .lp-logo { display: inline-flex; align-items: center; filter: drop-shadow(rgb(0, 0, 0) 0px 2px 1px); }
.spx-landing .lp-logo .ch-wordmark { font-size: 45px; letter-spacing: -0.035em; }
.spx-landing .lp-footer .lp-logo .ch-wordmark { font-size: 31px; }
.spx-landing .lp-logo .ch-wordmark > span { color: transparent; background: linear-gradient(rgb(255, 255, 255), rgb(224, 231, 236) 25%, rgb(124, 137, 149) 49%, rgb(239, 244, 248) 54%, rgb(255, 255, 255) 70%, rgb(137, 151, 164)) text; }
.spx-landing .lp-login { border-bottom: 1px solid rgba(133, 146, 156, 0.4); text-shadow: rgb(0, 0, 0) 0px 1px 2px; }
.spx-landing .lp-explore { border-color: rgb(185, 196, 204); box-shadow: rgba(247, 251, 255, 0.267) 0px 1px inset, rgba(100, 112, 124, 0.467) 0px -1px inset; background: linear-gradient(145deg, rgba(193, 206, 213, 0.094), rgba(2, 3, 4, 0.8) 42%, rgba(145, 161, 173, 0.082)); }
.spx-landing .lp-tier { border-color: rgb(104, 117, 128); box-shadow: rgba(229, 237, 245, 0.15) 0px 1px inset; background: linear-gradient(135deg, rgb(25, 33, 40), rgb(11, 13, 16) 32%, rgb(8, 9, 11)); }
.spx-landing .lp-tier-pro { border-color: rgb(221, 113, 28); background: linear-gradient(145deg, rgb(43, 27, 17), rgb(16, 17, 18) 75%); }
.spx-landing .lp-tier > a { border-color: rgb(137, 148, 158); box-shadow: rgba(228, 237, 245, 0.13) 0px 1px inset; }
.spx-landing .lp-tier-pro > a { border-color: rgb(255, 139, 44); }
.spx-landing .lp-tiers, .spx-landing .lp-footer { border-top-color: rgba(105, 118, 128, 0.4); }
.lp-player-preview { max-width: 670px; margin-top: 31px; position: relative; isolation: isolate; }
.lp-preview-heading { display: flex; justify-content: space-between; gap: 10px; align-items: center; font: 600 9px / 1.4 "JetBrains Mono", monospace; letter-spacing: 0.1em; color: rgb(217, 225, 231); margin-bottom: 10px; }
.lp-example-label { font-size: 8px; color: rgb(180, 192, 201); letter-spacing: 0.06em; }
.lp-player-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 17px; padding: 7px 4px 12px; perspective: 1200px; }
.lp-player-card { position: relative; isolation: isolate; min-width: 0px; aspect-ratio: 5 / 7; padding: 5px; border: 1px solid rgb(215, 224, 230); border-radius: 13px; background: linear-gradient(135deg, rgb(247, 251, 255), rgb(161, 173, 183) 14%, rgb(237, 245, 250), rgb(102, 116, 128) 34%, rgb(203, 213, 222) 48%, rgb(250, 255, 255) 52%, rgb(125, 140, 153) 66%, rgb(219, 230, 238) 85%, rgb(250, 252, 253)); box-shadow: rgb(68, 80, 90) 0px 3px, rgb(21, 30, 37) 0px 5px, rgba(0, 0, 0, 0.6) 0px 15px 23px, rgba(255, 255, 255, 0.64) 0px 0px 0px 1px inset; transform: rotate(-1deg); transform-origin: center 80%; transition: transform 0.25s, box-shadow 0.25s; }
.lp-player-card:nth-child(2) { transform: translateY(-4px) rotate(0.5deg); }
.lp-player-card:nth-child(3) { transform: rotate(1.2deg); }
.lp-player-card::after { content: ""; position: absolute; z-index: 2; pointer-events: none; inset: 1px; border-radius: 11px; border: 1px solid rgba(255, 255, 255, 0.33); background: linear-gradient(118deg, transparent 21%, rgba(237, 246, 255, 0.04) 26%, rgba(255, 255, 255, 0.133) 27%, transparent 30%, transparent 70%, rgba(229, 241, 255, 0.04) 73%, transparent 76%); }
.lp-card-face { height: 100%; display: grid; grid-template-rows: minmax(0px, 1fr) auto; overflow: hidden; border: 1px solid rgb(38, 51, 63); border-radius: 8px; background: rgb(17, 25, 34); box-shadow: rgba(241, 247, 252, 0.5) 0px 0px 0px 1px; }
.lp-player-photo { position: relative; isolation: isolate; overflow: hidden; min-height: 0px; background: rgb(24, 35, 45); }
.lp-player-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; display: block; }
.lp-player-photo::after { content: ""; position: absolute; z-index: 0; inset: 0px; background: linear-gradient(rgba(2, 7, 11, 0.9), rgba(2, 7, 11, 0) 24%, rgba(2, 7, 11, 0) 48%, rgba(2, 7, 11, 0.6) 73%, rgba(2, 7, 11, 0.95)); pointer-events: none; }
.lp-card-edition { position: absolute; z-index: 1; top: 0px; left: 0px; right: 0px; display: flex; align-items: center; justify-content: space-between; gap: 4px; padding: 10px 9px; color: rgb(224, 232, 238); font: 700 8px / 1.2 "JetBrains Mono", monospace; letter-spacing: 0.1em; }
.lp-card-edition > span:first-child { color: rgb(255, 154, 77); }
.lp-card-edition > span:last-child { font-size: 7px; letter-spacing: 0.14em; }
.lp-player-photo h2 { position: absolute; z-index: 1; left: 10px; right: 8px; bottom: 10px; font: italic 800 25px / 0.95 "Barlow Condensed", Impact, sans-serif; text-transform: uppercase; letter-spacing: -0.015em; margin: 0px; color: rgb(243, 247, 251); text-shadow: rgba(0, 0, 0, 0.733) 0px 2px 3px; max-width: 100%; overflow-wrap: normal; }
.lp-player-copy { position: relative; border-top: 2px solid rgb(255, 122, 22); background: linear-gradient(115deg, rgb(240, 245, 248), rgb(177, 190, 200) 38%, rgb(229, 237, 243) 57%, rgb(206, 216, 223)); color: rgb(18, 32, 44); }
.lp-card-stat { display: flex; align-items: center; gap: 9px; min-height: 64px; padding: 9px 9px 8px; }
.lp-card-stat > strong { flex: 0 0 auto; font-style: normal; font-variant: tabular-nums; font-size-adjust: none; font-language-override: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-weight: 800; font-stretch: normal; font-size: 36px; line-height: 0.95; font-family: "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.025em; color: rgb(16, 32, 45); }
.lp-card-stat > span { font: 700 11px / 1.25 Inter, Arial, sans-serif; min-width: 0px; color: rgb(20, 37, 48); }
.lp-card-stat small { display: block; font: 600 7px / 1.35 "JetBrains Mono", monospace; color: rgb(52, 72, 84); margin-top: 5px; letter-spacing: 0.015em; }
.lp-card-foot { display: flex; align-items: center; justify-content: space-between; padding: 5px 9px; border-top: 1px solid rgba(108, 125, 137, 0.6); background: linear-gradient(100deg, rgb(27, 41, 52), rgb(17, 27, 35)); color: rgb(210, 223, 231); font: 600 7px / 1.3 "JetBrains Mono", monospace; letter-spacing: 0.13em; }
.lp-card-foot b { font-size: 10px; font-style: italic; line-height: 1; color: rgb(255, 139, 50); letter-spacing: -0.08em; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .lp-player-card:hover { transform: translateY(-6px) rotate(0deg); box-shadow: rgb(88, 102, 114) 0px 3px, rgb(24, 37, 47) 0px 5px, rgba(0, 0, 0, 0.733) 0px 20px 30px, rgb(255, 255, 255) 0px 0px 0px 1px inset; }
}
.lp-preview-bottom { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 8px; }
.lp-preview-bottom > p { font: 400 9px / 1.5 Inter, Arial, sans-serif; color: rgb(176, 189, 201); margin: 0px; max-width: 285px; text-shadow: rgb(0, 0, 0) 0px 1px 4px; }
.lp-preview-controls { display: flex; align-items: center; gap: 3px; flex-shrink: 0; }
.lp-preview-controls button { display: grid; place-items: center; height: 36px; min-width: 36px; padding: 0px 8px; border: 1px solid rgb(99, 115, 128); background: rgba(10, 16, 21, 0.9); color: rgb(215, 226, 235); border-radius: 3px; font: 500 18px / 1 Inter, Arial, sans-serif; cursor: pointer; box-shadow: rgba(210, 229, 240, 0.14) 0px 1px inset; }
.lp-preview-controls button:hover { color: rgb(255, 161, 90); border-color: rgb(255, 161, 90); }
.lp-preview-controls .lp-preview-pause { font: 500 9px / 1 "JetBrains Mono", monospace; min-width: 48px; }
.lp-preview-controls button:disabled { color: rgb(164, 176, 185); cursor: default; }
.lp-player-preview button:focus-visible, .lp-photo-credits summary:focus-visible { outline: rgb(255, 141, 51) solid 3px; outline-offset: 3px; }
.lp-visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; }
.lp-photo-credits { max-width: 850px; color: rgb(156, 171, 182); font: 400 11px / 1.7 Inter, Arial, sans-serif; margin-top: 20px; }
.lp-photo-credits summary { cursor: pointer; width: fit-content; padding: 10px 0px; color: rgb(201, 212, 221); }
.lp-photo-credits p { margin: 9px 0px; }
.lp-photo-credits ul { padding-left: 18px; display: grid; gap: 9px; margin: 12px 0px; }
.lp-photo-credits a { text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 960px) {
  .spx-landing .lp-hero { padding-bottom: 95px; }
  .lp-player-preview { max-width: min(670px, 53vw); }
}
@media (max-width: 959px) {
  .spx-landing .lp-hero { padding-bottom: 185px; }
  .spx-landing .lp-logo .ch-wordmark { font-size: 39px; }
  .lp-player-preview { max-width: 610px; }
}
@media (max-width: 619px) {
  .spx-landing .lp-logo .ch-wordmark { font-size: 35px; }
  .spx-landing .lp-hero { padding-bottom: 130px; }
  .lp-player-preview { margin-top: 27px; max-width: 440px; }
  .lp-player-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 13px; padding-inline: 3px; }
  .lp-player-card { border-radius: 12px; padding: 4px; }
  .lp-card-face { border-radius: 7px; }
  .lp-card-edition { padding: 8px 7px; font-size: 8px; letter-spacing: 0.025em; }
  .lp-card-edition > span:last-child { font-size: 7px; letter-spacing: 0.04em; }
  .lp-player-photo h2 { left: 8px; right: 6px; bottom: 9px; font-size: 22px; }
  .lp-card-stat { min-height: 63px; gap: 7px; padding: 8px 7px; }
  .lp-card-stat > strong { font-size: 32px; }
  .lp-card-stat > span { font-size: 10px; }
  .lp-card-stat small { font-size: 7px; letter-spacing: 0px; }
  .lp-card-foot { padding: 5px 7px; font-size: 7px; letter-spacing: 0.08em; }
  .lp-preview-heading { font-size: 8px; letter-spacing: 0.04em; }
  .lp-example-label { font-size: 7px; letter-spacing: 0px; }
  .lp-preview-bottom { gap: 9px; }
  .lp-preview-bottom > p { font-size: 9px; max-width: 190px; }
  .lp-preview-controls button { min-width: 36px; height: 42px; padding: 0px 6px; }
  .lp-preview-controls .lp-preview-pause { min-width: 45px; font-size: 9px; }
  .lp-preview-controls { gap: 3px; }
  .lp-photo-credits { font-size: 10px; }
}
@media (max-width: 379px) {
  .lp-player-grid { grid-template-columns: minmax(0px, 228px); justify-content: center; padding-top: 10px; padding-bottom: 16px; }
  .lp-player-card { transform: rotate(-1deg); }
  .lp-player-photo h2 { font-size: 27px; }
  .lp-card-stat { min-height: 70px; padding: 10px; gap: 12px; }
  .lp-card-stat > strong { font-size: 40px; }
  .lp-card-stat > span { font-size: 12px; }
  .lp-card-stat small { font-size: 8px; }
  .lp-card-edition { padding: 10px; font-size: 9px; }
  .lp-card-edition > span:last-child { font-size: 8px; }
  .lp-card-foot { padding: 6px 10px; font-size: 8px; }
  .lp-preview-heading { font-size: 7px; }
  .lp-preview-bottom > p { font-size: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .lp-player-card { transition: none; }
}
.spx-landing .lp-risk-disclaimer { max-width: 110ch; margin-top: 24px; padding: 0px; border: 0px; border-radius: 0px; background: none; box-shadow: none; color: rgb(159, 167, 175); font: 400 12px / 1.7 Inter, Arial, sans-serif; }
.spx-landing .lp-risk-disclaimer h2 { margin: 0px 0px 6px; color: rgb(183, 191, 199); font: 600 12px / 1.5 Inter, Arial, sans-serif; letter-spacing: 0px; }
.spx-landing .lp-risk-disclaimer p { margin: 0px; color: inherit; font: inherit; max-width: none; }
.spx-landing .lp-risk-disclaimer + small { margin-top: 18px; }
@media (max-width: 619px) {
  .spx-landing .lp-risk-disclaimer { font-size: 13px; line-height: 1.65; }
  .spx-landing .lp-risk-disclaimer h2 { font-size: 13px; }
}
.lp-headline { position: relative; max-width: 850px; }
.lp-headline .lp-headline-title { display: grid; grid-template-columns: minmax(0px, 1fr); }
.lp-headline-title .lp-headline-message { grid-area: 1 / 1; min-width: 0px; align-self: start; pointer-events: none; opacity: 0; visibility: hidden; transition: opacity 0.32s, visibility linear 0.32s; }
.lp-headline-title .lp-headline-message.is-active { opacity: 1; visibility: visible; transition: opacity 0.32s, visibility; }
.lp-headline-toggle { position: absolute; left: 0px; top: calc(100% + 8px); display: inline-flex; align-items: center; gap: 7px; min-height: 28px; padding: 5px 6px; border: 0px; border-radius: 3px; background: rgba(2, 2, 2, 0.5); color: rgb(184, 196, 206); font: 500 10px / 1.4 "JetBrains Mono", monospace; letter-spacing: 0.015em; cursor: pointer; }
.lp-headline-toggle:hover { color: rgb(243, 247, 250); background: rgb(21, 27, 33); }
.lp-headline-toggle:focus-visible { outline: rgb(255, 148, 63) solid 2px; outline-offset: 2px; }
.lp-headline-toggle svg { flex: 0 0 auto; }
@media (max-width: 959px) {
  .lp-headline { max-width: 680px; }
  .lp-headline-toggle { top: calc(100% + 3px); }
}
@media (max-width: 619px) {
  .lp-headline { max-width: 100%; }
  .lp-headline-toggle { top: calc(100% + 1px); min-height: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .lp-headline-title .lp-headline-message, .lp-headline-title .lp-headline-message.is-active { transition: none; }
  .lp-headline-toggle { display: none; }
}
.published-portrait-grid { max-width: 670px; margin-inline: auto; align-items: stretch; }
.published-portrait-grid .lp-player-card { cursor: pointer; }
.published-portrait-grid .lp-player-card:focus-visible { outline: rgb(255, 139, 50) solid 3px; outline-offset: 5px; }
.lp-team-art { height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 16px; text-align: center; padding: 28px 12px 16px; background: linear-gradient(145deg, rgb(28, 44, 59), rgb(71, 97, 121) 55%, rgb(16, 25, 34)); }
.lp-team-art strong { display: block; position: relative; z-index: 1; font: italic 800 24px / 1.04 "Barlow Condensed", Impact, sans-serif; text-transform: uppercase; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.733) 0px 2px 3px; }
.lp-team-art small { display: block; color: rgb(255, 154, 77); margin-bottom: 14px; font-size: 10px; position: relative; z-index: 1; }
.lp-photo-unavailable { display: block; padding: 40px 12px; font-size: 12px; color: rgb(196, 210, 221); }
.published-detail-backdrop { position: fixed; inset: 0px; z-index: 1000; display: grid; place-items: center; padding: 24px; background: rgba(5, 8, 11, 0.867); backdrop-filter: blur(8px); }
.published-detail-panel { width: min(100%, 600px); max-height: 85dvh; overflow: auto; background: rgb(18, 27, 37); color: rgb(237, 244, 249); padding: 28px; border: 2px solid rgb(169, 186, 200); border-radius: 13px; font: 14px / 1.6 Inter, Arial, sans-serif; }
.published-detail-panel > button { float: right; padding: 8px 14px; border: 1px solid rgb(169, 186, 200); border-radius: 5px; background: rgb(36, 55, 70); color: rgb(255, 255, 255); cursor: pointer; }
.published-detail-panel h2 { font-size: 25px; margin: 12px 0px; }
.published-detail-panel h3 { font-size: 19px; margin: 12px 0px; }
.published-detail-panel ol { padding-left: 20px; display: grid; gap: 12px; margin: 20px 0px; }
.published-detail-panel a { color: rgb(255, 180, 121); }
@media (max-width: 619px) {
  .published-portrait-grid { max-width: 440px; }
  .lp-team-art strong { font-size: 22px; }
}
:root { --sp-silver: #edf2f7; --sp-muted: #b4bfcb; --sp-metal: linear-gradient(140deg,#e4edf7a6,#63728288 25%,#29333e 52%,#b1c3d199 82%,#485565); --sp-panel: linear-gradient(145deg,#202831ee,#0e1319f5 65%); }
.spx-enroll, .chrome-site { color-scheme: dark; --join-cream: var(--sp-silver); --join-ink: var(--sp-silver); --muted: var(--sp-muted); --line: #53617166; font-family: Inter, Arial, sans-serif; }
.spx-enroll :is(button, a, input, select, textarea):focus-visible, .chrome-site :is(button, a, input, select, textarea, summary):focus-visible { outline: rgb(255, 174, 109) solid 3px; outline-offset: 4px; }
.spx-enroll button:disabled, .chrome-site button:disabled { cursor: not-allowed; }
.sp-pack { --pack-accent: #dce7f1; position: relative; isolation: isolate; display: flex; flex-direction: column; width: 162px; aspect-ratio: 3 / 4; margin: 0px auto; color: rgb(220, 231, 241); filter: drop-shadow(rgba(0, 0, 0, 0.6) 0px 13px 12px); transform: rotate(-3deg); transition: transform 0.18s; pointer-events: none; }
.sp-pack-pro { --pack-accent: #ff963f; transform: rotate(1deg); }
.sp-pack-titan { --pack-accent: #f5f9ff; transform: rotate(3deg); }
.sp-pack-seal { height: 13px; flex: 0 0 auto; background: repeating-linear-gradient(90deg, rgb(89, 102, 117) 0px, rgb(89, 102, 117) 2px, rgb(186, 200, 211) 3px, rgb(55, 66, 78) 4px, rgb(55, 66, 78) 6px); border-block: 1px solid rgba(234, 244, 255, 0.333); clip-path: polygon(0px 8%, 100% 0px, 98% 100%, 2% 92%); }
.sp-pack-face { position: relative; flex: 1 1 0%; display: flex; align-items: center; flex-direction: column; justify-content: flex-end; padding: 15px 8px 16px; border-inline: 1px solid rgb(183, 199, 213); overflow: hidden; background: linear-gradient(118deg, rgba(237, 244, 252, 0.133), transparent 18%, rgba(167, 191, 219, 0.17) 25%, transparent 32%, transparent 65%, rgba(232, 245, 255, 0.133) 72%, transparent 78%), linear-gradient(145deg, rgb(100, 118, 137), rgb(17, 27, 38) 45%, rgb(40, 56, 73) 78%, rgb(160, 175, 186)); box-shadow: rgba(255, 255, 255, 0.098) 5px 0px 7px inset, rgba(0, 0, 0, 0.6) -6px 0px 8px inset; }
.sp-pack-face::before { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(216, 234, 255, 0.267); clip-path: polygon(0px 0px, 70% 0px, 100% 22%, 100% 100%, 0px 100%); pointer-events: none; }
.sp-pack-face::after { content: ""; position: absolute; inset: 0px; background: repeating-linear-gradient(0deg, transparent 0px, transparent 3px, rgba(255, 255, 255, 0.016) 3px, rgba(255, 255, 255, 0.016) 4px); pointer-events: none; }
.sp-pack-brand { position: absolute; top: 19px; left: 0px; right: 0px; text-align: center; font: 900 12px / 1 Inter, Arial, sans-serif; letter-spacing: -0.055em; color: rgb(231, 240, 248); text-shadow: rgb(0, 0, 0) 0px 1px; }
.sp-pack-play { position: absolute; top: 36px; width: 91%; height: 78px; color: var(--pack-accent); opacity: 0.85; }
.sp-pack-name { position: relative; font: 900 41px / 0.95 "Barlow Condensed", Impact, sans-serif; letter-spacing: -0.025em; color: transparent; background: linear-gradient(rgb(255, 255, 255), rgb(202, 212, 223) 37%, rgb(135, 149, 167) 48%, rgb(255, 255, 255) 55%, rgb(184, 201, 217)) text; filter: drop-shadow(rgb(0, 0, 0) 0px 2px 1px); }
.sp-pack-sport { margin-top: 8px; font: 600 7px / 1.5 "JetBrains Mono", monospace; letter-spacing: 0.035em; color: rgb(240, 245, 250); white-space: nowrap; }
.sp-pack-edition { margin-top: 12px; padding-top: 7px; border-top: 1px solid rgba(203, 221, 238, 0.4); width: 85%; text-align: center; font: 500 7px / 1.3 "JetBrains Mono", monospace; letter-spacing: 0.18em; color: rgb(200, 214, 227); }
.sp-pack-pro .sp-pack-face { background: linear-gradient(125deg, transparent 47%, rgba(249, 136, 52, 0.133) 48%, rgba(249, 136, 52, 0.133) 53%, transparent 54%), linear-gradient(115deg, rgba(246, 233, 221, 0.2), transparent 25%, rgba(255, 255, 255, 0.05) 69%, rgba(255, 224, 192, 0.24) 75%, transparent 85%), linear-gradient(145deg, rgb(97, 80, 68), rgb(22, 24, 25) 45%, rgb(51, 37, 30) 78%, rgb(150, 133, 120)); border-color: rgb(224, 180, 143); }
.sp-pack-pro .sp-pack-name { background-image: linear-gradient(rgb(255, 228, 204), rgb(255, 160, 81) 38%, rgb(184, 77, 17) 49%, rgb(255, 209, 168) 57%, rgb(255, 138, 50)); }
.sp-pack-pro .sp-pack-seal { background: repeating-linear-gradient(90deg, rgb(116, 71, 36) 0px, rgb(116, 71, 36) 2px, rgb(235, 176, 131) 3px, rgb(56, 37, 29) 4px, rgb(56, 37, 29) 6px); }
.sp-pack-titan .sp-pack-face { background: linear-gradient(112deg, rgba(205, 218, 234, 0.125), transparent 20%, rgba(216, 234, 255, 0.23) 25%, transparent 31%, transparent 67%, rgba(216, 234, 255, 0.157) 74%, transparent 79%), linear-gradient(150deg, rgb(79, 89, 99), rgb(5, 9, 15) 47%, rgb(16, 27, 40) 77%, rgb(102, 125, 144)); }
.sp-pack-titan .sp-pack-face::before { border: 2px solid rgba(221, 232, 241, 0.667); }
.sp-pack-compact { width: 112px; margin-block: 0px 25px; }
.sp-pack-compact .sp-pack-brand { font-size: 9px; top: 14px; }
.sp-pack-compact .sp-pack-play { top: 28px; height: 47px; }
.sp-pack-compact .sp-pack-name { font-size: 28px; }
.sp-pack-compact .sp-pack-sport { font-size: 5px; margin-top: 5px; }
.sp-pack-compact .sp-pack-edition { font-size: 5px; margin-top: 7px; padding-top: 5px; }
.sp-pack-compact .sp-pack-face { padding-bottom: 12px; }
.sp-pack-compact .sp-pack-seal { height: 9px; }
.lp-tier-grid article { box-shadow: rgba(255, 255, 255, 0.08) 0px 1px inset, rgba(0, 0, 0, 0.267) 0px 18px 35px; border-radius: 12px !important; background: var(--sp-panel) padding-box,var(--sp-metal) border-box !important; border: 1px solid transparent !important; }
.lp-tier-grid article .sp-pack { margin-top: 5px; }
.lp-tier-grid article ul { flex: 1 1 0%; }
.lp-tier-grid article a { border-radius: 5px; border-color: rgb(130, 145, 161) !important; }
.spx-enroll.is-tier-step .join-main { grid-template-columns: minmax(0px, 1fr); gap: 32px; max-width: 1400px; }
.spx-enroll.is-tier-step .join-intro { grid-area: auto; margin: 0px; }
.spx-enroll.is-tier-step .join-intro h1 { font-size: clamp(36px, 4vw, 58px); margin-top: 15px !important; }
.spx-enroll.is-tier-step .join-intro > p { max-width: 56ch; }
.spx-enroll.is-tier-step .join-flow { grid-area: auto; width: 100%; }
.spx-enroll.is-tier-step .join-summary { grid-area: auto; position: static; max-width: 100%; width: 100%; }
.spx-enroll.is-tier-step .join-summary-body { display: grid; grid-template-columns: 112px minmax(0px, 1fr) minmax(0px, 1fr); gap: 10px 28px; align-items: start; }
.is-tier-step .join-summary .sp-pack { grid-row: 1 / span 5; margin: 8px 0px; }
.is-tier-step .join-summary .join-eyebrow { grid-column: 2; }
.is-tier-step .join-summary-price { grid-column: 2; margin-top: 0px; }
.is-tier-step .join-summary ul { grid-area: 1 / 3 / span 3; margin-block: 0px; }
.is-tier-step .join-summary-note, .is-tier-step .join-summary-footer { grid-column: 2 / -1; }
.is-tier-step .join-pro-summary { grid-column: 2; }
.spx-enroll .join-plans { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 20px; align-items: stretch; margin: 0px 0px 28px; }
.spx-enroll .join-plan { position: relative; isolation: isolate; display: flex; flex-direction: column; min-width: 0px; padding: 32px 23px 20px; gap: 0px; border: 1px solid transparent; border-radius: 12px; background: var(--sp-panel) padding-box,var(--sp-metal) border-box; box-shadow: rgba(255, 255, 255, 0.082) 0px 1px inset, rgba(0, 0, 0, 0.267) 0px 16px 30px; color: var(--sp-silver); transition: box-shadow 0.16s, border-color 0.16s; }
.spx-enroll .join-plan:hover { box-shadow: rgba(255, 255, 255, 0.133) 0px 1px inset, rgba(0, 0, 0, 0.467) 0px 18px 40px; }
.spx-enroll .join-plan:hover .sp-pack { transform: rotate(0deg); }
.spx-enroll .join-plan.is-selected { border-color: rgb(255, 156, 81); background: linear-gradient(150deg, rgb(45, 41, 37), rgb(16, 20, 25) 62%) padding-box padding-box; box-shadow: rgba(255, 139, 60, 0.208) 0px 0px 0px 2px, rgba(0, 0, 0, 0.4) 0px 20px 35px; }
.spx-enroll .join-plan:focus-within { outline: rgb(255, 174, 109) solid 3px; outline-offset: 4px; }
.spx-enroll .join-plan > input { position: absolute; top: 16px; right: 16px; width: 20px; height: 20px; min-height: 20px; margin: 0px; accent-color: rgb(255, 140, 58); }
.spx-enroll .join-plan .sp-pack { margin: 8px auto 28px; }
.spx-enroll .join-plan-copy { display: flex; flex-direction: column; flex: 1 1 0%; }
.spx-enroll .join-plan h3 { font-size: 25px; font-weight: 800; color: rgb(238, 243, 248); letter-spacing: -0.035em; }
.spx-enroll .join-plan-copy > div > p { font-size: 12px; color: rgb(180, 191, 203); margin-top: 7px; }
.spx-enroll .join-plan ul { margin: 23px 0px 24px; gap: 12px; }
.spx-enroll .join-plan li { color: rgb(209, 218, 229); font-size: 13px; line-height: 1.65; gap: 9px; }
.spx-enroll .join-plan li span { color: rgb(255, 171, 107); }
.spx-enroll .join-plan-price { display: flex; flex-direction: row; align-items: baseline; text-align: left; gap: 8px; padding: 20px 0px 17px; border-top: 1px solid rgba(115, 134, 154, 0.27); }
.spx-enroll .join-plan-price strong { font: 800 40px / 1 Inter, Arial, sans-serif; letter-spacing: -0.055em; color: rgb(242, 246, 250); }
.spx-enroll .join-plan-price small { font: 400 10px / 1.6 "JetBrains Mono", monospace; color: rgb(185, 197, 209); white-space: normal; }
.join-pack-selection { display: flex; align-items: center; justify-content: center; min-height: 43px; padding: 10px; border: 1px solid rgb(118, 134, 150); border-radius: 5px; color: rgb(205, 217, 229); font: 600 11px / 1.5 "JetBrains Mono", monospace; text-align: center; text-transform: uppercase; }
.is-selected .join-pack-selection { color: rgb(21, 16, 11); background: linear-gradient(rgb(255, 160, 88), rgb(255, 129, 41)); border-color: rgb(255, 176, 120); }
.is-tier-step .join-pro-picker { max-width: 800px; margin: 24px 0px; }
.is-tier-step .join-flow-content > .join-primary { max-width: 360px; }
.spx-member :is(.join-account-auth, .join-account-details, .join-account-membership), .spx-enroll :is(.join-unavailable, .join-pending), .chrome-site :is(.empty-state, .results-summary, .result-row, .pick-card, .educational-sample, .sample-invitation, .ch-record, .ch-membership) { color: var(--sp-silver); border: 1px solid transparent; border-radius: 12px; background: var(--sp-panel) padding-box,var(--sp-metal) border-box; box-shadow: rgba(255, 255, 255, 0.047) 0px 1px inset, rgba(0, 0, 0, 0.2) 0px 16px 40px; }
.spx-member { --join-ink: var(--sp-silver); --join-cream: var(--sp-silver); }
.spx-member .join-account-intro h1 { font: 900 clamp(38px, 4.6vw, 64px) / 1.04 Inter, Arial, sans-serif; letter-spacing: -0.055em; }
.spx-member :is(.join-account-intro > p, .join-account-membership > p, .join-form label small, .join-recurrence, .join-fine-print, .join-account-details dt, .join-sport-preferences > p) { color: rgb(180, 191, 203); }
.spx-member :is(.join-account-details h2, .join-account-membership h2, .join-account-plan-price strong, .join-account-details dd, .join-form label) { color: rgb(238, 243, 248); }
.spx-member :is(.join-eyebrow, .join-account-membership > .join-eyebrow) { color: rgb(174, 189, 205); }
.spx-member .join-account-details dl > div { border-color: rgba(114, 132, 154, 0.23); }
.spx-member .join-form input:not([type="radio"]) { height: 49px; min-height: 49px; border: 1px solid rgb(116, 130, 148); border-radius: 5px; background: rgb(8, 13, 18); color: rgb(239, 245, 251); font-size: 16px; box-shadow: rgba(0, 0, 0, 0.533) 0px 1px 4px inset; }
.spx-member input::placeholder { color: rgb(151, 164, 178); opacity: 1; }
.spx-member input:-webkit-autofill { -webkit-text-fill-color: rgb(238, 243, 248); box-shadow: rgb(16, 22, 27) 0px 0px 0px 1000px inset; }
.spx-member .join-password button { color: rgb(208, 219, 230); }
.spx-member .join-text-button { color: rgb(255, 171, 107); }
.spx-member .join-primary { min-height: 51px; padding: 14px 18px; background: linear-gradient(rgb(255, 157, 84), rgb(255, 129, 40)); border: 1px solid rgb(255, 173, 108); border-radius: 5px; box-shadow: rgba(255, 255, 255, 0.21) 0px 1px inset; color: rgb(17, 17, 17) !important; font: 600 12px / 1.6 "JetBrains Mono", monospace !important; }
.spx-member .join-secondary { color: rgb(220, 229, 238); border: 1px solid rgb(123, 140, 158); background: linear-gradient(rgb(35, 45, 55), rgb(17, 25, 35)); border-radius: 5px; min-height: 46px; }
.spx-member .join-membership-status { background: rgb(27, 39, 50); border-color: rgb(123, 138, 152); color: rgb(211, 224, 237); }
.spx-member .join-membership-status.is-active { background: rgb(18, 42, 35); border-color: rgb(80, 141, 121); color: rgb(188, 232, 213); }
.spx-member .join-sport-buttons button { border-color: rgb(116, 134, 153); color: rgb(220, 230, 240); background: rgb(17, 25, 35); }
.spx-member .join-sport-buttons button[aria-pressed="true"] { background: rgb(255, 150, 63); border-color: rgb(255, 176, 114); color: rgb(19, 16, 13); }
.spx-member .join-alert, .spx-enroll .join-alert { color: rgb(255, 211, 197); border: 1px solid rgb(169, 120, 99); background: rgb(50, 31, 27); border-radius: 6px; font-size: 13px; line-height: 1.65; }
.spx-member .join-alert.is-success, .spx-enroll .join-alert.is-success { background: rgb(18, 42, 35); color: rgb(196, 237, 218); border-color: rgb(77, 148, 123); }
.spx-member .join-loading, .spx-enroll .join-loading { color: rgb(190, 201, 214); font-size: 13px !important; }
.join-loading span { border-color: rgb(255, 156, 81) rgba(140, 154, 170, 0.333) rgba(140, 154, 170, 0.333); }
.spx-enroll :is(.join-unavailable, .join-pending) { padding: 26px; }
.spx-enroll :is(.join-unavailable p, .join-pending p, .join-complete p) { color: rgb(185, 198, 212); line-height: 1.8; }
.spx-enroll :is(.join-unavailable h3, .join-pending h3, .join-complete h2) { color: rgb(240, 245, 250); }
.spx-enroll .join-status-icon { background: rgb(40, 49, 59); border: 1px solid rgb(153, 170, 185); color: rgb(232, 241, 248); border-radius: 10px; }
.spx-enroll .join-complete-check { border: 1px solid rgb(113, 156, 136); background: rgb(23, 44, 36); color: rgb(194, 235, 214); }
.spx-enroll .join-complete h2 { font: 850 clamp(32px, 5vw, 48px) / 1.08 Inter, Arial, sans-serif; letter-spacing: -0.045em; }
.spx-enroll .join-test-note { background: rgb(49, 37, 22); color: rgb(255, 224, 180); border-color: rgb(155, 122, 80); border-radius: 5px; }
.join-stripe { border-radius: 8px; overflow: hidden; }
.chrome-site:not(.chrome-home-page) { background: linear-gradient(rgba(6, 9, 13, 0.875), rgba(7, 10, 15, 0.96) 700px), url("/assets/public-home/tactical-board.webp") center top / 1600px auto no-repeat, rgb(7, 10, 15); }
.chrome-site .site-header { background: linear-gradient(rgba(21, 27, 35, 0.933), rgba(8, 12, 18, 0.97)); border-bottom: 1px solid rgba(125, 144, 161, 0.33); box-shadow: rgba(255, 255, 255, 0.03) 0px 1px; }
.chrome-site .site-mobile-menu, .chrome-site .bottom-nav { background: rgba(13, 19, 27, 0.96); border-color: rgba(131, 147, 163, 0.3); }
.chrome-site .desktop-nav a[aria-current="page"] { color: rgb(255, 172, 108); border-bottom: 2px solid rgb(255, 140, 53); }
.chrome-site .site-footer { background: rgb(6, 10, 15); border-top: 1px solid rgba(95, 114, 134, 0.3); color: rgb(166, 180, 195); }
.chrome-site .site-footer .ch-wordmark { font-size: 32px; }
.chrome-site .site-footer .ch-wordmark > span { color: transparent; background: linear-gradient(rgb(255, 255, 255), rgb(185, 198, 212) 45%, rgb(242, 247, 253) 57%, rgb(156, 174, 192)) text; }
.chrome-site .page-intro { margin-bottom: 28px; }
.chrome-site .page-intro h1 { font-weight: 900; }
.chrome-site .timestamp, .chrome-site .card-meta { color: rgb(174, 188, 204); }
.chrome-site :is(.filter-row button, .result-filters button, .playbook-views button, .ch-sports button, .ch-plan-switch button) { border-radius: 6px; border: 1px solid rgba(110, 128, 147, 0.282); background: linear-gradient(rgb(34, 45, 57), rgb(20, 28, 38)); color: rgb(199, 212, 226); }
.chrome-site :is(.filter-row button, .playbook-views button, .ch-sports button, .ch-plan-switch button)[aria-pressed="true"] { background: linear-gradient(rgb(255, 173, 105), rgb(255, 138, 48)); border-color: rgb(255, 176, 117); color: rgb(17, 17, 17); }
.chrome-site .result-filters button[aria-pressed="true"] { background: rgb(53, 69, 87); border-color: rgb(174, 191, 209); color: rgb(255, 255, 255); }
.chrome-site .record-toolbar select { background: rgb(15, 24, 34); color: rgb(234, 242, 250); border-color: rgb(130, 148, 168); border-radius: 6px; }
.chrome-site :is(.pick-card .price-grid, .record-guide, .ch-bottom-heading) { border-color: rgba(129, 151, 173, 0.267); }
.chrome-site .price-grid dt { color: rgb(182, 197, 213); }
.chrome-site .price-grid dd { color: rgb(229, 237, 246); }
.chrome-site .pick-card { position: relative; padding-top: 29px; }
.chrome-site .pick-card::before { content: ""; position: absolute; top: 0px; left: 24px; right: 24px; height: 3px; background: linear-gradient(90deg, rgb(124, 141, 158), rgb(228, 239, 249), rgb(255, 149, 62), rgb(85, 103, 121)); border-radius: 0px 0px 3px 3px; }
.chrome-site .sample-invitation { padding: 28px; margin-top: 25px; }
.chrome-site .loading-state { color: rgb(192, 204, 218); }
.chrome-site .record-guide li { border-color: rgba(126, 146, 166, 0.314); }
.chrome-site .record-guide li span { color: rgb(181, 196, 211); }
.chrome-site .ch-dialog { background: linear-gradient(145deg, rgb(32, 42, 53), rgb(11, 17, 25) 60%); border-color: rgb(157, 171, 185); }
.chrome-site .ch-plan-copy { color: rgb(189, 202, 218); }
.educational-sample { --sample-ink: #edf4fb; --sample-paper: #101923; --sample-orange: #ff963f; }
.educational-sample .sample-paper { background: linear-gradient(145deg, rgb(34, 47, 61), rgb(16, 24, 34) 70%); color: rgb(234, 242, 251); border-width: 3px 1px 1px; border-style: solid; border-color: rgb(255, 150, 63) rgb(129, 151, 173) rgb(129, 151, 173); border-image: none; border-radius: 9px; overflow: hidden; box-shadow: rgba(0, 0, 0, 0.267) 0px 18px 30px; }
.educational-sample :is(.sample-status, .sample-controls, .sample-numbers, .sample-numbers > div + div, .sample-reasons li, .sample-changes, .sample-changes li, .sample-footer) { border-color: rgba(125, 146, 164, 0.3); }
.educational-sample :is(.sample-teams, .sample-panel-title, .sample-reasons h4, .sample-changes strong, .sample-numbers dd) { color: rgb(237, 244, 252); }
.educational-sample :is(.sample-caption, .sample-not-live, .sample-fiction, .sample-body, .sample-math, .sample-reasons p, .sample-changes span, .sample-footer, .sample-numbers dt, .sample-teams span) { color: rgb(185, 200, 215); }
.educational-sample .sample-badge { color: rgb(255, 202, 157); background: rgb(53, 39, 29); border-color: rgb(174, 124, 83); }
.educational-sample .sample-controls { background: rgb(16, 24, 32); }
.educational-sample .sample-controls button { color: rgb(184, 200, 216); }
.educational-sample .sample-controls button:hover { background: rgb(38, 54, 70); color: rgb(255, 255, 255); }
.educational-sample .sample-controls button[aria-pressed="true"] { color: rgb(255, 240, 228); background: rgb(41, 51, 60); border-bottom-color: rgb(255, 150, 63); }
.educational-sample :is(.sample-pick, .sample-reason-number, .sample-footer > span) { color: rgb(255, 167, 100); }
.educational-sample .sample-uncertainty { background: rgb(22, 36, 49); color: rgb(208, 220, 232); border-left-color: rgb(255, 150, 63); }
@media (max-width: 1099px) {
  .spx-enroll .join-plans { gap: 14px; }
  .spx-enroll .join-plan { padding: 30px 18px 18px; }
  .spx-enroll .join-plan li { font-size: 12px; }
  .spx-enroll .join-plan .sp-pack { width: 140px; }
  .spx-enroll .join-plan h3 { font-size: 23px; }
}
@media (max-width: 759px) {
  .spx-enroll .join-plans { grid-template-columns: 1fr; gap: 20px; }
  .spx-enroll .join-plan { display: grid; grid-template-columns: 110px minmax(0px, 1fr); gap: 0px 22px; padding: 26px 22px 22px; }
  .spx-enroll .join-plan .sp-pack { width: 104px; grid-area: 1 / 1 / span 2; margin: 17px auto; }
  .join-plan .sp-pack-brand { font-size: 9px; top: 13px; }
  .join-plan .sp-pack-play { top: 25px; height: 45px; }
  .join-plan .sp-pack-name { font-size: 27px; }
  .join-plan .sp-pack-sport { font-size: 5px; margin-top: 4px; }
  .join-plan .sp-pack-edition { font-size: 5px; margin-top: 6px; padding-top: 5px; }
  .join-plan .sp-pack-face { padding-bottom: 10px; }
  .join-plan .sp-pack-seal { height: 9px; }
  .spx-enroll .join-plan-copy { grid-column: 2; margin-top: 5px; }
  .spx-enroll .join-plan h3 { font-size: 23px; }
  .spx-enroll .join-plan ul { margin: 17px 0px; gap: 8px; }
  .spx-enroll .join-plan-price { grid-column: 2; padding: 14px 0px; }
  .spx-enroll .join-plan-price strong { font-size: 32px; }
  .spx-enroll .join-plan-price small { font-size: 9px; }
  .join-pack-selection { grid-column: 1 / -1; margin-top: 8px; }
  .spx-enroll.is-tier-step .join-summary-body { display: block; }
  .is-tier-step .join-summary .sp-pack { float: right; margin: 0px 0px 20px 20px; width: 82px; }
  .is-tier-step .join-summary ul { clear: both; margin-top: 22px; }
  .is-tier-step .join-summary-price { flex-direction: column; align-items: start; }
  .is-tier-step .join-summary-price p { text-align: left; }
  .chrome-site .sample-invitation { padding: 23px; }
  .spx-enroll .join-unavailable, .spx-enroll .join-pending { padding: 22px 18px; }
}
@media (max-width: 479px) {
  .spx-enroll.is-tier-step .join-flow-content { padding: 25px 17px; }
  .spx-enroll .join-plan { grid-template-columns: 88px minmax(0px, 1fr); gap: 0px 16px; padding: 26px 16px 17px; }
  .spx-enroll .join-plan .sp-pack { width: 84px; }
  .join-plan .sp-pack-name { font-size: 23px; }
  .join-plan .sp-pack-brand { font-size: 7px; top: 9px; }
  .join-plan .sp-pack-play { top: 20px; height: 35px; }
  .join-plan .sp-pack-sport { font-size: 4px; }
  .join-plan .sp-pack-edition { font-size: 4px; margin-top: 5px; }
  .spx-enroll .join-plan h3 { font-size: 21px; }
  .spx-enroll .join-plan-copy > div > p { font-size: 11px; }
  .spx-enroll .join-plan li { font-size: 12px; line-height: 1.6; }
  .spx-enroll .join-plan-price { flex-wrap: wrap; gap: 5px; }
  .spx-enroll .join-plan-price strong { font-size: 30px; }
  .spx-member .join-account-intro h1 { font-size: 36px; }
  .chrome-site .site-footer .ch-wordmark { font-size: 29px; }
  .spx-enroll .join-summary-body > .sp-pack-compact { width: 96px; }
}
@media (prefers-reduced-motion: reduce) {
  .sp-pack { transition: none; }
  .spx-enroll .join-plan:hover .sp-pack { transform: rotate(0deg); }
}
.spx-account-hub { position: relative; isolation: isolate; margin: auto; min-height: 72vh; max-width: 1240px !important; padding: 64px 36px 76px !important; }
.hub-backdrop { position: absolute; z-index: -1; inset: 0px -60px auto; height: 600px; pointer-events: none; background: linear-gradient(rgba(5, 9, 13, 0.9), rgba(7, 12, 18, 0.72) 35%, rgb(8, 13, 19) 98%), url("/assets/public-home/tactical-board.webp") right top / cover no-repeat; opacity: 0.9; }
.spx-account-hub .join-account-intro { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 0px 0px 32px; }
.spx-account-hub .join-account-intro h1 { font: 900 clamp(34px, 4.2vw, 56px) / 1.02 Inter, Arial, sans-serif; letter-spacing: -0.055em; margin: 14px 0px; }
.spx-account-hub .join-account-intro h1 span { color: rgb(255, 147, 63); }
.spx-account-hub .join-account-intro p { font-size: 14px; line-height: 1.65; max-width: 570px; margin: 0px; color: rgb(183, 196, 210); }
.hub-dashboard-link { display: inline-flex; align-items: center; gap: 14px; color: rgb(213, 224, 236); border-bottom: 1px solid rgba(130, 145, 164, 0.4); padding: 9px 0px; white-space: nowrap; font: 500 11px / 1.5 "JetBrains Mono", monospace; }
.hub-dashboard-link svg { width: 16px; height: 16px; }
.hub-grid { display: grid; grid-template-columns: minmax(0px, 1.3fr) minmax(0px, 1fr); grid-template-areas: "membership profile" "sports sports"; gap: 22px; align-items: start; }
.hub-grid > * { min-width: 0px; }
.spx-account-hub .hub-membership { grid-area: membership; display: flex; align-items: center; gap: 26px; min-height: 300px; padding: 28px !important; }
.hub-member-art { flex: 0 0 112px; display: flex; justify-content: center; align-items: center; }
.hub-member-art > .sp-pack { width: 112px; }
.hub-member-art .sp-pack-name { font-size: 30px; }
.hub-member-art .sp-pack-brand { font-size: 9px; }
.hub-member-art .sp-pack-sport, .hub-member-art .sp-pack-edition { font-size: 5px; }
.hub-pack-stack { position: relative; width: 112px; height: 170px; display: flex; align-items: center; }
.hub-pack-stack .sp-pack { position: absolute; width: 84px; }
.hub-pack-stack .sp-pack:first-child { transform: translate(-14px, -7px) rotate(-13deg); }
.hub-pack-stack .sp-pack:nth-child(2) { transform: translate(30px, -7px) rotate(12deg); }
.hub-pack-stack .sp-pack:last-child { transform: translate(7px, 12px); }
.hub-membership-copy { min-width: 0px; flex: 1 1 0%; }
.spx-account-hub .hub-membership h2 { font: 800 30px / 1.1 "Barlow Condensed", Inter, sans-serif; margin: 13px 0px 8px; letter-spacing: -0.02em; }
.spx-account-hub .hub-membership p { font-size: 13px; line-height: 1.65; color: rgb(186, 198, 210); margin: 10px 0px; }
.spx-account-hub .hub-membership .join-fine-print { font-size: 11px; line-height: 1.6; color: rgb(162, 176, 192); margin: 14px 0px 0px; }
.spx-account-hub .join-membership-status { display: inline-block; margin: 12px 0px 0px; padding: 5px 8px; font: 500 10px / 1.5 "JetBrains Mono", monospace; border-radius: 4px; max-width: 100%; }
.spx-account-hub .hub-membership .join-primary, .spx-account-hub .hub-membership .join-secondary { width: 100%; margin: 10px 0px 0px; min-height: 44px; padding: 11px 13px; }
.spx-account-hub .join-account-plan-price strong { font-size: 28px; }
.spx-account-hub .hub-profile { grid-area: profile; padding: 24px !important; }
.hub-profile-heading { display: flex; gap: 14px; align-items: center; }
.hub-avatar { width: 46px; height: 54px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgb(181, 196, 214); border-radius: 7px; background: linear-gradient(140deg, rgb(226, 232, 237), rgb(133, 143, 153) 28%, rgb(242, 246, 249) 44%, rgb(141, 153, 167) 62%, rgb(62, 74, 88)); color: rgb(17, 27, 36); font: 800 20px / 1 Inter, sans-serif; box-shadow: rgba(27, 39, 59, 0.267) 0px 0px 0px 3px inset, rgba(0, 0, 0, 0.4) 0px 6px 15px; }
.hub-profile-heading > div { min-width: 0px; }
.spx-account-hub .hub-profile h2 { font: 700 23px / 1.2 "Barlow Condensed", Inter, sans-serif; margin: 7px 0px 4px; overflow-wrap: anywhere; }
.hub-profile-heading p { font-size: 12px; line-height: 1.6; color: rgb(184, 197, 211); margin: 0px; overflow-wrap: anywhere; }
.hub-profile-details { margin-top: 24px; border-top: 1px solid rgba(138, 155, 181, 0.23); border-bottom: 1px solid rgba(138, 155, 181, 0.23); }
.hub-profile-details summary { display: flex; justify-content: space-between; align-items: center; gap: 18px; list-style: none; cursor: pointer; padding: 17px 0px; color: rgb(226, 234, 242); font-size: 13px; line-height: 1.5; }
.hub-profile-details summary::-webkit-details-marker { display: none; }
.hub-profile-details summary small { display: block; color: rgb(157, 174, 191); font-size: 11px; margin-top: 3px; }
.hub-details-toggle { font: 400 23px / 1 Inter, sans-serif; color: rgb(255, 156, 88); }
.hub-profile-details[open] .hub-details-toggle { transform: rotate(45deg); }
.spx-account-hub .hub-profile dl { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 0px 0px 20px; }
.spx-account-hub .hub-profile dl > div { display: block; border: 0px; padding: 0px; min-width: 0px; }
.spx-account-hub .hub-profile dt { font-size: 10px; line-height: 1.6; text-transform: uppercase; letter-spacing: 0.06em; color: rgb(156, 172, 192); margin-bottom: 5px; }
.spx-account-hub .hub-profile dd { font-size: 13px; line-height: 1.5; margin: 0px; overflow-wrap: anywhere; }
.hub-profile-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; }
.hub-profile-footer > span { font-size: 11px; color: rgb(158, 175, 192); }
.spx-account-hub .hub-profile-footer .join-secondary { width: auto; min-height: 40px; margin: 0px; padding: 8px 14px; font-size: 11px; }
.spx-account-hub .hub-sports { grid-area: sports; border: 1px solid transparent; border-radius: 12px; background: var(--sp-panel) padding-box,var(--sp-metal) border-box; box-shadow: rgba(255, 255, 255, 0.047) 0px 1px inset, rgba(0, 0, 0, 0.2) 0px 16px 40px; padding: 26px !important; margin: 0px !important; }
.spx-account-hub .hub-sports h2 { font: 800 28px / 1.15 "Barlow Condensed", Inter, sans-serif; color: rgb(237, 243, 249); margin: 9px 0px 8px; letter-spacing: -0.02em; }
.spx-account-hub .hub-sports > p { font-size: 13px; line-height: 1.65; color: rgb(181, 195, 210); max-width: 780px; margin: 0px 0px 20px; }
.spx-account-hub .join-sport-buttons, .spx-account-hub .join-pro-choices { display: grid; grid-template-columns: repeat(5, minmax(0px, 1fr)); gap: 10px; counter-reset: sport-card 0; }
.spx-account-hub .join-pro-picker { max-width: none; }
.spx-account-hub .join-pro-options { margin: 0px; border: 0px; padding: 0px; }
.spx-account-hub .join-pro-options legend { font-size: 13px; color: rgb(237, 243, 250); }
.spx-account-hub .join-pro-help { font-size: 12px; line-height: 1.6; }
.spx-account-hub .join-sport-buttons button, .spx-account-hub .join-pro-choice { position: relative; display: flex; align-items: center; gap: 10px; min-height: 65px; padding: 13px 12px; border: 1px solid rgb(118, 136, 159); border-radius: 7px; background: linear-gradient(130deg, rgb(56, 70, 85) 0px, rgb(25, 36, 47) 22%, rgb(16, 24, 32) 64%, rgb(38, 52, 65)); box-shadow: rgba(9, 15, 22, 0.4) 0px 0px 0px 3px inset, rgba(238, 246, 255, 0.267) 0px 1px inset, rgba(0, 0, 0, 0.2) 0px 4px 10px; color: rgb(231, 238, 245); font: 600 13px / 1.4 Inter, sans-serif; text-align: left; cursor: pointer; overflow: hidden; }
.hub-sport-number, .spx-account-hub .join-pro-choice::before { font: 500 10px / 1 "JetBrains Mono", monospace; color: rgb(172, 189, 206); align-self: flex-start; }
.spx-account-hub .join-pro-choice::before { counter-increment: sport-card 1; content: counter(sport-card, decimal-leading-zero); }
.spx-account-hub .join-pro-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.spx-account-hub .join-pro-choice:focus-within { outline: rgb(255, 172, 110) solid 2px; outline-offset: 3px; }
.hub-sport-check, .spx-account-hub .join-pro-check { margin-left: auto; color: rgb(195, 208, 222); font-size: 16px; }
.spx-account-hub .join-sport-buttons button[aria-pressed="true"], .spx-account-hub .join-pro-choice.is-selected { color: rgb(255, 241, 228); border-color: rgb(255, 171, 110); background: linear-gradient(135deg, rgb(113, 72, 43), rgb(53, 40, 31) 35%, rgb(23, 27, 32) 80%); box-shadow: rgba(233, 124, 36, 0.15) 0px 0px 0px 3px inset, rgba(255, 216, 182, 0.267) 0px 1px inset; }
.spx-account-hub .join-sport-buttons button[aria-pressed="true"] .hub-sport-check, .spx-account-hub .join-pro-choice.is-selected .join-pro-check { color: rgb(255, 171, 110); }
.spx-account-hub .join-pro-choice.is-unavailable { opacity: 0.55; cursor: default; }
.spx-account-hub .join-pro-count { display: flex; align-items: center; gap: 15px; margin: 16px 0px; font-size: 12px; line-height: 1.6; }
.spx-account-hub .hub-sports > .join-primary, .spx-account-hub .hub-sports > .join-secondary { display: inline-flex; width: auto; min-height: 44px; margin: 0px 12px 0px 0px; padding: 11px 18px; }
.spx-account-hub .hub-sports .hub-preference-status { font: 400 11px / 1.6 "JetBrains Mono", monospace; color: rgb(180, 193, 207); margin: 15px 0px 0px; }
@media (max-width: 899px) {
  .spx-account-hub { padding: 40px 24px 56px !important; }
  .hub-grid { grid-template-columns: 1fr; grid-template-areas: "membership" "sports" "profile"; gap: 18px; }
  .spx-account-hub .hub-membership { min-height: 0px; }
  .hub-member-art { flex-basis: 130px; }
  .hub-member-art > .sp-pack { width: 120px; }
  .spx-account-hub .join-sport-buttons, .spx-account-hub .join-pro-choices { grid-template-columns: repeat(5, minmax(0px, 1fr)); }
  .spx-account-hub .join-account-intro { align-items: flex-start; }
  .hub-dashboard-link { font-size: 10px; }
}
@media (max-width: 599px) {
  .spx-account-hub { padding: 28px 18px 42px !important; }
  .hub-backdrop { inset: 0px -18px auto; height: 420px; }
  .spx-account-hub .join-account-intro { display: block; margin-bottom: 23px; }
  .spx-account-hub .join-account-intro h1 { font-size: 37px; }
  .spx-account-hub .join-account-intro p { font-size: 13px; }
  .hub-dashboard-link { margin-top: 12px; }
  .spx-account-hub .hub-membership { gap: 19px; align-items: flex-start; padding: 20px !important; }
  .hub-member-art { flex-basis: 76px; margin-top: 24px; }
  .hub-member-art > .sp-pack { width: 76px; }
  .hub-member-art .sp-pack-name { font-size: 22px; }
  .hub-member-art .sp-pack-brand { font-size: 6px; }
  .hub-member-art .sp-pack-play { height: 33px; top: 18px; }
  .hub-member-art .sp-pack-sport, .hub-member-art .sp-pack-edition { font-size: 4px; }
  .hub-pack-stack { width: 70px; height: 120px; }
  .hub-pack-stack .sp-pack { width: 56px; }
  .hub-pack-stack .sp-pack:first-child { transform: translate(-6px, -4px) rotate(-11deg); }
  .hub-pack-stack .sp-pack:nth-child(2) { transform: translate(14px, -4px) rotate(11deg); }
  .hub-pack-stack .sp-pack:last-child { transform: translate(4px, 9px); }
  .spx-account-hub .hub-membership h2 { font-size: 26px; }
  .spx-account-hub .hub-membership .join-primary, .spx-account-hub .hub-membership .join-secondary { letter-spacing: 0px; padding: 10px; font-size: 10px !important; }
  .spx-account-hub .hub-profile, .spx-account-hub .hub-sports { padding: 20px !important; }
  .spx-account-hub .join-sport-buttons, .spx-account-hub .join-pro-choices { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 9px; }
  .spx-account-hub .join-sport-buttons button, .spx-account-hub .join-pro-choice { min-height: 57px; padding: 11px 10px; font-size: 13px; }
  .spx-account-hub .join-pro-count { display: block; }
  .spx-account-hub .join-pro-count span { display: block; margin-top: 4px; }
  .spx-account-hub .hub-sports > .join-primary, .spx-account-hub .hub-sports > .join-secondary { width: 100%; margin: 8px 0px 0px; justify-content: center; }
  .spx-account-hub .hub-profile dl { grid-template-columns: 1fr; }
  .spx-account-hub .hub-profile h2 { font-size: 24px; }
  .spx-account-hub .hub-membership p { font-size: 12px; }
  .spx-account-hub .hub-membership .join-fine-print { font-size: 11px; }
  .spx-account-hub .join-membership-status { font-size: 9px; }
}
.sp-pack-sports { position: absolute; inset: 21% 4% 31%; display: flex; overflow: hidden; mask-image: linear-gradient(transparent, rgb(0, 0, 0) 10%, rgb(0, 0, 0) 75%, transparent); }
.sp-pack-sports img { display: block; width: 34%; height: 100%; min-width: 0px; object-fit: cover; object-position: 50% 22%; filter: contrast(1.08) saturate(0.85); }
.sp-pack-sports img:nth-child(2) { transform: scale(1.14); z-index: 1; }
.sp-pack-brand { z-index: 2; }
.spx-enroll .join-flow { border: 0px; border-radius: 0px; background: linear-gradient(135deg, rgba(16, 21, 27, 0.91), rgba(8, 12, 17, 0.937)); box-shadow: none; overflow: visible; }
.spx-enroll .join-steps { padding: 0px; background: transparent; border: 0px; gap: 20px; }
.spx-enroll .join-steps li { justify-content: flex-start; min-height: 52px; padding: 0px 0px 16px; border-bottom: 1px solid rgba(100, 113, 126, 0.4); color: rgb(143, 155, 170); gap: 9px; font-size: 11px; letter-spacing: 0.04em; }
.spx-enroll .join-steps li span { width: auto; height: auto; background: none; border: 0px; border-radius: 0px; box-shadow: none; color: rgb(143, 155, 170); font-size: 10px; }
.spx-enroll .join-steps li.is-current { border-bottom-color: rgb(255, 144, 63); color: rgb(240, 243, 246); }
.spx-enroll .join-steps li.is-current span { background: none; border: 0px; box-shadow: none; color: rgb(255, 150, 63); }
.spx-enroll .join-steps li.is-done span { background: none; border: 0px; color: rgb(201, 211, 223); }
.spx-enroll .join-flow-content { padding: 30px 0px 0px; }
.spx-enroll .join-unavailable, .spx-enroll .join-pending { background: transparent; border-width: 1px 0px 0px; border-style: solid none none; border-color: rgba(101, 120, 142, 0.267) currentcolor currentcolor; border-image: none; border-radius: 0px; box-shadow: none; padding: 24px 0px 0px; }
.spx-enroll .join-unavailable .join-status-icon, .spx-enroll .join-pending .join-status-icon { background: transparent; border: 1px solid rgba(125, 139, 153, 0.333); border-radius: 8px; color: rgb(200, 211, 223); }
@media (max-width: 479px) {
  .spx-enroll .join-steps { gap: 12px; }
  .spx-enroll .join-steps li { font-size: 10px; gap: 7px; }
  .spx-enroll .join-flow-content, .spx-enroll.is-tier-step .join-flow-content { padding: 25px 0px 0px; }
}
.spx-sport-navigation { display: flex; gap: 18px; overflow-x: auto; overscroll-behavior-x: contain; padding: 18px 3px 20px; margin: 12px 0px 20px; scrollbar-width: thin; scrollbar-color: rgb(140, 98, 63) transparent; }
.spx-sport-navigation button { flex: 0 0 74px; display: flex; flex-direction: column; align-items: center; gap: 9px; border: 0px; background: transparent; color: rgb(201, 209, 215); padding: 3px; font: 600 11px / 1.25 Inter, Arial, sans-serif; white-space: nowrap; cursor: pointer; }
.spx-sport-medallion { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; border: 2px solid rgb(156, 169, 180); background: linear-gradient(135deg, rgb(240, 245, 249), rgb(108, 122, 134) 7%, rgb(29, 40, 50) 15%, rgb(52, 67, 79), rgb(16, 25, 34) 85%, rgb(154, 171, 184) 97%); box-shadow: rgb(17, 28, 38) 0px 0px 0px 3px inset, rgba(0, 0, 0, 0.533) 0px 3px 8px; color: rgb(238, 244, 249); transition: border-color 0.18s, box-shadow 0.18s; }
.spx-sport-medallion svg { width: 27px; height: 27px; filter: drop-shadow(rgb(0, 0, 0) 0px 1px 2px); }
.spx-sport-navigation button[aria-pressed="true"] { color: rgb(255, 171, 103); }
.spx-sport-navigation button[aria-pressed="true"] .spx-sport-medallion { border-color: rgb(255, 155, 77); box-shadow: rgb(81, 48, 27) 0px 0px 0px 3px inset, rgba(247, 128, 41, 0.24) 0px 0px 18px; color: rgb(255, 184, 126); }
.spx-sport-navigation button:focus-visible { outline: rgb(255, 155, 77) solid 2px; outline-offset: 3px; border-radius: 8px; }
.spx-matchup-panel { position: relative; isolation: isolate; overflow: hidden; border: 2px solid rgb(172, 186, 198); border-radius: 18px; background: linear-gradient(135deg, rgb(232, 241, 248), rgb(111, 130, 146) 1%, rgb(29, 41, 52) 3%, rgb(10, 18, 26) 48%, rgb(42, 59, 72) 97%, rgb(193, 208, 219)); box-shadow: rgb(11, 18, 27) 0px 0px 0px 4px inset, rgba(106, 123, 136, 0.36) 0px 0px 0px 5px inset, rgba(0, 0, 0, 0.4) 0px 12px 35px; color: rgb(244, 248, 250); width: 100%; min-width: 0px; }
.spx-matchup-top { position: relative; z-index: 2; display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 20px 24px 8px; font: 600 12px / 1.4 Inter, Arial, sans-serif; }
.spx-matchup-top > span { color: rgb(255, 173, 109); white-space: nowrap; }
.spx-matchup-top i { font: 9px / 1 monospace; color: rgb(174, 189, 199); margin-left: 8px; letter-spacing: 2px; }
.spx-matchup-top time { text-align: right; color: rgb(211, 221, 229); }
.spx-matchup-teams { display: grid; grid-template-columns: 1fr 1fr; position: relative; min-height: 235px; }
.spx-match-side { min-width: 0px; position: relative; }
.spx-match-at { position: absolute; left: -12px; top: 46%; z-index: 3; color: rgb(184, 196, 205); font: 600 24px / 1 monospace; }
.spx-match-team { position: relative; overflow: hidden; min-height: 235px; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 15px 25px 28px; gap: 14px; }
.spx-team-watermark { position: absolute; z-index: -1; width: 260px; height: 260px; object-fit: contain; opacity: 0.11; top: 4px; left: -65px; pointer-events: none; }
.spx-match-side:nth-child(2) .spx-team-watermark { left: auto; right: -65px; }
.spx-team-logo { width: 100px; height: 100px; object-fit: contain; filter: drop-shadow(rgba(0, 0, 0, 0.533) 0px 3px 5px); }
.spx-team-name { position: relative; text-align: center; display: flex; flex-direction: column; gap: 4px; min-width: 0px; }
.spx-team-name span { font: 400 14px / 1.3 Inter, Arial, sans-serif; color: rgb(185, 198, 209); }
.spx-team-name strong { font: 800 27px / 1.1 "Barlow Condensed", Impact, sans-serif; overflow-wrap: anywhere; color: rgb(244, 248, 251); }
.spx-matchup-selections { position: relative; z-index: 2; border-top: 1px solid rgb(243, 139, 70); padding: 16px 20px; background: linear-gradient(110deg, rgb(21, 36, 49), rgb(10, 20, 29)); }
.spx-matchup-selections:empty { display: none; }
.spx-matchup-selections > a { display: inline-block; color: rgb(255, 180, 119); font-size: 12px; margin-top: 12px; }
.spx-team-selection { display: flex; flex-direction: column; gap: 5px; width: 100%; text-align: left; padding: 12px 14px; border-width: 1px 1px 1px 3px; border-style: solid; border-color: rgb(118, 139, 155) rgb(118, 139, 155) rgb(118, 139, 155) rgb(255, 150, 63); border-image: none; border-radius: 8px; color: rgb(245, 248, 251); background: linear-gradient(110deg, rgb(53, 70, 82), rgb(27, 41, 52)); cursor: pointer; }
.spx-team-selection + .spx-team-selection { margin-top: 9px; }
.spx-team-selection small { color: rgb(255, 181, 121); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; }
.spx-team-selection strong { font: 700 16px / 1.4 Inter, Arial, sans-serif; }
.spx-team-selection span { color: rgb(187, 204, 215); font-size: 11px; }
.spx-team-selection:focus-visible { outline: rgb(255, 161, 85) solid 2px; outline-offset: 3px; }
.spx-published-matchup { max-width: 900px; margin: 0px auto 42px; }
.spx-published-matchup > .spx-matchup-panel { margin-bottom: 24px; }
.spx-published-matchup > .published-portrait-grid { max-width: 760px; }
.spx-match-note { font-size: 11px; line-height: 1.5; color: rgb(188, 203, 214); margin: 12px 0px 0px; }
.sb-featured-rail > .spx-featured-matchup { flex: 0 0 450px; max-width: 100%; min-width: 0px; }
.spx-featured-matchup .spx-matchup-panel { height: 100%; }
.spx-featured-matchup .sb-prediction { border: 0px; padding: 0px; margin: 0px; background: none; }
.spx-featured-matchup .sb-prediction strong { color: rgb(255, 175, 112); font-size: 16px; }
.spx-featured-matchup .sb-prediction span { font-size: 13px; color: rgb(224, 232, 237); }
.spx-featured-matchup .spx-matchup-top { padding: 20px 20px 8px; }
@media (max-width: 619px) {
  .spx-sport-navigation { gap: 10px; margin: 12px -4px 16px; padding: 15px 4px; }
  .spx-sport-navigation button { flex-basis: 62px; font-size: 10px; }
  .spx-sport-medallion { width: 52px; height: 52px; }
  .spx-matchup-top { padding: 18px 16px 6px; font-size: 10px; }
  .spx-matchup-top i { display: none; }
  .spx-matchup-teams, .spx-match-team { min-height: 195px; }
  .spx-match-team { padding: 12px 14px 22px; gap: 12px; }
  .spx-team-logo { width: 78px; height: 78px; }
  .spx-team-name span { font-size: 12px; }
  .spx-team-name strong { font-size: 23px; }
  .spx-team-watermark { width: 210px; height: 210px; left: -65px; }
  .spx-matchup-selections { padding: 13px; }
  .spx-team-selection strong { font-size: 14px; }
  .sb-featured-rail > .spx-featured-matchup { flex-basis: calc(-52px + 100vw); }
  .spx-published-matchup { margin-bottom: 30px; }
}
.spx-sport-medallion .spx-league-logo { display: block; width: 38px; height: 38px; object-fit: contain; filter: none; opacity: 1; }
@media (max-width: 619px) {
  .spx-sport-medallion .spx-league-logo { width: 34px; height: 34px; }
}
.spx-player-filters { display: flex; gap: 18px; margin: 20px 0px 28px; flex-wrap: wrap; }
.spx-player-filters label, .spx-history-toolbar label { display: grid; gap: 8px; color: rgb(195, 200, 208); font-size: 12px; }
.spx-player-filters input, .spx-player-filters select, .spx-history-toolbar select { background: rgb(21, 24, 30); color: rgb(238, 238, 238); border: 1px solid rgb(85, 91, 102); border-radius: 8px; padding: 12px; max-width: 100%; min-height: 44px; }
.spx-player-filters input { width: 280px; }
.spx-history-players { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 24px; }
.spx-history-players .lp-player-card { width: 100%; max-width: 100%; margin: 0px; cursor: pointer; }
.spx-history-players .lp-player-card:focus-visible { outline: rgb(242, 122, 57) solid 3px; outline-offset: 5px; }
.spx-history-more { text-align: center; margin: 30px 0px; }
.spx-history-dialog { width: min(850px, -28px + 100vw); max-width: 850px; max-height: 90dvh; overflow: auto; padding: 28px; color: rgb(228, 231, 236); background: linear-gradient(145deg, rgb(40, 45, 53), rgb(16, 19, 24) 70%); border: 1px solid rgb(154, 162, 174); border-radius: 18px; }
.spx-history-dialog::backdrop { background: rgba(0, 0, 0, 0.733); backdrop-filter: blur(5px); }
.spx-history-dialog header { display: flex; justify-content: space-between; align-items: center; }
.spx-history-dialog header button { width: 44px; height: 44px; font-size: 30px; }
.spx-history-dialog h2 { margin: 12px 0px; font-size: 30px; }
.spx-history-toolbar { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-top: 24px; }
.spx-history-toolbar small { display: block; margin-top: 7px; color: rgb(173, 181, 192); font-size: 12px; }
.spx-history-chart { width: 100%; height: auto; display: block; margin: 20px 0px 5px; color: rgb(195, 200, 208); }
.spx-history-chart text { fill: currentcolor; font-size: 12px; font-family: inherit; }
.spx-history-chart .spx-chart-value { fill: rgb(255, 255, 255); font-size: 15px; font-weight: 700; }
.spx-history-table { width: 100%; border-collapse: collapse; min-width: 530px; font-size: 13px; }
.spx-history-table caption { text-align: left; padding: 10px 0px; color: rgb(170, 179, 191); }
.spx-history-table th, .spx-history-table td { text-align: left; padding: 13px 9px; border-bottom: 1px solid rgb(60, 66, 76); }
.spx-history-table th { color: rgb(174, 182, 194); font-size: 11px; text-transform: uppercase; }
.spx-history-table td small { display: block; max-width: 220px; color: rgb(157, 166, 179); font-size: 10px; margin-top: 5px; }
.spx-history-table a { color: rgb(238, 238, 238); text-decoration: none; }
.spx-history-table td:last-child { color: rgb(255, 153, 93); font-size: 17px; }
.spx-history-source { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; border-top: 1px solid rgb(71, 78, 89); padding-top: 16px; font-size: 11px; color: rgb(173, 181, 192); }
.spx-history-source a { color: rgb(255, 153, 93); }
.spx-history-source small { width: 100%; }
.spx-history-dialog .sb-note { line-height: 1.6; }
.spx-history-dialog .sb-log-scroll { overflow-x: auto; }
@media (max-width: 1100px) {
  .spx-history-players { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 18px; }
}
@media (max-width: 700px) {
  .spx-history-players { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; }
  .spx-player-filters label, .spx-player-filters input { width: 100%; }
  .spx-history-dialog { padding: 18px; }
  .spx-history-toolbar { display: block; }
  .spx-history-toolbar label { margin-top: 16px; }
  .spx-history-toolbar select { width: 100%; }
  .spx-history-dialog h2 { font-size: 25px; }
  .spx-history-players .lp-player-card h2 { font-size: 22px; }
}
.sb-dialog.spx-history-dialog { margin: auto; width: min(850px, -28px + 100vw); max-width: 850px; max-height: 92dvh; padding: 24px; background: linear-gradient(145deg, rgb(40, 45, 53), rgb(16, 19, 24) 70%); }
.sb-dialog.spx-history-dialog h2 { margin: 10px 0px; font-size: 28px; }
.spx-history-dialog .spx-history-chart { max-height: 185px; margin: 12px 0px; }
.spx-history-dialog .spx-history-toolbar { margin-top: 12px; }
.sb-dialog.spx-history-dialog td { padding: 10px 9px; }
.sb-dialog.spx-history-dialog .sb-note { margin: 10px 0px; font-size: 11px; }
.sb-dialog.spx-history-dialog .spx-history-table { min-width: 530px; }
@media (max-width: 700px) {
  .sb-dialog.spx-history-dialog { padding: 16px; }
  .spx-history-dialog .spx-history-chart { max-height: none; }
  .spx-history-dialog .spx-history-table { font-size: 12px; }
}
@media (max-width: 700px) {
  .sb-dialog.spx-history-dialog .spx-history-table { min-width: 0px; table-layout: fixed; width: 100%; font-size: 10px; }
  .sb-dialog.spx-history-dialog .spx-history-table th, .sb-dialog.spx-history-dialog .spx-history-table td { padding: 10px 4px; overflow-wrap: anywhere; }
  .spx-history-table th:first-child { width: 28%; }
  .spx-history-table th:nth-child(2) { width: 30%; }
  .spx-history-table th:nth-child(3) { width: 22%; }
  .spx-history-table th:nth-child(4) { width: 20%; }
  .sb-dialog.spx-history-dialog .spx-history-table th, .spx-history-dialog .spx-history-table td small { font-size: 9px; }
  .spx-history-dialog .spx-history-chart text { font-size: 20px; }
  .spx-history-dialog .spx-history-chart .spx-chart-value { font-size: 24px; }
  .spx-history-dialog .spx-history-source { line-height: 1.7; }
}
.spx-pick-strip { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 16px; border-width: 1px 1px 1px 3px; border-style: solid; border-color: rgba(210, 132, 81, 0.31) rgba(210, 132, 81, 0.31) rgba(210, 132, 81, 0.31) rgb(228, 130, 59); border-image: none; border-radius: 10px; background: linear-gradient(105deg, rgba(224, 120, 36, 0.094), rgba(195, 204, 211, 0.043) 70%); min-width: 0px; }
.spx-pick-choice { display: flex; align-items: center; gap: 12px; min-width: 0px; }
.spx-pick-choice img { width: 38px; height: 38px; object-fit: contain; flex: 0 0 auto; filter: drop-shadow(rgba(0, 0, 0, 0.4) 0px 2px 4px); }
.spx-pick-choice small { display: block; color: rgb(194, 199, 207); font-size: 11px; letter-spacing: 0.07em; margin-bottom: 6px; }
.spx-pick-choice strong { display: block; font-family: Inter, sans-serif; font-weight: 650; font-size: 18px; line-height: 1.35; color: rgb(241, 243, 246); overflow-wrap: anywhere; }
.spx-pick-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 9px; flex: 0 0 auto; text-align: right; }
.spx-pick-price strong { display: block; color: rgb(248, 186, 136); font-size: 19px; font-weight: 700; line-height: 1.2; }
.spx-pick-price small { display: block; color: rgb(197, 203, 211); font-size: 10px; margin-top: 4px; white-space: nowrap; }
.spx-pick-strip .spx-pick-actions button { background: transparent; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgba(200, 207, 217, 0.4); border-image: none; padding: 6px 0px; color: rgb(237, 240, 245); font-size: 11px; min-height: 32px; cursor: pointer; }
.spx-pick-actions button:focus-visible { outline: rgb(255, 173, 113) solid 2px; outline-offset: 4px; }
.spx-pick-unpriced { font-size: 11px; color: rgb(183, 190, 199); }
.spx-pick-result { display: block; font-size: 10px; margin-top: 5px; color: rgb(199, 205, 214); }
.spx-pick-result.win { color: rgb(166, 213, 173); }
.spx-pick-result.loss { color: rgb(237, 176, 162); }
.spx-pick-unavailable { display: flex; justify-content: space-between; gap: 15px; align-items: center; font-size: 12px; color: rgb(185, 192, 202); }
.spx-pick-unavailable a { font-size: 11px; white-space: nowrap; }
.sb-dialog.spx-pick-dialog { margin: auto; width: min(700px, -28px + 100vw); max-width: 700px; max-height: 90dvh; padding: 26px; background: linear-gradient(145deg, rgb(41, 46, 54), rgb(17, 20, 25) 70%); color: rgb(237, 240, 244); }
.sb-dialog.spx-pick-dialog h2 { font-family: Inter, sans-serif; font-size: 25px; letter-spacing: -0.03em; }
.spx-pick-contract { display: grid; gap: 9px; padding: 18px; margin: 20px 0px; border: 1px solid rgba(210, 132, 81, 0.333); border-radius: 10px; background: rgba(237, 125, 39, 0.063); }
.spx-pick-contract small { color: rgb(185, 192, 202); font-size: 11px; }
.spx-pick-contract strong { font-size: 16px; line-height: 1.5; }
.spx-pick-contract span { font-size: 12px; color: rgb(201, 207, 215); }
.spx-pick-reasons { padding-left: 20px; font-size: 13px; line-height: 1.75; }
.spx-pick-reasons li { padding: 5px 0px; overflow-wrap: anywhere; }
.spx-pick-reasons a { color: rgb(246, 179, 125); }
.spx-pick-dialog .price-grid:empty { display: none; }
.spx-pick-dialog::backdrop { background: rgba(0, 0, 0, 0.733); backdrop-filter: blur(5px); }
@media (max-width: 600px) {
  .spx-pick-strip { padding: 14px 12px; gap: 10px; }
  .spx-pick-choice { gap: 9px; }
  .spx-pick-choice img { width: 30px; height: 30px; }
  .spx-pick-choice strong { font-size: 15px; }
  .spx-pick-price strong { font-size: 17px; }
  .spx-pick-price small { font-size: 10px; }
  .spx-pick-strip .spx-pick-actions button { min-height: 38px; }
  .sb-dialog.spx-pick-dialog { padding: 20px; }
  .sb-dialog.spx-pick-dialog h2 { font-size: 22px; }
}
.spx-pick-strip[role="button"] { cursor: pointer; }
.spx-pick-strip[role="button"]:focus-visible { outline: rgb(255, 173, 113) solid 2px; outline-offset: 4px; }
.spx-account-chrome { max-width: 1240px !important; padding: 52px 30px 76px !important; }
.spx-account-chrome .join-account-intro { margin-bottom: 34px; align-items: flex-end; }
.spx-account-chrome .join-account-intro h1 { font: 750 64px / 1.05 Inter, sans-serif; letter-spacing: -0.055em; margin: 0px 0px 16px; text-transform: none; }
.spx-account-chrome .join-account-intro h1 span { color: rgb(244, 154, 84); }
.spx-account-chrome .join-account-intro p { font-size: 14px; color: rgb(170, 182, 196); }
.spx-account-chrome .hub-dashboard-link { font: 500 11px Inter, sans-serif; color: rgb(200, 209, 219); padding: 11px 0px; }
.spx-account-chrome .hub-grid { grid-template-columns: minmax(0px, 0.9fr) minmax(0px, 1.3fr); grid-template-areas: "profile profile" "membership sports"; gap: 24px; align-items: stretch; }
.spx-account-chrome .hub-profile, .spx-account-chrome .hub-membership, .spx-account-chrome .hub-sports { border-radius: 14px; border-width: 2px 1px 1px !important; border-style: solid !important; border-color: rgb(215, 224, 232) rgba(157, 174, 191, 0.44) rgba(157, 174, 191, 0.44) !important; border-image: none !important; background: linear-gradient(125deg, rgb(48, 57, 69), rgb(26, 34, 45) 48%, rgb(20, 29, 39)) !important; box-shadow: rgba(255, 255, 255, 0.157) 0px 1px inset, rgba(0, 0, 0, 0.2) 0px 14px 28px !important; }
.spx-account-chrome .hub-profile { display: grid; grid-template-columns: minmax(0px, 1fr) auto; grid-template-areas: "identity session" "details details"; gap: 0px 24px; padding: 28px 32px !important; background: linear-gradient(120deg, rgb(54, 65, 78), rgb(27, 37, 49) 60%, rgb(39, 51, 64)) !important; }
.spx-account-chrome .hub-profile-heading { grid-area: identity; gap: 22px; }
.spx-account-chrome .hub-avatar { width: 76px; height: 76px; border-radius: 12px; font: 750 28px Inter, sans-serif; text-transform: uppercase; border: 2px solid rgb(214, 222, 231); box-shadow: rgba(35, 49, 65, 0.333) 0px 0px 0px 4px inset, rgba(0, 0, 0, 0.333) 0px 5px 14px; }
.spx-account-chrome .join-eyebrow { font: 600 10px Inter, sans-serif; letter-spacing: 0.15em; color: rgb(174, 188, 203); }
.spx-account-chrome .hub-profile h2 { font: 650 28px / 1.2 Inter, sans-serif; letter-spacing: -0.035em; margin: 9px 0px 7px; }
.spx-account-chrome .hub-profile-heading p { font-size: 13px; color: rgb(193, 204, 216); }
.spx-account-chrome .hub-profile-footer { grid-area: session; display: flex; flex-direction: column; justify-content: center; align-items: flex-end; gap: 12px; margin: 0px; }
.spx-account-chrome .hub-profile-footer > span { font: 500 10px Inter, sans-serif; color: rgb(190, 209, 197); }
.spx-account-chrome .hub-profile-footer > span::before { content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: rgb(164, 203, 180); margin-right: 7px; }
.spx-account-chrome .hub-profile-footer .join-secondary { padding: 9px 20px; min-height: 38px; border: 1px solid rgba(154, 170, 187, 0.44); border-radius: 6px; background: rgba(17, 27, 38, 0.333); color: rgb(220, 228, 237); }
.spx-account-chrome .hub-profile-details { grid-area: details; margin-top: 24px; border-bottom: 0px; }
.spx-account-chrome .hub-profile-details summary { padding: 18px 0px 0px; font-size: 12px; }
.spx-account-chrome .hub-profile-details summary small { font-size: 10px; color: rgb(155, 170, 189); }
.spx-account-chrome .hub-profile-details[open] summary { padding-bottom: 18px; }
.spx-account-chrome .hub-profile dl { grid-template-columns: repeat(4, minmax(0px, 1fr)); padding: 18px; border-radius: 8px; background: rgba(11, 20, 30, 0.333); margin: 0px; }
.spx-account-chrome .hub-profile dd { font-size: 12px; }
.spx-account-chrome .hub-membership { display: block; min-height: 0px; padding: 28px !important; }
.spx-account-chrome .hub-member-art { float: right; width: 62px; min-height: 88px; margin: 0px 0px 18px 18px; opacity: 0.85; }
.spx-account-chrome .hub-member-art > .sp-pack { width: 62px; }
.spx-account-chrome .hub-member-art .sp-pack-name { font-size: 20px; }
.spx-account-chrome .hub-member-art .sp-pack-brand { font-size: 5px; }
.spx-account-chrome .hub-member-art .sp-pack-sport, .spx-account-chrome .hub-member-art .sp-pack-edition { font-size: 3px; }
.spx-account-chrome .hub-pack-stack { width: 62px; height: 90px; }
.spx-account-chrome .hub-pack-stack .sp-pack { width: 48px; }
.spx-account-chrome .hub-pack-stack .sp-pack:nth-child(2) { transform: translate(14px, -7px) rotate(12deg); }
.spx-account-chrome .hub-membership h2 { font: 650 28px / 1.2 Inter, sans-serif; letter-spacing: -0.03em; margin: 16px 0px 10px; }
.spx-account-chrome .join-membership-status { display: table; font: 500 10px / 1.6 Inter, sans-serif; margin-top: 18px; padding: 6px 9px; background: rgba(244, 154, 84, 0.063) !important; border: 1px solid rgba(219, 154, 101, 0.3) !important; color: rgb(240, 187, 145) !important; }
.spx-account-chrome .join-membership-status.is-active { background: rgba(157, 214, 178, 0.05) !important; border-color: rgba(157, 214, 178, 0.267) !important; color: rgb(180, 212, 191) !important; }
.spx-account-chrome .hub-membership p { font-size: 12px; line-height: 1.75; }
.spx-account-chrome .join-account-plan-price { padding: 15px 0px; border-top: 1px solid rgba(166, 181, 196, 0.17); border-bottom: 1px solid rgba(166, 181, 196, 0.17); clear: both; }
.spx-account-chrome .join-account-plan-price strong { font: 650 34px Inter, sans-serif; letter-spacing: -0.04em; color: rgb(237, 242, 246); }
.spx-account-chrome .hub-membership .join-primary { background: linear-gradient(135deg, rgb(248, 167, 98), rgb(233, 137, 62)); color: rgb(28, 19, 13); border: 1px solid rgb(255, 186, 135); border-radius: 7px; box-shadow: rgba(255, 225, 197, 0.467) 0px 1px inset; min-height: 44px; font: 650 12px Inter, sans-serif; }
.spx-account-chrome .hub-membership .join-secondary { background: rgba(16, 26, 37, 0.333); border: 1px solid rgba(129, 146, 166, 0.37); border-radius: 7px; min-height: 42px; color: rgb(217, 225, 235); font: 500 11px Inter, sans-serif; }
.spx-account-chrome .hub-membership .join-text-button { font-size: 11px; margin-top: 14px; color: rgb(239, 180, 134); }
.spx-account-chrome .hub-sports { padding: 28px !important; }
.spx-account-chrome .hub-sports h2 { font: 650 28px / 1.2 Inter, sans-serif; letter-spacing: -0.03em; margin: 16px 0px 12px; }
.spx-account-chrome .hub-sports > p { font-size: 12px; color: rgb(174, 189, 205); line-height: 1.75; margin-bottom: 24px; }
.spx-account-chrome .join-sport-buttons { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px; }
.spx-account-chrome .join-sport-buttons button { min-height: 74px; padding: 12px 10px; font-size: 11px; background: linear-gradient(135deg, rgb(52, 65, 79), rgb(24, 35, 48) 65%); border: 1px solid rgba(131, 148, 168, 0.404); box-shadow: rgba(220, 230, 239, 0.19) 0px 1px inset, rgba(0, 0, 0, 0.133) 0px 3px 7px; border-radius: 8px; gap: 8px; }
.spx-account-chrome .account-sport-icon { display: grid; place-items: center; flex: 0 0 28px; width: 28px; height: 32px; color: rgb(211, 220, 230); }
.spx-account-chrome .account-sport-icon img, .spx-account-chrome .account-sport-icon svg { width: 26px; height: 26px; object-fit: contain; }
.spx-account-chrome .hub-sport-check { font-size: 15px; color: rgb(172, 186, 201); }
.spx-account-chrome .join-sport-buttons button[aria-pressed="true"] { border-color: rgb(233, 163, 101); background: linear-gradient(135deg, rgb(123, 82, 51), rgb(44, 43, 42) 70%); color: rgb(255, 240, 226); box-shadow: rgba(248, 197, 153, 0.4) 0px 1px inset; }
.spx-account-chrome .hub-sports .hub-preference-status { border-top: 1px solid rgba(142, 159, 176, 0.196); padding-top: 18px; margin: 22px 0px 0px; font: 400 10px / 1.6 Inter, sans-serif; }
.spx-account-chrome button:focus-visible, .spx-account-chrome summary:focus-visible, .spx-account-chrome a:focus-visible { outline: rgb(242, 164, 103) solid 2px; outline-offset: 4px; }
@media (max-width: 899px) {
  .spx-account-chrome { padding: 36px 24px 60px !important; }
  .spx-account-chrome .hub-grid { grid-template-columns: 1fr; grid-template-areas: "profile" "membership" "sports"; gap: 20px; }
  .spx-account-chrome .join-account-intro h1 { font-size: 52px; }
  .spx-account-chrome .hub-profile dl { grid-template-columns: 1fr 1fr; }
  .spx-account-chrome .join-sport-buttons { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@media (max-width: 599px) {
  .spx-account-chrome { padding: 30px 18px 48px !important; }
  .spx-account-chrome .join-account-intro { margin-bottom: 24px; }
  .spx-account-chrome .join-account-intro h1 { font-size: 46px; }
  .spx-account-chrome .join-account-intro p { font-size: 12px; }
  .spx-account-chrome .hub-profile { grid-template-columns: 1fr; grid-template-areas: "identity" "details" "session"; padding: 22px !important; }
  .spx-account-chrome .hub-profile-heading { gap: 14px; }
  .spx-account-chrome .hub-avatar { width: 54px; height: 60px; font-size: 22px; }
  .spx-account-chrome .hub-profile h2 { font-size: 22px; }
  .spx-account-chrome .hub-profile-heading p { font-size: 11px; }
  .spx-account-chrome .hub-profile-footer { flex-direction: row; justify-content: space-between; align-items: center; margin-top: 22px; gap: 10px; }
  .spx-account-chrome .hub-profile dl { grid-template-columns: 1fr; }
  .spx-account-chrome .hub-profile-footer > span { font-size: 9px; }
  .spx-account-chrome .hub-membership, .spx-account-chrome .hub-sports { padding: 24px 22px !important; }
  .spx-account-chrome .hub-membership h2, .spx-account-chrome .hub-sports h2 { font-size: 25px; }
  .spx-account-chrome .join-sport-buttons { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .spx-account-chrome .join-sport-buttons button { min-height: 65px; font-size: 10px; gap: 7px; }
  .spx-account-chrome .hub-member-art { margin-top: 0px; }
  .spx-account-chrome .account-sport-icon { flex-basis: 24px; width: 24px; }
  .spx-account-chrome .account-sport-icon img, .spx-account-chrome .account-sport-icon svg { width: 23px; height: 23px; }
}
.spx-account-chrome .hub-avatar.hub-brand-badge { width: 88px; height: 42px; border-width: 1px 1px 2px; border-style: solid; border-color: rgb(169, 184, 199) rgb(169, 184, 199) rgb(216, 144, 85); border-image: none; border-radius: 8px; background: linear-gradient(135deg, rgb(76, 88, 100), rgb(24, 34, 46) 42%, rgb(48, 62, 76)); box-shadow: rgba(225, 232, 238, 0.4) 0px 1px inset, rgba(0, 0, 0, 0.267) 0px 3px 9px; padding: 7px; }
.spx-account-chrome .hub-brand-badge .ch-wordmark { font-size: 14px; line-height: 1; letter-spacing: -0.06em; white-space: nowrap; }
.spx-account-chrome .hub-brand-badge .ch-wordmark span, .spx-account-chrome .hub-brand-badge .ch-wordmark b { font-size: inherit; }
@media (max-width: 599px) {
  .spx-account-chrome .hub-avatar.hub-brand-badge { width: 72px; height: 38px; padding: 5px; border-radius: 7px; }
  .spx-account-chrome .hub-brand-badge .ch-wordmark { font-size: 12px; }
  .spx-account-chrome .hub-profile-heading { gap: 12px; }
}
.sb-board, .sb-studio, .sb-member-playbook { color: rgb(234, 240, 247); font-family: Inter, Arial, sans-serif; --muted: #a7b8cb; --metal: linear-gradient(125deg,#33404fed,#141f2b 48%,#192431); }
.sb-board { max-width: 1340px; margin: auto; padding: 22px 36px 70px; background: linear-gradient(rgba(8, 13, 19, 0.86), rgb(8, 13, 19) 630px), url("/assets/public-home/tactical-board.webp") right top / 1100px auto no-repeat; }
.sb-board button, .sb-studio button { cursor: pointer; }
.sb-board button:disabled, .sb-studio button:disabled { opacity: 0.45; cursor: not-allowed; }
.sb-board :is(button, a, input, select):focus-visible, .sb-studio :is(button, a, input, select, summary):focus-visible, .sb-dialog :is(button, a):focus-visible { outline: rgb(255, 173, 113) solid 2px; outline-offset: 4px; }
.sb-sports { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: thin; padding: 4px 2px 16px; margin-bottom: 20px; }
.sb-sports button { flex: 0 0 auto; min-height: 42px; padding: 10px 17px; border: 1px solid rgba(160, 177, 196, 0.4); border-radius: 6px; background: linear-gradient(140deg, rgb(53, 64, 77), rgb(19, 29, 40) 55%, rgb(41, 55, 71)); color: rgb(220, 231, 243); font: 600 12px / 1.5 Inter, sans-serif; box-shadow: rgba(225, 236, 243, 0.2) 0px 1px inset; }
.sb-sports button[aria-pressed="true"], .sb-primary { background: linear-gradient(rgb(255, 176, 108), rgb(255, 136, 46)); border: 1px solid rgb(255, 193, 140); color: rgb(25, 17, 11) !important; }
.sb-board-heading { display: flex; justify-content: space-between; align-items: center; gap: 28px; padding: 8px 0px 26px; }
.sb-eyebrow { font: 500 10px / 1.5 "JetBrains Mono", monospace; letter-spacing: 0.12em; color: rgb(180, 195, 212); }
.sb-board-heading h1 { font: 900 clamp(40px, 5.5vw, 72px) / 0.95 "Barlow Condensed", Inter, sans-serif; margin: 14px 0px; }
.sb-board-heading h1 em { font-style: normal; color: rgb(255, 152, 72); }
.sb-board-heading p { font-size: 14px; line-height: 1.7; color: rgb(183, 198, 214); }
.sb-preview-stamp { display: flex; flex-direction: column; gap: 10px; border: 1px solid rgba(154, 171, 193, 0.42); border-radius: 8px; padding: 22px 26px; background: var(--metal); box-shadow: rgba(217, 229, 243, 0.267) 0px 1px inset; }
.sb-preview-stamp b { font: 600 11px / 1.5 "JetBrains Mono", monospace; color: rgb(255, 181, 120); }
.sb-preview-stamp span, .sb-preview-stamp a { font-size: 12px; color: rgb(194, 209, 225); }
.sb-preview-stamp a { padding-top: 12px; border-top: 1px solid rgba(148, 165, 185, 0.2); }
.sb-banner { display: flex; gap: 18px; align-items: center; border-width: 1px 1px 1px 3px; border-style: solid; border-color: rgba(212, 138, 83, 0.31) rgba(212, 138, 83, 0.31) rgba(212, 138, 83, 0.31) rgb(255, 155, 78); border-image: none; background: rgba(48, 35, 24, 0.467); border-radius: 6px; padding: 13px 18px; font: 600 10px / 1.6 "JetBrains Mono", monospace; color: rgb(255, 186, 132); margin: 0px 0px 26px; }
.sb-banner span { font: 400 12px / 1.7 Inter, sans-serif; color: rgb(203, 190, 177); }
.sb-section { padding: 22px 0px 26px; border-bottom: 1px solid rgba(125, 143, 160, 0.17); }
.sb-section-title { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 14px; }
.sb-section-title h2 { font: 800 32px / 1.1 "Barlow Condensed", Inter, sans-serif; color: rgb(237, 243, 249); margin: 5px 0px 0px; }
.sb-section-title h3 { font-size: 18px; }
.sb-note { color: var(--muted); font-size: 12px; line-height: 1.7; margin: 10px 0px 18px; }
.sb-board :is(input, select), .sb-studio :is(input:not([type="checkbox"]), select) { border: 1px solid rgba(141, 157, 178, 0.467); border-radius: 6px; background: rgb(16, 27, 39); color: rgb(226, 234, 244); padding: 10px 12px; font: 400 13px / 1.5 Inter, sans-serif; min-height: 44px; max-width: 100%; color-scheme: dark; }
.sb-date, .sb-select { font-size: 11px; color: rgb(176, 195, 215); display: flex; gap: 10px; align-items: center; }
.sb-rail-caption { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.sb-rail-caption > div { display: flex; gap: 7px; }
.sb-rail-caption button, .sb-pagination button, .sb-section-title > button, .sb-state button, .sb-profile-form button, .sb-post-actions button { background: linear-gradient(rgb(52, 68, 86), rgb(21, 34, 52)); color: rgb(225, 235, 246); border: 1px solid rgba(158, 180, 205, 0.467); border-radius: 5px; min-height: 40px; min-width: 40px; padding: 10px 13px; font-size: 12px; }
.sb-game-rail { display: flex; gap: 14px; overflow-x: auto; padding: 7px 2px 17px; scroll-snap-type: x; scrollbar-width: thin; }
.sb-game { flex: 0 0 287px; text-align: left; border-width: 1px; border-style: solid; border-color: rgba(207, 223, 239, 0.6) rgba(151, 169, 193, 0.42) rgba(151, 169, 193, 0.42); border-image: none; border-radius: 11px; background: var(--metal); box-shadow: rgba(10, 16, 21, 0.267) 0px 0px 0px 3px inset, rgba(0, 0, 0, 0.2) 0px 7px 20px; padding: 19px 18px; color: rgb(236, 243, 250); scroll-snap-align: start; }
.sb-game-featured { border-color: rgba(239, 161, 108, 0.6); background: linear-gradient(130deg, rgb(105, 70, 39), rgb(38, 43, 49) 38%, rgb(18, 27, 36) 80%); }
.sb-game-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 23px; }
.sb-game-top > span { font: 600 11px / 1 "JetBrains Mono", monospace; color: rgb(255, 183, 127); }
.sb-game-top small { font-size: 10px; color: rgb(184, 199, 215); }
.sb-team { display: flex; gap: 12px; align-items: center; margin: 13px 0px; }
.sb-team b, .sb-avatar { display: grid; place-items: center; flex: 0 0 auto; border: 1px solid rgba(192, 203, 215, 0.533); border-radius: 5px; background: linear-gradient(135deg, rgb(215, 224, 233), rgb(115, 132, 153) 43%, rgb(189, 207, 223) 46%, rgb(67, 92, 116)); color: rgb(11, 20, 29); font: 800 12px / 1 Inter, sans-serif; box-shadow: rgba(25, 42, 59, 0.267) 0px 0px 0px 2px inset; }
.sb-team b { width: 35px; height: 37px; }
.sb-team strong { font: 700 19px / 1.2 "Barlow Condensed", sans-serif; }
.sb-game footer { display: flex; justify-content: space-between; border-top: 1px solid rgba(141, 159, 180, 0.23); padding-top: 13px; margin-top: 19px; font-size: 10px; color: rgb(193, 206, 221); }
.sb-demo-label { display: block; font: 400 8px / 1.5 "JetBrains Mono", monospace; color: rgb(169, 186, 203); margin-top: 10px; }
.sb-lines { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 13px; max-height: 580px; overflow: auto; padding: 3px; scrollbar-width: thin; }
.sb-line, .sb-post, .sb-player, .sb-profile-form, .sb-composer { border-width: 1px; border-style: solid; border-color: rgba(204, 218, 234, 0.533) rgba(161, 181, 206, 0.4) rgba(161, 181, 206, 0.4); border-image: none; border-radius: 10px; background: var(--metal); box-shadow: rgba(220, 232, 240, 0.094) 0px 1px inset, rgba(0, 0, 0, 0.2) 0px 10px 28px; }
.sb-line { padding: 19px 16px; display: flex; flex-direction: column; min-height: 220px; }
.sb-line > div { display: flex; justify-content: space-between; }
.sb-tag { font: 500 9px / 1.5 "JetBrains Mono", monospace; color: rgb(189, 205, 223); display: inline-block; border: 1px solid rgba(142, 155, 180, 0.4); border-radius: 4px; padding: 4px 7px; }
.sb-line-mark { font-size: 21px; color: rgb(255, 171, 105); }
.sb-line > p { font-size: 11px; line-height: 1.6; color: rgb(176, 194, 214); margin: 16px 0px 7px; }
.sb-line h3 { font: 650 15px / 1.5 Inter, sans-serif; margin: 0px 0px 18px; }
.sb-line footer { margin-top: auto; display: flex; flex-direction: column; gap: 12px; border-top: 1px solid rgba(136, 155, 178, 0.267); padding-top: 13px; }
.sb-line footer small { font-size: 10px; color: rgb(178, 196, 215); }
.sb-line footer a, .sb-link { font-size: 12px; color: rgb(255, 178, 119); min-height: 26px; }
.sb-community-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 16px; }
.sb-post { padding: 22px; min-width: 0px; }
.sb-post > header { display: flex; gap: 12px; align-items: center; }
.sb-avatar { width: 43px; height: 48px; font-size: 14px; }
.sb-post header > div { flex: 1 1 0%; min-width: 0px; }
.sb-post header strong { display: block; overflow-wrap: anywhere; font-size: 14px; }
.sb-post header small { display: block; margin-top: 6px; color: rgb(179, 196, 215); font-size: 10px; line-height: 1.5; }
.sb-post ol { list-style: none; padding: 0px; margin: 18px 0px; }
.sb-post li { display: flex; flex-direction: column; gap: 7px; padding: 14px 0px; border-top: 1px solid rgba(141, 159, 179, 0.267); }
.sb-post li > span { color: rgb(252, 180, 121); font: 500 9px / 1.5 "JetBrains Mono", monospace; }
.sb-post li strong { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.sb-post li small { color: rgb(173, 193, 215); font-size: 11px; }
.sb-empty, .sb-state { border: 1px dashed rgba(133, 151, 174, 0.533); border-radius: 10px; padding: 30px; background: linear-gradient(120deg, rgba(38, 52, 73, 0.467), rgba(17, 26, 36, 0.8)); color: rgb(180, 198, 218); font-size: 13px; line-height: 1.7; margin: 16px 0px; }
.sb-empty h3, .sb-state h3 { font: 700 25px / 1.2 "Barlow Condensed", sans-serif; color: rgb(226, 235, 244); margin: 12px 0px; }
.sb-empty p { max-width: 660px; }
.sb-empty-icon { display: inline-grid; place-items: center; width: 39px; height: 42px; border: 1px solid rgba(165, 180, 201, 0.467); border-radius: 6px; font-size: 22px; color: rgb(248, 179, 119); background: rgb(53, 67, 83); }
.sb-primary { display: inline-flex; gap: 15px; align-items: center; justify-content: center; min-height: 44px; padding: 11px 17px; border-radius: 5px; font: 650 11px / 1.5 Inter, sans-serif; box-shadow: rgba(255, 255, 255, 0.333) 0px 1px inset; cursor: pointer; }
.sb-subtle { display: inline-block; padding: 13px 16px; color: rgb(188, 207, 227); background: transparent; border: 0px; font-size: 12px; }
.sb-example { max-width: 520px; border-style: dashed; margin-top: 16px; }
.sb-example > p { font-size: 13px; line-height: 1.7; color: rgb(178, 193, 210); }
.sb-player-tools { display: grid; grid-template-columns: 2fr 1fr; gap: 14px; margin: 20px 0px; }
.sb-player-tools label { display: flex; flex-direction: column; gap: 9px; font-size: 11px; color: rgb(182, 200, 218); }
.sb-players { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 14px; }
.sb-player { text-align: left; padding: 17px; color: rgb(231, 239, 249); min-width: 0px; }
.sb-player-header { display: flex; gap: 11px; align-items: center; }
.sb-player-silhouette { display: grid; place-items: center; flex: 0 0 auto; width: 39px; height: 46px; border: 1px solid rgba(176, 196, 217, 0.533); background: linear-gradient(130deg, rgb(99, 117, 138), rgb(28, 43, 60)); border-radius: 6px; font: 700 12px / 1 "JetBrains Mono", monospace; color: rgb(208, 219, 234); }
.sb-player-header small { font: 400 8px / 1.4 "JetBrains Mono", monospace; color: rgb(189, 207, 227); }
.sb-player h3 { font: 750 17px / 1.3 "Barlow Condensed", sans-serif; margin: 5px 0px; }
.sb-player p { font-size: 10px; color: rgb(182, 200, 221); margin: 0px; }
.sb-stat-label { display: flex; gap: 9px; justify-content: space-between; margin: 22px 0px 15px; font-size: 10px; color: rgb(193, 210, 228); }
.sb-stat-label b { font-size: 8px; color: rgb(175, 195, 218); }
.sb-bars { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; align-items: end; }
.sb-bars > div { display: flex; align-items: center; flex-direction: column; gap: 6px; }
.sb-bars strong { font: 500 10px / 1 "JetBrains Mono", monospace; }
.sb-bars i { display: block; width: 100%; max-width: 29px; border: 1px solid rgba(199, 216, 227, 0.533); border-radius: 3px 3px 0px 0px; background: linear-gradient(90deg, rgb(75, 97, 119), rgb(211, 223, 232) 48%, rgb(125, 147, 167) 53%, rgb(50, 70, 91)); }
.sb-bars > div:last-child i { background: linear-gradient(90deg, rgb(190, 101, 47), rgb(255, 193, 138), rgb(235, 135, 60)); border-color: rgb(255, 187, 121); }
.sb-bars small { font-size: 9px; color: rgb(189, 207, 227); }
.sb-player footer { margin-top: 15px; padding-top: 12px; border-top: 1px solid rgba(131, 152, 177, 0.267); display: flex; justify-content: space-between; gap: 10px; font-size: 9px; color: rgb(182, 201, 223); }
.sb-player footer span { color: rgb(255, 193, 138); }
.sb-pagination { display: flex; justify-content: center; align-items: center; gap: 18px; margin: 25px 0px; color: rgb(184, 204, 226); font-size: 11px; }
.sb-dialog { width: min(620px, 100% - 30px); max-height: 85dvh; overflow: auto; padding: 30px; border: 1px solid rgba(164, 181, 200, 0.6); border-radius: 12px; background: linear-gradient(140deg, rgb(48, 63, 80), rgb(16, 28, 41) 50%); color: rgb(230, 238, 248); box-shadow: rgba(0, 0, 0, 0.733) 0px 25px 100px; }
.sb-dialog::backdrop { background: rgba(2, 5, 10, 0.79); backdrop-filter: blur(6px); }
.sb-dialog header { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.sb-dialog header button { background: rgb(19, 35, 51); border: 1px solid rgba(161, 181, 206, 0.533); border-radius: 5px; color: rgb(228, 237, 246); min-width: 40px; min-height: 40px; font-size: 23px; cursor: pointer; }
.sb-dialog h2 { font: 750 33px / 1.15 "Barlow Condensed", sans-serif; margin: 22px 0px; }
.sb-dialog p { font: 400 13px / 1.8 Inter, sans-serif; color: rgb(188, 203, 219); margin: 16px 0px; }
.sb-log-scroll { overflow-x: auto; }
.sb-dialog table { border-collapse: collapse; width: 100%; font-size: 12px; min-width: 380px; }
.sb-dialog th, .sb-dialog td { padding: 15px 10px; text-align: left; border-bottom: 1px solid rgba(156, 171, 192, 0.333); }
.sb-dialog th { color: rgb(249, 183, 127); }
.sb-spinner { display: inline-block; width: 16px; height: 16px; margin-right: 12px; border-width: 2px; border-style: solid; border-color: rgb(255, 174, 101) rgba(147, 169, 188, 0.4) rgba(147, 169, 188, 0.4); border-image: none; border-radius: 50%; animation: 0.8s linear 0s infinite normal none running sb-spin; }
@keyframes sb-spin { 
  100% { transform: rotate(360deg); }
}
.sb-studio-intro h2 { font: 800 37px / 1.15 "Barlow Condensed", sans-serif; margin: 12px 0px; }
.sb-studio-intro p { font-size: 13px; line-height: 1.7; color: rgb(181, 197, 215); }
.sb-composer { padding: 25px; margin: 24px 0px; }
.sb-compose-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px; max-height: 490px; overflow: auto; padding: 5px; }
.sb-choice { display: flex; gap: 10px; padding: 16px 12px; border: 1px solid rgba(145, 170, 201, 0.533); background: linear-gradient(130deg, rgb(55, 68, 87), rgb(23, 35, 52) 50%); border-radius: 7px; cursor: pointer; align-items: flex-start; }
.sb-choice.is-selected { border-color: rgb(255, 182, 125); background: linear-gradient(130deg, rgb(100, 69, 45), rgb(37, 44, 53) 60%); }
.sb-choice input { accent-color: rgb(255, 157, 82); width: 18px; height: 18px; flex: 0 0 auto; margin: 2px 0px; }
.sb-choice span { min-width: 0px; }
.sb-choice small { display: block; color: rgb(228, 188, 152); font: 400 8px / 1.6 "JetBrains Mono", monospace; }
.sb-choice strong { display: block; font-size: 12px; line-height: 1.7; margin: 8px 0px; }
.sb-choice em { font-size: 10px; color: rgb(184, 203, 224); line-height: 1.6; font-style: normal; }
.sb-save-bar { display: flex; justify-content: space-between; align-items: center; gap: 15px; border-top: 1px solid rgba(133, 155, 180, 0.333); padding-top: 20px; margin-top: 20px; }
.sb-save-bar > span { font-size: 12px; color: rgb(187, 201, 216); }
.sb-profile-form { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; align-items: center; padding: 25px; margin: 25px 0px; }
.sb-profile-form h3 { font: 700 25px / 1.2 "Barlow Condensed", sans-serif; margin: 8px 0px; }
.sb-profile-form p { font-size: 12px; line-height: 1.7; color: rgb(185, 205, 227); }
.sb-profile-form form { display: flex; align-items: flex-end; gap: 12px; }
.sb-profile-form label { min-width: 0px; flex: 1 1 0%; display: flex; flex-direction: column; gap: 8px; font-size: 11px; color: rgb(192, 212, 234); }
.sb-post-actions { display: flex; gap: 10px; align-items: flex-start; border-top: 1px solid rgba(138, 155, 180, 0.333); padding-top: 16px; }
.sb-post-actions details { flex: 1 1 0%; min-width: 0px; }
.sb-post-actions summary { cursor: pointer; color: rgb(255, 193, 138); font-size: 12px; padding: 12px 0px; }
.sb-post-actions p, .sb-post-actions small { font-size: 11px; line-height: 1.7; color: rgb(180, 195, 212); display: block; margin: 8px 0px; }
.sb-post-actions .sb-delete { background: transparent; color: rgb(222, 191, 185); }
.sb-notice { border: 1px solid rgba(125, 162, 145, 0.533); padding: 14px 18px; background: rgba(22, 53, 43, 0.533); color: rgb(192, 229, 214); border-radius: 6px; font-size: 13px; line-height: 1.6; margin: 18px 0px; }
.ch-playbook-mode.ch-shell { display: block; }
.ch-playbook-mode .ch-sidebar, .ch-playbook-mode .ch-bottom-grid { display: none; }
.ch-playbook-mode .ch-dashboard { padding: 24px 0px; }
.sb-member-playbook .sb-banner { margin: 20px 0px; }
.playbook-views { flex-wrap: wrap; }
@media (max-width: 1099px) {
  .sb-lines, .sb-players { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
  .sb-compose-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .sb-profile-form { grid-template-columns: 1fr; }
  .sb-board { padding-inline: 25px; }
  .sb-preview-stamp { padding: 20px; }
  .sb-community-grid { gap: 13px; }
}
@media (max-width: 759px) {
  .sb-board { padding: 16px 17px 42px; }
  .sb-sports { margin-bottom: 12px; }
  .sb-sports button { padding: 10px 14px; font-size: 11px; }
  .sb-board-heading { align-items: flex-start; gap: 15px; }
  .sb-board-heading h1 { font-size: 48px; }
  .sb-board-heading p { font-size: 12px; max-width: 230px; }
  .sb-preview-stamp { max-width: 165px; padding: 13px 11px; margin-top: 12px; }
  .sb-preview-stamp b { font-size: 8px; }
  .sb-preview-stamp span, .sb-preview-stamp a { font-size: 10px; line-height: 1.6; }
  .sb-banner { display: block; padding: 13px; font-size: 9px; }
  .sb-banner span { display: block; margin-top: 6px; font-size: 11px; }
  .sb-section-title { align-items: flex-start; gap: 15px; }
  .sb-section-title h2 { font-size: 29px; }
  .sb-date, .sb-select { flex-direction: column; align-items: flex-start; gap: 5px; font-size: 10px; max-width: 185px; }
  .sb-board .sb-select select { font-size: 11px; width: 100%; }
  .sb-note { font-size: 11px; }
  .sb-game { flex-basis: 260px; }
  .sb-lines, .sb-players { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .sb-community-grid { grid-template-columns: 1fr; }
  .sb-line { padding: 16px 13px; min-height: 224px; }
  .sb-line h3 { font-size: 13px; }
  .sb-empty, .sb-state { padding: 23px; }
  .sb-empty .sb-primary, .sb-empty .sb-subtle { display: flex; max-width: 300px; margin-top: 10px; }
  .sb-player { padding: 13px; }
  .sb-player-silhouette { width: 29px; height: 35px; font-size: 10px; }
  .sb-player-header { gap: 8px; }
  .sb-player h3 { font-size: 15px; }
  .sb-player-header small { font-size: 7px; }
  .sb-stat-label { flex-direction: column; gap: 5px; margin-top: 15px; }
  .sb-player footer { flex-direction: column; font-size: 9px; }
  .sb-player-tools { grid-template-columns: 1.4fr 1fr; gap: 10px; }
  .sb-pagination { gap: 10px; font-size: 10px; }
  .sb-pagination button { font-size: 11px; padding: 8px 11px; }
  .sb-studio .sb-section-title { display: block; }
  .sb-composer { padding: 17px; }
  .sb-composer .sb-select { margin-top: 15px; max-width: none; }
  .sb-save-bar { flex-direction: column; align-items: stretch; }
  .sb-profile-form { padding: 20px; }
  .sb-profile-form form { flex-direction: column; align-items: stretch; }
  .sb-dialog { padding: 22px; }
  .sb-post { padding: 18px; }
  .sb-post header { flex-wrap: wrap; }
  .sb-post header > .sb-tag { margin-left: 55px; }
  .sb-compose-grid { grid-template-columns: 1fr; max-height: 480px; }
}
@media (max-width: 389px) {
  .sb-board-heading { display: block; }
  .sb-preview-stamp { max-width: none; flex-flow: wrap; align-items: center; gap: 8px; margin: 12px 0px 0px; }
  .sb-preview-stamp a { border: 0px; padding: 0px; }
  .sb-section-title { flex-wrap: wrap; }
  .sb-lines { grid-template-columns: 1fr; max-height: 500px; }
  .sb-player-tools { grid-template-columns: 1fr; }
  .sb-player-header { display: block; }
  .sb-player-silhouette { margin-bottom: 9px; }
  .sb-date input { width: 180px; }
  .sb-community-grid .sb-post { padding: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .sb-spinner { animation: auto ease 0s 1 normal none running none; }
}
@media (min-width: 960px) {
  .chrome-home-page .desktop-nav { gap: 26px; align-items: center; display: flex !important; }
}
.sc-directory { min-width: 0px; scroll-margin-top: 90px; }
.sc-tabs { display: flex; gap: 8px; margin: 22px 0px; }
.sc-tabs button { padding: 11px 18px; border: 1px solid rgb(85, 93, 102); border-radius: 7px; background: rgb(16, 19, 24); color: rgb(205, 209, 216); font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.sc-tabs button[aria-pressed="true"] { background: linear-gradient(150deg, rgb(245, 247, 250), rgb(163, 171, 182) 52%, rgb(238, 240, 244)); color: rgb(17, 19, 24); border-color: rgb(228, 231, 236); }
.sc-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 20px; }
.sc-card { position: relative; display: flex; flex-direction: column; align-items: stretch; min-width: 0px; min-height: 286px; padding: 17px; text-align: left; color: rgb(242, 243, 245); background: linear-gradient(135deg, rgb(66, 71, 78), rgb(18, 21, 26) 5%, rgb(23, 28, 34) 48%, rgb(48, 53, 60) 98%, rgb(178, 186, 197)); border: 2px solid rgb(137, 147, 160); border-radius: 15px; box-shadow: rgb(11, 12, 15) 0px 0px 0px 3px inset, rgba(0, 0, 0, 0.467) 0px 10px 22px; cursor: pointer; transition: border-color 0.15s, transform 0.15s; }
.sc-card:hover { border-color: rgb(255, 122, 32); transform: translateY(-3px); }
.sc-card:focus-visible, .sc-tabs button:focus-visible { outline: rgb(255, 122, 32) solid 3px; outline-offset: 4px; }
.sc-card-top { display: flex; justify-content: space-between; gap: 8px; font: 600 12px monospace; color: rgb(226, 229, 235); }
.sc-card-top span { font-size: 10px; color: rgb(175, 184, 197); }
.sc-monogram { display: grid; place-items: center; align-self: center; margin: 26px 0px 20px; width: 76px; height: 76px; border: 1px solid rgb(129, 139, 151); border-radius: 50%; font-size: 28px; font-weight: 850; color: rgb(17, 17, 17); background: linear-gradient(130deg, rgb(242, 245, 248), rgb(146, 156, 169) 40%, rgb(225, 230, 237) 63%, rgb(119, 127, 140)); box-shadow: rgba(0, 0, 0, 0.533) 0px 10px 24px; }
.sc-card h3 { font-size: 19px; line-height: 1.25; margin: 0px 0px 8px; overflow-wrap: anywhere; }
.sc-card p { font-size: 12px; line-height: 1.55; color: rgb(188, 197, 210); margin: 0px 0px 20px; }
.sc-card-foot { display: flex; justify-content: space-between; gap: 8px; border-top: 1px solid rgb(115, 125, 139); margin-top: auto; padding-top: 13px; font-size: 11px; line-height: 1.5; color: rgb(216, 221, 229); }
.sc-card-foot span { color: rgb(255, 138, 62); }
.sc-coverage { margin-top: 26px; padding: 18px 0px; border-top: 1px solid rgb(66, 73, 81); font-size: 13px; color: rgb(190, 199, 212); line-height: 1.7; }
.sc-coverage summary { cursor: pointer; color: rgb(227, 230, 236); font-weight: 600; }
.sc-coverage a, .sc-detail footer a { color: rgb(255, 155, 89); }
.sc-detail h3 { margin-top: 25px; }
.sc-detail td small { display: block; color: rgb(183, 193, 206); font-size: 12px; }
.sc-detail footer { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 25px; padding-top: 18px; border-top: 1px solid rgb(89, 97, 109); font-size: 13px; }
.sc-detail .sb-state { padding: 24px 16px; line-height: 1.6; }
.sc-coverage table { min-width: 540px; }
.sc-directory .sb-pagination span { font-size: 12px; text-align: center; }
.sc-directory .sb-player-tools input { min-width: 0px; }
.sc-directory .sb-player-tools select { max-width: 100%; }
@media (max-width: 1150px) {
  .sc-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@media (max-width: 800px) {
  .sc-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; }
  .sc-card { padding: 15px; min-height: 270px; }
  .sc-card-top { flex-direction: column; }
  .sc-card h3 { font-size: 17px; }
  .sc-monogram { margin: 20px 0px; }
}
@media (max-width: 370px) {
  .sc-grid { grid-template-columns: 1fr; }
  .sc-card { min-height: 255px; }
  .sc-card-top { flex-direction: row; }
}
@media (prefers-reduced-motion: reduce) {
  .sc-card { transition: none; }
  .sc-card:hover { transform: none; }
}
.sb-board .sb-log-scroll table { width: 100%; min-width: 430px; border-collapse: collapse; font-size: 12px; line-height: 1.6; margin-top: 18px; }
.sb-board .sb-log-scroll caption { text-align: left; color: rgb(198, 208, 219); margin: 10px 0px; }
.sb-board .sb-log-scroll th, .sb-board .sb-log-scroll td { padding: 11px 9px; text-align: left; border-bottom: 1px solid rgba(139, 157, 178, 0.267); }
.sb-board .sb-log-scroll th { color: rgb(255, 183, 127); }
.sb-member-playbook > .ch-hero { margin: 22px 0px; }
.sb-board details > summary { cursor: pointer; color: rgb(225, 231, 237); }
.sb-board .sb-select { min-width: 0px; }
.sb-board .sb-select input { width: 100%; min-width: 0px; }
.sb-board .sb-post > p { font-size: 13px; line-height: 1.7; color: rgb(192, 202, 214); overflow-wrap: anywhere; }
.sb-prediction { margin-top: 16px; padding: 13px; border: 1px solid rgba(166, 179, 193, 0.3); border-radius: 7px; background: linear-gradient(130deg, rgb(48, 60, 72), rgb(17, 25, 34)); display: flex; flex-direction: column; gap: 7px; overflow-wrap: anywhere; }
.sb-prediction strong { font-size: 14px; color: rgb(234, 240, 246); }
.sb-prediction span { font-size: 12px; color: rgb(255, 188, 135); }
.sb-prediction small { font-size: 10px; line-height: 1.5; color: rgb(191, 204, 216); }
.sb-pack-catalog { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 18px; margin: 22px 0px; }
.sb-pack-tile { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.sb-pack-tile > img { width: 100%; max-width: 140px; height: 190px; object-fit: contain; filter: drop-shadow(rgba(0, 0, 0, 0.533) 0px 10px 12px); }
.sb-pack-tile h3 { font-size: 20px; margin: 4px 0px; }
.sb-pack-tile p { margin: 0px 0px 10px; }
.sb-pack-tile > button:disabled { padding: 12px; background: rgb(37, 44, 52); border: 1px solid rgba(116, 128, 140, 0.467); color: rgb(184, 194, 204); border-radius: 5px; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12px; cursor: default; }
.sb-catalog-search { display: flex; flex-direction: column; gap: 8px; margin: 24px 0px; font-size: 13px; color: rgb(195, 207, 219); }
.sb-catalog-search input { width: 100%; min-height: 44px; background: rgb(16, 24, 32); color: rgb(237, 241, 245); border: 1px solid rgba(153, 166, 183, 0.467); border-radius: 6px; padding: 12px; }
.sb-curated .sb-post h3 { overflow-wrap: anywhere; }
.sb-curated .sb-post > .sb-primary { margin-top: 16px; }
.sb-curated-reveal { animation: 0.5s ease-out 0s 1 normal both running spx-curated-reveal; }
@keyframes spx-curated-reveal { 
  0% { opacity: 0; transform: translateY(18px) rotateY(-12deg); }
  100% { opacity: 1; transform: none; }
}
@media (max-width: 1000px) {
  .sb-pack-catalog { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@media (max-width: 700px) {
  .sb-pack-catalog { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; }
  .sb-pack-tile { padding: 14px; }
  .sb-pack-tile .sb-primary { font-size: 10px; padding: 10px; }
  .sb-pack-tile > img { height: 155px; }
}
@media (max-width: 360px) {
  .sb-pack-catalog { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .sb-curated-reveal { animation: auto ease 0s 1 normal none running none; }
}
.sb-player-pick-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 22px; margin: 25px 0px; }
.sb-player-pick-card { min-width: 0px; position: relative; padding: 5px; display: flex; flex-direction: column; border: 2px solid rgb(191, 199, 209); border-radius: 18px; background: linear-gradient(135deg, rgb(242, 245, 248), rgb(126, 135, 147) 8%, rgb(220, 226, 233) 24%, rgb(48, 59, 70) 43%, rgb(236, 240, 244) 56%, rgb(113, 128, 144), rgb(209, 216, 223)); box-shadow: rgba(0, 0, 0, 0.533) 0px 15px 30px, rgba(255, 255, 255, 0.533) 0px 0px 0px 1px inset; overflow: hidden; }
.sb-player-pick-top { display: flex; justify-content: space-between; gap: 6px; border-radius: 11px 11px 0px 0px; padding: 12px 10px; background: rgb(16, 24, 32); color: rgb(231, 238, 247); font: 600 10px / 1.5 monospace; }
.sb-player-pick-top span:last-child { font-size: 8px; color: rgb(192, 203, 215); }
.sb-player-pick-art { height: 160px; background: radial-gradient(at 50% 80%, rgba(220, 229, 237, 0.153), transparent 60%), repeating-linear-gradient(135deg, rgb(17, 24, 32) 0px, rgb(17, 24, 32) 22px, rgb(49, 64, 76) 23px, rgb(19, 29, 38) 24px); display: flex; align-items: center; justify-content: center; flex-direction: column; position: relative; overflow: hidden; }
.sb-player-pick-art > span { font: 900 56px / 1 Impact, sans-serif; letter-spacing: 2px; color: rgb(216, 225, 232); text-shadow: rgb(255, 255, 255) 0px 2px, rgba(0, 0, 0, 0.6) 0px 5px 8px; border: 1px solid rgb(134, 152, 165); border-radius: 10px; padding: 17px; background: linear-gradient(150deg, rgba(115, 131, 146, 0.333), rgb(14, 24, 37) 60%, rgba(197, 208, 212, 0.2)); }
.sb-player-pick-art > i { font: 700 9px / 1.5 monospace; letter-spacing: 4px; color: rgb(255, 135, 48); margin-top: 17px; }
.sb-player-pick-copy { background: linear-gradient(135deg, rgb(34, 44, 55), rgb(11, 18, 27) 75%); padding: 18px 13px; display: flex; flex-direction: column; gap: 10px; flex: 1 1 0%; min-width: 0px; color: rgb(232, 237, 242); }
.sb-player-pick-copy > small:first-child { color: rgb(255, 164, 94); font: 600 9px / 1.6 monospace; }
.sb-player-pick-copy h3 { font: 750 24px / 1.12 "Barlow Condensed", Inter, sans-serif; margin: 0px; overflow-wrap: anywhere; }
.sb-player-pick-copy p { font-size: 11px; line-height: 1.6; color: rgb(189, 199, 211); margin: 0px; overflow-wrap: anywhere; }
.sb-player-pick-selection { border-top: 1px solid rgba(143, 155, 169, 0.333); padding-top: 13px; display: flex; flex-direction: column; gap: 8px; flex: 1 1 0%; overflow-wrap: anywhere; }
.sb-player-pick-selection strong { font-size: 14px; line-height: 1.6; }
.sb-player-pick-selection span, .sb-player-pick-copy > small:last-child { font-size: 10px; line-height: 1.6; color: rgb(185, 198, 213); }
.sb-player-pick-card footer { background: linear-gradient(110deg, rgb(222, 223, 226), rgb(148, 157, 169), rgb(229, 233, 237)); color: rgb(20, 32, 44); display: flex; justify-content: space-between; align-items: center; padding: 9px 10px; font: 700 8px / 1.5 monospace; border-radius: 0px 0px 10px 10px; }
.sb-player-pick-card footer b { color: rgb(189, 79, 5); font-size: 17px; }
.sb-pack-browser { border-top: 1px solid rgba(146, 160, 179, 0.333); padding-top: 22px; margin: 26px 0px; }
.sb-pack-browser summary { cursor: pointer; font-size: 18px; color: rgb(225, 232, 238); }
@media (max-width: 1100px) {
  .sb-player-pick-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@media (max-width: 800px) {
  .sb-player-pick-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; }
  .sb-player-pick-top { flex-direction: column; }
  .sb-player-pick-copy { padding: 14px 10px; }
  .sb-player-pick-copy .sb-primary { font-size: 10px; padding: 10px 7px; }
  .sb-player-pick-art { height: 140px; }
  .sb-player-pick-art > span { font-size: 40px; }
}
@media (max-width: 360px) {
  .sb-player-pick-grid { grid-template-columns: 1fr; }
  .sb-player-pick-art { height: 180px; }
}
.sb-market-nav { display: flex; gap: 8px; overflow-x: auto; max-width: 100%; padding: 10px 2px 14px; scrollbar-color: rgb(120, 129, 140) rgb(19, 22, 27); }
.sb-market-nav button { flex: 0 0 auto; min-height: 44px; padding: 10px 16px; border: 1px solid rgb(101, 112, 125); border-radius: 8px; background: linear-gradient(160deg, rgb(52, 59, 69), rgb(21, 26, 34) 55%, rgb(39, 46, 56)); color: rgb(227, 232, 239); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; cursor: pointer; }
.sb-market-nav button[aria-pressed="true"] { border-color: rgb(255, 121, 0); color: rgb(255, 255, 255); box-shadow: rgb(255, 121, 0) 0px -3px inset; }
.sb-market-nav button:focus-visible { outline: rgb(255, 255, 255) solid 2px; outline-offset: 2px; }
.sb-player-pick-selection a { color: rgb(205, 214, 226); overflow-wrap: anywhere; }
.sb-featured .sb-sports { margin-bottom: 4px; padding-bottom: 10px; }
.sb-featured-arrows { display: flex; gap: 6px; }
.sb-featured-arrows button { background: linear-gradient(rgb(52, 68, 86), rgb(21, 34, 52)); color: rgb(225, 235, 246); border: 1px solid rgba(158, 180, 205, 0.467); border-radius: 5px; width: 38px; height: 36px; }
.sb-featured-rail { flex-wrap: nowrap; align-items: stretch; }
.sb-featured-game { flex: 0 0 270px; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.sb-featured-game .sb-game-top { margin: 0px; gap: 10px; }
.sb-featured-game h3 { font: 700 20px / 1.2 "Barlow Condensed", sans-serif; margin: 0px; min-height: 48px; }
.sb-featured-game .sb-prediction { margin: 0px; padding: 8px 0px; display: flex; flex-direction: column; gap: 6px; font-size: 12px; }
.sb-featured-game > a { margin-top: auto; color: rgb(255, 178, 119); font-size: 11px; }
.sb-featured-game .sb-prediction span { font-size: 11px; color: rgb(189, 205, 223); }