/* ZurekoBet visual foundation. Keep all reusable UI tokens in this file. */
:root {
    --od-hd-scale: .711;
    --od-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --od-radius-sm: 12px;
    --od-radius: 20px;
    --od-radius-lg: 30px;
    --od-transition: 180ms ease;
    --ng-scrollbar-thumb: var(--ng-global-8);
    --ng-scrollbar-thumb-hover: var(--ng-global-25);
}

html[data-theme="dark"] {
    --ng-scrollbar-thumb: color-mix(in srgb,var(--ng-global-13) 55%,transparent);
    --ng-scrollbar-thumb-hover: color-mix(in srgb,var(--ng-global-13) 75%,transparent);
    color-scheme: dark;
    --od-bg: #160a0e;
    --od-surface: #231016;
    --od-surface-raised: #30141d;
    --od-surface-soft: rgba(48, 20, 29, .72);
    --od-text: #fff4f6;
    --od-muted: #d5afb7;
    --od-border: rgba(255, 203, 214, .14);
    --od-primary: #e33e5a;
    --od-primary-strong: #c72444;
    --od-primary-soft: rgba(227, 62, 90, .15);
    --od-secondary: #b95b72;
    --od-success: #d65b70;
    --od-info: #c9556c;
    --od-warning: #e68a99;
    --od-danger: #ff6b82;
    --od-shadow: 0 24px 60px rgba(0, 0, 0, .31);
    --od-grid: rgba(255, 180, 195, .05);
}

html[data-theme="light"] {
    color-scheme: light;
    --od-bg: #fcf7f8;
    --od-surface: #ffffff;
    --od-surface-raised: #ffffff;
    --od-surface-soft: rgba(255, 255, 255, .78);
    --od-text: #24181b;
    --od-muted: #79646a;
    --od-border: rgba(104, 26, 42, .12);
    --od-primary: #bd1f3d;
    --od-primary-strong: #9f1731;
    --od-primary-soft: rgba(189, 31, 61, .10);
    --od-secondary: #9c4b5c;
    --od-success: #b43a51;
    --od-info: #a94158;
    --od-warning: #c45a70;
    --od-danger: #d83251;
    --od-shadow: 0 22px 48px rgba(86, 17, 34, .10);
    --od-grid: rgba(104, 26, 42, .05);
}

* { box-sizing: border-box; }
html { scroll-behavior:smooth; scrollbar-color:var(--ng-scrollbar-thumb) transparent; }
/* In HD the shell, not html, owns the outer page scrollbar. Cover both modes. */
body.od-app,body.od-app .od-hd-scale-shell { scrollbar-color:var(--ng-scrollbar-thumb) transparent; }
html::-webkit-scrollbar-thumb,body.od-app::-webkit-scrollbar-thumb,body.od-app .od-hd-scale-shell::-webkit-scrollbar-thumb { border-radius:999px; background:var(--ng-scrollbar-thumb); }
html::-webkit-scrollbar-thumb:hover,body.od-app::-webkit-scrollbar-thumb:hover,body.od-app .od-hd-scale-shell::-webkit-scrollbar-thumb:hover { background:var(--ng-scrollbar-thumb-hover); }
/* All comparator and modal scroll areas use the same theme scrollbar tokens. */
body.od-app :is(.od-lev-results,.od-favor-results,.od-score-list,.od-score-table-wrap,.od-multi-select-global-1__list,.od-modal-global-1__dialog,.od-lev-filter-bookmakers) { scrollbar-color:var(--ng-scrollbar-thumb) transparent; }
body.od-app :is(.od-lev-results,.od-favor-results,.od-score-list,.od-score-table-wrap,.od-multi-select-global-1__list,.od-modal-global-1__dialog)::-webkit-scrollbar-thumb { background:var(--ng-scrollbar-thumb); }
body.od-app :is(.od-lev-results,.od-favor-results,.od-score-list,.od-score-table-wrap,.od-multi-select-global-1__list,.od-modal-global-1__dialog)::-webkit-scrollbar-thumb:hover { background:var(--ng-scrollbar-thumb-hover); }
body.od-app { display:flex; min-width:320px; min-height:100vh; min-height:100dvh; margin:0; overflow-x:hidden; flex-direction:column; background:var(--od-bg); color:var(--od-text); font-family:var(--od-font-sans); transition:background var(--od-transition),color var(--od-transition); }
/* Keep centered navigation anchored when route content gains/loses a scrollbar. */
html { scrollbar-gutter:stable; }
body.od-app > main { flex:1 0 auto; }
body.od-app > .od-hd-scale-shell { display:flex; min-width:0; min-height:100dvh; flex-direction:column; }
.od-hd-scale-shell > main { flex:1 0 auto; }
/* Responsive visibility is structural, not a generic button style. Keep this
   guard in the base sheet so desktop stays safe even while navigation loads
   or reorders the remaining stylesheets. */
@media (min-width:992px) {
    body.od-app :is(.od-mobile-nav-toggle,.od-mobile-open-calculator,.od-mobile-account-summary,.od-mobile-card-only,.od-lev-mobile-bet) {
        display:none;
    }
}
/* Score shares the desktop/mobile boundary with the application navigation. */
@media (min-width:992px) {
    body.od-app .od-score-mobile-back { display:none; }
}
/* Orange: the logical desktop is widened before the entire application is scaled. */
@media (min-width:992px) and (max-width:1440px) and (max-height:900px) {
    html { height:100%; overflow:hidden; scrollbar-gutter:auto; }
    body.od-app { height:100%; min-height:0; overflow:hidden; }
    .od-hd-scale-shell {
        width:calc(100vw / var(--od-hd-scale));
        height:calc(100dvh / var(--od-hd-scale));
        min-height:0 !important;
        overflow-x:hidden;
        overflow-y:auto;
        scrollbar-gutter:stable;
        zoom:var(--od-hd-scale);
        --favor-hd-zoom:var(--od-hd-scale);
    }
    /* Body-mounted dialogs (e.g. LEV tracker) are outside the scaled shell.
       Scale their content once while keeping the backdrop at full viewport size. */
    body.od-app > .od-modal-global-1 > .od-modal-global-1__dialog { zoom:var(--od-hd-scale); }
    /* Bootstrap breakpoints see the physical viewport, not the widened shell.
       Match Bootstrap's FHD home container before the shared HD zoom. */
    .od-hd-scale-shell .od-home-container,
    .od-hd-scale-shell .od-navbar__inner,
    .od-hd-scale-shell > .od-footer > .container {
        width:min(1320px,calc(100% - 32px));
        max-width:none;
    }
}
a { color: inherit; text-decoration: none; }
.od-particle-bg { position: fixed; z-index: -1; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: .68; }

