/* PreciseEV theme. Loaded last on every page (workspace, homepage, public pages, account, admin), it gives the
   whole site one design language: a zinc canvas, Plus Jakarta Sans for words and JetBrains Mono for figures and
   labels, hairline borders, violet for the brand and the main action, green for what is up, red for what is down.
   Selectors are scoped under three ids' worth of specificity (html:is(:root,#vo-a) body:is(*,#vo-b):is(*,#vo-c))
   so they settle the older page layers without each rule naming them. */

@font-face{font-family:'Plus Jakarta Sans';src:url('/assets/fonts/PlusJakartaSans-latin.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Plus Jakarta Sans';src:url('/assets/fonts/PlusJakartaSans-latin-ext.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* Older stylesheets name Inter or Outfit directly; both resolve to Plus Jakarta Sans. */
@font-face{font-family:'Inter';src:url('/assets/fonts/PlusJakartaSans-latin.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';src:url('/assets/fonts/PlusJakartaSans-latin-ext.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Outfit';src:url('/assets/fonts/PlusJakartaSans-latin.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Outfit';src:url('/assets/fonts/PlusJakartaSans-latin-ext.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';src:url('/assets/fonts/JetBrainsMono-latin.woff2') format('woff2');font-weight:100 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root {
  /* The PreciseEV kit: Ink for the canvas, Night for cards, Paper for words, Edge Green for what is up, Violet for the brand. */
  --pev-ink:#0B0A10; --pev-night:#16131F; --pev-paper:#F5F3FA; --pev-edge-green:#2BD07F; --pev-edge-green-dark:#12A05C;
  --pev-violet:#7B5CFF; --pev-violet-light:#8B6CFF; --pev-muted:#9A93B3;
  --vo-bg:#0B0A10; --vo-bg-2:#0e0c14; --vo-surface:#121019; --vo-surface-2:#16131F; --vo-surface-3:#1e1a2a;
  --vo-line:rgb(255 255 255/.07); --vo-line-2:rgb(255 255 255/.1); --vo-line-3:rgb(255 255 255/.17);
  --vo-text:#F5F3FA; --vo-text-2:#c6c1d9; --vo-text-3:#9A93B3; --vo-text-4:#5e5878;
  --vo-brand:#7B5CFF; --vo-brand-hi:#8B6CFF; --vo-brand-text:#bfb0ff; --vo-brand-pale:#e2dbff;
  --vo-brand-soft:rgb(123 92 255/.14); --vo-brand-line:rgb(123 92 255/.45);
  --vo-grad-btn:linear-gradient(180deg,#8B6CFF 0%,#7B5CFF 100%);
  --vo-grad-text:linear-gradient(100deg,#cbbcff 0%,#9d82ff 55%,#7B5CFF 100%);
  --vo-glow:0 0 0 1px rgb(123 92 255/.35),0 10px 40px -8px rgb(123 92 255/.55);
  --vo-up:#2BD07F; --vo-up-soft:rgb(43 208 127/.12); --vo-up-line:rgb(43 208 127/.4);
  --vo-down:#ff6b6b; --vo-down-soft:rgb(255 107 107/.12);
  --vo-warn:#f7b955; --vo-info:#6fb6ff;
  --vo-font:'Plus Jakarta Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --vo-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --vo-r-sm:8px; --vo-r:12px; --vo-r-lg:18px;
  --sl-mono:var(--vo-mono); --mono:var(--vo-mono);
  accent-color:var(--vo-brand);
}

/* ------------------------------------------------------------------ every page */
::selection { background:rgb(124 77 255/.38); color:#fff; }
html { scrollbar-color:#2a2a30 transparent; }
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:#2a2a30; border:3px solid transparent; border-radius:999px; background-clip:padding-box; }
::-webkit-scrollbar-thumb:hover { background:#3a3a41; border:3px solid transparent; background-clip:padding-box; }

html:is(:root,#vo-a) body:is(*,#vo-b):is(*,#vo-c) {
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility;

  & :is(code, kbd, samp, pre) { font-family:var(--vo-mono) !important; }
  & :is(input, select, textarea, button) { font-family:inherit; }
  & :focus-visible { outline-color:var(--vo-brand-hi); }

  /* Eyebrows and kickers: small mono capitals, the label voice of the whole site. */
  & :is([class*="eyebrow"], [class*="kicker"], .sl-tool-tag, .home-feature-label, .dashboard-nav-label, .sheet-eyebrow, .help-course-top, .doc-crumb):not(:has(h1, h2, h3, p, div)) {
    font-family:var(--vo-mono) !important; font-weight:500 !important; letter-spacing:.06em !important; text-transform:uppercase !important; font-feature-settings:normal;
  }

  /* Buttons everywhere: a violet gradient for the main action, a hairline outline for the rest, soft red for danger. */
  & :is(.learn-beginner-cta, .bg-button:not(.bg-button--ghost), .ad-button.primary, .settings-button:not(.secondary, .danger, .settings-text-button), .tracker-button.primary, .evx-primary, .evb-primary, .sm-primary, .pr-primary, .account-primary):not(:disabled) {
    border:0 !important; border-radius:9px !important; background:var(--vo-grad-btn) !important; color:#fff !important; font-weight:700 !important;
    box-shadow:inset 0 1px 0 rgb(255 255 255/.2), 0 0 0 1px rgb(124 77 255/.4), 0 8px 24px -10px rgb(124 77 255/.7) !important;
  }
  & :is(.learn-beginner-cta, .bg-button:not(.bg-button--ghost), .ad-button.primary, .settings-button:not(.secondary, .danger, .settings-text-button), .tracker-button.primary, .evx-primary, .evb-primary, .sm-primary, .pr-primary, .account-primary):not(:disabled):hover { filter:brightness(1.08); }
  & :is(.settings-button.secondary, .ad-button.secondary, .ad-button:not(.primary, .danger), .bg-button--ghost, .tracker-button:not(.primary)) {
    border:1px solid var(--vo-line-2) !important; border-radius:9px !important; background:rgb(255 255 255/.03) !important; color:var(--vo-text) !important; box-shadow:none !important;
  }
  & :is(.settings-button.secondary, .ad-button.secondary, .ad-button:not(.primary, .danger), .bg-button--ghost, .tracker-button:not(.primary)):hover { border-color:var(--vo-line-3) !important; background:rgb(255 255 255/.06) !important; }
  & :is(.settings-button.danger, .ad-button.danger) { border:1px solid rgb(255 107 107/.35) !important; border-radius:9px !important; background:var(--vo-down-soft) !important; color:#ff8a8a !important; box-shadow:none !important; }

  /* Keyboard hints. */
  & kbd { border:1px solid var(--vo-line-2) !important; border-radius:6px !important; background:rgb(255 255 255/.04) !important; color:var(--vo-text-3) !important; font-size:10.5px !important; font-weight:500 !important; box-shadow:none !important; }

  /* The brand: one horizontal logo (mark + wordmark) in every brand link. Older sheets size brand images as
     square tiles, so this settles them: 26px tall, width from the artwork, nothing painted on top. */
  & .brand-logo { display:block !important; height:26px !important; width:auto !important; max-width:none !important; border:0 !important; border-radius:0 !important; filter:none !important; box-shadow:none !important; object-fit:contain !important; }
  & :is(#dashboard-sidebar, .dashboard-mobile-bar) .brand-logo { height:22px !important; }
  /* The collapsed 68px sidebar only has room for the mark. */
  & .vo-sidebar-collapsed #dashboard-sidebar .brand-logo { content:url('/brand/mark-on-dark.svg?v=1'); height:20px !important; }
}

.brand-logo { height:26px; width:auto; display:block; }

/* ------------------------------------------------------------------ public pages: homepage, Learn, guides, API, company pages */
html:is(:root,#vo-a) body:is(*,#vo-b):is(*,#vo-c) {
  /* Header */
  & .vo-site-header { background:rgb(9 9 11/.78) !important; border-bottom:1px solid var(--vo-line) !important; backdrop-filter:saturate(1.4) blur(14px) !important; -webkit-backdrop-filter:saturate(1.4) blur(14px) !important; box-shadow:none !important; }
  & .vo-site-header .home-nav > a:not(.home-nav-login) { color:var(--vo-text-2) !important; font-size:14.5px !important; font-weight:500 !important; letter-spacing:0 !important; }
  & .vo-site-header .home-nav > a:not(.home-nav-login):hover, & .vo-site-header .home-nav > a[aria-current="page"] { color:var(--vo-text) !important; }
  & :is(.vo-site-header, .vo-site-footer) .home-brand { font-weight:700 !important; letter-spacing:-.02em !important; }
  & :is(.vo-site-header, .vo-site-footer) .home-brand img { filter:none !important; border-radius:9px; }
  & :is(.vo-site-header, .vo-site-footer) .home-brand em { color:var(--vo-brand-text) !important; }
  & .vo-site-header .home-login { color:var(--vo-text-2) !important; font-weight:600 !important; }
  & .vo-site-header .home-login:hover { color:var(--vo-text) !important; }

  /* Buttons: a violet gradient with a soft glow for the main action, a quiet outlined one beside it. */
  & :is(.home-button, .tool-hero-primary, .help-button, .hd-cta, .pb-cta):not(.home-button-ghost, .is-ghost, .is-secondary, .secondary) {
    border:0 !important; border-radius:10px !important; background:var(--vo-grad-btn) !important; color:#fff !important;
    font-weight:700 !important; letter-spacing:-.005em !important;
    box-shadow:inset 0 1px 0 rgb(255 255 255/.2), 0 0 0 1px rgb(124 77 255/.4), 0 10px 30px -10px rgb(124 77 255/.7) !important;
    transition:box-shadow .2s ease, filter .2s ease, transform .2s ease !important;
  }
  & :is(.home-button, .tool-hero-primary, .help-button, .hd-cta, .pb-cta):not(.home-button-ghost, .is-ghost, .is-secondary, .secondary):hover {
    filter:brightness(1.08) !important; box-shadow:inset 0 1px 0 rgb(255 255 255/.24), 0 0 0 1px rgb(124 77 255/.55), 0 14px 40px -10px rgb(124 77 255/.85) !important;
  }
  & .vo-site-header .home-header-action { height:36px !important; min-height:0 !important; padding:0 15px !important; border-radius:8px !important; font-size:13.5px !important; }
  & :is(.home-button-ghost, .home-button.is-ghost, .home-button.secondary) {
    border:1px solid var(--vo-line-2) !important; border-radius:10px !important; background:rgb(255 255 255/.03) !important; color:var(--vo-text) !important; box-shadow:none !important; font-weight:700 !important;
  }
  & :is(.home-button-ghost, .home-button.is-ghost, .home-button.secondary):hover { background:rgb(255 255 255/.06) !important; border-color:var(--vo-line-3) !important; }

  /* Pills that announce a section ("Research boards for …"). */
  & .sl-eyebrow { border:1px solid var(--vo-line-2) !important; background:rgb(255 255 255/.025) !important; color:var(--vo-text-2) !important; font-family:var(--vo-mono) !important; font-size:11.5px !important; font-weight:500 !important; letter-spacing:.06em !important; text-transform:uppercase !important; box-shadow:none !important; }
  @media (max-width:560px) { & .sl-eyebrow { max-width:100%; border-radius:14px !important; font-size:10px !important; letter-spacing:.03em !important; line-height:1.5 !important; text-align:left; } }
  & .home-feature-label { border:1px solid var(--vo-line-2) !important; background:rgb(255 255 255/.025) !important; color:var(--vo-brand-text) !important; font-size:11px !important; }

  /* Checklists: a plain green tick, no disc. */
  & .sl-check { background:none !important; box-shadow:none !important; border:0 !important; color:var(--vo-up) !important; }
  & .sl-check svg { color:var(--vo-up) !important; stroke:currentColor; }

  /* Headlines: heavier and tighter; the accented phrase in the violet gradient. */
  & :is(.sl-landing, .betting-pages, .help-page, .learn-page, .info-page, .api-page, .edu-page) :is(h1, h2) { font-weight:800 !important; letter-spacing:-.038em !important; }
  & .sl-landing h1 :is(em, span, strong, .sl-accent), & .sl-landing h2 :is(em, .sl-accent) {
    background:var(--vo-grad-text) !important; -webkit-background-clip:text !important; background-clip:text !important; color:transparent !important; -webkit-text-fill-color:transparent !important; font-style:normal !important;
  }

  /* Plans: green ticks, a mono badge on the featured plan, rounded-rectangle actions. */
  & .home-plan-features li > span { width:16px !important; height:16px !important; margin-top:3px; background:none !important; box-shadow:none !important; color:var(--vo-up) !important; font-size:13px !important; font-weight:700 !important; }
  & .home-plan-price strong { font-weight:800 !important; letter-spacing:-.035em !important; }
  & .home-plan.is-featured::before { background:var(--vo-grad-btn) !important; color:#fff !important; font-family:var(--vo-mono) !important; font-size:10.5px !important; font-weight:600 !important; letter-spacing:.08em !important; box-shadow:0 6px 20px -8px rgb(124 77 255/.8) !important; }
  & .home-plan-action { border-radius:10px !important; }
  & .home-plan:not(.is-featured) .home-plan-action { border:1px solid var(--vo-line-2) !important; background:rgb(255 255 255/.03) !important; color:var(--vo-text) !important; box-shadow:none !important; }
  & .home-plan.is-featured .home-plan-action { border:0 !important; background:var(--vo-grad-btn) !important; color:#fff !important; font-weight:700 !important; box-shadow:inset 0 1px 0 rgb(255 255 255/.2), 0 0 0 1px rgb(124 77 255/.4), 0 10px 30px -10px rgb(124 77 255/.7) !important; }

  /* Account and sign-in forms */
  & :is(.account-submit, .account-header-link, .settings-button) { border-radius:10px !important; }
  & .account-submit:not(:disabled) { border:0 !important; background:var(--vo-grad-btn) !important; color:#fff !important; font-weight:700 !important; box-shadow:inset 0 1px 0 rgb(255 255 255/.2), 0 0 0 1px rgb(124 77 255/.4), 0 10px 30px -12px rgb(124 77 255/.75) !important; }
  & .account-submit:not(:disabled):hover { filter:brightness(1.08); }
  & :is(.account-story-label, .account-kicker, .settings-kicker, .account-eyebrow) { font-family:var(--vo-mono) !important; font-size:11.5px !important; font-weight:500 !important; letter-spacing:.08em !important; text-transform:uppercase !important; color:var(--vo-brand-text) !important; }

  & .sl-landing .home-hero { padding-bottom:40px !important; }
  & .sl-landing .home-reviews { padding-bottom:24px !important; }

  /* Footer */
  & .vo-site-footer .vo-footer-cta { padding:0 !important; border:0 !important; background:none !important; box-shadow:none !important; color:var(--vo-brand-text) !important; font-weight:600 !important; }
  & .vo-site-footer .vo-footer-cta:hover { color:var(--vo-brand-pale) !important; }
  & .vo-site-footer { border-top:1px solid var(--vo-line) !important; background:var(--vo-bg) !important; }
  & .vo-site-footer .vo-footer-column h2 { font-family:var(--vo-mono) !important; font-size:11px !important; font-weight:600 !important; letter-spacing:.08em !important; text-transform:uppercase !important; color:var(--vo-text-3) !important; }
  & .vo-site-footer .vo-footer-column a { color:var(--vo-text-2) !important; font-size:14px !important; }
  & .vo-site-footer .vo-footer-column a:hover { color:var(--vo-text) !important; }
  & .vo-site-footer .vo-footer-age { font-family:var(--vo-mono) !important; }
}

/* ------------------------------------------------------------------ workspace */
html:is(:root,#vo-a) body:is(*,#vo-b):is(*,#vo-c).site-layout {
  /* What's up is green: edges, plus-EV prices, the best number on a row. */
  & #ev-view :is(.evb-board .is-positive, .evb-stats .is-positive dd, .evd-grid .evd-best strong, .evd-grid tbody td.is-best strong, .evd-boost-result, .evb-ev .evb-pin) { color:var(--vo-up) !important; }
  & #ev-view .evb-ev-bar i { background:var(--vo-up) !important; }
  & #ev-view .evb-matrix tbody td.is-plus { border-color:var(--vo-up-line) !important; background:var(--vo-up-soft) !important; color:var(--vo-up) !important; }
  & #ev-view .evb-matrix tbody td.is-best { border-color:var(--vo-up) !important; background:var(--vo-up) !important; color:#04180d !important; }
  & #ev-view .evb-legend i.is-best { background:var(--vo-up) !important; border-color:var(--vo-up) !important; }
  & #ev-view .evb-legend i.is-plus { background:var(--vo-up-soft) !important; border-color:var(--vo-up-line) !important; }

  /* Prices read in mono, like a quote screen. */
  & #ev-view :is(.evb-price, .evb-prob strong, .evb-stake strong, .evb-matrix tbody td, .evd-grid tbody td strong) { font-family:var(--vo-mono) !important; font-weight:600 !important; letter-spacing:-.01em !important; font-variant-numeric:tabular-nums; }
  & #ev-view .evb-price { font-size:15px !important; }

  /* Odds screen: every price a small mono chip; the best green, the worst red. */
  &.ev-page[data-ev-screen="odds"] .os-px { border:1px solid rgb(255 255 255/.05); background:rgb(255 255 255/.025); border-radius:7px; font-family:var(--vo-mono); font-size:12.5px; }
  &.ev-page[data-ev-screen="odds"] .os-px b { font-weight:500; }
  &.ev-page[data-ev-screen="odds"] .os-book-cell[data-open-quote]:hover .os-px { border-color:rgb(255 255 255/.14); background:rgb(255 255 255/.05); }
  &.ev-page[data-ev-screen="odds"] .os-book-cell.is-best .os-px { border-color:rgb(62 224 143/.38); background:rgb(62 224 143/.12); color:var(--vo-up); }
  &.ev-page[data-ev-screen="odds"] .os-book-cell.is-best .os-px b { font-weight:650; }
  &.ev-page[data-ev-screen="odds"] .os-book-cell.is-worst .os-px { border-color:rgb(255 107 107/.3); background:rgb(255 107 107/.1); color:#ff8a8a; }
  &.ev-page[data-ev-screen="odds"] .os-book-cell:is(.is-missing, .is-locked) .os-px { border-color:transparent; background:none; }
  &.ev-page[data-ev-screen="odds"] .os-average strong { font-family:var(--vo-mono); font-size:12.5px; font-weight:500; }

  /* Filter triggers on phones: one line each, the value ellipsized rather than wrapped. */
  @media (max-width:560px) {
    & #main .td-choice-trigger { font-size:13px !important; gap:6px !important; }
    & #main .td-choice-trigger .choice-trigger-copy { display:flex !important; align-items:center; gap:6px; min-width:0; overflow:hidden; }
    & #main .td-choice-trigger :is(.choice-trigger-label, .choice-trigger-copy strong) { min-width:0 !important; max-width:none !important; overflow:hidden !important; white-space:nowrap !important; text-overflow:ellipsis !important; }
    & #main .td-choice-trigger .choice-trigger-label { flex:0 1 auto !important; }
    & #main .td-choice-trigger .choice-trigger-copy strong { flex:0 1 auto !important; }
    & #main .dfs-slip-trigger { gap:6px !important; font-size:13px !important; }
    & #main .dfs-slip-trigger > :is(span, strong, b) { min-width:0 !important; overflow:hidden !important; white-space:nowrap !important; text-overflow:ellipsis !important; }
  }

  /* Shapes: buttons and segmented controls are rounded rectangles; only badges stay pills. */
  & :is(.evx-view-toggle, .vo-refresh-options, .tracker-period-tabs, .tracker-view-switch, .picks-tabs, .side-toggle, .section-tabs, .os-tabs, .sports-views) { border-radius:10px !important; }
  & :is(.evx-view-toggle, .vo-refresh-options, .tracker-period-tabs, .tracker-view-switch, .picks-tabs, .side-toggle, .section-tabs, .os-tabs, .sports-views) > :is(button, a) { border-radius:7px !important; }
  & .market-tabs > .market-tab { border-radius:8px !important; }
  & :is(.button, .tracker-button, .connection, .td-choice-trigger, .calendar-trigger, .hd-open, .pb-open, .dfs-platform-all, .evb-link, .hd-onboard-steps a, .vo-onboard-steps a) { border-radius:9px !important; }
  & :is(main .site-sports, .hd-sports .site-sports) a { border-radius:9px !important; }
  & main nav > button { border-radius:8px !important; }
}