.od-navbar { position: sticky; top: 0; z-index: 20; flex:0 0 auto; border-bottom: var(--ng-border-width, 1px) solid var(--ng-global-11); background: var(--ng-global-1); color: var(--ng-text-on-global-1); }
.od-navbar__inner { min-height:clamp(56px,5.3vh,76px); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.od-brand { display: inline-flex; align-items: center; gap: 9px; color: var(--ng-text-on-global-1); font-size: 1.2rem; font-weight: 800; letter-spacing: -.045em; }
.od-brand > span:last-child span { color: var(--ng-global-13); }
.od-brand__mark { display: grid; width: 34px; height: 34px; place-items: center; border-radius: var(--ng-radius-sm); color: var(--ng-text-on-global-12); background: var(--ng-global-12); box-shadow: none; }
.od-brand--small { font-size: 1rem; }.od-brand--small .od-brand__mark { width: 29px; height: 29px; border-radius: 9px; }
.od-nav { align-items: center; gap: 28px; }.od-nav__link { position: relative; padding: 8px 0; color: var(--ng-text-muted-on-global-1); font-size: .91rem; font-weight: 600; }.od-nav__link:hover, .od-nav__link.is-active { color: var(--ng-global-13); }.od-nav__link.is-active::after { content: ""; position: absolute; bottom: 0; left: 0; width: 18px; height: 2px; border-radius: 5px; background: var(--ng-global-13); }
.od-navbar__actions { display: flex; align-items: center; gap: 10px; }.od-theme-toggle { display: grid; width: 38px; height: 38px; place-items: center; border: var(--ng-border-width, 1px) solid var(--ng-global-11); border-radius: var(--ng-radius-sm); background: var(--ng-global-2); color: var(--ng-text); transition: transform var(--od-transition), background var(--od-transition); }.od-theme-toggle:hover { background: var(--ng-global-4); color: var(--ng-text-on-global-4); transform: rotate(12deg); }.od-theme-toggle__moon { display: none; } html[data-theme="light"] .od-theme-toggle__sun { display: none; } html[data-theme="light"] .od-theme-toggle__moon { display: block; }.od-navbar-button { text-decoration: none; white-space: nowrap; }.od-navbar-button--secondary { background: var(--ng-global-4); color: var(--ng-text-on-global-4); }.od-navbar-button--secondary:hover { background: var(--ng-global-2); color: var(--ng-text); }
.od-button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 40px; padding: 9px 15px; border: 1px solid transparent; border-radius: 11px; font-size: .88rem; font-weight: 750; transition: transform var(--od-transition), background var(--od-transition), border-color var(--od-transition), color var(--od-transition); }.od-button:hover { transform: translateY(-2px); }.od-button--primary { color: #fff; background: linear-gradient(135deg, var(--od-primary), var(--od-primary-strong)); box-shadow: 0 10px 20px var(--od-primary-soft); }.od-button--ghost { border-color: var(--od-border); color: var(--od-text); background: var(--od-surface-soft); }.od-button--ghost:hover { border-color: var(--od-primary); }.od-button--light { background: #fff; color: #20263a; }.od-button--large { min-height: 50px; padding: 12px 20px; font-size: .93rem; }

.od-hero { padding: 104px 0 82px; }.od-eyebrow { display: inline-flex; align-items: center; gap: 7px; color: var(--od-primary); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }.od-hero__title { max-width: 690px; margin: 18px 0; font-size: clamp(2.8rem, 6vw, 5.4rem); font-weight: 850; letter-spacing: -.065em; line-height: .98; }.od-hero__title span { color: var(--od-primary); }.od-hero__lead { max-width: 555px; margin: 0 0 28px; color: var(--od-muted); font-size: 1.08rem; line-height: 1.75; }.od-hero__proof { display: flex; align-items: center; gap: 12px; margin-top: 35px; color: var(--od-muted); font-size: .82rem; }.od-avatars { display: flex; padding-left: 8px; }.od-avatars span { display: grid; width: 27px; height: 27px; margin-left: -8px; place-items: center; border: 2px solid var(--od-bg); border-radius: 50%; background: var(--od-surface-raised); color: var(--od-text); font-size: .63rem; font-weight: 800; }.od-avatars span:nth-child(2) { background: var(--od-secondary); }.od-avatars span:nth-child(3) { background: var(--od-success); }.od-avatars span:last-child { color: var(--od-primary); background: var(--od-primary-soft); }

.od-terminal-card { padding: 20px; border: 1px solid var(--od-border); border-radius: var(--od-radius-lg); background: var(--od-surface-soft); box-shadow: var(--od-shadow); backdrop-filter: blur(14px); }.od-terminal-card__top { display: flex; align-items: center; gap: 6px; padding-bottom: 19px; border-bottom: 1px solid var(--od-border); }.od-terminal-card__top span { width: 7px; height: 7px; border-radius: 50%; background: #fe5e56; }.od-terminal-card__top span:nth-child(2) { background: #fdbc3d; }.od-terminal-card__top span:nth-child(3) { background: #28c840; }.od-terminal-card__top small { margin-left: auto; color: var(--od-muted); font-size: .68rem; }.od-match-head { display: flex; justify-content: space-between; margin: 22px 0 16px; }.od-match-head__label, .od-live-dot { color: var(--od-muted); font-size: .64rem; font-weight: 800; letter-spacing: .08em; }.od-live-dot { color: var(--od-success); }.od-live-dot::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: currentColor; }.od-match { display: flex; align-items: center; justify-content: space-between; text-align: center; }.od-match > div { display: flex; flex: 1; flex-direction: column; align-items: center; gap: 8px; font-size: .77rem; }.od-match__time { color: var(--od-muted); }.od-match__time b { color: var(--od-text); font-size: 1rem; }.od-match__time span { font-size: .64rem; font-weight: 800; }.od-team-badge { display: grid; width: 45px; height: 45px; place-items: center; border-radius: 15px; color: #fff; font-weight: 850; }.od-team-badge--blue { background: #365fc6; }.od-team-badge--red { background: #dd4051; }.od-signal { margin-top: 26px; padding: 14px; border-radius: var(--od-radius-sm); background: var(--od-primary-soft); color: var(--od-muted); font-size: .73rem; }.od-signal b { color: var(--od-primary); }.od-progress { height: 6px; margin-top: 10px; overflow: hidden; border-radius: 8px; background: var(--od-border); }.od-progress span { display: block; height: 100%; border-radius: inherit; background: var(--od-primary); }.od-stat { padding: 11px; border: 1px solid var(--od-border); border-radius: 11px; }.od-stat span, .od-stat b { display: block; }.od-stat span { color: var(--od-muted); font-size: .64rem; }.od-stat b { margin-top: 3px; font-size: .77rem; }

.od-section { padding: 86px 0; }.od-section--compact { padding-top: 36px; }.od-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 35px; margin-bottom: 34px; }.od-section-heading h2, .od-cta-panel h2 { margin: 11px 0 0; font-size: clamp(1.85rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -.05em; }.od-section-heading p { max-width: 390px; margin: 0; color: var(--od-muted); line-height: 1.7; }.od-feature-card { height: 100%; padding: 28px; border: 1px solid var(--od-border); border-radius: var(--od-radius); background: var(--od-surface-soft); transition: transform var(--od-transition), border-color var(--od-transition), background var(--od-transition); }.od-feature-card:hover { border-color: color-mix(in srgb, var(--od-primary) 55%, var(--od-border)); background: var(--od-surface-raised); transform: translateY(-5px); }.od-feature-card__icon { display: grid; width: 45px; height: 45px; margin-bottom: 23px; place-items: center; border-radius: 14px; color: var(--od-primary); background: var(--od-primary-soft); font-size: 1.25rem; }.od-feature-card__icon--violet { color: var(--od-secondary); background: color-mix(in srgb, var(--od-secondary) 13%, transparent); }.od-feature-card__icon--green { color: var(--od-success); background: color-mix(in srgb, var(--od-success) 13%, transparent); }.od-feature-card h3 { font-size: 1.06rem; font-weight: 800; }.od-feature-card p { min-height: 52px; margin: 11px 0 20px; color: var(--od-muted); font-size: .89rem; line-height: 1.6; }.od-feature-card a { color: var(--od-text); font-size: .84rem; font-weight: 750; }.od-feature-card a i { margin-left: 4px; color: var(--od-primary); }
.od-cta-panel { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 47px; overflow: hidden; border-radius: var(--od-radius-lg); color: #fff; background: linear-gradient(115deg, #7a1028, #bd1f3d 55%, #df4b66); box-shadow: 0 22px 50px rgba(128, 18, 43, .22); }.od-cta-panel .od-eyebrow { color: rgba(255, 255, 255, .76); }.od-cta-panel h2 { max-width: 560px; }.od-cta-panel p { max-width: 560px; margin: 13px 0 0; color: rgba(255, 255, 255, .82); }.od-footer { margin-top: 70px; padding: 28px 0; border-top: 1px solid var(--od-border); color: var(--od-muted); font-size: .82rem; }

.od-catalog-hero { padding: 74px 0 33px; }.od-catalog-hero h1 { max-width: 720px; margin: 14px 0; font-size: clamp(2.3rem, 5vw, 4.2rem); font-weight: 850; letter-spacing: -.06em; }.od-catalog-hero p { max-width: 650px; color: var(--od-muted); font-size: 1rem; line-height: 1.7; }.od-catalog-section { padding: 30px 0; }.od-catalog-section__heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin: 0 0 20px; }.od-catalog-section__heading h2 { margin: 0; font-size: 1.35rem; font-weight: 800; letter-spacing: -.035em; }.od-catalog-section__heading p { margin: 0; color: var(--od-muted); font-size: .84rem; }.od-catalog-card { height: 100%; padding: 20px; border: 1px solid var(--od-border); border-radius: var(--od-radius); background: var(--od-surface-soft); }.od-catalog-card__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }.od-catalog-card__name { margin: 0; font-size: .83rem; font-weight: 800; }.od-token { display: inline-flex; max-width: 175px; overflow: hidden; color: var(--od-muted); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .64rem; text-overflow: ellipsis; white-space: nowrap; }.od-catalog-demo { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; min-height: 48px; }.od-color-card { display: flex; align-items: center; gap: 13px; padding: 13px; border: 1px solid var(--od-border); border-radius: 14px; background: var(--od-surface-soft); }.od-color-swatch { flex: 0 0 auto; width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.18); border-radius: 11px; background: var(--od-swatch); }.od-color-card strong, .od-color-card small { display: block; }.od-color-card strong { color: var(--od-text); font-size: .77rem; }.od-color-card small { margin-top: 3px; color: var(--od-muted); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .62rem; }.od-panel { padding: 18px; border: 1px solid var(--od-border); border-radius: var(--od-radius-sm); background: var(--od-surface-raised); }.od-panel__title { margin: 0; color: var(--od-text); font-size: .9rem; font-weight: 800; }.od-panel__body { margin: 7px 0 0; color: var(--od-muted); font-size: .8rem; line-height: 1.55; }.od-badge { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 99px; font-size: .68rem; font-weight: 800; }.od-badge--primary { color: var(--od-primary); background: var(--od-primary-soft); }.od-badge--success { color: var(--od-success); background: color-mix(in srgb, var(--od-success) 14%, transparent); }.od-badge--info { color: var(--od-info); background: color-mix(in srgb, var(--od-info) 14%, transparent); }.od-badge--warning { color: var(--od-warning); background: color-mix(in srgb, var(--od-warning) 14%, transparent); }.od-badge--danger { color: var(--od-danger); background: color-mix(in srgb, var(--od-danger) 14%, transparent); }.od-form-label { display: block; margin: 0 0 7px; color: var(--od-text); font-size: .76rem; font-weight: 750; }.od-textarea { width: 100%; min-height: 92px; padding: 10px 12px; resize: vertical; }.od-input { width: 100%; padding: 0 12px; }.od-select { width: 100%; padding: 0 12px; }.od-help-text { margin-top: 6px; color: var(--od-muted); font-size: .68rem; }.od-alert { display: flex; gap: 10px; padding: 13px; border: 1px solid currentColor; border-radius: var(--od-radius-sm); font-size: .78rem; line-height: 1.45; }.od-alert--info { color: var(--od-info); background: color-mix(in srgb, var(--od-info) 10%, transparent); }.od-alert--success { color: var(--od-success); background: color-mix(in srgb, var(--od-success) 10%, transparent); }.od-alert--warning { color: var(--od-warning); background: color-mix(in srgb, var(--od-warning) 10%, transparent); }.od-alert--danger { color: var(--od-danger); background: color-mix(in srgb, var(--od-danger) 10%, transparent); }

@media (max-width: 991.98px) { .od-navbar__inner { min-height: 66px; }.od-hero { padding: 69px 0 50px; }.od-hero__title { max-width: 610px; }.od-terminal-card { max-width: 525px; }.od-section { padding: 65px 0; }.od-section-heading, .od-cta-panel { align-items: flex-start; flex-direction: column; }.od-cta-panel { padding: 32px; }.od-footer { margin-top: 42px; } }
@media (max-width: 575.98px) { .od-navbar__actions { gap: 7px; }.od-brand { font-size: 1.08rem; }.od-brand__mark { width: 30px; height: 30px; }.od-theme-toggle { width: 34px; height: 34px; }.od-button { padding: 8px 11px; }.od-hero__lead { font-size: .98rem; }.od-section-heading { gap: 18px; }.od-cta-panel { padding: 27px; }.od-hero__proof { align-items: flex-start; } }

/* OrangeDemo named globals: preserve these tokens and classes across all screens. */
html[data-theme="light"] { --ng-text-on-global-1:#f4fbf7; --ng-text-muted-on-global-1:#b4c7bd; }
html[data-theme="dark"] { --ng-text-on-global-1:#f4fbf7; --ng-text-muted-on-global-1:#b4c7bd; }
html[data-theme="light"] { --ng-font:Inter,system-ui,sans-serif; --ng-radius-sm:6px; --ng-radius-md:8px; --ng-border-width:1px; --ng-global-1:#015a3c;--ng-global-2:#fff;--ng-global-3:#2f6b56;--ng-text-on-global-3:#f4fbf7;--ng-global-4:#b3cdc4;--ng-text-on-global-4:#1e293b;--ng-global-5:#e4edea;--ng-global-6:#e4edea;--ng-global-7:#076b4b;--ng-text-on-global-7:#f4fbf7;--ng-global-8:#a5c3b8;--ng-global-9:#b3cdc4;--ng-text-on-global-9:#1e293b;--ng-global-10:#007a52;--ng-global-11:#004c35;--ng-global-12:#007a52;--ng-text-on-global-12:#f4fbf7;--ng-global-13:#406457;--ng-global-14:#c7dbd3;--ng-global-15:#007a52;--ng-text-on-global-15:#f4fbf7;--ng-global-16:#087a5e;--ng-input-border:var(--ng-global-11);--ng-input-prefix-color:#006b47;--ng-input-text:#1e293b;--ng-input-placeholder:#64748b;--ng-control:#fff;--ng-text:#1e293b;--ng-text-muted:#64748b;--ng-border:#b7c5d3;--ng-border-subtle:#d8e0e8;--ng-shadow:0 12px 32px rgba(15,23,42,.1);--ng-particle-connection:rgba(1,90,60,.35);--ng-particle-pointer:rgba(0,91,64,.55);--ng-particle-glow-core:rgba(0,166,103,.86);--ng-particle-glow-edge:rgba(0,166,103,.44);--ng-particle-node:#007a52; }
html[data-theme="dark"] { --ng-font:Inter,system-ui,sans-serif; --ng-radius-sm:6px;--ng-radius-md:8px;--ng-border-width:1px;--ng-global-1:#002e21;--ng-global-2:#002e21;--ng-global-3:#013a27;--ng-text-on-global-3:#f4fbf7;--ng-global-4:#034f38;--ng-text-on-global-4:#f4fbf7;--ng-global-5:#01422e;--ng-global-6:#01422e;--ng-global-7:#076b4b;--ng-text-on-global-7:#f4fbf7;--ng-global-8:#005b40;--ng-global-9:#013a27;--ng-text-on-global-9:#f4fbf7;--ng-global-10:#22ff91;--ng-global-11:#004c35;--ng-global-12:#013a27;--ng-text-on-global-12:#f4fbf7;--ng-global-13:#ffd60a;--ng-global-14:#004c35;--ng-global-15:#076b4b;--ng-text-on-global-15:#f4fbf7;--ng-global-16:#22ff91;--ng-input-border:var(--ng-global-6);--ng-input-prefix-color:#22ff91;--ng-input-text:#f4fbf7;--ng-input-placeholder:#b4c7bd;--ng-control:#003621;--ng-text:#f4fbf7;--ng-text-muted:#b4c7bd;--ng-border:#087a55;--ng-border-subtle:#07533b;--ng-shadow:0 14px 36px rgba(0,0,0,.22);--ng-particle-connection:rgba(64,255,190,.36);--ng-particle-pointer:rgba(218,255,238,.72);--ng-particle-glow-core:rgba(64,255,190,.98);--ng-particle-glow-edge:rgba(0,230,160,.42);--ng-particle-node:#f4fbf7; }
.od-input-global-1{width:100%;min-height:36px;padding:7px 10px;border:var(--ng-border-width) solid var(--ng-input-border);border-radius:var(--ng-radius-sm);outline:0;background:var(--ng-control);color:var(--ng-input-text);font:16px var(--ng-font)}.od-input-global-1:focus{border-color:var(--ng-global-7)}.od-input-global-1::placeholder,.od-input-shell-global-1 input::placeholder{color:var(--ng-input-placeholder);opacity:1}.od-input-shell-global-1{display:flex;align-items:center;gap:8px;min-height:36px;padding:0 10px;border:var(--ng-border-width) solid var(--ng-input-border);border-radius:var(--ng-radius-sm);background:var(--ng-control);color:var(--ng-input-text);font:16px var(--ng-font)}.od-input-shell-global-1:focus-within{border-color:var(--ng-global-7)}.od-input-shell-global-1 input{width:100%;min-width:0;min-height:34px;padding:0;border:0;outline:0;background:transparent;color:inherit}.od-input-prefix{color:var(--ng-input-prefix-color)}
.od-button-global-1{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:0 13px;border:1px solid var(--ng-global-11);border-radius:var(--ng-radius-sm);background:var(--ng-global-12);color:var(--ng-text-on-global-12);font:14px var(--ng-font);cursor:pointer}.od-button-global-1:hover,.od-button-global-1:focus-visible{outline:0;background:var(--ng-global-4);color:var(--ng-text-on-global-4)}.od-button-global-1.od-button-icon{width:34px;height:34px;padding:0}.od-badge-global-1{display:inline-flex;align-items:center;min-height:26px;padding:4px 8px;border-radius:var(--ng-radius-md);background:var(--ng-global-4);color:var(--ng-text-on-global-4);font-size:13px}.od-panel{border:1px solid var(--ng-border);border-radius:var(--ng-radius-md);background:var(--ng-global-2)}.od-page-title-global-1{margin:0;color:var(--ng-global-13);font-size:24px;text-align:center;text-transform:uppercase}
.od-card-global-1{overflow:hidden;border:1px solid var(--ng-border-subtle);border-radius:var(--ng-radius-sm);background:var(--ng-global-5);color:var(--ng-text)}.od-card-global-1__title{padding:10px 12px;background:var(--ng-global-1);color:#f4fbf7}.od-card-global-1__body{display:grid;gap:10px;padding:12px;background:var(--ng-global-5)}.od-card-global-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(120px,.8fr);overflow:hidden;border:1px solid var(--ng-border-subtle);border-radius:var(--ng-radius-sm)}.od-card-global-2__label,.od-card-global-2__value{display:flex;align-items:center;min-height:52px;padding:10px 12px}.od-card-global-2__label{background:var(--ng-global-1);color:#f4fbf7}.od-card-global-2__value{justify-content:flex-end;background:var(--ng-global-2);color:var(--ng-text)}
.od-table-global-1{width:100%;border-collapse:collapse;table-layout:fixed;background:var(--ng-global-5);color:var(--ng-text)}.od-table-global-1 :is(th,td){padding:10px 12px;border-bottom:1px solid var(--ng-border-subtle);text-align:left}.od-table-global-1 :is(th+th,th+td,td+td){border-inline-start:1px solid var(--ng-border-subtle)}.od-table-global-1 thead th,.od-table-global-1 tbody th{background:var(--ng-global-3);color:var(--ng-text-on-global-3);font-size:12px;text-transform:uppercase}.od-pagination-global-1{display:flex;justify-content:center}.od-pagination-global-1__pages{display:inline-flex;margin:0;padding:0;overflow:hidden;border:1px solid var(--ng-global-11);border-radius:var(--ng-radius-sm);list-style:none}.od-pagination-global-1__pages li+li{border-inline-start:1px solid var(--ng-global-11)}.od-pagination-global-1__control{display:grid;width:34px;height:34px;place-items:center;border:0;background:var(--ng-control);color:var(--ng-text);text-decoration:none}.od-pagination-global-1__control:hover,.od-pagination-global-1__control:focus-visible{background:var(--ng-global-15);color:var(--ng-text-on-global-15)}.od-pagination-global-1__control.is-current{background:var(--ng-global-12);color:var(--ng-text-on-global-12)}.od-pagination-global-1__control.is-disabled{background:var(--ng-global-5);color:var(--ng-text-muted)}
.od-switch-global-1{position:relative;display:inline-flex;width:40px;height:22px;cursor:pointer}.od-switch-global-1 input{position:absolute;width:1px;height:1px;opacity:0}.od-switch-global-1 span{width:100%;height:100%;border:1px solid var(--ng-global-11);border-radius:999px;background:var(--ng-global-5)}.od-switch-global-1 span::after{display:block;width:16px;height:16px;margin:2px;border-radius:50%;background:var(--ng-global-2);content:"";transition:transform .16s}.od-switch-global-1 input:checked+span{border-color:var(--ng-global-7);background:var(--ng-global-7)}.od-switch-global-1 input:checked+span::after{transform:translateX(18px)}.od-checkbox-global-1{appearance:none;width:16px;height:16px;margin:0;border:1px solid var(--ng-input-border);border-radius:3px;background:var(--ng-control);cursor:pointer}.od-checkbox-global-1:checked{border-color:var(--ng-global-7);background:var(--ng-global-7)}.od-checkbox-global-1:checked::after{display:block;width:4px;height:8px;margin:1px auto 0;border:solid var(--ng-text-on-global-7);border-width:0 2px 2px 0;content:"";transform:rotate(45deg)}
.od-modal-global-1{position:fixed;z-index:1200;inset:0;display:none;place-items:center;padding:20px;background:rgba(0,20,13,.58)}.od-modal-global-1.is-open{display:grid}.od-modal-global-1__dialog{position:relative;width:min(600px,100%);padding:22px 20px 18px;border:1px solid var(--ng-global-11);border-radius:var(--ng-radius-md);background:var(--ng-global-2);color:var(--ng-text);box-shadow:var(--ng-shadow)}.od-modal-global-1__title{margin:0 36px 16px 0;font-size:22px}.od-modal-global-1__close{position:absolute;top:12px;right:12px}.od-modal-global-1__actions{display:flex;justify-content:flex-end;margin-top:16px}.od-link-global-1{color:var(--ng-text);font-weight:600;text-decoration:none}.od-link-global-1:hover{text-decoration:underline;text-underline-offset:2px}

/* OrangeDemo globals: shared, named primitives for all product screens. */
html[data-theme="light"] { --ng-font: Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --ng-weight-regular:400; --ng-weight-medium:400; --ng-weight-semibold:400; --ng-radius-sm:6px; --ng-radius-md:8px; --ng-border-width:1px; --ng-global-1:#015a3c; --ng-global-2:#fff; --ng-global-3:#2f6b56; --ng-text-on-global-3:#f4fbf7; --ng-global-4:#b3cdc4; --ng-text-on-global-4:#1e293b; --ng-global-5:#e4edea; --ng-global-6:#e4edea; --ng-global-7:#076b4b; --ng-text-on-global-7:#f4fbf7; --ng-global-8:#a5c3b8; --ng-global-9:#b3cdc4; --ng-text-on-global-9:#1e293b; --ng-global-10:#007a52; --ng-global-11:#004c35; --ng-global-12:#007a52; --ng-text-on-global-12:#f4fbf7; --ng-global-13:#406457; --ng-global-14:#c7dbd3; --ng-global-15:#007a52; --ng-text-on-global-15:#f4fbf7; --ng-global-16:#087a5e; --ng-input-border:var(--ng-global-11); --ng-input-prefix-color:#006b47; --ng-input-text:#1e293b; --ng-input-placeholder:#64748b; --ng-control:#fff; --ng-text:#1e293b; --ng-text-muted:#64748b; --ng-border:#b7c5d3; --ng-border-subtle:#d8e0e8; --ng-shadow:0 12px 32px rgba(15,23,42,.10); }
html[data-theme="dark"] { --ng-font:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --ng-weight-regular:400; --ng-weight-medium:400; --ng-weight-semibold:400; --ng-radius-sm:6px; --ng-radius-md:8px; --ng-border-width:1px; --ng-global-1:#002e21; --ng-global-2:#002e21; --ng-global-3:#013a27; --ng-text-on-global-3:#f4fbf7; --ng-global-4:#034f38; --ng-text-on-global-4:#f4fbf7; --ng-global-5:#01422e; --ng-global-6:#01422e; --ng-global-7:#076b4b; --ng-text-on-global-7:#f4fbf7; --ng-global-8:#005b40; --ng-global-9:#013a27; --ng-text-on-global-9:#f4fbf7; --ng-global-10:#22ff91; --ng-global-11:#004c35; --ng-global-12:#013a27; --ng-text-on-global-12:#f4fbf7; --ng-global-13:#ffd60a; --ng-global-14:#004c35; --ng-global-15:#076b4b; --ng-text-on-global-15:#f4fbf7; --ng-global-16:#22ff91; --ng-input-border:var(--ng-global-6); --ng-input-prefix-color:#22ff91; --ng-input-text:#f4fbf7; --ng-input-placeholder:#b4c7bd; --ng-control:#003621; --ng-text:#f4fbf7; --ng-text-muted:#b4c7bd; --ng-border:#087a55; --ng-border-subtle:#07533b; --ng-shadow:0 14px 36px rgba(0,0,0,.22); }
.od-input-global-1 { width:100%; min-height:36px; padding:7px 10px; border:var(--ng-border-width) solid var(--od-input-border,var(--ng-input-border)); border-radius:var(--ng-radius-sm); outline:0; background:var(--od-input-bg,var(--ng-control)); color:var(--od-input-color,var(--ng-input-text)); font:16px var(--ng-font); }.od-input-global-1:focus { border-color:var(--od-input-focus-border,var(--ng-global-7)); }.od-input-global-1::placeholder,.od-input-shell-global-1 input::placeholder { color:var(--ng-input-placeholder); opacity:1; }
.od-input-shell-global-1 { display:flex; align-items:center; gap:8px; min-height:36px; padding:0 10px; border:var(--ng-border-width) solid var(--od-input-border,var(--ng-input-border)); border-radius:var(--ng-radius-sm); background:var(--od-input-bg,var(--ng-control)); color:var(--od-input-color,var(--ng-input-text)); font:16px var(--ng-font); }.od-input-shell-global-1:focus-within { border-color:var(--od-input-focus-border,var(--ng-global-7)); }.od-input-shell-global-1 input { width:100%; min-width:0; min-height:34px; padding:0; border:0; outline:0; background:transparent; color:inherit; }.od-input-prefix { color:var(--ng-input-prefix-color); font-weight:var(--ng-weight-semibold); }
.od-button-global-1 { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:0 13px; border:var(--ng-border-width) solid var(--ng-global-11); border-radius:var(--ng-radius-sm); background:var(--ng-global-12); color:var(--ng-text-on-global-12); font:14px/1 var(--ng-font); cursor:pointer; }.od-button-global-1:hover,.od-button-global-1:focus-visible { outline:0; background:var(--ng-global-4); color:var(--ng-text-on-global-4); }.od-button-global-1:disabled { cursor:not-allowed; opacity:.55; }.od-button-global-1.od-button-icon { width:34px; height:34px; padding:0; }
.od-copy-global-1 { display:inline-grid; width:24px; height:24px; flex:0 0 24px; place-items:center; padding:0; border:var(--ng-border-width) solid var(--ng-global-21); border-radius:var(--ng-radius-sm); background:transparent; color:var(--ng-text); font-size:12px; line-height:1; cursor:pointer; }.od-copy-global-1:hover,.od-copy-global-1:focus-visible,.od-copy-global-1.is-copied { outline:0; border-color:var(--ng-global-24); background:var(--ng-global-24); color:var(--ng-text-on-global-24); }
.od-badge-global-1 { display:inline-flex; align-items:center; min-height:26px; padding:4px 8px; border-radius:var(--ng-radius-md); background:var(--ng-global-4); color:var(--ng-text-on-global-4); font-size:13px; }.od-panel { min-width:0; border:var(--ng-border-width) solid var(--ng-border); border-radius:var(--ng-radius-md); background:var(--ng-global-2); }.od-page-title-global-1 { margin:0; color:var(--ng-global-13); font-size:24px; font-weight:var(--ng-weight-medium); text-align:center; text-transform:uppercase; }
.od-card-global-1 { overflow:hidden; border:var(--ng-border-width) solid var(--ng-border-subtle); border-radius:var(--ng-radius-sm); background:var(--ng-global-5); color:var(--ng-text); }.od-card-global-1__title { padding:10px 12px; background:var(--ng-global-1); color:#f4fbf7; font-weight:var(--ng-weight-semibold); }.od-card-global-1__body { display:grid; gap:10px; padding:12px; background:var(--ng-global-5); }.od-card-global-2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(120px,.8fr); overflow:hidden; border:var(--ng-border-width) solid var(--ng-border-subtle); border-radius:var(--ng-radius-sm); }.od-card-global-2__label,.od-card-global-2__value { display:flex; align-items:center; min-height:52px; padding:10px 12px; }.od-card-global-2__label { background:var(--ng-global-1); color:#f4fbf7; font-weight:var(--ng-weight-semibold); }.od-card-global-2__value { justify-content:flex-end; background:var(--ng-global-2); color:var(--ng-text); }
.od-table-global-1 { width:100%; border-collapse:collapse; table-layout:fixed; overflow:hidden; border-radius:var(--ng-radius-sm); background:var(--ng-global-5); color:var(--ng-text); }.od-table-global-1 :is(th,td) { padding:10px 12px; border-bottom:var(--ng-border-width) solid var(--ng-border-subtle); text-align:left; vertical-align:middle; }.od-table-global-1 :is(th+th,th+td,td+td) { border-inline-start:var(--ng-border-width) solid var(--ng-border-subtle); }.od-table-global-1 thead th,.od-table-global-1 tbody th { background:var(--ng-global-3); color:var(--ng-text-on-global-3); font-size:12px; font-weight:var(--ng-weight-semibold); text-transform:uppercase; }
.od-pagination-global-1 { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px; color:var(--ng-text); }.od-pagination-global-1__pages { display:inline-flex; margin:0; padding:0; overflow:hidden; border:var(--ng-border-width) solid var(--ng-global-11); border-radius:var(--ng-radius-sm); list-style:none; }.od-pagination-global-1__pages li+li { border-inline-start:var(--ng-border-width) solid var(--ng-global-11); }.od-pagination-global-1__control { display:grid; width:34px; height:34px; place-items:center; border:0; background:var(--ng-control); color:var(--ng-text); font:14px var(--ng-font); text-decoration:none; }.od-pagination-global-1__control:hover,.od-pagination-global-1__control:focus-visible { outline:0; background:var(--ng-global-15); color:var(--ng-text-on-global-15); }.od-pagination-global-1__control.is-current { background:var(--ng-global-12); color:var(--ng-text-on-global-12); }.od-pagination-global-1__control.is-disabled { background:var(--ng-global-5); color:var(--ng-text-muted); cursor:not-allowed; }
.od-switch-global-1 { position:relative; display:inline-flex; width:40px; height:22px; cursor:pointer; }.od-switch-global-1 input { position:absolute; width:1px; height:1px; opacity:0; }.od-switch-global-1 span { width:100%; height:100%; border:var(--ng-border-width) solid var(--ng-global-11); border-radius:999px; background:var(--ng-global-5); transition:.16s ease; }.od-switch-global-1 span::after { display:block; width:16px; height:16px; margin:2px; border-radius:50%; background:var(--ng-global-2); content:""; transition:transform .16s ease; }.od-switch-global-1 input:checked+span { border-color:var(--ng-global-7); background:var(--ng-global-7); }.od-switch-global-1 input:checked+span::after { transform:translateX(18px); }.od-switch-global-1 input:focus-visible+span { outline:1px solid var(--ng-global-7); outline-offset:2px; }
.od-checkbox-global-1 { appearance:none; width:16px; height:16px; margin:0; border:var(--ng-border-width) solid var(--ng-input-border); border-radius:3px; background:var(--ng-control); cursor:pointer; }.od-checkbox-global-1:checked { border-color:var(--ng-global-7); background:var(--ng-global-7); }.od-checkbox-global-1:checked::after { display:block; width:4px; height:8px; margin:1px auto 0; border:solid var(--ng-text-on-global-7); border-width:0 2px 2px 0; content:""; transform:rotate(45deg); }.od-checkbox-global-1:focus-visible { outline:1px solid var(--ng-global-7); outline-offset:2px; }
.od-modal-global-1 { position:fixed; z-index:1200; inset:0; display:none; place-items:center; padding:20px; background:rgba(0,20,13,.58); }.od-modal-global-1.is-open { display:grid; }.od-modal-global-1__dialog { position:relative; width:min(600px,100%); padding:22px 20px 18px; border:var(--ng-border-width) solid var(--ng-global-11); border-radius:var(--ng-radius-md); background:var(--ng-global-2); color:var(--ng-text); box-shadow:var(--ng-shadow); }.od-modal-global-1__title { margin:0 36px 16px 0; font-size:22px; }.od-modal-global-1__close { position:absolute; top:12px; right:12px; }.od-modal-global-1__actions { display:flex; justify-content:flex-end; gap:10px; margin-top:16px; }.od-link-global-1 { color:var(--ng-text); font-weight:var(--ng-weight-semibold); text-decoration:none; }.od-link-global-1:hover { color:var(--ng-text); text-decoration:underline; text-underline-offset:2px; }

/* Selector múltiple global: se reutiliza para casas, ligas y mercados. */
.od-multi-select-modal-global-1 { width:min(360px,100%); }.od-multi-select-modal-global-1 .od-modal-global-1__close { top:16px; right:16px; }.od-multi-select-modal-global-1 .od-modal-global-1__title { display:flex; align-items:center; gap:10px; margin:0 48px 18px 0; color:var(--ng-text); font-size:27px; font-weight:var(--ng-weight-medium); }.od-multi-select-global-1 { display:grid; gap:10px; padding:12px; border:var(--ng-border-width) solid var(--ng-border-subtle); border-radius:var(--ng-radius-sm); background:var(--ng-global-5); color:var(--ng-text); }.od-multi-select-global-1__head { display:flex; align-items:center; justify-content:space-between; gap:12px; color:var(--ng-text); font-size:13px; font-weight:var(--ng-weight-semibold); }.od-multi-select-global-1__head span { display:inline-flex; align-items:center; gap:8px; }.od-multi-select-global-1__head strong { color:var(--ng-text); font-size:12px; }.od-multi-select-global-1 .od-input-global-1 { min-height:36px; padding:7px 10px; }.od-multi-select-global-1__list { display:grid; gap:2px; max-height:280px; padding:6px 2px 6px 0; overflow:auto; scrollbar-color:var(--ng-global-8) transparent; }.od-multi-select-global-1__list::-webkit-scrollbar { width:6px; }.od-multi-select-global-1__list::-webkit-scrollbar-thumb { border-radius:99px; background:var(--ng-global-8); }.od-multi-select-global-1__option { display:flex; align-items:center; gap:10px; min-height:31px; padding:5px 8px; border-radius:var(--ng-radius-xs); color:var(--ng-text); font-size:14px; cursor:pointer; }.od-multi-select-global-1__option:hover { background:var(--ng-global-4); color:var(--ng-text-on-global-4); }.od-multi-select-global-1__option[hidden] { display:none; }.od-button-global-1--secondary { border-color:var(--ng-global-7); background:transparent; color:var(--ng-text); }.od-button-global-1--secondary:hover,.od-button-global-1--secondary:focus-visible { background:var(--ng-global-4); color:var(--ng-text-on-global-4); }.od-button-global-1:disabled { opacity:.48; cursor:not-allowed; }

/* ZurekoBet palette: the 16 global tokens are a red/wine scale in both themes. */
html[data-theme="light"] { --ng-global-1:#701328; --ng-global-2:#ffffff; --ng-global-3:#9a2a40; --ng-text-on-global-1:#fff7f8; --ng-text-on-global-3:#fff7f8; --ng-global-4:#e8b7c0; --ng-text-on-global-4:#24181b; --ng-global-5:#f5e7e9; --ng-global-6:#f0dfe2; --ng-global-7:#ad1f3c; --ng-text-on-global-7:#fff7f8; --ng-global-8:#d4a6af; --ng-global-9:#e8b7c0; --ng-text-on-global-9:#24181b; --ng-global-10:#b01837; --ng-global-11:#651126; --ng-global-12:#bd1f3d; --ng-text-on-global-12:#fff7f8; --ng-global-13:#7a4751; --ng-global-14:#efd1d6; --ng-global-15:#b01837; --ng-text-on-global-15:#fff7f8; --ng-global-16:#c4304b; --ng-input-border:var(--ng-global-11); --ng-input-prefix-color:#a31735; --ng-input-text:#24181b; --ng-input-placeholder:#79646a; --ng-control:#ffffff; --ng-text:#24181b; --ng-text-muted:#79646a; --ng-border:#d2b9be; --ng-border-subtle:#eadadd; --ng-shadow:0 12px 32px rgba(61,10,23,.12); --ng-particle-connection:rgba(176,24,55,.30); --ng-particle-pointer:rgba(142,19,44,.52); --ng-particle-glow-core:rgba(204,45,76,.78); --ng-particle-glow-edge:rgba(204,45,76,.38); --ng-particle-node:#b01837; }
html[data-theme="dark"] { --ng-global-1:#321018; --ng-global-2:#1e0b10; --ng-global-3:#4a1320; --ng-text-on-global-1:#fff4f6; --ng-text-on-global-3:#fff4f6; --ng-global-4:#6b1f30; --ng-text-on-global-4:#fff4f6; --ng-global-5:#541725; --ng-global-6:#541725; --ng-global-7:#bf3651; --ng-text-on-global-7:#fff4f6; --ng-global-8:#7e3241; --ng-global-9:#4a1320; --ng-text-on-global-9:#fff4f6; --ng-global-10:#ff6b82; --ng-global-11:#781c30; --ng-global-12:#5a1826; --ng-text-on-global-12:#fff4f6; --ng-global-13:#ffb3be; --ng-global-14:#661a2a; --ng-global-15:#b9324d; --ng-text-on-global-15:#fff4f6; --ng-global-16:#ff6b82; --ng-input-border:var(--ng-global-6); --ng-input-prefix-color:#ff8ca0; --ng-input-text:#fff4f6; --ng-input-placeholder:#d5afb7; --ng-control:#351018; --ng-text:#fff4f6; --ng-text-muted:#d5afb7; --ng-border:#8c3043; --ng-border-subtle:#682233; --ng-shadow:0 14px 36px rgba(0,0,0,.28); --ng-particle-connection:rgba(255,122,143,.34); --ng-particle-pointer:rgba(255,216,222,.68); --ng-particle-glow-core:rgba(255,107,130,.92); --ng-particle-glow-edge:rgba(235,56,86,.42); --ng-particle-node:#fff4f6; }

/* Final brand direction: pure red accent with neutral white/gray surfaces. */
html[data-theme="light"] { --ng-global-1:#454545; --ng-global-2:#ffffff; --ng-global-3:#5b5b5b; --ng-text-on-global-1:#ffffff; --ng-text-on-global-3:#ffffff; --ng-global-4:#ffe0e0; --ng-text-on-global-4:#262626; --ng-global-5:#f1f1f1; --ng-global-6:#eeeeee; --ng-global-7:#ff1010; --ng-text-on-global-7:#ffffff; --ng-global-8:#ababab; --ng-global-9:#ffe0e0; --ng-text-on-global-9:#262626; --ng-global-10:#ff1010; --ng-global-11:#e5e5e5; --ng-global-12:#ff1010; --ng-text-on-global-12:#ffffff; --ng-global-13:#ff1010; --ng-global-14:#fff0f0; --ng-global-15:#ff1010; --ng-text-on-global-15:#ffffff; --ng-global-16:#ff1010; --ng-input-border:#d7d7d7; --ng-input-prefix-color:#ff1010; --ng-input-text:#262626; --ng-input-placeholder:#8a8a8a; --ng-control:#ffffff; --ng-text:#262626; --ng-text-muted:#777777; --ng-border:#dedede; --ng-border-subtle:#e8e8e8; --ng-shadow:0 12px 32px rgba(0,0,0,.10); --ng-particle-connection:rgba(255,16,16,.22); --ng-particle-pointer:rgba(255,16,16,.48); --ng-particle-glow-core:rgba(255,16,16,.72); --ng-particle-glow-edge:rgba(255,16,16,.32); --ng-particle-node:#ff1010; --od-bg:#f4f4f4; --od-surface:#ffffff; --od-surface-raised:#ffffff; --od-surface-soft:rgba(255,255,255,.82); --od-text:#262626; --od-muted:#777777; --od-border:rgba(0,0,0,.12); --od-primary:#ff1010; --od-primary-strong:#e60000; --od-primary-soft:rgba(255,16,16,.10); --od-secondary:#777777; --od-success:#ff3030; --od-info:#555555; --od-warning:#ff5a5a; --od-danger:#ff1010; --od-shadow:0 22px 48px rgba(0,0,0,.10); --od-grid:rgba(0,0,0,.05); }
html[data-theme="dark"] { --ng-global-1:#3f3f3f; --ng-global-2:#242424; --ng-global-3:#343434; --ng-text-on-global-1:#ffffff; --ng-text-on-global-3:#ffffff; --ng-global-4:#5a1515; --ng-text-on-global-4:#ffffff; --ng-global-5:#2d2d2d; --ng-global-6:#404040; --ng-global-7:#ff1b1b; --ng-text-on-global-7:#ffffff; --ng-global-8:#777777; --ng-global-9:#393939; --ng-text-on-global-9:#ffffff; --ng-global-10:#ff3b3b; --ng-global-11:#565656; --ng-global-12:#ff1010; --ng-text-on-global-12:#ffffff; --ng-global-13:#ff6262; --ng-global-14:#441111; --ng-global-15:#ff1b1b; --ng-text-on-global-15:#ffffff; --ng-global-16:#ff3b3b; --ng-input-border:#4d4d4d; --ng-input-prefix-color:#ff4a4a; --ng-input-text:#f5f5f5; --ng-input-placeholder:#aaaaaa; --ng-control:#1f1f1f; --ng-text:#f5f5f5; --ng-text-muted:#aaaaaa; --ng-border:#4c4c4c; --ng-border-subtle:#3d3d3d; --ng-shadow:0 14px 36px rgba(0,0,0,.32); --ng-particle-connection:rgba(255,75,75,.30); --ng-particle-pointer:rgba(255,190,190,.62); --ng-particle-glow-core:rgba(255,50,50,.86); --ng-particle-glow-edge:rgba(255,20,20,.38); --ng-particle-node:#fff5f5; --od-bg:#151515; --od-surface:#222222; --od-surface-raised:#2c2c2c; --od-surface-soft:rgba(44,44,44,.76); --od-text:#f5f5f5; --od-muted:#aaaaaa; --od-border:rgba(255,255,255,.14); --od-primary:#ff2525; --od-primary-strong:#e60000; --od-primary-soft:rgba(255,37,37,.15); --od-secondary:#888888; --od-success:#ff4a4a; --od-info:#bdbdbd; --od-warning:#ff7777; --od-danger:#ff2525; --od-shadow:0 24px 60px rgba(0,0,0,.34); --od-grid:rgba(255,255,255,.05); }
html[data-theme="light"] { --ng-text-muted-on-global-1:#dedede; }
html[data-theme="dark"] { --ng-text-muted-on-global-1:#d8d8d8; }
.od-cta-panel { background:linear-gradient(115deg,#e00000,#ff1010 55%,#ff6969); box-shadow:0 22px 50px rgba(255,16,16,.22); }

/* Global 1–16: a complete pure-red scale, with no gray token swatches. */
html[data-theme="light"] { --ng-global-1:#b00018; --ng-global-2:#ffffff; --ng-global-3:#d52b2b; --ng-text-on-global-1:#ffffff; --ng-text-on-global-3:#ffffff; --ng-global-4:#ffc4c4; --ng-text-on-global-4:#2b1010; --ng-global-5:#ffebeb; --ng-global-6:#ffe2e2; --ng-global-7:#f50000; --ng-text-on-global-7:#ffffff; --ng-global-8:#f29a9a; --ng-global-9:#ffcdcd; --ng-text-on-global-9:#2b1010; --ng-global-10:#f50000; --ng-global-11:#a90000; --ng-global-12:#f50000; --ng-text-on-global-12:#ffffff; --ng-global-13:#e00000; --ng-global-14:#ffd6d6; --ng-global-15:#f50000; --ng-text-on-global-15:#ffffff; --ng-global-16:#ff1744; --ng-input-border:var(--ng-global-11); --ng-input-prefix-color:#e00000; --ng-input-text:#2b1010; --ng-input-placeholder:#966464; --ng-control:#ffffff; --ng-text:#2b1010; --ng-text-muted:#966464; --ng-border:#efb8b8; --ng-border-subtle:#f6dada; --ng-shadow:0 12px 32px rgba(190,0,0,.12); --ng-particle-connection:rgba(245,0,0,.26); --ng-particle-pointer:rgba(245,0,0,.52); --ng-particle-glow-core:rgba(255,30,30,.78); --ng-particle-glow-edge:rgba(255,30,30,.34); --ng-particle-node:#f50000; }
html[data-theme="dark"] { --ng-global-1:#4a0000; --ng-global-2:#320000; --ng-global-3:#650000; --ng-text-on-global-1:#fff5f5; --ng-text-on-global-3:#fff5f5; --ng-global-4:#8a1010; --ng-text-on-global-4:#fff5f5; --ng-global-5:#5a0000; --ng-global-6:#650000; --ng-global-7:#ff1a1a; --ng-text-on-global-7:#ffffff; --ng-global-8:#8e2a2a; --ng-global-9:#700000; --ng-text-on-global-9:#fff5f5; --ng-global-10:#ff4d4d; --ng-global-11:#920000; --ng-global-12:#d90000; --ng-text-on-global-12:#ffffff; --ng-global-13:#ff5c5c; --ng-global-14:#7a1111; --ng-global-15:#ff1a1a; --ng-text-on-global-15:#ffffff; --ng-global-16:#ff4d4d; --ng-input-border:var(--ng-global-6); --ng-input-prefix-color:#ff6969; --ng-input-text:#fff5f5; --ng-input-placeholder:#e2aaaa; --ng-control:#470000; --ng-text:#fff5f5; --ng-text-muted:#e2aaaa; --ng-border:#9b3030; --ng-border-subtle:#732020; --ng-shadow:0 14px 36px rgba(0,0,0,.34); --ng-particle-connection:rgba(255,84,84,.34); --ng-particle-pointer:rgba(255,203,203,.66); --ng-particle-glow-core:rgba(255,55,55,.92); --ng-particle-glow-edge:rgba(255,0,0,.42); --ng-particle-node:#fff5f5; }
/* Dark red is layered, like the original dark green: deep red background, then lighter red surfaces. */
html[data-theme="dark"] { --ng-global-1:#35070a; --ng-global-2:#35070a; --ng-global-3:#4d0a0e; --ng-global-4:#681017; --ng-global-5:#5a0d12; --ng-global-6:#5a0d12; --ng-global-7:#8d1720; --ng-global-8:#74151b; --ng-global-9:#4d0a0e; --ng-global-10:#ff5252; --ng-global-11:#641016; --ng-global-12:#4d0a0e; --ng-global-13:#ff5c5c; --ng-global-14:#641016; --ng-global-15:#8d1720; --ng-global-16:#ff5252; --ng-input-border:var(--ng-global-6); --ng-control:#42090d; --ng-border:#8d2329; --ng-border-subtle:#6f1a20; --ng-text:#fff5f5; --ng-text-muted:#e2aaaa; --od-bg:#3a0b0f; --od-surface:#430d12; --od-surface-raised:#561117; --od-surface-soft:rgba(86,17,23,.78); --od-border:rgba(255,158,158,.24); --od-shadow:0 24px 60px rgba(0,0,0,.25); }
html[data-theme="dark"] body.od-app { background:radial-gradient(circle at 18% -12%,#841923 0,transparent 34%),radial-gradient(circle at 87% 5%,#641119 0,transparent 31%),linear-gradient(150deg,#581116 0%,#3a0b0f 50%,#2d070a 100%); }
html[data-theme="dark"] .od-particle-bg { opacity:.56; }
html[data-theme="dark"] :is(.od-catalog-card,.od-color-card,.od-terminal-card,.od-feature-card) { background:var(--od-surface-raised); }

/* Home sections sit on solid parent surfaces so the particle layer stays decorative. */
.od-home-panel { position:relative; padding:clamp(28px,4vw,64px); border:1px solid var(--od-border); border-radius:var(--od-radius-lg); background:var(--od-surface-raised); box-shadow:var(--od-shadow); }.od-home-panel--hero { padding-block:clamp(38px,5vw,78px); }.od-home-panel--tools { padding-block:clamp(32px,4vw,56px); }.od-home-panel .od-terminal-card,.od-home-panel .od-feature-card { background:var(--od-surface); }.od-home-panel .od-feature-card:hover { background:var(--od-surface-raised); }
@media (max-width:991.98px) { .od-home-panel { padding:30px 24px; border-radius:var(--od-radius); }.od-home-panel--hero { padding-block:38px; } }

/* Once sections have outer panels, their previous standalone vertical spacing is no longer needed. */
.od-hero { padding:46px 0 30px; }.od-section#herramientas { padding:32px 0 56px; }
html[data-theme="light"] { --ng-surface-home-panel:#ffffff; --ng-surface-home-inner:#fff3f3; }
html[data-theme="dark"] { --ng-surface-home-panel:#561117; --ng-surface-home-inner:#3d090d; }
.od-home-panel { background:var(--ng-surface-home-panel); }
.od-home-panel .od-terminal-card,.od-home-panel .od-feature-card { background:var(--ng-surface-home-inner) !important; }
@media (max-width:991.98px) { .od-hero { padding:28px 0 20px; }.od-section#herramientas { padding:24px 0 42px; } }

/* Dark theme: calm ink-blue workspace; red remains the ZurekoBet action accent. */
html[data-theme="dark"],.od-theme-dark-global-1 { --ng-global-1:#0b1b2d; --ng-global-2:#102238; --ng-global-3:#17314c; --ng-global-4:#203e5c; --ng-global-5:#142a43; --ng-global-6:#1b3450; --ng-global-7:#ff2b2b; --ng-global-8:#31516f; --ng-global-9:#1d3955; --ng-global-10:#ff4242; --ng-global-11:#2b4b69; --ng-global-12:#cc2630; --ng-global-13:#ff5353; --ng-global-14:#20364f; --ng-global-15:#ff2b2b; --ng-global-16:#ff5252; --ng-text-on-global-1:#f4f9ff; --ng-text-on-global-3:#f4f9ff; --ng-text-on-global-4:#f4f9ff; --ng-text-on-global-7:#ffffff; --ng-text-on-global-9:#f4f9ff; --ng-text-on-global-12:#ffffff; --ng-text-on-global-15:#ffffff; --ng-text-muted-on-global-1:#b7c8d9; --ng-input-border:#294765; --ng-input-prefix-color:#ff5a5a; --ng-input-text:#f4f9ff; --ng-input-placeholder:#9db2c6; --ng-control:#0d1c2f; --ng-text:#f4f9ff; --ng-text-muted:#9db2c6; --ng-border:#294765; --ng-border-subtle:#1d3854; --ng-shadow:0 14px 36px rgba(0,0,0,.28); --ng-particle-connection:rgba(255,79,79,.24); --ng-particle-pointer:rgba(255,205,205,.58); --ng-particle-glow-core:rgba(255,55,55,.82); --ng-particle-glow-edge:rgba(255,23,23,.32); --ng-particle-node:#fff3f3; --od-bg:#091625; --od-surface:#102238; --od-surface-raised:#142b45; --od-surface-soft:rgba(20,43,69,.82); --od-text:#f4f9ff; --od-muted:#9db2c6; --od-border:rgba(115,160,201,.24); --od-primary:#ff2020; --od-primary-strong:#df0808; --od-primary-soft:rgba(255,32,32,.14); --od-secondary:#5186b8; --od-success:#35d692; --od-info:#5ca9e6; --od-warning:#ffbf59; --od-danger:#ff5252; --od-shadow:0 24px 60px rgba(0,0,0,.30); --od-grid:rgba(126,171,212,.06); --ng-surface-home-panel:#0d1c2f; --ng-surface-home-inner:#142b45; }
html[data-theme="light"] { --ng-value-positive:#00865a; --ng-value-negative:#c70022; }html[data-theme="dark"],.od-theme-dark-global-1 { --ng-value-positive:#35d692; --ng-value-negative:#ef4b50; }.od-value-global-1 { font-weight:var(--ng-weight-regular); }.od-value-global-1--positive,.od-value-global-1--neutral { color:var(--ng-value-positive); }.od-value-global-1--negative { color:var(--ng-value-negative); }
html[data-theme="dark"] body.od-app { background:radial-gradient(circle at 18% -12%,#1a3654 0,transparent 34%),radial-gradient(circle at 87% 5%,#132944 0,transparent 31%),linear-gradient(150deg,#0d1d31 0%,#091625 50%,#06111d 100%); }

/* Neutral dark foundation: graphite surfaces, never visibly blue. */
html[data-theme="dark"],.od-theme-dark-global-1 { --ng-global-1:#090a0f; --ng-global-2:#0d0f15; --ng-global-3:#171a22; --ng-global-4:#22252e; --ng-global-5:#15171e; --ng-global-6:#23262f; --ng-global-8:#3a3e49; --ng-global-9:#1c1f27; --ng-global-11:#363a45; --ng-global-14:#22252e; --ng-input-border:#30333d; --ng-control:#101218; --ng-text:#f5f6f8; --ng-text-muted:#a8acb6; --ng-border:#343842; --ng-border-subtle:#252831; --od-bg:#0d0f15; --od-surface:#11131a; --od-surface-raised:#191b22; --od-surface-soft:rgba(25,27,34,.88); --od-text:#f5f6f8; --od-muted:#a8acb6; --od-border:rgba(255,255,255,.12); --od-secondary:#737783; --od-info:#9ba0ad; --od-grid:rgba(255,255,255,.045); --ng-surface-home-panel:#0d0f15; --ng-surface-home-inner:#191b22; }
html[data-theme="dark"] body.od-app { background:radial-gradient(circle at 18% -12%,#20232c 0,transparent 34%),radial-gradient(circle at 87% 5%,#171a22 0,transparent 31%),linear-gradient(150deg,#15171e 0%,#0d0f15 50%,#090a0f 100%); }
html[data-theme="dark"] .od-particle-bg { opacity:.42; }

/* Keep the blue-ink canvas; only content surfaces use the neutral graphite scale. */
html[data-theme="dark"] { --od-bg:#091625; }
html[data-theme="dark"] body.od-app { background:radial-gradient(circle at 18% -12%,#1a3654 0,transparent 34%),radial-gradient(circle at 87% 5%,#132944 0,transparent 31%),linear-gradient(150deg,#0d1d31 0%,#091625 50%,#06111d 100%); }
html[data-theme="dark"],.od-theme-dark-global-1 { --ng-surface-home-panel:#020618; --ng-surface-home-inner:#0f1324; }

/* Inicio: los contenedores usan el radio discreto global; la geometría píldora es exclusiva del botón global 2. */
.od-home-panel,
.od-home-panel .od-terminal-card,
.od-home-panel .od-feature-card,
.od-home-panel .od-feature-card__icon,
.od-home-panel .od-team-badge,
.od-home-panel .od-signal,
.od-home-panel .od-stat { border-radius:var(--ng-radius-md); }
.od-home-panel { border-radius:12px; }

/* Global button modifiers share the same radius and only change role or size. */
html[data-theme="light"] { --ng-button-inverse-bg:#ffffff; --ng-button-inverse-text:#2b1010; }
html[data-theme="dark"] { --ng-button-inverse-bg:#f4f9ff; --ng-button-inverse-text:#0d0f15; }
.od-button-global-1--large { min-height:50px; padding-inline:20px; border-radius:var(--ng-radius-sm); font-size:15px; }.od-button-global-1--light { border-color:var(--ng-button-inverse-bg); background:var(--ng-button-inverse-bg); color:var(--ng-button-inverse-text); }.od-button-global-1--light:hover,.od-button-global-1--light:focus-visible { border-color:var(--ng-global-4); background:var(--ng-global-4); color:var(--ng-text-on-global-4); }

/* Global Button 2: same palette and states as Button 1, with pill geometry. */
.od-button-global-2 { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:0 16px; border:var(--ng-border-width) solid var(--ng-global-11); border-radius:999px; background:var(--ng-global-12); color:var(--ng-text-on-global-12); font:14px/1 var(--ng-font); cursor:pointer; }.od-button-global-2:hover,.od-button-global-2:focus-visible { outline:0; background:var(--ng-global-4); color:var(--ng-text-on-global-4); }.od-button-global-2:disabled { cursor:not-allowed; opacity:.55; }.od-button-global-2.od-button-icon { width:36px; height:36px; padding:0; }.od-button-global-2--large { min-height:50px; padding-inline:22px; font-size:15px; }.od-button-global-2--secondary { border-color:transparent; background:transparent; color:var(--ng-text); box-shadow:inset 0 0 0 var(--ng-border-width) var(--ng-global-12); }.od-button-global-2--secondary:hover,.od-button-global-2--secondary:focus-visible { background:var(--ng-global-4); color:var(--ng-text-on-global-4); }.od-button-global-2--light { border-color:var(--ng-button-inverse-bg); background:var(--ng-button-inverse-bg); color:var(--ng-button-inverse-text); }.od-button-global-2--light:hover,.od-button-global-2--light:focus-visible { border-color:var(--ng-global-4); background:var(--ng-global-4); color:var(--ng-text-on-global-4); }

/* Global canvas and navigation surfaces: independent from color-role tokens. */
html[data-theme="light"] { --ng-surface-page:#fff9ef; --ng-surface-navbar:#fffefe; --ng-text-on-navbar:#2b1010; --ng-text-muted-on-navbar:#966464; --ng-surface-home-panel:#ffffff; --od-bg:var(--ng-surface-page); }
html[data-theme="dark"] { --ng-surface-page:#091625; --ng-surface-navbar:#020618; --ng-text-on-navbar:#f4f9ff; --ng-text-muted-on-navbar:#b7c8d9; --ng-surface-home-panel:#020618; }
.od-navbar { border-color:var(--ng-border); background:var(--ng-surface-navbar); color:var(--ng-text-on-navbar); }.od-brand { color:var(--ng-text-on-navbar); }.od-nav__link { color:var(--ng-text-muted-on-navbar); }

/* Global 7 is the darker interactive red: hover and focus never switch to gray. */
html[data-theme="light"] { --ng-global-7:#d90d17; }
html[data-theme="dark"],.od-theme-dark-global-1 { --ng-global-7:#a91f27; }
.od-button-global-1:hover,.od-button-global-1:focus-visible,.od-button-global-2:hover,.od-button-global-2:focus-visible { border-color:var(--ng-global-7); background:var(--ng-global-7); color:var(--ng-text-on-global-7); }.od-button-global-1--secondary:hover,.od-button-global-1--secondary:focus-visible,.od-button-global-2--secondary:hover,.od-button-global-2--secondary:focus-visible { border-color:var(--ng-global-7); background:var(--ng-global-7); color:var(--ng-text-on-global-7); }

/* Global tutorial video: the calling page supplies a YouTube or Bunny embed URL. */
.od-video-play-global-1 { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:36px; padding:0 14px; border:var(--ng-border-width) solid var(--ng-global-11); border-radius:999px; background:var(--ng-global-12); color:var(--ng-text-on-global-12); font:14px/1 var(--ng-font); cursor:pointer; }.od-video-play-global-1 i { display:grid; width:19px; height:19px; place-items:center; border-radius:50%; background:var(--ng-text-on-global-12); color:var(--ng-global-12); font-size:.7rem; }.od-video-play-global-1:hover,.od-video-play-global-1:focus-visible { outline:0; border-color:var(--ng-global-7); background:var(--ng-global-7); color:var(--ng-text-on-global-7); }.od-video-play-global-1:hover i,.od-video-play-global-1:focus-visible i { background:var(--ng-text-on-global-7); color:var(--ng-global-7); }.od-video-modal-global-1__dialog { width:min(920px,100%); }.od-video-modal-global-1__dialog .od-modal-global-1__title { box-sizing:border-box; width:100%; margin:0 0 16px; padding:0 52px 13px 0; border-bottom:3px solid var(--ng-global-12); }.od-video-modal-global-1__frame { position:relative; overflow:hidden; aspect-ratio:16/9; border:var(--ng-border-width) solid var(--ng-border-subtle); border-radius:var(--ng-radius-sm); background:#020618; }.od-video-modal-global-1__frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }.od-video-modal-global-1__description { margin:14px 0 0; color:var(--ng-text-muted); line-height:1.55; }.od-video-modal-global-1__description:empty { display:none; }@media (min-width:2000px) { .od-video-modal-global-1__dialog { width:min(1180px,100%); } }
.od-modal-global-1__dialog .od-modal-global-1__title { box-sizing:border-box; width:100%; margin:0 0 16px; padding:0 52px 13px 0; border-bottom:3px solid var(--ng-global-12); }
.od-login-modal__dialog { width:min(420px,100%); }
.od-login-modal__lead { margin:-5px 0 18px; color:var(--ng-text-muted); font-size:.92rem; }
.od-login-modal__form { display:grid; gap:12px; }
.od-login-modal__form label { display:grid; align-content:start; gap:6px; color:var(--ng-text); font-size:.82rem; font-weight:var(--ng-weight-medium); }
.od-login-modal__form .od-input-global-1 { min-height:42px; }
.od-login-modal__form > .od-button-global-1 { justify-content:center; margin-top:4px; }
.od-login-modal__error { margin-top:0; }
.od-register-modal__dialog { width:min(560px,100%); }
.od-register-modal__row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.od-register-modal__phone { grid-template-columns:110px minmax(0,1fr); }
.od-register-modal__row label { min-width:0; }
.od-register-modal__row .od-input-global-1 { width:100%; min-width:0; }
.od-register-modal__row .od-login-modal__error { margin-top:0; }
.od-register-modal__switch { margin:0; text-align:center; color:var(--ng-text-muted); font-size:.82rem; }
.od-register-modal__switch button { padding:0; border:0; background:none; }
.od-register-modal__success .od-button-global-1 { width:100%; justify-content:center; }
@media (max-width:575.98px) { .od-register-modal__row:not(.od-register-modal__phone) { grid-template-columns:minmax(0,1fr); } }
.od-user-menu { position:relative; display:flex; align-items:center; gap:8px; }
.od-user-menu__trigger { display:inline-flex; align-items:center; gap:6px; padding:7px 2px; border:0; background:transparent; color:var(--ng-text); font:inherit; cursor:pointer; }
.od-user-menu__trigger i { color:var(--ng-text-muted); font-size:.7rem; transition:transform .16s ease; }
.od-user-menu:hover .od-user-menu__trigger i,.od-user-menu:focus-within .od-user-menu__trigger i { transform:rotate(180deg); }
.od-user-menu__tier,.od-user-menu__balance { display:inline-flex; align-items:center; min-height:32px; padding:0 10px; border:var(--ng-border-width) solid var(--ng-border); border-radius:var(--ng-radius-sm); background:var(--ng-control); color:var(--ng-text); font-size:.8rem; font-weight:var(--ng-weight-semibold); white-space:nowrap; }
.od-user-menu__tier { gap:6px; }
.od-user-menu__tier i { color:var(--ng-value-positive); }
.od-user-menu__balance.od-value-global-1--positive { border-color:color-mix(in srgb,var(--ng-value-positive) 45%,var(--ng-border)); color:var(--ng-value-positive); }
.od-user-menu__balance.od-value-global-1--negative { border-color:color-mix(in srgb,var(--ng-value-negative) 45%,var(--ng-border)); color:var(--ng-value-negative); }
.od-user-menu__dropdown { position:absolute; z-index:60; top:100%; left:0; right:auto; display:none; min-width:160px; padding:5px; border:var(--ng-border-width) solid var(--ng-border-subtle); border-radius:var(--ng-radius-sm); background:var(--ng-global-2); box-shadow:0 10px 24px rgba(0,0,0,.14); }
.od-user-menu:hover .od-user-menu__dropdown,.od-user-menu:focus-within .od-user-menu__dropdown { display:grid; }
.od-user-menu__dropdown :is(a,button) { display:flex; align-items:center; gap:7px; width:100%; min-height:34px; padding:7px 10px; border:0; border-radius:var(--ng-radius-xs); background:transparent; color:var(--ng-text); font:14px/1 var(--ng-font); text-align:left; text-decoration:none; cursor:pointer; }
.od-user-menu__dropdown :is(a,button):hover { background:var(--ng-global-4); color:var(--ng-text-on-global-4); }
@media (max-width:575.98px) { .od-user-menu__tier { display:none; }.od-user-menu__balance { padding-inline:8px; font-size:.75rem; }.od-user-menu__name { max-width:88px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } }
.od-nav-dropdown { position:relative; display:flex; align-items:stretch; }
.od-nav-dropdown__trigger { border:0; background:transparent; font-family:inherit; cursor:pointer; }
.od-nav-dropdown__trigger i { margin-inline-start:3px; font-size:.68em; transition:transform .16s ease; }
.od-nav-dropdown:hover .od-nav-dropdown__trigger i,.od-nav-dropdown:focus-within .od-nav-dropdown__trigger i { transform:rotate(180deg); }
.od-nav-dropdown__menu { position:absolute; z-index:60; top:100%; left:0; display:none; min-width:190px; padding:5px; border:var(--ng-border-width) solid var(--ng-border-subtle); border-radius:var(--ng-radius-sm); background:var(--ng-global-2); box-shadow:0 10px 24px rgba(0,0,0,.14); }
.od-nav-dropdown:hover .od-nav-dropdown__menu,.od-nav-dropdown:focus-within .od-nav-dropdown__menu { display:grid; }
.od-nav-dropdown__menu a { display:flex; min-height:34px; align-items:center; padding:7px 10px; border-radius:var(--ng-radius-xs); color:var(--ng-text); font:14px/1 var(--ng-font); text-decoration:none; white-space:nowrap; }
.od-nav-dropdown__menu a:hover,.od-nav-dropdown__menu a.is-active { background:var(--ng-global-4); color:var(--ng-text-on-global-4); }
.od-nav-dropdown__separator { display:block; height:var(--ng-border-width); margin:5px 7px; background:var(--ng-border-subtle); }
.od-navbar .od-navbar-academy { flex-shrink:0; border-color:var(--ng-global-13); background:transparent; color:var(--ng-global-13); box-shadow:none; }
.od-navbar .od-navbar-academy:is(:hover,:focus-visible) { border-color:var(--ng-global-13); background:color-mix(in srgb,var(--ng-global-13) 8%,transparent); color:var(--ng-global-13); }
html[data-theme="dark"] .od-navbar .od-navbar-academy { color:#fff; }
.od-navbar .od-navbar-academy:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
.od-academy-external-modal__dialog { width:min(560px,100%); }
.od-academy-external-modal__url { overflow-wrap:anywhere; }
body.od-app .od-navbar .od-nav[data-mobile-nav] .od-nav__link--whatsapp { color:#25d366; white-space:nowrap; }
html[data-theme="light"] body.od-app .od-navbar .od-nav[data-mobile-nav] .od-nav__link--whatsapp { color:#087f3e; }
.od-access-section { padding:72px 0; }.od-access-section__card { display:grid; gap:14px; max-width:680px; padding:28px; }.od-access-section__card h1,.od-access-section__card p { margin:0; }.od-access-section__card p { color:var(--ng-text-muted); }

/* Data globals 17–24: exact light duplicates, independently tunable dark data identity. */
html[data-theme="light"] { --ng-global-17:#c70022; --ng-global-18:#ffffff; --ng-global-19:#ffe8ea; --ng-global-20:#ffd9dd; --ng-global-21:#f3b7c0; --ng-global-22:#ff1010; --ng-global-23:#c70022; --ng-global-24:#df292b; --ng-global-25:#e0192c; --ng-text-on-global-17:#ffffff; --ng-text-on-global-24:#ffffff; }
html[data-theme="dark"],.od-theme-dark-global-1 { --ng-global-17:#75191e; --ng-global-18:#14090a; --ng-global-19:#250d10; --ng-global-20:#3c1519; --ng-global-21:#7c2b30; --ng-global-22:#ef4b50; --ng-global-23:#ee6266; --ng-global-24:#75191e; --ng-global-25:#d43b40; --ng-text-on-global-17:#fff9f9; --ng-text-on-global-24:#fff9f9; }
/* Global 26: compact LEV quote badges. Light duplicates the interior surface; dark is intentionally brighter. */
html[data-theme="light"] { --ng-global-26:#fff3f3; }
html[data-theme="dark"],.od-theme-dark-global-1 { --ng-global-26:#17223a; }
.od-theme-dark-global-1 { color-scheme:dark; }
.od-panel { border-color:var(--ng-global-21); background:var(--ng-global-18); }.od-card-global-1 { border-color:var(--ng-global-21); background:var(--ng-global-19); }.od-card-global-1__title { background:var(--ng-global-17); color:var(--ng-text-on-global-17); }.od-card-global-1__body { background:var(--ng-global-19); }.od-card-global-2 { border-color:var(--ng-global-21); }.od-card-global-2__label { background:var(--ng-global-17); color:var(--ng-text-on-global-17); }.od-card-global-2__value { background:var(--ng-global-18); }.od-table-global-1 { border:var(--ng-border-width) solid var(--ng-global-21); border-collapse:separate; border-spacing:0; background:var(--ng-global-19); }.od-table-global-1 :is(th,td) { border:0; border-bottom:var(--ng-border-width) solid var(--ng-global-21); }.od-table-global-1 :is(th,td):not(:last-child) { border-inline-end:var(--ng-border-width) solid var(--ng-global-21); }.od-table-global-1 tbody tr:last-child :is(th,td) { border-bottom:0; }.od-table-global-1 thead th,.od-table-global-1 tbody th { background:var(--ng-global-26); color:var(--ng-text); }html[data-theme="light"] .od-table-global-1 thead th,html[data-theme="light"] .od-table-global-1 tbody th { background:var(--ng-global-24); color:var(--ng-text-on-global-24); }

/* Global typography: reusable hierarchy without landing-specific extra-bold display text. */
.od-table-global-1 { border-color:var(--ng-global-24); }
.od-table-global-1 :is(th,td) { border-bottom-color:var(--ng-global-24); }
.od-table-global-1 :is(th+th,th+td,td+td) { border-inline-start-width:0; }
.od-table-global-1 :is(th,td):not(:last-child) { border-inline-end-color:var(--ng-global-24); }
/* Neutral dark tables: do not recolor the shared red action/selection palette. */
html[data-theme="dark"],.od-theme-dark-global-1 { --ng-table-surface:#0f172a; --ng-table-border:#29354b; }
html[data-theme="dark"] .od-table-global-1,.od-theme-dark-global-1 .od-table-global-1 { background:var(--ng-table-surface); border-color:var(--ng-table-border); }
html[data-theme="dark"] .od-table-global-1 :is(th,td),.od-theme-dark-global-1 .od-table-global-1 :is(th,td) { border-bottom-color:var(--ng-table-border); }
html[data-theme="dark"] .od-table-global-1 :is(th,td):not(:last-child),.od-theme-dark-global-1 .od-table-global-1 :is(th,td):not(:last-child) { border-inline-end-color:var(--ng-table-border); }

/* Dos columnas equivalentes para comparadores con lista y calculadora. */
.od-comparator-layout-global-1 { display:grid; grid-template-columns:minmax(470px,1.01fr) minmax(470px,.99fr); gap:16px; align-items:start; }
.od-comparator-layout-global-1.od-lev-layout { grid-template-columns:minmax(470px,1.01fr) minmax(470px,.99fr); }
@media (max-width:991px) { .od-comparator-layout-global-1,.od-comparator-layout-global-1.od-lev-layout { grid-template-columns:1fr; } }
:root { --ng-text-display-size:clamp(2rem,3.5vw,3.55rem); --ng-text-display-weight:var(--ng-weight-medium); --ng-text-display-tracking:normal; --ng-text-display-line-height:1.08; --ng-text-display-measure:15ch; --ng-text-heading-size:clamp(1.65rem,2.5vw,2.2rem); --ng-text-heading-weight:var(--ng-weight-medium); }.od-text-display-global-1 { max-width:var(--ng-text-display-measure); color:var(--ng-text); font-size:var(--ng-text-display-size); font-weight:var(--ng-text-display-weight); letter-spacing:var(--ng-text-display-tracking); line-height:var(--ng-text-display-line-height); }.od-text-display-global-1 > span { color:var(--ng-global-12); }.od-text-heading-global-1 { margin:11px 0 0; color:var(--ng-text); font-size:var(--ng-text-heading-size); font-weight:var(--ng-text-heading-weight); letter-spacing:normal; line-height:1.16; }.od-text-card-title-global-1 { color:var(--ng-text); font-size:1.05rem; font-weight:var(--ng-weight-semibold); letter-spacing:normal; line-height:1.3; }.od-text-body-global-1 { color:var(--ng-text-muted); font-size:1rem; font-weight:var(--ng-weight-regular); line-height:1.65; }.od-text-card-body-global-1 { color:var(--ng-text-muted); font-size:.9rem; font-weight:var(--ng-weight-regular); line-height:1.6; }.od-text-label-global-1 { color:var(--ng-global-12); font-size:.72rem; font-weight:var(--ng-weight-semibold); letter-spacing:.1em; text-transform:uppercase; }
.od-subtitle-badge-global-1 { display:inline-flex; align-items:center; gap:7px; min-height:30px; padding:4px 12px; border:var(--ng-border-width) solid transparent; border-radius:999px; background:var(--ng-global-5); box-shadow:inset 0 0 0 var(--ng-border-width) var(--ng-global-12); color:var(--ng-global-12); font-size:.78rem; font-weight:var(--ng-weight-medium); letter-spacing:normal; line-height:1.2; }.od-subtitle-badge-global-1 i { font-size:1em; }.od-cta-panel .od-subtitle-badge-global-1 { border-color:transparent; background:transparent; box-shadow:inset 0 0 0 var(--ng-border-width) var(--ng-text-on-global-12); color:var(--ng-text-on-global-12); }
/* Both input variants share Comparator Favor's control surface, not quote-card fills. */
.od-input-global-2 { width:100%; min-height:36px; padding:7px 10px; border:var(--ng-border-width) solid var(--ng-input-border); border-radius:var(--ng-radius-sm); outline:0; background:var(--ng-control); color:var(--ng-input-text); font:16px var(--ng-font); }.od-input-global-2:focus,.od-input-global-2:focus-visible { border-color:var(--ng-global-7); outline:0; }.od-input-global-2::placeholder { color:var(--ng-input-placeholder); opacity:1; }
.od-input-shell-global-2 { border-color:var(--ng-input-border); background:var(--ng-control); color:var(--ng-input-text); }.od-input-shell-global-2:focus-within { border-color:var(--ng-global-7); }.od-input-shell-global-2 input { background:transparent; color:inherit; }
.od-tabs-global-1 { display:flex; align-items:stretch; gap:0; width:100%; overflow:hidden; border:0; border-bottom:var(--ng-border-width) solid var(--ng-border-subtle); border-radius:0; background:transparent; }.od-tabs-global-1 button { position:relative; flex:1; min-height:36px; padding:0 10px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--ng-text-muted); font:14px/1 var(--ng-font); cursor:pointer; }.od-tabs-global-1 button:hover,.od-tabs-global-1 button:focus-visible { outline:0; color:var(--ng-text); }.od-tabs-global-1 button.is-active { border-bottom-color:var(--ng-global-12); background:transparent; color:var(--ng-text); }

/* Dropdown global: CSS-only enhancement; unsupported browsers keep the native select. */
select.od-button-global-1 { width:auto; max-width:100%; padding-inline:13px; }
@supports (appearance:base-select) and selector(::picker(select)) {
    select.od-select-global-1,select.od-select-global-1::picker(select) { appearance:base-select; }
    select.od-select-global-1 { font-weight:var(--ng-weight-regular); }
    select.od-select-global-1::picker(select) { min-inline-size:anchor-size(width); max-block-size:min(320px,60vh); margin-block-start:4px; padding:4px; overflow:auto; border:var(--ng-border-width) solid var(--ng-global-21); border-radius:var(--ng-radius-sm); background:var(--ng-global-18); color:var(--ng-text); box-shadow:var(--ng-shadow); font:inherit; scrollbar-color:var(--ng-global-8) transparent; }
    select.od-select-global-1 option { min-block-size:28px; padding:5px 10px; border:0; border-radius:var(--ng-radius-xs); background:transparent; color:var(--ng-text); font:inherit; font-weight:var(--ng-weight-regular); line-height:1.25; white-space:nowrap; cursor:pointer; }
    select.od-select-global-1 option:not(:disabled):is(:checked,:hover,:focus,:focus-visible) { outline:0; background:var(--ng-global-12); color:var(--ng-text-on-global-12); }
    select.od-select-global-1 option:disabled { opacity:.45; cursor:not-allowed; }
    select.od-select-global-1 option::checkmark { display:none; }
    select.od-select-global-1::picker-icon { color:var(--ng-text); }
    select.od-select-global-1.od-button-global-1::picker-icon { color:currentColor; }
    select.od-select-global-1:open::picker-icon { rotate:180deg; }
}

/* Tabla global exclusiva de Score: compacta, sin cuadrícula ni borde exterior. */
.od-table-score-global-1 { width:100%; border:0; border-collapse:collapse; table-layout:fixed; background:var(--ng-global-18); color:var(--ng-text); font:inherit; }
.od-table-score-global-1 :is(th,td) { padding:4px 10px; border:0; vertical-align:middle; text-align:center; }
.od-table-score-global-1 :is(th,td):first-child { width:42%; text-align:left; }
.od-table-score-global-1 thead { position:sticky; z-index:2; top:0; }
.od-table-score-global-1 thead th { padding-block:7px; background:var(--ng-global-19); color:var(--ng-text); font-weight:var(--ng-weight-regular); }
.od-table-score-global-1 tbody td { background:var(--ng-global-18); }
.od-table-score-global-1 tbody tr:not(:last-child) td { border-bottom:var(--ng-border-width) solid var(--ng-border-subtle); }
.od-table-score-global-1 th button { width:100%; padding:0; border:0; background:transparent; color:inherit; font:inherit; text-align:inherit; cursor:pointer; }
.od-table-score-global-1 [data-score-pick] { width:100%; min-height:24px; padding:3px 6px; border:0; border-radius:var(--ng-radius-xs); background:transparent; color:inherit; font:inherit; text-align:center; cursor:pointer; }
.od-table-score-global-1__odd { position:relative; display:inline-block; white-space:nowrap; font-variant-numeric:tabular-nums; }
.od-table-score-global-1__odd .od-lev-odd-marker { position:absolute; inset-inline-start:calc(100% + 2px); top:50%; margin:0; transform:translateY(-50%); }
.od-table-score-global-1 [data-score-pick]:hover,.od-table-score-global-1 [data-score-pick]:focus-visible,.od-table-score-global-1 [data-score-pick].is-best { background:var(--ng-global-20); color:var(--ng-text); }
.od-table-score-global-1 [data-score-pick]:disabled { cursor:default; opacity:.45; }
.od-table-score-global-1__house { display:grid; grid-template-columns:24px 16px minmax(0,15ch) 20px 24px; align-items:center; justify-content:start; gap:4px; min-width:0; white-space:nowrap; }
.od-table-score-global-1__name { min-width:0; overflow:hidden; text-overflow:ellipsis; font-weight:var(--ng-weight-regular); }
.od-score-league__head strong { font-weight:var(--ng-weight-regular); }
.od-score-league__head .od-button-icon { width:auto; min-width:56px; height:34px; min-height:34px; padding:0 8px; gap:6px; flex-shrink:0; }
.od-table-score-global-1__house .od-score-rank { grid-column:1; color:var(--ng-text-muted); }
.od-table-score-global-1__house .od-score-bookmaker-logo { grid-column:2; width:16px; height:16px; object-fit:contain; }
.od-table-score-global-1__house .od-table-score-global-1__name { grid-column:3; }
.od-table-score-global-1__house a { grid-column:4; display:inline-grid; height:24px; place-items:center; color:var(--ng-global-7); }
.od-table-score-global-1__house .od-copy-global-1 { grid-column:5; }

/* Navbar y footer comparten la misma superficie para enmarcar la página. */
.od-api-rate-notice{position:fixed;inset:auto 24px 24px auto;z-index:20000;display:block;width:max-content;max-width:calc(100vw - 32px);padding:12px 16px;border:1px solid var(--ng-global-13);border-radius:var(--ng-radius-md);background:var(--od-surface-raised);color:var(--ng-global-13);box-shadow:var(--ng-shadow);font-size:14px;line-height:1.4;white-space:normal;pointer-events:none}
.od-api-rate-notice[hidden]{display:none!important}
.od-api-rate-notice--score{display:grid;gap:6px;width:min(440px,calc(100vw - 32px))}
.od-api-rate-notice--score strong{font-size:14px;font-weight:var(--ng-weight-medium)}
@media(max-width:767px){.od-api-rate-notice{inset:auto 16px max(16px,env(safe-area-inset-bottom)) 16px;width:auto}}
.od-footer { flex:0 0 auto; margin-top:42px; padding:18px 0; border-top-color:var(--ng-border); background:var(--ng-surface-navbar); color:var(--ng-text-muted-on-navbar); box-shadow:0 -10px 30px rgba(0,0,0,.10); font-size:.76rem; }.od-footer .od-brand { color:var(--ng-text-on-navbar); }.od-footer .od-brand--small { font-size:.9rem; }.od-footer .od-brand--small .od-brand__mark { width:26px; height:26px; }.od-footer p { color:var(--ng-text-muted-on-navbar); }
@media (min-width:2000px) { .od-footer { margin-top:70px; padding:28px 0; font-size:.82rem; }.od-footer .od-brand--small { font-size:1rem; }.od-footer .od-brand--small .od-brand__mark { width:29px; height:29px; } }
@media (max-width:991px) { .od-footer { margin-top:32px; padding:16px 0; } }

/* Shared, database-backed footer: Imperial's four sections, Zureko's palette. */
.od-site-footer { margin-top:8px; padding:10px 0; box-shadow:none; font-size:14px; }
.od-site-footer__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.od-site-footer__column { display:flex; align-items:flex-start; gap:10px; min-width:0; }
.od-site-footer__column > div,.od-site-footer__social { min-width:0; }
.od-site-footer__icon { flex:0 0 20px; font-size:22px; line-height:1.2; color:var(--ng-accent-gold,#ffd60a); }
.od-site-footer h2 { margin:0 0 4px; color:var(--ng-text-on-navbar); font-size:15px; font-weight:600; line-height:1.4; }
.od-site-footer p { margin:0; color:var(--ng-text-on-navbar); line-height:1.45; overflow-wrap:anywhere; }
.od-site-footer__multiline { white-space:pre-line; }
.od-site-footer__social-links { display:flex; flex-wrap:wrap; gap:8px; }
.od-site-footer__social-links :is(a,span) { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; flex:0 0 28px; border:1px solid var(--ng-text-muted-on-navbar); border-radius:50%; color:var(--ng-text-muted-on-navbar); font-size:14px; }
.od-site-footer__social-links a:hover,.od-site-footer__social-links a:focus-visible { color:var(--ng-global-13); border-color:currentColor; }
.od-site-footer__social-links a:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
.od-site-footer__copyright { margin-top:6px; font-size:12px; text-align:center; }
.od-site-footer__copyright strong { margin-inline:4px; }
@media(max-width:991.98px) { .od-site-footer__grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 20px; }.od-site-footer__social-links :is(a,span) { width:40px; height:40px; flex-basis:40px; font-size:17px; } }
@media(max-width:575.98px) { .od-site-footer__grid { grid-template-columns:1fr; }.od-site-footer__social { padding-left:30px; } }