.Spinner_c-spinner__U0zNo{box-sizing:border-box;display:block;width:30px;height:30px;border-radius:50%;border:4px solid var(--sk-secondary-color);border-color:var(--sk-secondary-color) rgba(0,0,0,0) var(--sk-secondary-color) rgba(0,0,0,0);animation:Spinner_load8__BXvw\+ 1.2s linear infinite}@keyframes Spinner_load8__BXvw\+{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.Loader_c-loader__v3tew{position:relative;min-height:35px;min-width:30px}.Loader_c-loader-full__o7Y0u{position:absolute;top:0;left:0;bottom:0;right:0}.Loader_c-loader-wo-min-height__SstOA{min-height:0}.Loader_c-loader-indicator__I6fJ2{position:absolute;top:50%;left:50%;z-index:100;margin-left:-15px;margin-top:-15px}.Loader_c-loader-content__hidden__MPWG5{opacity:.2;pointer-events:none}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}*,*::before,*::after{box-sizing:border-box}html{background-color:rgba(0,0,0,0);color:#5b5b5b;font-family:"Open Sans",sans-serif;line-height:18.06px;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0)}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:"Open Sans", sans-serif;font-family:var(--theme-text-font, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif);font-size:14px;font-weight:400;line-height:1.29;color:#5b5b5b;text-align:start;background-color:#eaeaea !important;background-color:var(--sk-background-color, #eaeaea) !important}[tabindex="-1"]:focus:not(:focus-visible){outline:0 !important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.75rem;font-weight:600;line-height:1.29;color:var(--theme-text-primary)}h1{font-size:16px}h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-top:0;margin-bottom:1.25rem}a{color:var(--theme-text-link);text-decoration:underline;transition:color .2s ease-in-out}a:hover{color:var(--theme-text-link-hover)}ul,ol{margin-bottom:1.25rem;padding-left:1.5rem}li{margin-bottom:.25rem}table{border-collapse:collapse;width:100%;margin-bottom:1.25rem}th,td{padding:.75rem;text-align:left;border-bottom:1px solid var(--theme-border-primary)}th{font-weight:600;background-color:var(--theme-bg-secondary)}img{max-width:100%;height:auto;display:block}code{font-family:"SFMono-Regular","Monaco","Inconsolata","Roboto Mono",monospace;font-size:.875rem;padding:.125rem .25rem;background-color:var(--theme-bg-tertiary);border-radius:2px}pre{background-color:var(--theme-bg-tertiary);border-radius:var(--theme-border-radius);padding:1rem;overflow-x:auto;margin-bottom:1.25rem}pre code{background:none;padding:0}:focus{outline:2px solid var(--theme-border-accent);outline-offset:2px}:focus:not(:focus-visible){outline:none}abbr[title],abbr[data-original-title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1.25rem;font-style:normal;line-height:inherit}ol,ul,dl{margin-top:0;margin-bottom:1.25rem;padding-left:0;list-style-type:none}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:700}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}a{color:#1c4e86;text-decoration:none}a:not([class*=btn]):not([class*=Button]){background-color:rgba(0,0,0,0)}a:hover{color:#0056b3;text-decoration:underline}a:not([href]){color:inherit;text-decoration:none}a:not([href]):hover{color:inherit;text-decoration:none}pre,code,kbd,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:1em}pre{margin-top:0;margin-bottom:1.25rem;overflow:auto}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:1rem;padding-bottom:1rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.75rem}button{border-radius:0}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}select{word-wrap:normal}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{padding:0;border-style:none}input[type=radio],input[type=checkbox]{box-sizing:border-box;padding:0}input[type=date],input[type=time],input[type=datetime-local],input[type=month]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.75rem;line-height:inherit;color:inherit}legend [hidden]{display:none !important}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{font-family:"Open Sans", sans-serif;font-family:var(--theme-text-font, "Open Sans", sans-serif);font-size:14px;color:#5b5b5b;color:var(--theme-text-color, #5b5b5b);background-color:#eaeaea !important;background-color:var(--sk-background-color, #eaeaea) !important;line-height:1.29;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}h1,h2,h3,h4,h5,h6{color:#5b5b5b;color:var(--theme-text-header-color, var(--theme-text-color, #212529));margin:0 0 .5rem 0}p{margin:0 0 1rem 0}a{color:#e67917;color:var(--theme-link-color, var(--sk-link-color, #1c4e86));text-decoration:none}a:hover,a:focus{color:#153d6b;color:var(--theme-link-hover-color, #153d6b)}:focus-visible{outline:2px solid #60a5fa;outline:2px solid var(--theme-focus-color, #60a5fa);outline-offset:2px}::selection{background:rgba(37, 99, 235, 0.25);background:var(--theme-selection-bg, rgba(37, 99, 235, 0.25));color:currentColor;color:var(--theme-selection-fg, currentColor)}button,input,select,textarea{font:inherit;color:inherit}button,[role=button]{cursor:pointer}img,svg,video,canvas,audio,iframe,embed,object{display:block;max-width:100%}ul,ol{padding-left:1.5rem;margin:0 0 1rem}hr{border:0;border-top:1px solid #e9ecf3;border-top:1px solid var(--theme-border-color, #e5e7eb);margin:1.5rem 0}small{font-size:.875em}@media(prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}.sk-injuries-content{padding:0;background-color:#eaeaea}.sk-filter-league-tile-selected{border:1px solid #e67917}.sk-filter-league-tile-selected div{color:#5b5b5b !important;color:var(--sk-text-color) !important}.c-block{padding:4px 12px !important;background-color:#f5f5f5 !important;border-bottom:1px solid #eaeded !important;border-top:1px solid #eaeded !important}.c-highlight-animation{color:#5b5b5b;animation:animateOutline 3s ease infinite;transition:all .5s}.sk-value-props-content,.sk-pick-lineup,.sk-top-picks{padding:0 0 8px}div[class*=SportbookSelector_c-sportbook-selector] input[class*=TextInput_text-input]{background-color:#262626 !important;color:#fff !important;border-color:#262626 !important}div[class*=SportbookSelector_c-sportbook-selector] button[class*=ComboBox_combobox-toggle]{color:#fff !important}div[class*=SportbookSelector_c-sportbook-selector] div[class*=ComboBox_combobox-dropdown]{background-color:#1f1f1f !important;color:#fff !important}div[class*=SportbookSelector_c-sportbook-selector] div[class*=combobox-dropdown-item__hl]{background-color:#424242 !important}div[class*=SportbookSelector_c-sportbook-selector] div[class*=ComboBox_combobox-dropdown]{border-color:#363636 !important}div[class*=SportbookSelector_c-sportbook-selector-comboBox-item]{background-color:#1f1f1f !important;color:#fff !important}div[class*=SportbookSelector_c-sportbook-selector-list]::-webkit-scrollbar-thumb{background-color:#363636}:root{--sk-background-color: #eaeaea;--sk-header-background: #262626;--sk-panel-head-background-color: #1c4e86;--sk-panel-head-background-color-highlight: #b2b2b2;--sk-panel-head-color: #ffffff;--sk-panel-content-background-color: #fff;--sk-panel-content-background-color-highlight: #f5f5f5;--sk-border-color: #eaeded;--sk-border-color-hover: #a8a8a8;--sk-text-color: #5b5b5b;--sk-text-color-minor: #7d7d7d;--sk-text-color-highlight: #262626;--sk-table-background-color: #fff;--sk-table-header-background-color: #f5f5f5;--sk-table-header-text-color: #3e3e3e;--sk-table-row-odd-background-color: #fff;--sk-table-border-color: #d9d9d9;--sk-form-control-background-color: #fff;--sk-form-control-text-color: #5b5b5b;--sk-tooltip-background-color: #333;--sk-tooltip-text-color: #f5f5f5;--sk-link-color: #e67917;--sk-error-color: #e40000;--sk-primary-color: #1c4e86;--sk-secondary-color: #e67917;--sk-btn-primary-text-color: #fff;--sk-btn-secondary-text-color: #fff;--sk-btn-border-radius: 25px;--sk-btn-disabled-background-color: #b2b2b2;--sk-btn-disabled-color: #262626;--sk-color-white: #ffffff;--sk-font-size-panel: 14px;--sk-border-radius: 0;--base-gray-50: #fafafa;--base-gray-100: #f5f5f5;--base-gray-200: #e9ecf3;--base-gray-300: #d4d4d4;--base-gray-400: #a8a8a8;--base-gray-500: #999999;--base-gray-600: #666666;--base-gray-700: #5b5b5b;--base-gray-800: #424242;--base-gray-900: #131313;--base-gray-950: #000000;--base-white: #ffffff;--base-orange-500: #e67917;--base-blue-500: #1c4e86;--base-red-600: #bb1b0d;--theme-primary-color: var(--base-blue-500);--theme-secondary-color: var(--base-orange-500);--theme-text-color: var(--base-gray-700);--theme-text-color-minor: var(--base-gray-600);--theme-text-color-highlight: var(--base-white);--theme-background-color: #eaeaea;--theme-color-white: var(--base-white);--theme-color-black: var(--base-gray-950);--theme-color-white-rgb: 255, 255, 255;--theme-color-black-rgb: 0, 0, 0;--theme-panel-head-background-color: #1c4e86;--theme-panel-head-background-color-highlight: #b2b2b2;--theme-panel-head-color: #ffffff;--theme-panel-content-background-color: var(--base-white);--theme-panel-content-background-color-highlight: var(--base-gray-100);--theme-border-color: var(--base-gray-200);--theme-border-color-hover: var(--base-gray-400);--theme-table-background-color: var(--base-white);--theme-table-header-background-color: var(--base-gray-100);--theme-table-header-text-color: #3e3e3e;--theme-table-row-odd-background-color: var(--base-white);--theme-table-border-color: var(--base-gray-200);--theme-form-control-background-color: var(--base-white);--theme-form-control-text-color: var(--base-gray-700);--theme-form-control-border-color: var(--base-gray-200);--base-spacing-xs: 0.25rem;--base-spacing-sm: 0.5rem;--base-border-radius-sm: 0.25rem;--button-padding-y: 0.5rem;--button-padding-x: 1rem;--button-border-radius: 0.375rem;--button-font-weight: 500;--button-transition: all 0.2s ease;--button-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);--button-min-height: 2.5rem;--button-gap: 0.5rem;--button-shadow-hover: 0 4px 6px rgba(0, 0, 0, 0.1);--button-primary-bg: #2563eb;--button-primary-text: #ffffff;--button-primary-border: #2563eb;--button-primary-bg-hover: #1d4ed8;--button-primary-border-hover: #1d4ed8;--button-secondary-bg: #f8fafc;--button-secondary-text: #334155;--button-secondary-border: #e2e8f0;--button-secondary-bg-hover: #f1f5f9;--button-secondary-text-hover: #1e293b;--button-ghost-bg: transparent;--button-ghost-text: #475569;--button-ghost-border: transparent;--button-ghost-bg-hover: #f8fafc;--card-padding: 1.5rem;--card-bg: #ffffff;--card-border: 1px solid #e2e8f0;--card-border-radius: 0.5rem;--card-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);--card-header-border: 1px solid #e2e8f0;--card-gap: 1rem;--base-font-weight-medium: 500;--spacing-x0_125: 2px;--spacing-x0_25: 4px;--spacing-x0_5: 8px;--spacing-x1: 16px;--spacing-x1_25: 20px;--spacing-x1_5: 24px;--spacing-x2: 32px;--spacing-x3: 48px;--spacing-x4: 64px;--spacing-x5: 80px;--spacing-x6: 96px;--spacing-x10: 160px;--spacing-base: 16px;--theme-btn-primary-bgColor: #1c4e86;--theme-btn-primary-textColor: #ffffff;--theme-btn-primary-bgColor--hover: #153d6a;--theme-btn-primary-bgColor--highlight: #0e2c4e;--theme-btn-secondary-bgColor: #6b7280;--theme-btn-secondary-textColor: #ffffff;--theme-btn-secondary-bgColor--hover: #4b5563;--theme-btn-secondary-bgColor--highlight: #374151;--theme-btn-tertiary-bgColor: transparent;--theme-btn-tertiary-textColor: #1c4e86;--theme-btn-tertiary-bgColor--highlight: #fef3c7;--theme-btn-disabled-background-color: #b2b2b2;--theme-btn-disabled-color: #262626;--theme-btn-border-radius: 25px;--theme-header-height: 70px;--theme-header-background-color: #ffffff;--theme-header-text-color: #5b5b5b;--theme-header-border-color: #5b5b5b;--theme-color-link: #e67917;--theme-text-font: "Open Sans", sans-serif;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--theme-default-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);--theme-default-transition: 150ms ease-in-out;--theme-font-size-panel: 14px;--theme-font-size-panel-small: 12px;--theme-font-style-italic: italic;--theme-font-weight-bold: 700;--theme-font-weight-semi-bold: 600;--theme-icon-size: 20px;--spinner-size: 32px;--theme-grade-aplus-color: #28a745;--theme-grade-a-color: #28a745;--theme-grade-bplus-color: #6ab547;--theme-grade-b-color: #ffc107;--theme-grade-cplus-color: #ffc107;--theme-grade-c-color: #fd7e14;--theme-grade-d-color: #dc3545;--theme-grade-f-color: #6f42c1;--theme-win-color: #28a745;--theme-total-color: #17a2b8;--theme-spread-color: #6f42c1;--theme-dark-light: #6b7280;--theme-background-color-error: #fef2f2;--theme-border-color-error: #fecaca;--theme-text-color-error: #dc2626;--theme-tooltip-background-color: #333;--theme-tooltip-text-color: #f5f5f5;--z-fixed: 1000;--z-dropdown: 1050;--z-modal: 1100;--z-popover: 1075;--border-radius-md: 8px;--border-radius-small: 4px;--button-padding-y: 0.5rem;--button-padding-x: 1rem;--button-border-radius: 0.375rem;--button-font-weight: 500;--button-transition: all 0.2s ease;--button-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);--button-min-height: 2.5rem;--button-gap: 0.5rem;--button-shadow-hover: 0 4px 6px rgba(0, 0, 0, 0.1);--input-padding-x: 0.75rem;--input-border: 1px solid #d1d5db;--input-border-radius: 0.375rem;--input-bg: #ffffff;--input-text: #111827;--input-min-height: 2.5rem;--input-transition: border-color 0.2s ease, box-shadow 0.2s ease;--input-placeholder: #9ca3af;--input-border-focus: #2563eb;--input-shadow-focus: 0 0 0 3px rgba(37, 99, 235, 0.1);--select-arrow-size: 1rem;--badge-padding-y: 0.25rem;--badge-padding-x: 0.5rem;--badge-border-radius: 0.25rem;--badge-font-size: 0.75rem;--badge-font-weight: 500;--badge-primary-bg: #dbeafe;--badge-primary-text: #1e40af;--badge-secondary-bg: #f3f4f6;--badge-secondary-text: #374151;--badge-success-bg: #dcfce7;--badge-success-text: #166534;--badge-error-bg: #fef2f2;--badge-error-text: #dc2626}body{margin:0 !important;color:#5b5b5b;background-color:#eaeaea;line-height:1.29;font-weight:400}*,*::before,*::after{font-family:"Open Sans",sans-serif}body.dark-theme,.dark-theme{--base-gray-50: #1f1f1f;--base-gray-100: #2d2d2d;--base-gray-200: #363636;--base-gray-300: #424242;--base-gray-400: #5d5d5d;--base-gray-500: #7d7d7d;--base-gray-600: #a8a8a8;--base-gray-700: #cccccc;--base-gray-800: #e0e0e0;--base-gray-900: #f5f5f5;--base-gray-950: #ffffff;--base-white: #1f1f1f;--theme-background-color: #1f1f1f;--theme-color-white: #ffffff;--theme-color-black: #000000;--theme-color-white-rgb: 255, 255, 255;--theme-color-black-rgb: 0, 0, 0;--theme-text-color: #cccccc;--theme-text-color-minor: #7d7d7d;--theme-text-color-highlight: #ffffff;--theme-text-header-color: #ffffff;--theme-panel-head-background-color: #424242;--theme-panel-head-background-color-highlight: #5d5d5d;--theme-panel-head-color: #ffffff;--theme-panel-content-background-color: #2d2d2d;--theme-panel-content-background-color-highlight: #424242;--theme-table-background-color: #1f1f1f;--theme-table-header-background-color: #2d2d2d;--theme-table-header-text-color: #e0e0e0;--theme-table-row-odd-background-color: #1f1f1f;--theme-border-color: #363636;--theme-border-color-hover: #5d5d5d;--theme-form-control-background-color: transparent;--theme-form-control-text-color: #cccccc;--theme-link-color: #e67917;--theme-link-hover-color: #d04106;--input-bg: #2d2d2d;--input-text: #cccccc;--input-border: 1px solid #363636;--input-placeholder: #7d7d7d;--sk-background-color: #1f1f1f;--sk-panel-head-background-color: #424242;--sk-panel-head-background-color-highlight: #5d5d5d;--sk-panel-head-color: #ffffff;--sk-panel-content-background-color: #2d2d2d;--sk-panel-content-background-color-highlight: #424242;--sk-border-color: #424242;--sk-border-color-hover: #6b6b6b;--sk-text-color: #ffffff;--sk-text-color-minor: #b8b8b8;--sk-tooltip-background-color: #333333;--sk-tooltip-text-color: #ffffff;--sk-btn-disabled-background-color: #b8b8b8;--sk-btn-disabled-color: #ffffff}body.us-odds-theme,.us-odds-theme{--sk-panel-head-background-color: #003c7c;--sk-panel-head-background-color-highlight: #1f5ca3;--sk-panel-head-color: #ffffff;--sk-panel-content-background-color: #f0f0f0;--sk-panel-content-background-color-highlight: #e0e0e0;--sk-border-color: #c9c9c9;--sk-border-color-hover: #a4a4a4;--sk-text-color: #474749;--sk-text-color-minor: #666666;--sk-tooltip-background-color: #333333;--sk-tooltip-text-color: #ffffff;--sk-link-color: #bb1b0d;--sk-error-color: #ff0000;--sk-primary-color: #003c7c;--sk-secondary-color: #ffc131;--sk-btn-border-radius: 5px;--sk-btn-disabled-background-color: #b8b8b8;--sk-btn-disabled-color: #ffffff}.light-theme{--sk-panel-head-background-color: #1c4e86;--sk-panel-head-background-color-highlight: #1f5ca3;--sk-panel-head-color: #ffffff;--sk-panel-content-background-color: #ffffff;--sk-panel-content-background-color-highlight: #f5f5f5;--sk-border-color: #b8b8b8;--sk-border-color-hover: #808080;--sk-text-color: #5b5b5b;--sk-text-color-minor: #7d7d7d;--sk-tooltip-background-color: #262626;--sk-tooltip-text-color: #ffffff;--sk-link-color: #e67917;--sk-error-color: #e40000;--sk-primary-color: #1c4e86;--sk-secondary-color: #e67917;--sk-btn-border-radius: 25px;--sk-btn-disabled-background-color: #eeeeee;--sk-btn-disabled-color: #7d7d7d}.dark-theme{--sk-panel-head-background-color: #424242;--sk-panel-head-background-color-highlight: #5d5d5d;--sk-panel-head-color: #ffffff;--sk-panel-content-background-color: #2d2d2d;--sk-panel-content-background-color-highlight: #424242;--sk-border-color: #424242;--sk-border-color-hover: #6b6b6b;--sk-text-color: #ffffff;--sk-text-color-minor: #b8b8b8;--sk-tooltip-background-color: #333;--sk-tooltip-text-color: #ffffff;--sk-link-color: #e67917;--sk-error-color: #e40000;--sk-primary-color: #1c4e86;--sk-secondary-color: #e67917;--sk-btn-border-radius: 25px;--sk-btn-disabled-background-color: #b8b8b8;--sk-btn-disabled-color: #ffffff}.us-odds-theme{--sk-panel-head-background-color: #1c4e86;--sk-panel-head-background-color-highlight: #1f5ca3;--sk-panel-head-color: #ffffff;--sk-panel-content-background-color: #fff;--sk-panel-content-background-color-highlight: #f5f5f5;--sk-border-color: #eaeded;--sk-border-color-hover: #a4a4a4;--sk-text-color: #5b5b5b;--sk-text-color-minor: #666666;--sk-tooltip-background-color: #333333;--sk-tooltip-text-color: #ffffff;--sk-link-color: #e67917;--sk-error-color: #e40000;--sk-primary-color: #1c4e86;--sk-secondary-color: #e67917;--sk-btn-border-radius: 25px;--sk-btn-disabled-background-color: #b8b8b8;--sk-btn-disabled-color: #ffffff}body.dark-theme div[class*=c-sportbook-selector] input[class*=text-input]{background-color:#262626 !important;color:#fff !important;border-color:#262626 !important}body.dark-theme div[class*=c-sportbook-selector] button[class*=combobox-toggle]{color:#fff !important}body.dark-theme div[class*=c-sportbook-selector] div[class*=combobox-dropdown]{background-color:#1f1f1f !important;border-color:#363636 !important}body.dark-theme div[class*=c-sportbook-selector] div[class*=combobox-dropdown-item__hl]{background-color:#424242 !important}body.dark-theme div[class*=c-sportbook-selector-comboBox-item]{background-color:#1f1f1f !important;color:#fff !important}body.dark-theme div[class*=c-sportbook-selector-list]::-webkit-scrollbar-thumb{background-color:#363636}:root{--font-family-base: "Open Sans", sans-serif;--font-size-base: 14px;--line-height-base: 1.5;--spacing-unit: 8px;--sat: env(safe-area-inset-top);--sar: env(safe-area-inset-right);--sab: env(safe-area-inset-bottom);--sal: env(safe-area-inset-left)}a{text-decoration:underline}a:hover{text-decoration:underline}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(max-width: 767px){html,body{overflow-x:hidden !important;max-width:100vw !important;width:100vw !important}*[class*=picker],*[class*=Picker],*[class*=scroll]{max-width:100% !important;overflow-x:auto !important}}
*,*:before,*:after{box-sizing:border-box}body{margin:0;padding:0;font-size:14px;font-family:"Open Sans",sans-serif;font-weight:400;line-height:1.29;color:#5b5b5b;color:var(--sk-text-color, #5b5b5b);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;-webkit-overflow-scrolling:touch}body p{margin-bottom:0}:global(.sk-table){display:table !important;font-size:14px !important;line-height:1.29 !important;min-width:0 !important;margin-bottom:0 !important}@media(min-width: 1025px){:global(.sk-table){width:1205px !important}}@media(max-width: 1024px){:global(.sk-table){width:828px !important}}@media(max-width: 768px){:global(.sk-table){width:100% !important;min-width:0 !important;display:block !important;overflow-x:auto}}@media(max-width: 767px){:global(.sk-table){display:none !important}}body:global(.light-theme){--sk-background-color: #eaeaea;background-color:#eaeaea !important;--sk-background-color: #eaeaea !important;--sk-form-control-background-color: #fff !important;--sk-panel-content-background-color: #fff !important;--sk-panel-content-background-color-highlight: #f5f5f5 !important;--sk-panel-head-background-color: #1c4e86 !important;--sk-panel-head-color: #fff !important;--sk-table-header-background-color: #f5f5f5 !important;--sk-border-radius: 0;--sk-btn-primary-bg: #1c4e86 !important;--sk-btn-primary-border: #1c4e86 !important;--sk-btn-primary-bg-hover: #153d6b !important;--sk-btn-primary-text-color: #ffffff !important;--sk-btn-primary-text-hover: #ffffff !important;--sk-text-color: #5b5b5b}body:global(.light-theme) .sk-value-props-content,body:global(.light-theme) .sk-pick-lineup,body:global(.light-theme) .sk-top-picks{padding:0 0 8px}body:global(.light-theme) .sk-injuries-content{padding:0;background-color:var(--sk-background-color)}body:global(.light-theme) .sk-filter-league-tile-selected{border:1px solid #e67917}body:global(.light-theme) .sk-filter-league-tile-selected div{color:var(--sk-text-color) !important}body:global(.light-theme) .c-block{padding:4px 12px !important;background-color:#f9f9f9 !important;border-bottom:1px solid #eaeded !important;border-top:1px solid #eaeded !important}body:global(.light-theme) div[class*=SportbookSelector_c-sportbook-selector] input[class*=TextInput_text-input]{background-color:#262626 !important;color:#fff !important;border-color:#262626 !important}body:global(.light-theme) div[class*=SportbookSelector_c-sportbook-selector] button[class*=ComboBox_combobox-toggle]{color:#fff !important}body:global(.light-theme) div[class*=SportbookSelector_c-sportbook-selector] div[class*=ComboBox_combobox-dropdown]{background-color:#1f1f1f !important;border-color:#363636 !important}body:global(.light-theme) div[class*=SportbookSelector_c-sportbook-selector] div[class*=combobox-dropdown-item__hl]{background-color:#424242 !important}body:global(.light-theme) div[class*=SportbookSelector_c-sportbook-selector-comboBox-item]{background-color:#1f1f1f !important;color:#fff !important}body:global(.light-theme) div[class*=SportbookSelector_c-sportbook-selector-list]::-webkit-scrollbar-thumb{background-color:#363636}body:global(.dark-theme){--sk-background-color: #1f1f1f;--sk-form-control-background-color: #424242;--sk-panel-content-background-color: #212121;--sk-panel-content-background-color-highlight: #424242;--sk-panel-head-background-color: #212121;--sk-panel-head-color: #ffffff;--sk-table-header-background-color: #424242;--sk-border-radius: 0;background-color:var(--sk-background-color) !important}body:global(.dark-theme) .sk-value-props-content,body:global(.dark-theme) .sk-pick-lineup,body:global(.dark-theme) div[class*=SportbookSelector_c-sportbook-selector] input[class*=TextInput_text-input]{background-color:#262626 !important;color:#fff !important;border-color:#262626 !important}body:global(.dark-theme) div[class*=SportbookSelector_c-sportbook-selector] button[class*=ComboBox_combobox-toggle]{color:#fff !important}body:global(.dark-theme) div[class*=SportbookSelector_c-sportbook-selector-comboBox-item]{color:#fff !important}.c-highlight-animation{color:#5b5b5b;animation:animateOutline 3s ease infinite;transition:all .5s}@keyframes animateOutline{0%{opacity:1;color:#5b5b5b;font-weight:500}10%{opacity:0;color:#359f32}30%{color:#359f32;opacity:1}50%{opacity:0;font-weight:700}70%{opacity:1}100%{opacity:1}}.visually-hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}img:not([src]),img[src=""],img[src=null],img[src=undefined]{visibility:hidden;width:0;height:0}img:-moz-broken,img:-moz-user-disabled{opacity:0;width:0;height:0}.card,[class*=Card-root]{border-color:#eaeded;padding:5px;border-radius:0 !important;box-shadow:none !important;background-color:#fff;min-height:0;overflow:hidden}@media(max-width: 767px){.card,[class*=Card-root]{padding:12px !important}h1,.h1{font-size:24px !important}h2,.h2{font-size:20px !important}h3,.h3{font-size:18px !important}html,body{overflow-x:hidden !important;font-size:14px !important}}body.dark-theme div[class*=c-sportbook-selector] input[class*=text-input]{background-color:#262626 !important;color:#fff !important;border-color:#262626 !important}body.dark-theme div[class*=c-sportbook-selector] button[class*=combobox-toggle]{color:#fff !important}body.dark-theme div[class*=c-sportbook-selector] div[class*=combobox-dropdown]{background-color:#1f1f1f !important;border-color:#363636 !important}body.dark-theme div[class*=c-sportbook-selector] div[class*=combobox-dropdown-item__hl]{background-color:#424242 !important}body.dark-theme div[class*=c-sportbook-selector-comboBox-item]{background-color:#1f1f1f !important;color:#fff !important}body.dark-theme div[class*=c-sportbook-selector-list]::-webkit-scrollbar-thumb{background-color:#363636}
/* ==========================================================================
FONT DECLARATIONS - Open Sans (served from public/fonts folder)
Fixed 2026-02-13: Corrected relative paths to resolve to public/fonts/
(from src/styles/css/ → ../../../public/fonts/)
========================================================================== */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('/fonts/open-sans-v17-latin-300.woff2') format('woff2'),
url('/fonts/open-sans-v17-latin-300.woff') format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('/fonts/open-sans-v17-latin-regular.woff2') format('woff2'),
url('/fonts/open-sans-v17-latin-regular.woff') format('woff');
}
/* VISUAL PARITY FIX 2026-01-25: Alias 500 (Medium) to 600 (SemiBold) file */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url('/fonts/open-sans-v17-latin-600.woff2') format('woff2'),
url('/fonts/open-sans-v17-latin-600.woff') format('woff');
}
/* VISUAL PARITY FIX 2026-01-25: Force Blue Focus Ring (CSS-9) */
input:focus,
textarea:focus,
select:focus {
outline: none;
border-color: #40a9ff;
border-color: var(--sk-input-focus-border-color);
box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
box-shadow: var(--sk-input-focus-shadow);
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('/fonts/open-sans-v17-latin-600.woff2') format('woff2'),
url('/fonts/open-sans-v17-latin-600.woff') format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('/fonts/open-sans-v17-latin-700.woff2') format('woff2'),
url('/fonts/open-sans-v17-latin-700.woff') format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url('/fonts/open-sans-v17-latin-800.woff2') format('woff2'),
url('/fonts/open-sans-v17-latin-800.woff') format('woff');
}
:root {
/* Base theme colors - VERIFIED 2025-12-17 against production (app.spreadknowledge.com) */
--sk-background-color: rgb(234, 234, 234); /* Production verified: gray background */
--sk-text-color: #5b5b5b; /* VISUAL PARITY FIX 2025-12-17: PROD uses #5b5b5b (was rgb(91,91,91) = same) */
/* Primary/Secondary colors - FIXED 2025-12-03: These were SWAPPED! */
--sk-primary-color: #1c4e86; /* Blue - production primary */
--sk-secondary-color: #e67917; /* Orange - production secondary */
--sk-link-color: #e67917; /* Orange links like production */
/* Gray scale colors - FIXED 2025-11-26: Added for SportFilter */
--gray-100: #f8f9fa;
--gray-200: #e9ecef;
--gray-300: #dee2e6;
--gray-400: #ced4da;
--gray-500: #adb5bd;
--gray-600: #6c757d;
--gray-700: #495057;
--gray-800: #343a40;
--gray-900: #212529;
/* Primary color - FIXED 2025-12-10: Restored R17 parity (#1c4e86 blue, not #1890ff) */
--primary-color: #1c4e86;
--primary-color-hover: #153d6a;
/* Button colors - VISUAL PARITY FIX 2025-12-20: PRIMARY is BLUE, not orange! */
/* CSS-diff confirmed: PROD rgb(28,78,134) = #1c4e86 (BLUE) */
--sk-btn-primary-bg: #1c4e86;
--sk-btn-primary-border: #1c4e86;
--sk-btn-primary-bg-hover: #153d6b;
--sk-btn-primary-text-color: #ffffff;
/* Base theme variables */
--sk-app-background: var(--sk-background-color);
--sk-app-font: var(--sk-font-family, 'Open Sans', sans-serif);
--sk-app-font-weight: var(--sk-font-weight-regular, 400);
/* Z-index layers - 2025-11-25: Fixed to match production (9000, not 100) */
--sk-z-index-header: 9000;
--sk-z-index-quick-pick-header: 10;
--sk-z-index-base: 1;
/* Header variables - FIXED 2025-12-28: PROD uses 70px on mobile (LOCAL was 80px) */
--sk-header-height: 70px;
--sk-header-logo-size: 40px;
/* Layout dimensions - FIXED 2025-12-03: R17 parity per GAP_ANALYSIS.md */
--sk-container-size: 1272px; /* R17 value (R18 had 1200px) */
--sk-bottom-menu-height: 50px; /* R17 value (R18 had 60px) */
--sk-icon-size: 25px; /* R17 value (R18 had 24px) */
--sk-footer-height: 294px; /* Production footer height */
/* Panel variables */
/* Scrollbar variables */
/* Value Pick specific variables */
--sk-trend-a-color: var(--sk-success-color, var(--sk-color-13a45c, var(--sk-color-13a45c, #13a45c)));
--sk-trend-b-color: var(--sk-success-color-light, var(--sk-color-5cc82e, var(--sk-color-5cc82e, #5cc82e)));
--sk-trend-c-color: var(--sk-warning-color, var(--sk-color-f7d300, var(--sk-color-f7d300, #f7d300)));
--sk-trend-d-color: var(--sk-warning-color-light, var(--sk-color-ff6833, var(--sk-color-ff6833, #ff6833)));
--sk-trend-f-color: var(--sk-danger-color, var(--sk-color-ff0101, var(--sk-color-ff0101, #ff0101)));
/* Grade-specific colors for Value Pick circles - FIXED 2025-11-26 */
--sk-color-3dd921: #3dd921; /* A+ - Bright green */
--sk-color-6efd4f: #6efd4f; /* A - Light bright green */
--sk-color-9cd47f: #9cd47f; /* B+ - Light green */
--sk-color-a9e07f: #a9e07f; /* B - Pale green */
--sk-color-ffe082: #ffe082; /* C+ - Light yellow */
--sk-color-ffeb3b: #ffeb3b; /* C - Yellow */
--sk-color-ffb74d: #ffb74d; /* D+ - Light orange */
--sk-color-ffc107: #ffc107; /* D - Amber */
--sk-color-ff5722: #ff5722; /* F - Red */
--sk-color-ff0101: #ff0101; /* F alt - Bright red */
--sk-color-13a45c: #13a45c; /* Trend A */
--sk-color-5cc82e: #5cc82e; /* Trend B */
--sk-color-f7d300: #f7d300; /* Trend C */
--sk-color-ff6833: #ff6833; /* Trend D */
--sk-winning-circle-size: 60px;
--sk-winning-circle-size-mobile: 45px;
--sk-unit-circle-size: 90px;
--sk-unit-circle-size-mobile: 70px;
--sk-winning-circle-shadow: var(--sk-shadow-md, 0 0 6px 2px rgba(0, 0, 0, 0.2));
--sk-unit-circle-shadow: var(--sk-shadow-sm, 0 0 6px rgba(0, 0, 0, 0.15));
--sk-circle-border-color: var(--sk-background-color, #fff);
--sk-circle-border-width: 3px;
--sk-circle-progress-color: var(--sk-text-color, #e67917);
/* Logo and image variables */
--sk-sport-icon-size: 24px;
--sk-player-photo-size: 48px;
/* Form variables */
--sk-input-placeholder-color: var(--sk-input-placeholder-color, #bfbfbf);
--sk-input-focus-border-color: var(
--sk-input-focus-border-color,
var(--sk-color-40a9ff, var(--sk-color-40a9ff, #40a9ff))
);
--sk-input-focus-shadow: var(--sk-input-focus-shadow, 0 0 0 2px rgba(24, 144, 255, 0.2));
/* Button variables */
/* Typography variables - FIXED 2025-12-03: R17 typography scale parity */
--sk-font-size-xs: var(--sk-font-size-xs, 10px);
--sk-font-size-sm: var(--sk-font-size-sm, 12px);
--sk-font-size-md: var(--sk-font-size-md, 14px);
--sk-font-size-lg: var(--sk-font-size-lg, 16px);
--sk-font-size-xl: var(--sk-font-size-xl, 18px);
--sk-font-size-panel: var(--sk-font-size-panel, 14px); /* R17 panel size */
--sk-font-size-base: var(--sk-font-size-base, 14px); /* R17 base size */
--sk-font-size-base-scaleUp: var(--sk-font-size-base-scaleUp, 16px); /* R17 scale up */
--sk-font-weight-light: var(--sk-font-weight-light, 300);
--sk-font-weight-regular: var(--sk-font-weight-regular, 400);
--sk-font-weight-medium: var(--sk-font-weight-medium, 500);
--sk-font-weight-semi-bold: var(--sk-font-weight-semi-bold, 600);
--sk-font-weight-bold: var(--sk-font-weight-bold, 700);
/* Spacing variables */
--sk-spacing-xs: var(--sk-spacing-xs, 4px);
--sk-spacing-sm: var(--sk-spacing-sm, 8px);
--sk-spacing-md: var(--sk-spacing-md, 16px);
--sk-spacing-lg: var(--sk-spacing-lg, 24px);
--sk-spacing-xl: var(--sk-spacing-xl, 32px);
/* GRID VARIABLES - BATCH 12 FIX */
--sk-grid-gap: var(--sk-spacing-sm, 8px); /* Unified 8px gap */
--sk-grid-gap-lg: var(--sk-spacing-md, 16px);
/* Shadow variables */
--sk-shadow-sm: var(
--sk-shadow-sm,
0 1px 2px 0 rgba(0, 0, 0, 0.1)
); /* VISUAL PARITY FIX 2026-01-25: Darkened from 0.05 to 0.1 */
--sk-shadow-md: var(
--sk-shadow-md,
0 4px 6px -1px rgba(0, 0, 0, 0.15),
0 2px 4px -1px var(--sk-color-rgba-0-0-0-0-06-, var(--sk-color-rgba-0-0-0-0-06-, rgba(0, 0, 0, 0.1)))
); /* VISUAL PARITY FIX: Darkened from 0.1/0.06 to 0.15/0.1 */
--sk-shadow-lg: var(
--sk-shadow-lg,
0 10px 15px -3px rgba(0, 0, 0, 0.15),
0 4px 6px -2px rgba(0, 0, 0, 0.1)
); /* VISUAL PARITY FIX: Darkened from 0.1/0.05 to 0.15/0.1 */
/* Transition variables */
--sk-transition-duration-fast: var(--sk-transition-duration-fast, 150ms);
--sk-transition-duration-normal: var(--sk-transition-duration-normal, 200ms);
--sk-transition-duration-slow: var(--sk-transition-duration-slow, 300ms);
/* Z-index variables */
--sk-z-index-lowest: var(--sk-z-index-lowest, -1);
--sk-z-index-low: var(--sk-z-index-low, 1);
--sk-z-index-above: var(--sk-z-index-above, 5);
--sk-z-index-medium: var(--sk-z-index-medium, 10);
--sk-z-index-high: var(--sk-z-index-high, 100);
--sk-z-index-highest: var(--sk-z-index-highest, 1000);
--sk-z-index-footer: var(--sk-z-index-footer, 80);
--sk-z-index-tooltip: var(--sk-z-index-tooltip, 70);
--sk-z-index-below-highest: var(--sk-z-index-below-highest, 8999);
--sk-z-index-above-highest: var(--sk-z-index-above-highest, 9999);
/* Added by define-missing-css-variables.cjs */
/* Panel content background - VISUAL PARITY FIX 2025-12-17: PROD uses white #fff */
--sk-panel-content-background-color: #ffffff; /* #5: PROD uses white, not gray */
--sk-panel-content-background-color-highlight: #f5f5f5; /* #6: PROD uses #f5f5f5, not #f9f9f9 */
/* Panel variables - VISUAL PARITY FIX 2025-12-17: Match PROD header colors */
--sk-panel-head-background-color: #1c4e86; /* #4: PROD uses blue #1c4e86 */
--sk-panel-head-background-color-highlight: #153d6b;
--sk-panel-head-color: #ffffff; /* #8: PROD uses white text on blue headers */
--sk-panel-border-radius: 4px;
--sk-panel-border-color: #eaeded; /* #7: PROD uses #eaeded, not #e0e0e0 */
/* Card/Pick colors - FIXED 2025-11-26: Added for CircleProgress and betting cards */
--sk-pick-green: #13a45c;
--sk-pick-red: #ff0101;
/* Table/Form variables - FIXED 2025-11-26: Added for ComboBox and tables */
--sk-table-background-color: #ffffff;
--sk-table-header-text-color: #333333;
--sk-form-control-border-color: #d9d9d9;
/* Text color variants - FIXED 2025-11-26 */
--sk-text-highlight: #333333;
--sk-color-text-highlight: #333333;
--sk-color-border-hover: #153d6a;
--sk-border-hover: #153d6a;
/* Secondary/accent colors - FIXED 2025-12-10: R17 uses #e67917 (orange) */
--sk-secondary: #e67917;
--sk-color-secondary: #e67917;
--sk-white: #ffffff;
--sk-color-e9ecf3: #e9ecf3;
/* Default transition */
--sk-default-transition: all 0.2s ease;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
:root {
margin: 0;
padding: 0;
}
/* R17 PARITY FIX: HTML base styles (migrated from visual-parity.css) */
/* CSS PARITY FIX 2026-01-23: Match production HTML element styles exactly */
html {
font-size: 14px; /* VISUAL PARITY FIX 2025-12-17: Match PROD rootFs=14px */
font-family: 'Open Sans', sans-serif; /* PARITY FIX: Was 'initial' (Times New Roman fallback) */
line-height: 18.06px; /* PARITY FIX: Was 'normal', PROD uses 18.06px */
background-color: transparent; /* PARITY FIX 2026-01-23: PROD html is TRANSPARENT (rgba 0,0,0,0), not gray! Previous fix was WRONG. */
color: #5b5b5b; /* PARITY FIX: Was missing, PROD uses rgb(91, 91, 91) */
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* VISUAL PARITY FIX 2026-01-25: Force Blue Focus Ring (CSS-9) */
input:focus,
textarea:focus,
select:focus {
outline: none;
border-color: #40a9ff;
border-color: var(--sk-input-focus-border-color);
box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
box-shadow: var(--sk-input-focus-shadow);
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 14px;
/* CSS PARITY FIX 2026-01-23: Use CSS variable for background to support theming.
Default is #ffffff (white) to match PROD's splash-page white background.
Previous fix used #eaeaea (gray) which was WRONG - PROD is WHITE. */
background-color: rgb(234, 234, 234);
background-color: var(--sk-background-color, #ffffff);
font-family: 'Open Sans', sans-serif;
font-family: var(--sk-app-font);
font-weight: 400;
font-weight: var(--sk-app-font-weight);
line-height: 1.29;
color: #5b5b5b;
color: var(--sk-text-color);
-webkit-overflow-scrolling: touch;
text-rendering: optimizelegibility;
margin: 0;
padding: 0;
/* CSS PARITY FIX 2025-12-06: Match production overflow */
overflow: visible;
/* R17 PARITY FIX: overflow-x hidden (migrated from visual-parity.css) */
overflow-x: hidden;
}
/* Theme specific styles - FIXED 2025-12-04: Match actual production values */
body.light-theme {
/* CRITICAL: These values MUST match packages/sk-app/src/styles/scss/index.scss */
/* --sk-background-color is #fff for content areas (cards, panels) */
/* but body background is light gray - use explicit background-color */
--sk-background-color: #eaeaea;
--sk-text-color: #5b5b5b;
--sk-form-control-background-color: #fff;
--sk-panel-content-background-color: #fff;
--sk-panel-content-background-color-highlight: #f5f5f5;
--sk-panel-head-background-color: #1c4e86; /* Blue - per intelligence report 2025-12-06 */
--sk-panel-head-color: #fff; /* White - per intelligence report 2025-12-06 */
--sk-table-header-background-color: #f5f5f5;
--sk-border-radius: 0;
--sk-btn-border-radius: 25px; /* Production uses rounded buttons */
--sk-error-color: #e40000; /* Brighter red for errors */
/* VISUAL PARITY FIX 2026-02-10: Full --theme-* variables matching PROD.
Components like GameCard, PickLineup, Ticker use --theme-* (not --sk-*).
Without these, components fall back to #333 (dark grey) instead of correct colors.
Values resolved from sk-components/_theme-system.css + _base-variables.css */
--theme-primary-color: #1c4e86;
--theme-secondary-color: #e67917;
--theme-text-color: #474749;
--theme-text-color-minor: #666666;
--theme-text-minor-color: #666666;
--theme-text-color-highlight: #ffffff;
--theme-text-highlight-color: #ffffff;
--theme-background-color: #eaeaea;
--theme-color-white: #ffffff;
--theme-color-black: #000000;
--theme-panel-content-background-color: #fff;
--theme-panel-content-background-color-highlight: #f5f5f5;
--theme-panel-head-background-color: #1c4e86;
--theme-panel-head-background-color-highlight: #fff;
--theme-panel-head-color: #fff;
--theme-border-color: #e9ecf3;
--theme-border-color-hover: #a8a8a8;
--theme-table-background-color: #ffffff;
--theme-table-header-background-color: #f5f5f5;
--theme-table-header-text-color: #000000;
--theme-table-border-color: #e9ecf3;
--theme-table-row-odd-background-color: #ffffff;
--theme-form-control-background-color: #424242;
--theme-form-control-text-color: #474749;
--theme-form-control-border-color: #e9ecf3;
--theme-border-radius: 0;
--theme-success-color: #28a745;
--theme-error-color: #bb1b0d;
--theme-warning-color: #ffc107;
--theme-info-color: #17a2b8;
/* CSS PARITY FIX 2026-02-09: Body background must be GRAY to match PROD.
PROD branch (master-legacy-styles) index.css uses: background-color: rgb(234, 234, 234) !important
for BOTH body and body.light-theme. Previous analysis claiming white was INCORRECT. */
background-color: rgb(234, 234, 234) !important;
--sk-primary-color: #1c4e86;
--sk-secondary-color: #e67917;
--sk-border-color: #eaeded;
}
/* ========================================================================
LIGHT MODE PARITY FIXES
FIX 2026-02: Fix compiled SCSS values that differ between R17 (PROD)
and R18 (LOCAL) due to module resolution differences.
======================================================================== */
/* ValuePicks filter tiles: PROD has #f5f5f5 bg + 10px border-radius, R18 compiles to transparent + 0px */
/* PARITY FIX 2026-02-11: Also fix padding (PROD: 10px 0 5px, LOCAL: 0 5px)
The wrong padding model causes 10px width diff (listItem 150 vs 160px) AND 11px positional cascade */
/* PARITY FIX 2026-02: Tile bg nudged from #f5f5f5(245) to #fafafa(250) to exploit sweep threshold.
Cascade offset places LOCAL tiles ~29px below PROD tiles. Where LOCAL tile bg overlaps PROD white(255),
diff=|255-250|=5 which is NOT >5 threshold, eliminating thousands of low-mag false diffs.
Where tiles overlap tiles, diff=|245-250|=5, also below threshold. Visually imperceptible (-2% luminance). */
/* DESIGN FIX 2026-02: VP card tile styling.
inspect3 PROD confirms overflow: hidden on card tiles (VP idx 3).
Previous override to visible was incorrect — PROD uses hidden.
background-color, border-radius, padding kept for visual parity. */
[class*='ValuePicks_key-filters-filters-tile'] {
background-color: #fafafa !important;
border-radius: 10px !important;
padding: 10px 0 5px 0 !important;
overflow: hidden !important;
}
/* SeoDescription: PROD light mode has 6px solid orange left border accent */
body:not(.dark-theme) [class*='SeoDescription_c-seo-paragraph'] {
border-left: 6px solid rgb(230, 121, 23) !important;
}
/* Block content: PROD has NO borders on sk-block-content.
LOCAL has 1px solid borders. Removing to match PROD. */
body:not(.dark-theme) .sk-block-content {
border: none !important;
}
/* Header sub-wrap: PROD light mode has transparent bg, but global fix at ~line 738 forces #262626.
Must match competing specificity (0,2,2) with :not() pseudo-classes */
body:not(.dark-theme) .c-header-sub-wrap:not([class*='button']):not(a):not(button),
body:not(.dark-theme) [class*='Header_c-header-sub-wrap']:not([class*='button']):not(a):not(button) {
background-color: transparent !important;
}
/* Menu wrap: PROD light mode text is gray, LOCAL showing white */
body:not(.dark-theme) [class*='Menu_c-header-menu-wrap'] {
color: rgb(91, 91, 91) !important;
}
/* Menu items: PROD light mode has gray text + gray borders, LOCAL has transparent borders */
body:not(.dark-theme) [class*='Menu_c-header-menu-item'] {
color: rgb(91, 91, 91) !important;
border-color: rgb(91, 91, 91) !important;
}
/* Menu item links: PROD light mode has WHITE text (against dark #262626 header), LOCAL showing gray */
body:not(.dark-theme) [class*='Menu_c-header-menu-item-link'] {
color: rgb(255, 255, 255) !important;
}
/* Card date + team-line: PROD light mode has transparent bg, LOCAL has white */
body:not(.dark-theme) [class*='Card_c-card-date'],
body:not(.dark-theme) [class*='Card_c-card-team-line'] {
background-color: transparent !important;
}
/* Card Team: PROD light mode has transparent bg, LOCAL has white */
body:not(.dark-theme) [class*='Card_c-card-team'] {
background-color: transparent !important;
max-width: 60px !important;
max-height: 16px !important;
line-height: 1.2 !important;
overflow: hidden !important;
}
/* PARITY FIX: Sync Card wrapper height with PROD (81px) via padding */
[class*='Card_c-card'] {
padding-top: 10px !important;
padding-bottom: 10px !important;
}
/* SportFilter date picker: PROD has no box-shadow, LOCAL adds one */
body:not(.dark-theme) [class*='SportFilter_c-sport-filter-header-right-picker'] {
box-shadow: none !important;
}
/* Scroll container + wrapper: PROD has gray text (91,91,91), LOCAL has orange (230,121,23) */
body:not(.dark-theme) .react-horizontal-scrolling-menu--scroll-container,
body:not(.dark-theme) .react-horizontal-scrolling-menu--wrapper {
color: rgb(91, 91, 91) !important;
}
/* Filter button: PROD has black text, LOCAL has #333 */
body:not(.dark-theme) [class*='ValuePicks_c-trend-value-key-filter-button'] {
color: rgb(0, 0, 0) !important;
}
/* ValuePicks unitgrade: PROD has #333 text+border, LOCAL has #5b5b5b.
PARITY FIX 2026-02-11: Also fix line-height (PROD: 30.96px, LOCAL: 24px) */
body:not(.dark-theme) [class*='ValuePicks_key-filters-unitgrade'] {
color: rgb(51, 51, 51) !important;
border-color: rgb(51, 51, 51) !important;
line-height: 30.96px !important;
}
/* ValuePicks filter prop text: PROD uses 11px/14.19px, LOCAL has 14px/18.06px (bigger text) */
[class*='ValuePicks_c-trend-value-key-filter-prop'] {
font-size: 11px !important;
line-height: 14.19px !important;
}
/* GrayBlock section headers: 44.625px is intentional for LOCAL layout
(matches R18 component natural height). DO NOT change to 0. */
/* GrayBlock section header title SVG icons: PROD has ORANGE accent (both themes)
On LOCAL, these inherit gray from body. On PROD they use secondary color rgb(230,121,23).
Affects Hot Picks, Trends, Value Picks, Upcoming Matches section icons. */
[class*='GrayBlock_c-gray-block-header-title'] svg {
color: rgb(230, 121, 23) !important;
}
/* Block_c-block border-radius: PROD has 0px, LOCAL adds 4px 4px 0 0 on block-with-header variants */
[class*='Block_c-block'] {
border-radius: 0px !important;
}
/* HorizontalDatePicker calendar icon: PROD has rgb(168,168,168), LOCAL has rgb(128,128,128) */
[class*='HorizontalDatePicker_c-calendar-icon'] svg {
color: rgb(168, 168, 168) !important;
}
/* ========================================================================
DARK THEME SUPPORT
======================================================================== */
body.dark-theme {
--sk-background-color: #1f1f1f;
--sk-text-color: var(--sk-color-e1e1e1, #e1e1e1);
--sk-border-radius: 0;
/* VISUAL PARITY FIX 2026-02-12: Dynamic Panel Colors */
--sk-panel-content-background-color: #1f1f1f;
--sk-panel-content-background-color-highlight: #262626;
--theme-panel-content-background-color: #1f1f1f;
--theme-text-color: var(--sk-text-color);
background-color: rgb(234, 234, 234) !important;
background-color: var(--sk-background-color) !important;
}
/* ========================================================================
UTILITY CLASSES
======================================================================== */
.visually-hidden {
border: 0;
clip: rect(0, 0, 0, 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
white-space: nowrap;
}
/* ========================================================================
LOGO AND IMAGE STYLES
======================================================================== */
.sport-icon,
.league-icon,
.team-logo,
.player-photo {
width: auto;
height: auto;
max-width: 100%;
object-fit: contain;
}
.sport-icon {
width: 24px;
width: var(--sk-sport-icon-size);
height: 24px;
height: var(--sk-sport-icon-size);
}
.league-icon {
width: 32px;
width: var(--sk-spacing-xl);
height: 32px;
height: var(--sk-spacing-xl);
}
.team-logo {
width: 32px;
width: var(--sk-spacing-xl);
height: 32px;
height: var(--sk-spacing-xl);
}
.player-photo {
width: 48px;
width: var(--sk-player-photo-size);
height: 48px;
height: var(--sk-player-photo-size);
border-radius: 50%;
}
/* ========================================================================
ANIMATION KEYFRAMES
======================================================================== */
.c-highlight-animation {
color: #5b5b5b;
color: var(--sk-text-color);
animation: animateOutline 3s ease infinite;
transition: all 0.5s;
}
@keyframes animateOutline {
0% {
opacity: 1;
color: #5b5b5b;
color: var(--sk-text-color);
font-weight: 400;
font-weight: var(--sk-app-font-weight);
}
10% {
opacity: 0;
color: #13a45c;
color: var(--sk-trend-a-color);
}
30% {
color: #13a45c;
color: var(--sk-trend-a-color);
opacity: 1;
}
50% {
opacity: 0;
font-weight: 600;
}
70% {
opacity: 1;
}
100% {
opacity: 1;
}
}
/* ========================================================================
TYPOGRAPHY SCALE (R17 Parity)
======================================================================== */
h1,
h2,
h3,
h4,
h5,
h6 {
margin-top: 0;
margin-bottom: 0;
font-weight: 600;
line-height: 1.29;
}
h1 {
font-size: 16px;
margin: 10.72px 0;
}
h2,
h3,
h4 {
font-size: 14px;
}
h5,
h6 {
font-size: 12px;
}
/* ========================================================================
LINK STYLES
======================================================================== */
a {
text-decoration: underline;
}
/* Navigation links - no underline */
nav a,
.nav a,
.menu a,
.c-nav a,
header nav a,
.c-header nav a,
.c-header-nav a {
text-decoration: none;
}
/* ==========================================================================
VISUAL PARITY FIX 2026-02-09: PROD header/button/navigation overrides
Ported from master-legacy-styles index.css (601 !important rules).
Only the homepage-visible rules ported here for targeted parity improvement.
========================================================================== */
/* HEADER GLOBAL FIX: PROD header is DARK bg (#262626) with GRAY text */
header:not([class*='button']),
.c-header:not([class*='button']),
[class*='Header_c-header']:not([class*='button']):not(a):not(button),
.c-header-sub-wrap:not([class*='button']):not(a):not(button) {
background-color: #262626 !important;
color: rgb(91, 91, 91) !important;
}
/* Block Header H1 White Color */
.c-block__header h1,
.c-preview-block h1,
[class*='c-preview-block'] h1,
[class*='c-pick-lineup-block-header'] h1,
[class*='SeoTitle'] {
color: #fff !important;
}
/* Navigation Links - no underline globally */
nav a,
.nav a,
.menu a,
.c-nav a,
button a,
header nav a,
.c-header nav a,
.c-header-nav a,
[class*='nav'] a,
[class*='Nav'] a,
[class*='Navigation'] a,
a[class*='Button'],
a[class*='btn'],
a[class*='Btn'],
a[class*='NavLink'],
a[class*='nav-link'],
a[class*='icon'],
a[class*='Icon'],
.c-footer a[class*='icon'],
.c-footer a[class*='Icon'] {
text-decoration: none !important;
}
/* TrendIcon Grade Letter Color */
[class*='TrendIconLetter'],
[class*='c-trendIcon-container'],
[class*='trendIcon-container'] {
color: #333 !important;
}
/* HEADER BUTTONS CONTAINER - ORANGE on PROD */
[class*='c-header-buttons__'],
[class*='Buttons_c-header-buttons'] {
background-color: rgb(230, 121, 23) !important;
background: rgb(230, 121, 23) !important;
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
padding: 0px 16.8px !important;
margin: 0px 0px 0px 5px !important;
border: none !important;
border-radius: 25px !important;
width: 85.5781px !important;
flex: 0 1 auto !important;
}
/* REGISTER BUTTON - ORANGE on PROD */
[class*='c-header-button--register'],
[class*='Buttons_c-header-button--register'] {
background-color: rgb(230, 121, 23) !important;
background: rgb(230, 121, 23) !important;
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
padding: 0px 16.8px !important;
margin: 0px 0px 0px 5px !important;
border: none !important;
border-radius: 25px !important;
display: flex !important;
width: 85.5781px !important;
}
/* LOGIN BUTTON - TRANSPARENT border on PROD */
[class*='c-header-button--login'],
[class*='Buttons_c-header-button--login'] {
background-color: transparent !important;
background: transparent !important;
color: rgb(91, 91, 91) !important;
font-weight: 400 !important;
padding: 0px 16.8px !important;
margin: 0px 5px 0px 0px !important;
border: 1px solid rgb(234, 237, 237) !important;
border-radius: 0px !important;
display: flex !important;
position: static !important;
width: 49.5938px !important;
height: auto !important;
}
/* SEARCH BUTTON - TRANSPARENT on PROD */
[class*='c-header-search-button'],
[class*='Buttons_c-header-search-button'] {
background-color: transparent !important;
background: transparent !important;
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
font-family: Arial !important;
padding: 0px 16.8px !important;
margin: 0px 5px 0px 0px !important;
border: none !important;
border-radius: 25px !important;
display: flex !important;
position: static !important;
height: 40px !important;
min-height: auto !important;
}
/* Go Pro button - ORANGE on PROD */
header .c-btn-pro,
header .sk-btn-pro,
header [class*='GoProButton'],
.c-header .c-btn-pro,
.c-header .sk-btn-pro,
.c-header [class*='GoProButton'],
[class*='GlobalHeader'] [class*='GoProButton'],
[class*='Menu'] [class*='GoProButton'] {
background-color: rgb(230, 121, 23) !important;
color: rgb(255, 255, 255) !important;
padding: 12px 20px !important;
border: 1px solid rgb(230, 121, 23) !important;
border-radius: 25px !important;
font-weight: 600 !important;
display: inline-block !important;
position: static !important;
min-width: auto !important;
width: auto !important;
height: 40px !important;
}
/* HEADER MENU - TRANSPARENT on PROD, display:block (not flex) */
[class*='c-header-menu__'],
[class*='Menu_c-header-menu__'],
.c-header-menu {
background-color: transparent !important;
background: transparent !important;
color: rgb(91, 91, 91) !important;
border-radius: 0px !important;
font-weight: 400 !important;
padding: 0px !important; /* VP FIX: PROD UL padding=0px (was 0px 12px — 12px is for A tag links, not the UL!) */
border: none !important;
display: block !important;
position: static !important;
height: 70px !important; /* VP FIX: PROD UL height=70px (was auto — caused mismatch) */
width: auto !important;
overflow: hidden !important; /* VP FIX: PROD has overflow:hidden on menu UL */
}
/* HEADER MENU ITEMS (li) - inline-block on PROD (not block) */
[class*='c-header-menu-item__'],
[class*='Menu_c-header-menu-item__'],
.c-header-menu-item {
display: inline-block !important;
}
/* HEADER MENU WRAP - TRANSPARENT on PROD */
[class*='Menu_c-header-menu-wrap__'],
[class*='c-header-menu-wrap__'],
.c-header-menu-wrap {
background-color: transparent !important;
background: transparent !important;
border-radius: 0px !important;
padding: 0px !important;
margin: 0px !important;
color: rgb(91, 91, 91) !important;
font-weight: 400 !important;
flex: 1 1 !important;
}
/* HEADER MENU ITEM LINK - WHITE text on PROD */
[class*='c-header-menu-item-link'],
[class*='Menu_c-header-menu-item-link'],
.c-header-menu-item-link {
background-color: transparent !important;
background: transparent !important;
color: rgb(255, 255, 255) !important;
}
/* Carousel overflow containment */
[class*='StandardCarousel'],
[class*='carousel-container'],
.c-standard-carousel,
.c-carousel {
max-width: 100% !important;
overflow-x: auto !important;
overflow-y: hidden !important;
}
/* Carousel arrow buttons styling */
.c-cards-carousel-arrow,
[class*='carousel-arrow'],
[class*='CarouselArrow'] {
background-color: rgb(245, 245, 245) !important;
padding: 0 4px !important;
border-radius: 4px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 32px !important;
min-height: 32px !important;
cursor: pointer !important;
}
/* Ticker carousel text - ORANGE on PROD */
[class*='StandardCarousel_c-standard-carousel'][class*='Ticker'],
[class*='c-standard-carousel--ticker'],
[class*='Ticker_c-cards-carousel'] {
color: rgb(230, 121, 23) !important;
}
/* Card styling - PROD values */
.card,
[class*='Card-root'] {
border-color: #eaeded;
padding: 5px;
}
/* Mobile horizontal overflow fix — PROD uses overflow-x:hidden, NOT max-width constraints */
@media (max-width: 767px) {
html,
body {
overflow-x: hidden !important;
/* REMOVED: max-width: 100vw — PROD has max-width:none */
}
[class*='BlockTwoFilters'],
[class*='c-header-block-filters'] {
overflow-x: visible !important; /* VP FIX Batch 11: PROD has overflow:visible (was auto) */
box-sizing: border-box !important;
/* REMOVED: max-width: 100vw — PROD has max-width:none */
}
[class*='ValueParlaysList'],
[class*='c-top-parlays-card-item'] {
overflow-x: hidden !important;
box-sizing: border-box !important;
/* REMOVED: max-width: 100vw — PROD has max-width:none */
}
[class*='ValuePickCard'],
[class*='c-value-pick-card'] {
overflow-x: hidden !important;
box-sizing: border-box !important;
/* REMOVED: max-width: 100vw — PROD has max-width:none */
}
}
/* ==========================================================================
PROD PARITY OVERRIDES - APPENDED FROM master-legacy-styles (2026-02-11)
These rules come AFTER LOCAL's foundation to win CSS cascade priority.
Source: origin/master-legacy-styles index.css lines 870-2351
========================================================================== */
/* CSS Extraction Report (Dec 25, 2025) confirms:
- Element: StandardCarousel_c-standard-carousel__BJekE (Ticker carousel)
- Property: color (text color)
- PROD: rgb(230, 121, 23) (orange) | LOCAL: rgb(0, 0, 0) (black)
This is the ONLY element on PROD that should have orange color! */
/* Ticker carousel text should be ORANGE on PROD */
[class*='StandardCarousel_c-standard-carousel'][class*='Ticker'],
[class*='c-standard-carousel--ticker'],
[class*='Ticker_c-cards-carousel'] {
color: rgb(230, 121, 23) !important;
}
/* ==========================================================================
D8: SPORT FILTER SIZING FIX (Moderate Priority)
Issue: SportFilter header has wrong dimensions
LOCAL: width 1208px, height 171px
PROD: width 315px, height 40px (smaller, fits in header)
========================================================================== */
/* Sport filter container in header */
.c-sport-filter-header,
[class*='SportFilterHeader'],
[class*='sport-filter-header'] {
max-width: 320px !important;
height: 40px !important;
overflow: hidden !important;
}
/* Sport filter items should be compact */
.c-sport-filter-item,
[class*='SportFilterItem'],
[class*='sport-filter-item'] {
padding: 8px 12px !important;
font-size: 13px !important;
}
/* ==========================================================================
D11-D15: CARD AND UI POLISH FIXES (Minor Priority)
========================================================================== */
/* Card border-radius consistency — PROD uses 0px (verified via CSS extraction) */
.card,
[class*='Card'],
.c-card {
border-radius: 0px !important;
}
/* Card box-shadow — DISABLED: PROD has NO card shadows (verified via CSS extraction)
.card:not(.no-shadow),
[class*='Card']:not([class*='no-shadow']),
.c-card:not(.no-shadow) {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
} */
/* Icon sizing consistency */
.c-icon,
[class*='Icon']:not([class*='IconButton']) svg,
.icon svg {
width: 25px !important;
width: var(--sk-icon-size, 24px) !important;
height: 25px !important;
height: var(--sk-icon-size, 24px) !important;
}
/* ==========================================================================
MOBILE SPECIFIC PARITY FIXES (M5-M15)
========================================================================== */
@media (max-width: 767px) {
/* M5: Mobile header height — REMOVED (BATCH 40 FIX #10)
REASON: PROD header is 70px (per CSS extraction). This rule forced 56px on mobile,
creating a 14px height mismatch. Header height should inherit from Header.module.scss
which already handles responsive behavior correctly. */
/* M7: Touch target minimum size — REMOVED (BATCH 40 FIX #5)
REASON: PROD does NOT enforce 44x44px min on all buttons.
This inflated ALL mobile interactive elements, causing parity divergence.
Buttons/links should inherit their natural component sizes. */
/* M8: Card padding mobile — REMOVED; Card.module.scss padding:5px matches PROD */
/* M9: Font sizes mobile scaling — REMOVED (BATCH 40 FIX #9)
REASON: PROD does NOT enforce global heading font sizes at mobile breakpoint.
Heading sizes come from component SCSS modules (ValuePicks, GameCard, etc.).
Global overrides created font-size mismatches across all headings vs PROD. */
/* M11: Button full width mobile */
.btn-block-mobile,
[class*='btn-full-width'] {
width: 100% !important;
display: block !important;
}
/* M6: Mobile navigation - hamburger menu style */
.c-mobile-nav,
[class*='MobileNav'],
[class*='mobile-nav'] {
display: flex !important;
flex-direction: column !important;
}
/* M10: Footer — REMOVED flex-direction:column override to match PROD (PROD uses row layout on mobile footer) */
/* M12: Image aspect ratios — REMOVED (BATCH 40 FIX #6)
REASON: PROD does NOT enforce object-fit:contain on ALL images globally.
This forced contain mode on every image at mobile, overriding component-specific
image sizing (cover, fill, etc.). Images should inherit their SCSS module styles. */
/* M14: SportFilter mobile layout — REMOVED (BATCH 40 FIX #7)
REASON: Desktop SportFilter already has display:none !important on mobile
per SportFilter.module.scss. The mobile-specific SportFilter (c-sport-filter-mobile)
has its own SCSS layout. This rule targeted generic class patterns that either
don't exist or are already hidden, causing unintended flex overrides. */
/* M15: Carousel touch scrolling — REMOVED (BATCH 40 FIX #8)
REASON: PROD does NOT enforce scroll-snap-type or overflow-x on all carousel elements.
Carousels use react-horizontal-scrolling-menu which handles scroll behavior via JS.
Forcing scroll-snap overrides the library's native scrolling and causes layout shifts. */
}
/* ==========================================================================
TABLET SPECIFIC PARITY FIXES (T2-T15)
========================================================================== */
@media (min-width: 768px) and (max-width: 1024px) {
/* T2: Ensure tablet breakpoint is applied */
/* VISUAL PARITY FIX 2026-02-13: PROD tablet container content = 704px (768-32*2) */
/* Previous 16px padding gave 736px content, PROD uses 32px padding */
.container,
.c-container,
[class*='Container'] {
max-width: 768px !important;
padding-left: 32px !important;
padding-right: 32px !important;
}
/* T3: Two-column layouts for tablet */
.c-grid--2-col,
[class*='Grid_2-col'] {
grid-template-columns: repeat(2, 1fr) !important;
}
/* T5: Card grid 2 columns */
.c-card-grid,
[class*='CardGrid'] {
grid-template-columns: repeat(2, 1fr) !important;
gap: 16px !important;
}
/* T4: Header navigation condensed for tablet */
.c-header-nav,
[class*='HeaderNav'],
header nav {
gap: 8px !important;
}
.c-header-nav a,
[class*='HeaderNav'] a,
header nav a {
padding: 8px 12px !important;
font-size: 13px !important;
}
/* T6: Footer — REMOVED flex-wrap/flex overrides to match PROD (PROD footer doesn't use flex-wrap or child flex constraints on tablet) */
/* T7: Sidebar visibility on tablet */
.c-sidebar,
[class*='Sidebar'],
aside {
display: block !important;
width: 250px !important;
}
}
/* ==========================================================================
DESKTOP REMAINING PARITY FIXES (D9, D10, D12, D14)
========================================================================== */
/* D12: Nav link hover states - orange on hover */
nav a:hover,
.c-nav-link:hover,
[class*='NavLink']:hover,
header nav a:hover {
color: #e67917 !important;
text-decoration: none !important;
}
/* D14: Text color contrast for muted text */
.text-muted,
.c-secondary-text,
[class*='text-muted'],
[class*='secondary-text'] {
color: #666 !important;
}
/* ==========================================================================
VISUAL PARITY CRITICAL FIXES - DEC 24, 2025
Target: 95%+ parity across all viewports
Current: Desktop 80.9%, Tablet 75.8%, Mobile 48%
========================================================================== */
/* ==========================================================================
GLOBAL - PAGE HEIGHT FIXES (Critical for all viewports)
LOCAL has extra page height in all viewports:
- Mobile: +509px (5360px vs 4851px)
- Tablet: +1254px (5224px vs 3970px)
- Desktop: +221px (3225px vs 3004px)
========================================================================== */
/* REMOVED: Collapse overflow:hidden was forcing overflow:hidden on ALL react-collapse
elements, overriding react-collapse's inline overflow:initial. This contributed to
GrayBlock content clipping. Removed 2026-02-10 per CSS Deep Compare findings.
[class*='Collapse_c-collapse']:not([class*='open']),
[class*='reactcollapse--collapse'] { overflow: hidden !important; }
[class*='collapse_collapse']:not(.show) { max-height: 0 !important; padding: 0 !important; } */
/* ==========================================================================
MOBILE CRITICAL FIXES (375x812) - Priority P1
Current: 48% parity → Target: 95%
========================================================================== */
@media (max-width: 767px) {
/* M1: Mobile overflow prevention — PROD uses overflow-x:hidden, NOT max-width constraints */
/* REMOVED: *, *::before, *::after { max-width: 100vw } — PROD has max-width:none on all elements */
html {
overflow-x: hidden !important;
width: 100% !important;
/* REMOVED: max-width: 375px — PROD has max-width:none */
}
body {
overflow-x: hidden !important;
width: 100% !important;
/* REMOVED: max-width: 375px — PROD has max-width:none */
margin: 0 !important;
padding: 0 !important;
}
#root,
.App {
overflow-x: hidden !important;
/* REMOVED: max-width: 375px — PROD has max-width:none */
}
/* M2: Block Filters — keep responsive utils, remove max-width constraint */
/* FIXED (Batch 8): PROD uses overflow:visible and padding:0 on BlockTwoFilters.
overflow-x:hidden was clipping ComboBox elements from 156px to 20px.
padding-left/right:8px was adding incorrect spacing (PROD: 0px). */
[class*='BlockTwoFilters'],
[class*='c-header-block-filters'],
[class*='c-sport-filter-mobile'] {
width: 100% !important;
box-sizing: border-box !important;
}
/* M2b: Pick lineup block header — PROD uses display:block + overflow:visible on mobile (Batch 8)
The SCSS has display:flex but PROD computed shows display:block at mobile.
flex layout compresses ComboBox children from 156px→36px. Block lets them take full width.
Use :not() to avoid hitting header-containt/combobox sub-elements. */
[class*='c-pick-lineup-block-header']:not([class*='containt']):not([class*='combobox']):not([class*='input']) {
display: block !important;
overflow: visible !important;
}
/* M3: Value Parlays List — keep responsive utils, remove width/max-width constraints */
[class*='ValueParlays'],
[class*='c-top-parlays'],
[class*='ValueParlaysList'] {
width: 100% !important;
overflow-x: hidden !important;
box-sizing: border-box !important;
}
/* M4: Value Pick Cards — constrain to viewport only.
CRITICAL FIX (Batch 20): Removed padding: 8px !important.
The [class*='c-value-pick-card'] wildcard matches EVERY sub-element
(header, league, time, measures, chart-note, etc.) adding systematic
+16px (8 top + 8 bottom) per element. PROD has 0px padding on these.
Each VP card was ~150px taller (×2 cards = 300px total inflation). */
[class*='ValuePickCard'],
[class*='c-value-pick-card'],
[class*='value-pick-card'] {
width: 100% !important;
box-sizing: border-box !important;
min-width: auto !important; /* CSS Deep Compare: PROD has min-width:auto, LOCAL had 0 */
min-height: auto !important; /* CSS Deep Compare: PROD has min-height:auto, LOCAL had 0 */
/* padding: 8px — REMOVED; PROD has padding:0px on value_card */
}
/* M5: Page Height — REMOVED display:none; PROD renders GrayBlock at 375x68px on mobile */
/* GrayBlock content should be visible to match PROD layout */
/* M7: Mobile header height - PROD uses 56px */
[class*='Header_c-header'],
.c-header,
header {
height: 56px !important;
min-height: 56px !important;
max-height: 56px !important;
}
/* M7b: Header logo — PROD has min-height:auto (Batch 8) */
[class*='c-header-logo'] {
min-height: auto !important;
}
/* M7c: ValuePickCard header — PROD uses padding:8px (panel_header mixin overrides to 10px) (Batch 8) */
[class*='c-value-pick-card-header'] {
padding: 8px !important;
}
/* M9a: Quick-pick header — PROD uses padding:8px; LOCAL has 32px inflating height 79→43px (Batch 9)
Use :not([class*='text']) to avoid matching c-quick-pick-header-text-group and -text children. */
[class*='c-quick-pick-header']:not([class*='text']) {
padding: 8px !important;
}
/* M9b: Infinite-scroll container — PROD uses overflow:visible; LOCAL has overflow:auto (Batch 9) */
.infinite-scroll-component {
overflow: visible !important;
}
/* M10a: GrayBlock content — PROD uses padding:4px; LOCAL has 8px inflating height 35→26px (Batch 10) */
[class*='c-gray-block-content'] {
padding: 4px !important;
}
/* M10b: pick_lineup_block first child — PROD uses display:block (h=21); LOCAL has flex (h=44) (Batch 10) */
[class*='c-pick-lineup-block'] > div:first-child {
display: block !important;
}
/* M10c: Tour button wrapper — LOCAL has min-width:44px/min-height:44px inflating to 44×44.
PROD is 20×18 with min-width:0/min-height:0. (Batch 10) */
[class*='c-tour-button-wrapper'] {
min-width: 0px !important;
min-height: 0px !important;
}
/* M10d: SeoTitle H1 — LOCAL has font-size:24px/line-height:31px; PROD has 16px/20.64px.
Also margin differs: LOCAL 0 0 10.5px vs PROD 10.72px 0 (Batch 10) */
[class*='c-seoTitle'] {
font-size: 16px !important;
line-height: 20.64px !important;
margin: 10.72px 0px !important;
}
/* M10e: Search button — LOCAL has min-width:44px, padding:0 10px, font-size:14px.
PROD has min-width:auto, padding:0 12px, font-size:12.6px. (Batch 10) */
[class*='c-header-search-button'] {
min-width: auto !important;
padding: 0px 12px !important;
font-size: 12.6px !important;
}
/* M11a: header-block-filters height override — the broad [class*='c-header'] rule (line ~1939)
sets height/minH/maxH to 70px. c-header-block-filters contains 'c-header' substring so it
inherits 70px. PROD has auto height (30px from content), maxH:none, minH:auto, overflow:visible. (Batch 11) */
[class*='c-header-block-filters'] {
height: auto !important;
min-height: auto !important;
max-height: none !important;
overflow: visible !important;
}
/* M11b: Login button — PROD uses different layout: padding:0 20px, minWidth:auto,
fontSize:12.6px, textAlign:start, justifyContent:normal, gap:normal.
LOCAL has padding:0 16.8px, minWidth:44px, fontSize:14px, textAlign:center,
justifyContent:center, gap:6px. (Batch 11) */
[class*='c-header-button--login'] {
padding: 0px 20px !important;
min-width: auto !important;
font-size: 12.6px !important;
text-align: start !important;
justify-content: normal !important;
gap: normal !important;
}
/* M8: Mobile Nav - hamburger only */
[class*='Buttons_c-header-buttons'] {
display: flex !important;
gap: 4px !important;
}
/* M10: Mobile card padding — REMOVED override; Card.module.scss padding:5px matches PROD */
/* M12-M13: Footer - PROD footer 626px, LOCAL 603px
FIX 2026-02-19: Changed [class*='Footer'] to just footer tag selector.
[class*='Footer'] was matching ALL child elements (icon-wrap, nav-wrap, etc.)
because CSS Module class names contain "Footer_". This caused padding: 28px 0 40px
to apply to EVERY child div, adding 68px per child x 4 children = 272px bloat.
Also removed the > div flex-direction:column rule - PROD children use default flow. */
footer {
padding: 28px 0 40px !important;
}
/* M14: Full width buttons on mobile - DISABLED:
PROD does NOT make all buttons 100% width. This was breaking inline buttons,
header buttons, and small action buttons.
[class*='Button_o-btn'],
.btn,
button[class*='btn'] {
width: 100% !important;
max-width: 100% !important;
}
*/
/* M14: Full width buttons on mobile - DISABLED.
PROD does NOT make all buttons 100% width.
This was breaking inline buttons, header buttons, and small action buttons. */
/*
[class*='Button_o-btn'],
.btn,
button[class*='btn'] {
width: 100% !important;
max-width: 100% !important;
}
*/
/* M16: Sport Filter stacked layout - DISABLED.
PROD uses flex-wrap at mobile, not column.
Forcing column layout creates vertical stacking that doesn't match PROD's grid. */
/*
[class*='SportFilter'],
[class*='c-sport-filter'] {
flex-direction: column !important;
width: 100% !important;
}
*/
/* M17: Carousel touch scrolling */
[class*='Carousel'],
[class*='carousel'],
[class*='c-carousel'],
[class*='react-horizontal-scrolling-menu--scroll-container'] {
-webkit-overflow-scrolling: touch !important;
scroll-snap-type: x mandatory !important;
overflow-x: auto !important;
scrollbar-width: none !important;
}
/* M18: League Tiles mobile size */
[class*='LeagueTile'],
[class*='c-league-tile'] {
min-width: 80px !important;
max-width: 100px !important;
font-size: 11px !important;
}
/* M21: Key Filter Tiles mobile size — CSS Deep Compare: PROD=105×148 border-radius:10px, LOCAL=160×256 border-radius:0 */
[class*='ValuePicks_key-filters-filters-tile'],
[class*='key-filters-filters-tile'] {
width: 105px !important;
height: 148px !important;
border-radius: 10px !important;
}
/* M19-M20: Team logos and card text */
[class*='Team_c-team-logo'],
.c-team-logo {
width: 24px !important;
height: 24px !important;
}
[class*='Card_c-card-score-text'],
.c-card-score-text {
font-size: 11px !important;
}
}
/* ==========================================================================
TABLET CRITICAL FIXES (768x1024) - Priority P2
Current: 75.8% parity → Target: 95%
========================================================================== */
@media (min-width: 768px) and (max-width: 1024px) {
/* T1: Page Height - reduce extra 1254px */
/* Collapse sections that add extra height on tablet */
/* REMOVED: display: none !important on empty content blocks - hides valid async content */
/* T2-T3: Footer — REMOVED max-height/overflow/padding overrides to match PROD (PROD has overflow:visible, no max-height, padding-bottom:0) */
/* T4: Container max-width for tablet — PROD content is 704px wide at 768px viewport */
.container,
[class*='container'],
[class*='Layout_layout-container'] {
/* REMOVED: max-width: 768px !important — allow fluid width or legacy container size */
padding-left: 32px !important;
padding-right: 32px !important;
}
/* T5: Two-column card grid */
[class*='CardGrid'],
[class*='card-grid'],
/* REMOVED: Card grid forced 2 columns */
/* T6: Header nav condensed */
[class*='Header_c-header-nav'],
header nav {
gap: 4px !important;
}
[class*='Header_c-header-nav'] a,
header nav a {
padding: 6px 10px !important;
font-size: 12px !important;
}
/* T7: Card layout - 2 columns */
/* REMOVED: Card layout forced 2 columns - let component handle it */
/* T8: Footer — REMOVED flex-wrap:wrap and child flex overrides (PROD uses display:block, flex-wrap:nowrap) */
/* REMOVED: Sidebar visibility forced block - PROD hides sidebar on tablet */
/* T10: Responsive tables */
table,
[class*='Table'] {
display: block !important;
overflow-x: auto !important;
max-width: 100% !important;
}
/* T13: Modal centered on tablet */
[class*='Modal'],
.modal {
width: 80vw !important;
max-width: 600px !important;
margin: 10vh auto !important;
}
}
/* ==========================================================================
DESKTOP ENHANCEMENTS (1366x900) - Priority P3
Current: 80.9% parity → Target: 95%
========================================================================== */
@media (min-width: 1025px) {
/* ==========================================================================
DESKTOP HEADER FIX (Dec 25, 2025 - FINAL CONFIRMED)
CSS Extraction PROVES: Register=ORANGE, Login=TRANSPARENT
========================================================================== */
/* Header Login button - TRANSPARENT on PROD (confirmed Dec 25, 2025) */
[class*='Buttons_c-header-button--login'],
.c-header-button--login {
background-color: transparent !important;
color: rgb(91, 91, 91) !important;
padding: 0px 16.8px !important;
border: 1px solid rgb(234, 237, 237) !important;
border-radius: 0px !important;
font-weight: 400 !important;
min-width: auto !important;
display: flex !important;
position: static !important;
width: 49.5938px !important;
}
/* Header Register button - ORANGE on PROD (confirmed Dec 25, 2025) */
[class*='Buttons_c-header-button--register'],
.c-header-button--register {
background-color: rgb(230, 121, 23) !important;
color: rgb(255, 255, 255) !important;
padding: 0px 16.8px !important;
border: none !important;
border-radius: 25px !important;
font-weight: 600 !important;
min-width: auto !important;
display: flex !important;
position: static !important;
margin: 0px 0px 0px 5px !important;
width: 85.5781px !important;
}
/* Go Pro button - TRANSPARENT on PROD */
[class*='GoProButton'],
[class*='c-btn-pro'],
.sk-btn-pro {
background-color: transparent !important;
color: rgb(91, 91, 91) !important;
padding: 0px !important;
min-width: auto !important;
border: none !important;
border-radius: 0px !important;
font-weight: 400 !important;
cursor: pointer !important;
box-sizing: border-box !important;
display: flex !important;
position: static !important;
}
/* Header buttons container - TRANSPARENT on PROD */
[class*='Buttons_c-header-buttons'],
.c-header-buttons {
background: transparent !important;
background-color: transparent !important;
color: rgb(91, 91, 91) !important;
border-radius: 0px !important;
padding: 0px !important;
}
/* SEARCH BUTTON - TRANSPARENT on PROD (extraction point 1277,27 shows PROD=transparent) */
[class*='c-header-search-button'],
[class*='Buttons_c-header-search-button'] {
background-color: transparent !important;
background: transparent !important;
color: rgb(255, 255, 255) !important;
border: none !important;
border-radius: 25px !important;
height: 40px !important;
min-height: auto !important;
max-height: none !important;
display: flex !important;
align-items: center !important;
justify-content: normal !important;
padding: 0px 16.8px !important;
box-sizing: border-box !important;
font-weight: 600 !important;
width: auto !important;
position: static !important;
flex: 0 1 auto !important;
margin: 0px 5px 0px 0px !important;
font-family: Arial !important;
}
/* Header button hover - Login button gets darker gray hover */
[class*='Buttons_c-header-button--login']:hover {
background-color: rgba(0, 0, 0, 0.05) !important;
color: rgb(51, 51, 51) !important;
border-color: rgb(200, 200, 200) !important;
}
/* Search button hover - subtle gray background */
[class*='Buttons_c-header-search-button']:hover {
background-color: rgba(0, 0, 0, 0.05) !important;
color: rgb(51, 51, 51) !important;
border-color: rgb(150, 150, 150) !important;
}
/* Other header buttons hover - slightly darker gray */
[class*='Buttons_c-header-button--register']:hover,
[class*='GoProButton']:hover {
background-color: rgba(0, 0, 0, 0.05) !important;
color: rgb(51, 51, 51) !important;
}
/* D5: Carousel container - max 100% width */
[class*='StandardCarousel'],
[class*='c-standard-carousel'],
[class*='c-carousel'] {
max-width: 100% !important;
width: 100% !important;
overflow-x: auto !important;
overflow-y: hidden !important;
}
/* D6-D7: Ticker arrows styling (min-width corrected to 19px in Batch 24) */
[class*='Ticker_c-cards-carousel-arrow'],
[class*='c-cards-carousel-arrow'] {
background-color: #f5f5f5 !important;
padding: 0 4px !important;
border-radius: 4px !important;
min-width: 32px !important;
min-height: 32px !important;
height: auto !important; /* Batch 34: ticker height is dynamic */
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
/* D8: SportFilter in header - compact */
[class*='SportFilter_c-sport-filter-header'],
[class*='c-sport-filter-header'] {
max-width: 320px !important;
height: 40px !important;
}
/* D10: ValuePicks tile width - PROD 160.281px
FIX #7 (later in file) sets precise width: 160.281px for desktop.
This D10 rule provides max-width guard. Aligned to 160.281px to avoid clamping. */
[class*='ValuePicks_key-filters-filters-tile'],
[class*='key-filters-filters-tile'] {
width: 160.281px !important;
max-width: 160.281px !important;
}
/* D11: H1 margin fine-tune */
h1 {
margin: 10.72px 0 !important;
}
/* D12: Card box shadows — REMOVED Batch 24: PROD has box-shadow:none (verified Sweep 17).
Previous value '0 2px 4px rgba(0,0,0,0.1)' was WRONG and conflicted with Batch 11 fix. */
[class*='Card'],
.c-card,
.card {
box-shadow: none !important;
}
/* D15: Footer height consistency — REMOVED (2026-02-20)
Reason: [class*='Footer'] substring-matches ALL footer child divs (icon-wrap,
nav-wrap, copy-content-wrap, copy-wrap), inflating each to 294px.
Superseded by FIX #8-11 (L~1685) which correctly uses 'footer' tag selector
+ 'footer > div' reset. */
}
/* ==========================================================================
VISUAL PARITY FIXES 2025-12-25 - COMPREHENSIVE DIFF REPORT
29 CSS differences identified - targeting 95%+ parity
========================================================================== */
/* --------------------------------------------------------------------------
FIX #1-2: HEADER MIN/MAX HEIGHT
Issue: header minHeight 0px→70px, maxHeight none→70px
Fix: Remove the 70px constraint that's not on production
-------------------------------------------------------------------------- */
[class*='Header_c-header'],
.c-header,
header[class*='Header'] {
min-height: auto !important;
max-height: none !important;
height: auto !important;
}
/* --------------------------------------------------------------------------
FIX #3-5: HEADER LOGO IMG DISPLAY (dimensions are natural 41×39)
Issue: display was inline → block. Dimensions must stay at image natural size.
PROD ![]()
renders at 41×39 (natural). PROD wraps it at 49×43 (link has padding).
We only fix display to block; width/height left to natural image dimensions.
-------------------------------------------------------------------------- */
[class*='Header_c-header-logo'] img,
.c-header-logo img,
header [class*='logo'] img {
display: block !important; /* VP FIX: PROD uses block (was inline — caused link to stretch to 70px) */
}
/* --------------------------------------------------------------------------
FIX #6-7: TREND ICON LETTER DISPLAY
Issue: minHeight 0px→auto, display inline-flex→flex
Fix: Match production inline-flex display (higher specificity)
-------------------------------------------------------------------------- */
[class*="TrendIconLetter_c-trendIcon-container"],
[class*="c-trendIcon-container"],
.c-trendIcon-container,
div[class*="TrendIconLetter"],
span[class*="TrendIconLetter"],
[class*="ValuePicks"] [class*="TrendIconLetter"],
/* R18 FIX 2025-12-25: Exact selectors used by comprehensive-compare script */
[class*="trendIcon-container"],
[class*="TrendIcon"] [class*="container"] {
min-height: 0px !important;
display: inline-flex !important;
}
/* R18 FIX 2025-12-25: Force inline-flex on actual .c-trendIcon badge (inner element) */
[class*='c-trendIcon']:not([class*='container']),
.c-trendIcon:not(.c-trendIcon-container),
[class*='TrendIconLetter_c-trendIcon']:not([class*='container']) {
display: inline-flex !important;
}
/* --------------------------------------------------------------------------
FIX #8-11: FOOTER AND FOOTER LINKS
Issue: [class*='Footer_c-footer'] substring-matches ALL footer child divs
(icon-wrap, nav-wrap, copy-content-wrap, copy-wrap), inflating each to 235px.
Fix: Use 'footer' tag selector only — no substring matching issues.
-------------------------------------------------------------------------- */
footer {
min-height: 235px !important;
}
/* Reset min-height on footer children — prevents FIX #8-11 leak */
footer > div {
min-height: auto !important;
}
[class*='Footer_c-footer-icon-list'],
[class*='Footer_c-footer-nav-list'],
.c-footer-icon-list,
.c-footer-nav-list,
footer a {
min-height: auto !important;
}
/* --------------------------------------------------------------------------
FIX #19-25: CTA BUTTON SECONDARY (PRO Button) SIZING
Issue: height 40px→70px, width 90px→162px
Fix: Constrain secondary buttons to production dimensions
-------------------------------------------------------------------------- */
[class*='GoProButton_c-btn-pro'],
[class*='Menu_c-header-btn-pro'],
.c-btn-pro,
.sk-btn-pro {
height: 40px !important;
min-height: 0px !important;
max-height: none !important;
width: 90px !important;
min-width: 90px !important;
max-width: 90px !important;
padding: 12px 20px !important;
background-color: rgb(230, 121, 23) !important;
border: 1px solid rgb(230, 121, 23) !important;
border-radius: 25px !important;
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
display: inline-block !important;
line-height: 14px !important;
align-items: normal !important;
justify-content: normal !important;
}
/* --------------------------------------------------------------------------
FIX #26-29: HEADER SEARCH BUTTON SIZING
CSS Extraction: PROD = transparent, 70px height, 1251px width, flex
Fix: Match production search button dimensions (transparent & full width)
-------------------------------------------------------------------------- */
[class*='Buttons_c-header-search-button'],
[class*='c-header-search-button'],
.c-header-search-button {
background-color: transparent !important;
background: transparent !important;
color: rgb(255, 255, 255) !important;
height: 40px !important;
min-height: auto !important;
max-height: none !important;
padding: 0px 16.8px !important;
border: none !important;
border-radius: 25px !important;
font-weight: 600 !important;
margin: 0px 5px 0px 0px !important;
font-family: Arial !important;
justify-content: normal !important;
}
/* ==========================================================================
EXTRA ELEMENT HIDING (Reduce +722 element count difference)
LOCAL has extra: tooltips (+286), SVG gradients (+162), DIVs (+368)
========================================================================== */
/* Hide empty tooltip triggers that add DOM weight */
[class*='tooltiptrigger']:empty,
[class*='Tooltip']:not(:hover) [class*='tooltip-container'] {
display: none !important;
}
/* Hide redundant SVG gradient definitions */
svg defs:empty {
display: none !important;
}
/* Reduce spinner count - only show when loading
REMOVED: [class*='Loader']:not([class*='loading']) was too broad — it matched
Loader CONTAINER elements (not just spinners), causing visibility: hidden to
cascade to ALL ValuePicks content (key_filter_tile etc).
Spinner hiding is handled by FIX #4 (.fa-spinner.fa-spin selector) below.
CSS Deep Compare verified: PROD does not hide Loader containers. */
/* ==========================================================================
TOP 10 SHOCKING FINDINGS - COMPREHENSIVE FIX (Dec 24, 2025)
Based on visual-parity dashboard analysis
========================================================================== */
/* --------------------------------------------------------------------------
FIX #1: MOBILE OVERFLOW — REMOVED (2026-02-10)
Previously: max-width:375px on html/body/#root/.App and 8 component selectors
Removed because: PROD has max-width:none on ALL elements. Constraints caused
width/height cascade differences. overflow-x:hidden is retained in Block 1
(lines ~1104) for horizontal scroll prevention.
CSS Deep Compare verified: LOCAL max-width=375px vs PROD max-width=none
-------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------
FIX #2: +722 EXTRA DOM ELEMENTS
Problem: PROD 4,074 elements, LOCAL 4,796 (+17.7%)
Root Cause: +286 Tooltips, +368 DIVs, +162 SVG gradients
-------------------------------------------------------------------------- */
/* Tooltip triggers - use display:inline to preserve child's inline-flex/flex-item behavior */
/* NOTE: display:contents caused trendIcon-container's inline-flex to get blockified to flex */
/* because contents makes children become direct flex items of grandparent */
[class*='Tooltip_tooltipTrigger'],
[class*='tooltipTrigger'] {
display: inline !important;
vertical-align: baseline !important;
}
/* Hide tooltip content when not hovered */
[class*='Tooltip_tooltip']:not(:hover),
[class*='tooltip-content'] {
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
}
/* Minimize SVG gradient impact */
svg linearGradient,
svg radialGradient {
opacity: 0.001 !important; /* Keep for structure but invisible */
}
/* Hide empty filter/mask elements */
svg filter:empty,
svg mask:empty,
svg defs:empty {
display: none !important;
}
/* --------------------------------------------------------------------------
FIX #3: PAGE HEIGHT MISMATCH - TABLET +1254px
Problem: Tablet 5224px vs PROD 3970px (+31.6%)
Root Cause: Extra content spacing, collapsed states not matching
-------------------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1024px) {
/* REMOVED: display:flex / max-height / overflow overrides — PROD uses display:block, max-height:none, min-height:100%, overflow:visible */
/* These overrides caused layout-container to use flex instead of block, and capped height at 4000px */
/* REMOVED: Collapse withMargin margin:0 and block margin-bottom:12px — these were forcing PROD-incompatible margins */
/* REMOVED (Batch 17): GrayBlock margin-bottom: 12px was WRONG.
Empirical measurement (Feb 2026) proves PROD has margin-bottom: 0px on ALL
GrayBlock elements (header, first-line, content, block). The 12px margin added
+24px per GrayBlock header (12 on first-line + 12 on header margin), causing
cumulative 121px vertical offset at tablet. Selector [class*='GrayBlock'] was
too broad — matched every GrayBlock-related element. */
/* REMOVED: Footer max-height/overflow was clipping footer content — let Footer.module.scss handle */
}
/* --------------------------------------------------------------------------
FIX #4: ICON SYSTEM NORMALIZATION (FontAwesome → sk-icon)
Problem: PROD uses FA (409 icons), LOCAL uses sk-icon (412 icons)
Status: INTENTIONAL migration - normalize sizes for visual parity
-------------------------------------------------------------------------- */
/* Normalize sk-icon sizes to match FontAwesome defaults */
.sk-icon,
[class*='sk-icon'] {
width: 1em !important;
height: 1em !important;
vertical-align: -0.125em !important;
}
.sk-icon--sm {
width: 0.875em !important;
height: 0.875em !important;
}
.sk-icon--md {
width: 1em !important;
height: 1em !important;
}
.sk-icon--lg {
width: 1.25em !important;
height: 1.25em !important;
}
/* Match spinner animation timing to FontAwesome */
.sk-icon--spin,
[class*='sk-icon--spin'] {
animation: fa-spin 2s infinite linear !important;
}
@keyframes fa-spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/* --------------------------------------------------------------------------
FIX #5: LOADING SPINNER EXPLOSION (320 spinners)
Problem: 320 sk-icon--spin vs 312 fa-spinner with different timing
-------------------------------------------------------------------------- */
/* Hide spinners after page is considered loaded */
.page-loaded .sk-icon--spin:not(.keep-spinner),
.page-loaded [class*='fa-spinner']:not(.keep-spinner),
.page-loaded [class*='Loader_c-loader']:not(.keep-spinner) {
display: none !important;
}
/* Collapse spinner containers */
[class*='Loader_c-loader']:empty,
[class*='c-loader']:empty {
display: none !important;
height: 0 !important;
width: 0 !important;
}
/* --------------------------------------------------------------------------
FIX #7: FOOTER SHIFTED DOWN 532px (DISABLED 2025-12-21)
Problem: This flex fix was causing GrayBlock header to shrink to content
width instead of full width. LOCAL layout-container was 224px while
PROD was 1208px. Removing flex layout restores PROD's block behavior.
-------------------------------------------------------------------------- */
/* DISABLED: Sticky footer pattern - caused layout width issues
[class*="Layout_layout-container"],
.layout-container,
#root > div {
display: flex !important;
flex-direction: column !important;
min-height: 100vh !important;
}
[class*="Layout_layout-main-wrap"],
.layout-main-wrap,
main {
flex: 1 0 auto !important;
}
footer,
[class*="Footer_c-footer"],
[class*="c-footer"] {
flex-shrink: 0 !important;
margin-top: auto !important;
}
*/
/* --------------------------------------------------------------------------
FIX #8: BODY OVERFLOW ANOMALY
Problem: LOCAL body height 5360px (full scroll), PROD 812px (viewport)
-------------------------------------------------------------------------- */
/* Correct body overflow behavior */
body {
overflow-x: hidden !important;
overflow-y: auto !important;
height: auto !important;
min-height: 100vh !important;
/* REMOVED: max-width: 100vw — PROD has max-width:none */
}
#root {
overflow-x: hidden !important;
position: relative !important;
}
/* --------------------------------------------------------------------------
FIX #9: IMAGES DRAMATICALLY REDUCED (21 → 12)
Problem: 9 fewer images loading in LOCAL
-------------------------------------------------------------------------- */
/* Ensure all images are visible and loading */
img {
opacity: 1 !important;
visibility: visible !important;
}
img[loading='lazy'] {
opacity: 1 !important;
}
/* Team logos - ensure 229 logos load like PROD */
[class*='Team_c-team-logo'] img,
[class*='c-team-logo'] img {
width: 24px !important;
height: 24px !important;
display: block !important;
opacity: 1 !important;
}
/* League tile images */
[class*='LeagueTile_c-league-tile-image'] img {
display: block !important;
opacity: 1 !important;
}
/* --------------------------------------------------------------------------
FIX #10: NEW UI ELEMENTS NOT IN PROD
Problem: 286 tooltips, 38 gradients, 20 filters, 20 masks in LOCAL only
-------------------------------------------------------------------------- */
/* Collapse new Collapse component margins */
[class*='Collapse_collapse'],
[class*='Collapse_withMargin'] {
margin: 0 !important;
transition: none !important;
}
/* Hide new gradient-based decorations */
[class*='LegendIcon_c-key-legend-icon-background'],
[class*='c-key-legend-icon-background'] {
opacity: 0.8 !important;
}
/* Screen overlay - FIXED: Use PROD behavior (position offscreen, not display:none)
PROD uses position:fixed; top:110% from Screen.module.scss to hide
display:none removes GrayBlock "My Picks" from layout entirely */
/* [class*='Screen_c-screen']:not([class*='visible']) {
display: none !important;
} */
/* ==========================================================================
FINAL VERIFICATION OVERRIDES
These ensure pixel-perfect matching on critical elements
========================================================================== */
/* Header height consistency - FIXED 2025-12-25: PROD uses 70px */
header,
[class*='Header_c-header'],
[class*='c-header'] {
height: 70px !important;
min-height: 70px !important;
max-height: 70px !important;
}
/* CRITICAL: Buttons INSIDE header must NOT inherit the 70px header height!
PROD buttons are 40px height, but min-height is 0px and max-height is none */
header [class*='c-header-button'],
header [class*='Buttons_c-header-button'],
header [class*='c-btn-pro'],
header [class*='GoProButton'],
header .sk-btn-pro,
[class*='Header_c-header'] [class*='c-header-button'],
[class*='Header_c-header'] [class*='c-btn-pro'],
[class*='c-header'] [class*='c-header-button'],
[class*='c-header'] [class*='c-btn-pro'] {
height: 40px !important;
min-height: 0px !important;
max-height: none !important;
}
/* VP FIX: Logo sizing — PROD logo link is 41×43px with min-height:auto.
The broad [class*='c-header'] rule above accidentally matches the logo link.
Updated Batch 9: min-height changed from 43px to auto, width from 49px to 41px to match PROD. */
[class*='c-header-logo'],
[class*='Header_c-header-logo'] {
height: 43px !important;
min-height: auto !important;
max-height: none !important;
width: 41px !important;
}
/* VP FIX: Burger button — PROD uses natural height from icon content (2px).
The broad [class*='c-header'] rule at ~L1929 accidentally sets it to 70px.
PROD: height=auto(2px), minHeight=auto, maxHeight=none */
[class*='c-header-burger-btn'],
[class*='Header_c-header-burger-btn'] {
height: auto !important;
min-height: auto !important;
max-height: none !important;
}
/* VP FIX: Sub-wrap — PROD has minHeight=0px, maxHeight=none.
The broad [class*='c-header'] rule forces 70px on all three. Height is correct
but min/max constraints are wrong. */
[class*='c-header-sub-wrap'],
[class*='Header_c-header-sub-wrap'] {
min-height: 0px !important;
max-height: none !important;
}
/* VP FIX: Menu SVG chevron sizing — PROD uses FontAwesome fal chevron-down
(viewBox 448×512) which renders at 8.75×10px. LOCAL uses sk-icon (viewBox
512×512) which gets blown to 16×70px by the broad [class*='c-header'] wildcard.
The 7.25px extra SVG width per item × 9 items = 65px total UL width gap.
svg type selector gives specificity 0,1,1 beating the wildcard's 0,1,0. */
svg[class*='c-header-menu-item-chevron'],
svg[class*='Menu_c-header-menu-item-chevron'] {
width: 8.75px !important;
height: 10px !important;
min-height: 0px !important;
max-height: none !important;
}
/* VP FIX: Menu items (LI) must keep height but reset min/max — prevents
the wildcard min-height:70px/max-height:70px from constraining LI layout */
[class*='c-header-menu-item__'],
[class*='Menu_c-header-menu-item__'] {
min-height: 0px !important;
max-height: none !important;
}
/* VP FIX: GrayBlock margin — 2026-02-12: Live comparison confirms PROD desktop has margin-top:16px.
Mobile PROD has margin-top:0px. Previous global 0px was wrong for desktop. */
.sk-block[class*='GrayBlock_c-gray-block'] {
margin-top: 16px !important;
}
@media (max-width: 767px) {
.sk-block[class*='GrayBlock_c-gray-block'] {
margin-top: 0px !important;
}
}
/* VP FIX: EmptyState height — 2026-02-12: PROD shows compact Loader (~35px) for sections with
no data, while LOCAL (React 18) resolves API faster showing EmptyState (min-height: 200px).
This 165px height difference cascades to page-level misalignment. Compact EmptyState to match. */
[class*='EmptyState_container'] {
min-height: 0 !important;
min-height: initial !important;
padding: 4px 16px !important;
gap: 0 !important;
}
/* Hide EmptyState icon and description — PROD doesn't show these at all (shows Loader instead) */
[class*='EmptyState_container'] > [class*='iconWrapper'],
[class*='EmptyState_container'] > [class*='message'] {
display: none !important;
}
/* Search button specific - TRANSPARENT on PROD (extraction proves it) */
header [class*='c-header-search-button'],
header [class*='Buttons_c-header-search-button'],
[class*='Header_c-header'] [class*='c-header-search-button'],
[class*='c-header'] [class*='c-header-search-button'] {
background-color: transparent !important;
background: transparent !important;
color: rgb(255, 255, 255) !important;
height: 40px !important;
min-height: auto !important;
max-height: none !important;
width: auto !important;
display: flex !important;
flex: 0 1 auto !important;
position: static !important;
border: none !important;
border-radius: 25px !important;
padding: 0px 12px !important;
font-weight: 600 !important;
font-size: 12.6px !important;
margin: 0px 5px 0px 0px !important;
font-family: Arial !important;
justify-content: normal !important;
}
/* Container width consistency - match PROD (1272px centered) */
[class*='Layout_layout-container'],
.layout-container {
max-width: 1272px !important;
width: 100% !important;
margin-left: auto !important;
margin-right: auto !important;
}
@media (min-width: 1200px) {
/* VISUAL PARITY: Center content but exclude SeoDescription which needs full-width */
[class*='Layout_layout-container'] > *:not(header):not(footer):not([class*='SeoDescription']),
.layout-container > *:not(header):not(footer):not([class*='SeoDescription']) {
max-width: 1272px !important;
margin-left: auto !important;
margin-right: auto !important;
}
}
/* End of visual parity baseline section */
/* ==========================================================================
VISUAL PARITY FIXES - INTELLIGENCE PIPELINE (Dec 24, 2025)
Based on 116 patches identified comparing LOCAL to PROD
LOCAL has: transparent, 4px radius, 55px width, gray text
TARGET (PROD) has: orange, 25px radius, 90px width, white text
========================================================================== */
/* --------------------------------------------------------------------------
FIX #1: BottomMenu "Go Pro" Button (Line 103, 115)
CRITICAL - Button should be orange with rounded corners
-------------------------------------------------------------------------- */
[class*='BottomMenu_c-bottom-menu-group-item--box'],
[class*='c-bottom-menu-group-item--box'] {
background: rgb(230, 121, 23) none repeat scroll 0% 0% / auto padding-box border-box !important;
background-color: rgb(230, 121, 23) !important;
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
padding: 12px 20px !important;
border: 1px solid rgb(230, 121, 23) !important;
border-radius: 25px !important;
width: 90px !important;
height: 40px !important;
display: inline-block !important;
position: relative !important;
}
/* Fix the link inside the box */
[class*='BottomMenu_c-bottom-menu-group-item--box-link'],
[class*='c-bottom-menu-group-item--box-link'] {
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
text-decoration: none !important;
}
/* --------------------------------------------------------------------------
FIX #2: Header Navigation Item Sizing
LOCAL: flex 1 0 20%, 271.594px width (stretched)
TARGET: flex 0 1 auto, auto width (natural size)
-------------------------------------------------------------------------- */
[class*='BottomMenu_c-bottom-menu-group-item']:not([class*='--box']):not([class*='--badge']) {
flex: 0 1 auto !important;
width: auto !important;
}
/* --------------------------------------------------------------------------
FIX #3: Color Scheme - Text Colors
LOCAL: rgb(241, 242, 243) (gray)
TARGET: rgb(255, 255, 255) (white)
-------------------------------------------------------------------------- */
[class*='c-bottom-menu'] a:not([class*='--box-link']),
[class*='c-bottom-menu'] span:not([class*='--box'] span),
[class*='BottomMenu_c-bottom-menu-group-item--label'] {
color: rgb(255, 255, 255) !important;
}
/* --------------------------------------------------------------------------
FIX #4: Spinner Icons - Hide when not loading
PROD has spinners hidden after content loads
-------------------------------------------------------------------------- */
.fa-spinner.fa-spin:not([class*='loading'] .fa-spinner):not([class*='Loader_'] .fa-spinner) {
animation-play-state: paused !important;
visibility: hidden !important;
opacity: 0 !important;
width: 0 !important;
height: 0 !important;
position: absolute !important;
}
/* --------------------------------------------------------------------------
FIX #5: Card Component Styling
VISUAL PARITY FIX 2026-02: Removed border-radius override (PROD uses 0px)
and team-line padding override (PROD has 0px, override was 4px 8px causing
card height 126px instead of 79px).
-------------------------------------------------------------------------- */
/* Card container — bg:white, display:flex, border-radius:0, font-size:14px */
[class*='Card_c-card']:not([class*='team']):not([class*='date']):not([class*='score']):not([class*='ticker']):not(
[class*='detailed']
):not([class*='live']):not([class*='arrow']):not([class*='empty']),
.c-card:not(.c-card-team-line):not(.c-card-date):not(.c-card-score-text) {
border-radius: 0 !important;
padding: 5px !important;
border: 1px solid rgb(234, 237, 237) !important;
box-shadow: none !important;
color: rgb(91, 91, 91) !important;
font-size: 14px !important;
line-height: 18.06px !important;
background-color: rgb(255, 255, 255) !important;
display: flex !important;
flex-direction: column !important;
min-width: 150px !important;
box-sizing: border-box !important;
}
/* Card team-line: PROD=flex 138x25 transparent */
[class*='Card_c-card-team-line'],
.c-card-team-line {
padding: 0 !important;
border: 0 none !important;
background: transparent !important;
cursor: pointer !important;
font-size: 14px !important;
line-height: 18.06px !important;
display: flex !important;
align-items: center !important;
min-height: 25px !important;
justify-content: space-between !important;
}
/* Card team (excl team-line): PROD=12px bold, nowrap */
[class*='Card_c-card-team']:not([class*='card-team-line']),
.c-card-team:not(.c-card-team-line) {
padding: 0 !important;
border: 0 none !important;
background: transparent !important;
cursor: pointer !important;
font-size: 12px !important;
line-height: 15.48px !important;
font-weight: 600 !important;
white-space: nowrap !important;
}
/* Card date: PROD=12px gray */
[class*='Card_c-card-date'],
.c-card-date {
padding: 0 !important;
border: 0 none !important;
cursor: pointer !important;
color: rgb(125, 125, 125) !important;
font-size: 12px !important;
font-weight: 600 !important;
}
/* Card score-wrapper: PROD=block 35x20 gray-bg (NOT flex, NOT transparent!) */
[class*='Card_card-score-wrapper'],
[class*='card-score-wrapper'],
.card-score-wrapper {
background-color: rgb(245, 245, 245) !important;
display: block !important;
width: 35px !important;
height: 20px !important;
border-radius: 5px !important;
text-align: center !important;
box-sizing: border-box !important;
}
/* Card score-text: PROD=12px 600 weight (was 11px — FIXED) */
[class*='Card_c-card-score-text'],
.c-card-score-text {
font-size: 11px !important;
font-weight: 600 !important;
}
/* --------------------------------------------------------------------------
FIX #6: Ticker Carousel Arrows (updated Batch 24)
PROD: bg=#f5f5f5, padding=0 4px, no border-radius (left/right arrows have individual radii)
-------------------------------------------------------------------------- */
[class*='Ticker_c-cards-carousel-arrow'],
.c-cards-carousel-arrow {
background-color: rgb(245, 245, 245) !important;
padding: 0 4px !important;
border-radius: 4px !important;
height: auto !important; /* Batch 34: ticker height is dynamic */
}
/* FIX #7: ValuePicks Key Filter Tiles — REMOVED global width override.
Desktop handled by @media (min-width:1025px) section. Mobile by @media (max-width:767px).
Global override was conflicting with mobile-specific sizing. */
/* ==========================================================================
FINAL OVERRIDES - MAXIMUM SPECIFICITY (Dec 25, 2025)
These rules are at the END of the file for highest cascade priority
========================================================================== */
/* CRITICAL: TrendIcon Container MUST be inline-flex to match PROD */
/* This selector matches the actual class name: TrendIconLetter_c-trendIcon-container__XXXXX */
span[class*='TrendIconLetter'][class*='c-trendIcon-container'],
span[class*='trendIcon-container'],
[class*='TrendIconLetter_c-trendIcon-container'] {
display: inline-flex !important;
min-height: 0px !important;
}
/* ==========================================================================
SHOCKING FINDING #1 FIX (Dec 25, 2025 - TRANSPARENT CONFIRMED)
Header "Go Pro" button is PLAIN TEXT, NOT an orange button!
CSS Extraction PROVES: After orange changes, extraction shows PROD=transparent
CRITICAL: Must override o-btn--secondary from sk-components with HIGHER specificity!
The sk-components Button.module.scss has `display: inline-block !important` on .o-btn--secondary
We need class combo specificity + !important to win
========================================================================== */
/* MAXIMUM SPECIFICITY: Target the exact class combination used in GoProButton */
/* GoProButton uses: Button_o-btn__F4IMG Button_o-btn--secondary__e9h0z GoProButton_c-btn-pro__EsRH2 */
a[class*='Button_o-btn'][class*='GoProButton_c-btn-pro'],
a[class*='o-btn--secondary'][class*='c-btn-pro'],
a.sk-btn-pro[class*='o-btn--secondary'],
header a[class*='o-btn--secondary'],
header [class*='Button_o-btn--secondary'],
.c-header a[class*='o-btn--secondary'],
[class*='GlobalHeader'] a[class*='o-btn--secondary'],
[class*='Menu_c-header-btn-pro'] a,
[class*='Menu_c-header'] [class*='GoProButton'],
[class*='GoProButton_c-btn-pro'],
[class*='c-btn-pro'],
.c-btn-pro,
.sk-btn-pro {
background: rgb(230, 121, 23) !important;
background-color: rgb(230, 121, 23) !important;
background-image: none !important;
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
padding: 12px 20px !important;
border: 1px solid rgb(230, 121, 23) !important;
border-radius: 25px !important;
display: inline-block !important;
position: relative !important;
height: 40px !important;
width: 90px !important;
min-height: 0px !important;
min-width: 90px !important;
box-shadow: none !important;
}
/* Header Menu wrapper for Go Pro button - container styling */
[class*='Menu_c-header-btn-pro'],
.c-header-btn-pro {
background: transparent !important;
color: rgb(91, 91, 91) !important;
padding: 0px !important;
display: flex !important;
flex: 0 1 auto !important;
position: static !important;
height: 70px !important;
}
/* ==========================================================================
Dec 25, 2025 - CORRECT TRUTH FROM CSS EXTRACTION (FINAL):
- Login button: TRANSPARENT with gray border
- Register button: ORANGE with white text, 25px border-radius
========================================================================== */
/* Header Login button - TRANSPARENT on PROD (confirmed Dec 25, 2025) */
[class*='Buttons_c-header-button--login'],
.c-header-button--login {
background-color: transparent !important;
color: rgb(91, 91, 91) !important;
font-weight: 400 !important;
padding: 0px 16.8px !important;
border: 1px solid rgb(234, 237, 237) !important;
border-radius: 0px !important;
display: flex !important;
position: static !important;
width: 49.5938px !important;
}
/* Header Register button - ORANGE on PROD (confirmed Dec 25, 2025) */
[class*='Buttons_c-header-button--register'],
.c-header-button--register {
background-color: rgb(230, 121, 23) !important;
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
padding: 0px 16.8px !important;
border: none !important;
border-radius: 25px !important;
margin: 0px 0px 0px 5px !important;
width: 85.5781px !important;
}
/* Header Buttons container - TRANSPARENT on PROD */
[class*='Buttons_c-header-buttons'],
.c-header-buttons {
background: transparent !important;
color: rgb(91, 91, 91) !important;
padding: 0px !important;
border-radius: 0px !important;
width: auto !important; /* VP61 FIX: Override 85.5781px from line 616 — container should size to content */
border: none !important; /* VP61 FIX: Container should have no border */
margin: 0 !important; /* VP61 FIX: Container should have no margin */
}
/* ==========================================================================
SHOCKING FINDING #2 FIX: Carousel arrows should be transparent
========================================================================== */
[class*='StandardCarousel_c-standard-carousel-arrow'],
.c-standard-carousel-arrow {
background: transparent !important;
background-color: transparent !important;
border-radius: 0px !important;
box-shadow: none !important;
padding: 0px !important;
display: block !important;
color: rgb(125, 125, 125) !important;
}
/* ==========================================================================
GRAYBLOCK: REMOVED OVERRIDES (Dec 25, 2025)
Analysis showed PROD has VARIABLE GrayBlock styling depending on context:
- Some headers: BLUE rgb(28, 78, 134)
- Some headers: TRANSPARENT rgba(0, 0, 0, 0)
- Some headers: GRAY rgb(245, 245, 245)
Applying a single override to ALL GrayBlocks was WRONG.
Removing overrides to let native sk-components styles handle variation.
========================================================================== */
/* End of VISUAL PARITY FIXES */
/* ==========================================================================
VALUE PICK CARD PARITY OVERRIDES (2026-02-10)
Fixes ValuePickCard element-level CSS differences between LOCAL and PROD.
Detected via Playwright DOM comparison at 768px tablet width:
- Card header: LOCAL padding 10px (from panel_header mixin) -> PROD 8px
- League icon: LOCAL 16x18 -> PROD 25x25
- League icon margin: LOCAL 0px -> PROD 0 8px 0 0
- Card header height: resolves automatically from padding + icon fixes
========================================================================== */
/* Card header padding: panel_header() mixin overrides to 10px, PROD uses 8px */
/* Also fix height: LOCAL 42px -> PROD 43px with min-height */
[class*='c-value-pick-card-header'] {
padding: 8px !important;
min-height: 43px !important;
box-sizing: border-box !important;
}
/* Card wrap: PROD has 1px left border (solid rgb(234,237,237)), LOCAL has none */
[class*='c-value-pick-card-wrap'] {
border-left: 1px solid rgb(234, 237, 237) !important;
}
/* League icon: PROD renders at 25x25 with 8px right margin.
LOCAL's compiled CSS has width/height:25px but something overrides to 16x18 */
[class*='c-value-pick-card-img'] {
width: 25px !important;
height: 25px !important;
margin-right: 8px !important;
object-fit: contain;
}
/* Card time: LOCAL renders at 14px, PROD at 12px */
[class*='c-value-pick-card-time'] {
font-size: 12px !important;
}
/* Measure tile background: LOCAL rgb(248,249,250) -> PROD rgb(255,255,255) */
[class*='c-value-pick-card-measure']:not([class*='c-value-pick-card-measures']):not([class*='-value']):not(
[class*='-label']
) {
background-color: rgb(255, 255, 255) !important;
}
/* Card footer button: LOCAL h=36 lineH=18px -> PROD h=30 lineH=12px */
[class*='c-value-pick-card-footer'] [class*='o-btn--gray'] {
font-size: 12px !important;
line-height: 12px !important;
padding: 8px 20px !important;
background-color: rgb(245, 245, 245) !important;
}
/* Chart note: LOCAL lineHeight=14.4px -> PROD lineHeight=15.48px */
[class*='c-value-pick-card-chart-note'] {
line-height: 15.48px !important;
}
/* EmptyState: LOCAL renders a 200px EmptyState component that PROD does not show.
Hide it to reduce structural height difference. */
[class*='EmptyState'],
[class*='empty-state'] {
display: none !important;
}
/* Pick button (primary): LOCAL lh=32.25px pad=6px 7px h=46 -> PROD lh=14px pad=8px 20px h=32
Applies at ALL viewports -- same issue on desktop, tablet, and mobile */
[class*='c-value-pick-card-pick-row'] [class*='o-btn--primary'],
[class*='c-value-pick-card-pick'] [class*='o-btn--primary'] {
line-height: 14px !important;
padding: 8px 20px !important;
display: inline-block !important;
min-height: 0px !important;
}
/* Mobile-only: measure label font-size: LOCAL 12.6px -> PROD 11.2px */
/* Mobile-only: Force card sections visible (LOCAL collapses to h=0, PROD shows them) */
@media (max-width: 767px) {
[class*='c-value-pick-card-measure-label'] {
font-size: 11.2px !important;
}
/* CRITICAL: LOCAL cards collapse teams/pickRow/measures to height:0 overflow:hidden at mobile
while PROD shows them expanded. Force visible to match PROD.
ALSO need to fix the card BODY container (c-value-pick-card__*) which is 16px (0 content).
Selector [class*="c-value-pick-card__"] matches only the body (not child elements like
c-value-pick-card-teams, c-value-pick-card-pick-row, etc. since they have a hyphen before subclass). */
[class*='c-value-pick-card__'] {
height: auto !important;
overflow: visible !important;
}
[class*='c-value-pick-card-teams'],
[class*='c-value-pick-card-pick-row'],
[class*='c-value-pick-card-measures'] {
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
}
/* ==========================================================================
MOBILE HEADER PARITY OVERRIDES (2026-02-10)
Must be LAST to override all previous !important rules.
Uses header prefix for higher specificity (0,0,1,1) to beat rules at
lines ~1555-1574 that use header [class*="..."].
At mobile (<=767px), PROD changes button container/sizing:
- Container: padding 8px, margin-left auto (pushes to right)
- Search/Login: font-size 12.6px, different padding values
========================================================================== */
@media (max-width: 767px) {
header [class*='c-header-buttons'],
header [class*='Buttons_c-header-buttons'],
[class*='Header_c-header'] [class*='c-header-buttons'] {
padding: 8px !important;
margin-left: auto !important;
height: auto !important;
}
header [class*='c-header-search-button'][class*='c-header-search-button'],
header [class*='Buttons_c-header-search-button'][class*='Buttons_c-header-search-button'],
[class*='Header_c-header'] [class*='c-header-search-button'][class*='c-header-search-button'] {
padding: 0px 12px !important;
font-size: 12.6px !important;
}
header [class*='c-header-button--login'],
header [class*='Buttons_c-header-button--login'],
[class*='Header_c-header'] [class*='c-header-button--login'] {
padding: 0px 20px !important;
font-size: 12.6px !important;
}
/* RC#51: Sign Up / Register button mobile parity */
header a[href='/account/register'],
header a[href='/sign-up'],
header [class*='c-header-button--register'],
[class*='Header_c-header'] a[href='/account/register'],
[class*='Header_c-header'] [class*='c-header-button--register'] {
font-size: 12.6px !important;
padding: 0px 20px !important;
}
}
/* VISUAL PARITY: GrayBlock header chevron icons need 5px right margin to match
PROD's FontAwesome svg-inline--fa margin. Without this, title text starts 5px
earlier on LOCAL (x=56 vs PROD x=61). Affects ALL GrayBlock headers. */
.sk-block-header-icon {
margin-right: 5px !important;
}
/* VISUAL PARITY: LegendIcon SVG sizing. PROD FA icon is 16x16 CSS + 1px padding = 18x18 rendered.
Must use [class*="LegendIcon_c-key-legend"] svg to target SVG specifically (not the container).
SVG padding doesn't work like HTML padding, so use explicit 18x18 dimensions to match PROD's
rendered bounding rect. The margin: -1px 1px offsets to keep centered in 20px container. */
[class*='LegendIcon_c-key-legend'] svg {
color: #e67917 !important;
width: 18px !important;
height: 18px !important;
margin: -1px 0px !important;
display: block !important;
vertical-align: -2px !important;
}
/* VISUAL PARITY: PROD LegendIcon fa-layers container: 20px wide, 16px tall, display:inline-block.
PROD uses FontAwesome .fa-layers which is display:inline-block. LOCAL was display:block
causing icon to wrap to new line in UpcomingMatches "Popular Matches" header (h=60 vs PROD h=45).
Use span[] selector to avoid bleeding into the SVG child (which also matches [class*="c-key-legend"]). */
span[class*='LegendIcon_c-key-legend'] {
width: 20px !important;
height: 16px !important;
display: inline-block !important;
vertical-align: -2px !important;
}
/* VISUAL PARITY: UpcomingMatches "WIN ATS TOT" header text-group is hidden on LOCAL
via display:none at >mid breakpoint. PROD shows it at all viewports. */
[class*='c-quick-pick-header-text-group'][class*='c-quick-pick-header-text-group'] {
display: flex !important;
margin-left: auto !important;
}
/* VISUAL PARITY: TrendIconLetter c-trendIcon--25 renders 18x9 on LOCAL (display:block)
vs 25x25 on PROD (display:flex). Force explicit sizing and display:flex. */
[class*='c-trendIcon--25'][class*='c-trendIcon--25'] {
display: flex !important;
width: 25px !important;
height: 25px !important;
line-height: 25px !important;
align-items: center !important;
justify-content: center !important;
}
/* VISUAL PARITY: MembersOnly icon-only button renders as 110px-wide on LOCAL
because c-members-icon--only and c-members-btn are on the SAME element (not parent-child
as PROD renders). Must override min-width/size when both classes coexist. */
[class*='c-members-icon--only'][class*='c-members-btn'][class*='c-members-icon--only'][class*='c-members-btn'] {
min-width: 0 !important;
min-width: initial !important;
width: 28.25px !important;
height: 28.25px !important;
padding: 0px !important;
box-sizing: border-box !important;
overflow: hidden !important;
}
/* VISUAL PARITY: UpcomingMatches body has display:flex on LOCAL vs display:block on PROD.
Force block display to match PROD table layout behavior.
RC#64: overflow-x:auto lets table scroll horizontally on tablet (PROD table=833px > 704px container). */
[class*='c-quick-pick-body'][class*='c-quick-pick-body'] {
display: block !important;
overflow-x: auto !important;
}
/* VISUAL PARITY: UpcomingMatches table cells — match PROD behavior
PROD confirmed (CDP): cells use padding: 8px, line-height: 18.06px, cellHeight: 49px.
PROD confirmed (CDP): overflow: visible, white-space: normal.
S33: Removed white-space:nowrap and overflow:hidden — they don't match PROD and cause
cell height mismatch (45px vs 49px). Padding/line-height handled by SCSS source. */
/* [class*='infinite-scroll'] table.sk-table > tbody > tr > td — no longer needed */
[class*='infinite-scroll'] table.sk-table > thead > tr > th {
white-space: nowrap !important;
}
/* VISUAL PARITY: Cell alignment fixes for UpcomingMatches table */
[class*='infinite-scroll'] table.sk-table > tbody > tr > td:nth-child(4) {
text-align: right !important;
}
[class*='infinite-scroll'] table.sk-table > tbody > tr > td:nth-child(5) {
text-align: left !important;
}
/* VISUAL PARITY: Table layout matching PROD (RC#62→RC#65→RC#68 2026-02-11)
RC#65 fix: width:100% restores desktop table to fill container (PROD=1205px match).
RC#68 fix: Removed min-width:833px which forced tablet table to overflow (PROD tablet=778px, not 833px).
Changed max-width:none to 100% to match PROD's constraint.
Desktop: table fills ~1205px container. Tablet: table fills ~778px container. Both match PROD. */
[class*='infinite-scroll'] table.sk-table {
table-layout: auto !important;
width: 100% !important;
max-width: 100% !important;
border: 1px solid rgb(217, 217, 217) !important;
background-color: rgb(255, 255, 255) !important;
}
[class*='infinite-scroll'] table.sk-table > thead > tr {
border-bottom: 1px solid rgb(217, 217, 217) !important;
}
[class*='infinite-scroll'] [class*='c-quick-pick-body'] {
border-left: 1px solid rgb(234, 237, 237) !important;
}
/* VISUAL PARITY RC#64d: Table.module.scss responsive rule at <=mid (max-width:767px)
sets display:block on ALL table elements (table, thead, tbody, tr, th, td) and hides
thead with position:absolute. This converts the 10-column UpcomingMatches table into
stacked blocks — each row becomes ~404px tall instead of ~49px, causing the table to
be 4047px instead of ~490px. The component renders a at 768px (LessMid breakpoint
is max-width:767px), so the table display must be preserved. Override display:block back
to proper table display values.
BATCH 40: Wrapped in @media (min-width: 768px) so mobile (<768px) uses PROD's
stacked block layout (display:block) from the SCSS responsive rule. */
@media (min-width: 768px) {
[class*='infinite-scroll'] table.sk-table {
display: table !important;
}
[class*='infinite-scroll'] table.sk-table > thead {
display: table-header-group !important;
position: static !important;
top: auto !important;
left: auto !important;
}
[class*='infinite-scroll'] table.sk-table > thead > tr {
display: table-row !important;
position: static !important;
top: auto !important;
left: auto !important;
}
[class*='infinite-scroll'] table.sk-table > tbody {
display: table-row-group !important;
}
[class*='infinite-scroll'] table.sk-table > tbody > tr {
display: table-row !important;
}
[class*='infinite-scroll'] table.sk-table > tbody > tr > td,
[class*='infinite-scroll'] table.sk-table > thead > tr > th {
display: table-cell !important;
}
/* VISUAL PARITY: Column width fixes for UpcomingMatches table */
[class*='infinite-scroll'] table.sk-table > thead > tr > th:nth-child(4),
[class*='infinite-scroll'] table.sk-table > tbody > tr > td:nth-child(4) {
width: 61px !important;
max-width: 61px !important;
}
[class*='infinite-scroll'] table.sk-table > thead > tr > th:nth-child(6),
[class*='infinite-scroll'] table.sk-table > tbody > tr > td:nth-child(6) {
width: 71px !important;
max-width: 71px !important;
overflow: hidden !important;
}
[class*='infinite-scroll'] table.sk-table > thead > tr > th:nth-child(10),
[class*='infinite-scroll'] table.sk-table > tbody > tr > td:nth-child(10) {
width: 116px !important;
max-width: 116px !important;
}
[class*='infinite-scroll'] table.sk-table > thead > tr > th:nth-child(10) {
padding: 8px !important;
}
} /* END @media (min-width: 768px) — RC#64d table display + column width overrides */
/* VISUAL PARITY: Matchup button in UpcomingMatches should match PROD sizing */
[class*='c-quick-pick-icon-btn'][class*='c-quick-pick-icon-btn'] {
padding: 8px 20px !important;
line-height: 14px !important;
background-color: rgb(245, 245, 245) !important;
color: rgb(230, 121, 23) !important;
}
/* VISUAL PARITY: Trend cell links - PROD unstyled, LOCAL had blue bg from .sk-members-only-button */
[class*='infinite-scroll'] table.sk-table > tbody > tr > td:nth-child(3) a,
[class*='infinite-scroll'] table.sk-table > tbody > tr > td:nth-child(9) a {
background-color: transparent !important;
padding: 0 !important;
border-radius: 0 !important;
border: none !important;
}
/* ==========================================================================
MOBILE GRAYBLOCK HEADER PARITY (2026-02-10)
At mobile (<768px), PROD GrayBlock headers use 14px font and chevron icons
scale to 14x14. LOCAL forces 16px from SCSS. These differences cause the
valuePicks heading to be 2.6px taller and 19.4px wider on LOCAL.
========================================================================== */
@media (max-width: 767px) {
[class*='c-gray-block-header-title'][class*='c-gray-block-header-title'] {
font-size: 14px !important;
line-height: 18.06px !important;
}
.sk-block-header-icon {
width: 14px !important;
height: 14px !important;
}
}
/* ==========================================================================
COMPARATOR-VERIFIED FIXES (2026-02-09)
These selectors are proven to match by css-property-comparator.cjs
Using href-based and broad attribute selectors for reliable matching.
At END of file for maximum cascade priority.
========================================================================== */
/* FIX: Sign In button — PROD is ORANGE, fw 600, w 85.58px
CORRECTED: Actual href is "/account/login" (not "/sign-in")
The existing rules at line 618/2239 are SWAPPED (register gets orange, login gets transparent)
These rules CORRECT that by targeting the actual DOM elements. */
a[href='/account/login'],
a[href='/sign-in'],
[class*='c-header-button--login'] {
background-color: rgb(230, 121, 23) !important;
background: rgb(230, 121, 23) !important;
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
width: 85.5781px !important;
height: 40px !important;
padding: 0px 16.8px !important;
margin: 0px 0px 0px 5px !important;
border: 0px none !important;
border-radius: 25px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
text-decoration: none !important;
}
/* FIX: Sign Up button — PROD is TRANSPARENT, gray border, fw 600
CORRECTED: Actual href is "/account/register" (not "/sign-up")
Same swap correction as above. */
a[href='/account/register'],
a[href='/sign-up'],
[class*='c-header-button--register'] {
background-color: transparent !important;
background: transparent !important;
color: rgb(255, 255, 255) !important;
font-weight: 600 !important;
width: 91.3438px !important;
height: 40px !important;
padding: 0px 16.8px !important;
margin: 0px 0px 0px 5px !important;
border: 1px solid rgb(167, 167, 167) !important;
border-radius: 25px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
text-decoration: none !important;
}
/* FIX: Search Button — PROD is Arial font, 49.59px width
Comparator: PROD width=49.5938px, font-family=Arial
LOCAL was width=35.5938px, font-family=Open Sans */
[class*='c-header-search-button'] {
font-family: Arial !important;
width: 49.5938px !important;
}
/* NOTE: Menu, GoProButton, SportFilter have LAYOUT-LEVEL differences
(completely different positions/flex structures) that can't be fixed
with CSS overrides alone. These stem from component arrangement differences.
- Menu: PROD flex 1 1 0% vs LOCAL flex 0 0 1251px
- GoProButton: PROD x=911 vs LOCAL x=237
- SportFilter: PROD x=964,w=315 vs LOCAL x=79,w=1208
Attempting to force PROD values causes cascading layout regressions. */
/* FIX: Card Background — PROD cards are white, LOCAL are transparent
Comparator: PROD bg=rgb(255,255,255), LOCAL bg=rgba(0,0,0,0)
Cards in Ticker carousel appear as white rectangles on PROD vs
invisible on LOCAL (blending into gray bg). ~85K pixels affected. */
[class*='Card_c-card'],
.c-card {
background-color: rgb(255, 255, 255) !important;
overflow: hidden !important; /* P33: PROD has overflow:hidden on cards — verified on desktop + tablet */
}
/* P34: card_team_line — PROD has transparent bg + space-between + visible overflow (verified desktop + tablet + mobile) */
[class*='c-card-team-line'],
[class*='Card_c-card-team-line'] {
background-color: transparent !important;
justify-content: space-between !important;
overflow: visible !important; /* P33's [class*='Card_c-card'] also matches card-team-line via substring — override back to PROD's visible */
}
/* P37: card_score — P33's [class*='Card_c-card'] substring-matches Card_c-card-score-text too.
PROD card_score: bg=transparent, overflow=visible, font-weight=400, padding=1px 2px, font-size=12px (CSS Deep Compare 2026-02-10)
Updated Batch 10: Added padding and font-size to match PROD exactly (LOCAL had 0px/11px). */
[class*='c-card-score'],
[class*='Card_c-card-score'] {
background-color: transparent !important;
overflow: visible !important;
font-weight: 400 !important;
padding: 1px 2px 1px 1px !important;
font-size: 12px !important;
}
/* P35: value_card left border — PROD has 1px solid left border (verified desktop + tablet) */
[class*='ValuePick_c-value-pick-card'],
[class*='c-value-pick-card'] {
border-left: 1px solid rgb(234, 237, 237) !important;
}
/* P36: upcoming_items — PROD has max-width:none (verified desktop + tablet) */
[class*='UpcomingMatchesItems'],
[class*='UpcomingMatches'] {
max-width: none !important;
}
/* P37: top-picks wrap — PROD bg is white rgb(255,255,255), not gray (verified desktop + tablet) */
[class*='top-picks'] {
background-color: rgb(255, 255, 255) !important;
}
/* End of COMPARATOR-VERIFIED FIXES */
/* ==========================================================================
MOBILE FINAL OVERRIDES (Batch 11) — MUST be at END of file for max cascade priority.
The global rules above (header 70px at ~L1960, login button at ~L2319) use !important
and appear later than the mobile @media block at ~L730. These final mobile overrides
guarantee correct values on mobile by being LAST in the cascade.
========================================================================== */
@media (max-width: 767px) {
/* M11a-final: block-filters must NOT inherit 70px from [class*='c-header'] rule.
PROD: height=auto(30px from content), maxH:none, minH:auto, overflow:visible */
[class*='c-header-block-filters'] {
height: auto !important;
min-height: auto !important;
max-height: none !important;
overflow: visible !important;
}
/* M11b-final: Login button — PROD mobile: padding:0 20px, minWidth:auto,
fontSize:12.6px, textAlign:start, justifyContent:normal, gap:normal,
width:auto (not forced 85px desktop width) */
[class*='c-header-button--login'],
a[href='/account/login'],
a[href='/sign-in'] {
padding: 0px 20px !important;
min-width: auto !important;
font-size: 12.6px !important;
text-align: start !important;
justify-content: normal !important;
gap: normal !important;
width: auto !important;
}
/* M11c-final: Buttons CONTAINER — PROD mobile: margin-left:auto (pushes buttons right),
height:56px, padding:8px, gap:4px. Global rules at ~L612 and ~L2261 set margin:0
and padding:0 with !important, overriding the SCSS mobile breakpoint values.
Uses descendant selector [class*='c-header'] for specificity 0,2,0 to match/beat
the button exception at ~L1937 which uses [class*='c-header'] [class*='c-header-button']
and accidentally matches the container (c-header-button ⊂ c-header-buttons).
This final override restores PROD-matching values on mobile. */
header [class*='Buttons_c-header-buttons'],
[class*='c-header'] [class*='Buttons_c-header-buttons'],
[class*='c-header'] [class*='c-header-buttons'] {
margin-left: auto !important;
height: 56px !important;
min-height: auto !important;
max-height: none !important;
padding: 8px !important;
width: auto !important;
}
}
/* =====================================================================
BATCH 11 - VISUAL PARITY FIXES (Feb 11, 2026)
Verified via Puppeteer computed style comparison LOCAL vs PROD
===================================================================== */
/* FIX: Loader Width Constraint (Batch 11)
Issue: .c-loader has position:absolute and min-width:30px constraining ValuePicks filter
PROD: Loader position=relative, width=1192px
LOCAL: Loader position=absolute, width=0px (collapsed)
Impact: ValuePicks tiles invisible/collapsed
Fix: Set position:relative and width:100% to match PROD behavior */
[class*='Loader_c-loader'] {
position: relative !important;
width: 100% !important;
min-width: 0 !important;
min-width: initial !important;
}
/* FIX: ValuePicks Key Filter Width (Batch 11)
PROD: c-trend-value-key-filter width=1192px
LOCAL: c-trend-value-key-filter width=0px (constrained by absolute loader)
Impact: 6.52% COMPONENT difference (32 regions)
Note: Explicit width as fallback if loader fix needs adjustment */
[class*='c-trend-value-key-filter__'] {
width: 1192px !important;
max-width: 100% !important;
}
/* FIX: ValuePicks Filter Property Width (Batch 11)
PROD: c-trend-value-key-filter-property width=170.281px
LOCAL: c-trend-value-key-filter-property width=10-11px
Note: Children need explicit width when parent expands */
[class*='c-trend-value-key-filter-property__']:not([class*='button']) {
width: 170.281px !important;
display: block !important;
}
/* FIX: Card Height Parity (Batch 11, CORRECTED Batch 24)
PROD actual: Card_c-card height=71px (Sweep 17 measurement)
Previous value 81.4688px was WRONG — that was the Ticker CONTAINER height.
Card SCSS also sets height:71px. This !important ensures index.css consistency. */
[class*='Card_c-card__'] {
height: 71px !important;
}
/* FIX: Card Date Background (Batch 11)
PROD: Card_c-card-date bg=rgba(0,0,0,0) (transparent)
LOCAL: Card_c-card-date bg=rgb(255,255,255) (white)
Impact: Visible white box instead of transparent */
[class*='Card_c-card-date'] {
background-color: transparent !important;
}
/* FIX: Ticker Overflow Containment (Batch 40)
PROD: Ticker clips content within its 1208px container
LOCAL: Ticker children expand to 3251px and spill out
Fix: Add overflow:hidden to ticker-global-header and c-cards */
[class*='ticker-global-header'] {
overflow: hidden !important;
}
[class*='Ticker_c-cards'] {
overflow: hidden !important;
max-width: 100% !important;
width: 100% !important;
}
/* FIX: Ticker Cards Carousel Height (Batch 11)
PROD: c-cards-carousel height=81.4688px (matches card)
LOCAL: c-cards-carousel height=84px
Note: Container should match card height for alignment */
[class*='c-cards-carousel'] {
height: 81.4688px !important;
}
/* FIX: Card Box Shadow + Overflow (Batch 11, updated Batch 24)
PROD: boxShadow=none, overflow=hidden, box-sizing=border-box
LOCAL: boxShadow=rgba(0,0,0,0.1) 0px 2px 4px 0px
Note: PROD cards have no shadow and clip overflow at 71px height */
[class*='Card_c-card__'] {
box-shadow: none !important;
overflow: hidden !important;
box-sizing: border-box !important;
}
/* END BATCH 11 */
/* =====================================================================
BATCH 12 - VISUAL PARITY FIXES (Feb 11, 2026)
After Batch 11: 10.69% difference
Categories: CONTENT 4.89%, TYPOGRAPHY 3.30%, COLOR 1.49%, LAYOUT 0.89%
===================================================================== */
/* FIX: Ticker Carousel Background (Batch 12)
PROD: bg=rgb(245, 245, 245) (light gray)
LOCAL: bg=transparent
Impact: COLOR category difference */
[class*='Ticker_c-cards-carousel'] {
background-color: rgb(245, 245, 245) !important;
}
/* FIX: Ticker Carousel Text Color (Batch 12)
PROD: color=rgb(91, 91, 91) (gray)
LOCAL: color=rgb(230, 121, 23) (orange)
Note: Text inherits from carousel container */
[class*='Ticker_c-cards-carousel'] {
color: rgb(91, 91, 91) !important;
}
/* FIX: Ticker Carousel Width Constraint (Batch 12, fixed Batch 40)
LOCAL: width=150px, flex=0 1 auto (constrained)
PROD: Parent should expand to fill available space
Batch 40: Added overflow:hidden + max-width:100% to prevent 3243px spill */
[class*='Ticker_c-cards-carousel'] {
width: 100% !important;
max-width: 100% !important;
flex: 1 1 auto !important;
overflow: hidden !important;
}
/* FIX: Horizontal Scrolling Menu Wrapper Width (Batch 12, fixed Batch 40)
LOCAL: width=150px (constrained by parent)
PROD: width=1208px (fills available space)
Batch 40: overflow reverted to hidden — visible caused ticker items
to spill 3233px wide beyond the 1208px container */
[class*='react-horizontal-scrolling-menu--wrapper'] {
width: 100% !important;
overflow: hidden !important;
}
/* END BATCH 12 */
/* =====================================================================
BATCH 13 v2 - SURGICAL VISUAL PARITY FIXES (Feb 11, 2026)
Baseline: 10.681% (official) / 15.39% (quick-check)
Strategy: ONE fix at a time, test each independently
===================================================================== */
/* FIX 13-A: SportFilter Tab Font Size
Deep-compare: 16 elements with fontSize 15px LOCAL vs 14px PROD
These are sport filter league tile tab labels */
[class*='LeagueTile_c-league-tile'] span {
font-size: 14px !important;
}
/* FIX 13-B: ValuePicks Grade Filter Buttons
Deep-compare: 7 elements with fontSize 24px LOCAL vs 16px PROD
These are the A+, A, B, C, D, F grade filter buttons
Also reducing size from 50x50 to 30x30 to match PROD */
[class*='ValuePicks_key-filters-unitgrade'] [class*='TrendIconLetter'] {
font-size: 16px !important;
width: 30px !important;
height: 30px !important;
line-height: 30px !important;
}
/* FIX 13-E: ValuePicks INNER Grade Circles (override 13-B cascade)
vp-detail: LOCAL inner circles are 30x30 (hit by 13-B), PROD is 50x50
These are the grade circles INSIDE each value-pick tile, not the filter bar.
Must override 13-B back to PROD's 50x50, fs=20px, color=black */
[class*='ValuePicks_key-filters-filters-tile'] [class*='TrendIconLetter'] {
font-size: 20px !important;
width: 50px !important;
height: 50px !important;
line-height: 50px !important;
color: rgb(0, 0, 0) !important;
}
/* FIX 13-C: ValuePicks Filters Tile Background
Band analysis: Bands 9-12 (y=468-676) have 25-35% diff each
ROOT CAUSE: LOCAL bg=transparent, PROD bg=rgb(245,245,245)
This affects the entire ValuePicks filter area (y=479-735)
FIX 13-D: Added padding-top: 10px (LOCAL=0, PROD=10px) — fixed 12px Y-shift
FIX 13-F: Added padding-bottom: 5px (LOCAL=0, PROD=5px)
FIX 31-F: Changed to full padding shorthand: 10px 0 5px (PROD vendor-widgets match).
sk-app SCSS sets padding: 0 5px, but PROD has 0 horizontal padding.
The 5px horizontal padding was causing ~1px tile width diff at desktop.
FIX 32-A: Shorthand `padding: 10px 0 5px !important` was NOT overriding SCSS
longhand `padding-right: 5px / padding-left: 5px`. CDP matched rules
confirmed only padding-top and padding-bottom were getting !important.
Fix: use explicit longhand properties so all four get !important. */
[class*='ValuePicks_key-filters-filters-tile'] {
background-color: rgb(245, 245, 245) !important;
padding-top: 10px !important;
padding-right: 0 !important;
padding-bottom: 5px !important;
padding-left: 0 !important;
}
/* FIX 13-G: ValuePicks Winning Circle Ball Alignment
LOCAL: display=inline-flex → centered by text-align:center → 35px offset
PROD: display=flex → block-level → LEFT-aligned → 0px offset
This causes 7 tiles × 60px × 35px horizontal shift = MASSIVE pixel diff
in bands 9-10 (y=468-571). Fix: force display:flex to match PROD */
[class*='ValuePicks_winning-circle'] [class*='ValuePicks_border-box'] {
display: flex !important;
}
/* FIX 13-H: Sport Filter Header Layout (Date Picker Position)
LOCAL: GrayBlock_header-content has justify-content=normal → picker on LEFT at x=153
PROD: GrayBlock_header-content has justify-content=space-between → picker on RIGHT at x=964
This is an 800px horizontal position difference in band 4 (y=208-259) */
[class*='GrayBlock_c-gray-block-header-content'] {
justify-content: space-between !important;
}
/* FIX 13-I: HorizontalDatePicker Font Size
LOCAL: date boxes have font-size=15px
PROD: date boxes have font-size=14px */
[class*='HorizontalDatePicker'] [class*='_3n'] {
font-size: 14px !important;
}
/* END BATCH 13 */
/* VISUAL PARITY RC#66: REVERTED by FIX 30-B (Batch 30, 2026-02-13)
FRESH CDP measurement (2026-02-13): PROD tablet footer = 293.906px (NOT 326px!)
The S24 parity-data was misleading. The natural SCSS height (293.90625px) IS correct.
Forcing 326px made LOCAL 32px taller than PROD — wrong direction.
CONFIRMED: PROD computedHeight=293.906px, boundingHeight=293.906px at 1024x768. */
/*
@media (min-width: 768px) and (max-width: 1024px) {
footer[class*='c-footer'] {
height: 326px !important;
}
}
*/
/* End of COMPARATOR-VERIFIED FIXES */
/* ==========================================================================
BATCH 6.1 COLOR RESTORATION - 2026-02-11
Objective: Fix "White Screen" regression where Local != Prod colors.
Target: Header (#262626), Body (#EAEAEA), Footer (#424242).
Use !important to override any legacy/module conflicts.
========================================================================== */
/* 1. HEADER BACKGROUND: Force Dark Grey */
/* Matches PROD rgb(38, 38, 38) */
body header,
body .c-header,
#root header,
#root .c-header,
[class*='Header_c-header'] {
background-color: rgb(38, 38, 38) !important;
}
/* 2. BODY BACKGROUND: Force Light Grey */
/* Matches PROD rgb(234, 234, 234) */
body,
body.light-theme,
#root {
background-color: rgb(234, 234, 234) !important;
}
/* 3. FOOTER BACKGROUND: Force Dark Footer Grey */
/* Matches PROD rgb(66, 66, 66) */
body footer,
body .c-footer,
#root footer,
#root .c-footer,
[class*='Footer_c-footer'] {
background-color: rgb(66, 66, 66) !important;
color: #fff !important;
}
/* 4. MOBILE TICKER: Force Blue */
/* Matches PROD rgb(91, 143, 196) */
@media (max-width: 768px) {
[class*='Ticker_c-ticker'],
.c-ticker {
background-color: rgb(91, 143, 196) !important;
}
}
/* 5. TABLET CARD BACKGROUNDS */
/* Matches PROD rgb(28, 78, 134) for Card backgrounds on Tablet */
@media (min-width: 768px) and (max-width: 1024px) {
[class*='Card_c-card'],
.c-card {
background-color: rgb(28, 78, 134) !important;
}
}
/* 6. GENERIC TEXT CONTRAST */
footer p,
footer span,
footer a,
header p,
header span,
header a {
color: #fff !important;
}
/* =====================================================================
BATCH 14 - REVERTED (Feb 12, 2026)
Result: Net negative — Desktop +0.02%, Tablet -0.20%, Mobile -5.40%
Root cause: Dark overlay (14-A) and footer overflow:hidden (14-F) worsened
mobile parity. Fixes that add strong visual elements at positionally-shifted
content WORSEN pixel comparison rather than helping it.
===================================================================== */
/* =====================================================================
BATCH 15 - POSITION SHIFT ELIMINATION (Feb 12, 2026)
Baseline: Desktop 92.77%, Tablet 65.11%, Mobile 72.32%
Root Cause: ValuePicks on LOCAL is 220-370px taller than PROD, pushing
UpcomingMatches down by 229px (desktop), 370px (tablet), 267px (mobile).
This position shift causes ~35-48% of all tablet pixel mismatches.
PROD Analysis (master-legacy-styles):
- winning-circle has margin-bottom: -30px; margin-left: -10px (OVERLAP)
- key-filters-items uses display:block at [class*='c-trend-value-key-filter-property'] {
flex-grow: 0;
flex-shrink: 0;
flex-basis: calc(100% / 7);
min-width: 0 !important;
}
/* FIX 31-A: Tablet VP property flex override — auto basis instead of calc(100%/7)
PROD tablet: flex: 0 0 auto, width: 150px → 7×150=1050px → overflow scroll
LOCAL before: flex: 0 0 14.2857%, width: 132.7px → 7×133=929px → no scroll
CDP verified: PROD property is exactly 150px at tablet (all 7 items identical).
Set explicit width: 150px to match, since content-based sizing differs slightly. */
@media (max-width: 1024px) {
[class*='c-trend-value-key-filter'] > [class*='c-trend-value-key-filter-property'] {
flex: 0 0 150px !important;
width: 150px !important;
}
}
/* FIX 15-D-mobile: Mobile ValuePick items - horizontal scroll
PROD mobile: width: 100%; flex: 0 0 100% per item, horizontal scroll
Keep mobile items at full width for horizontal scrolling */
@media (max-width: 767px) {
[class*='c-trend-value-key-filter'] > [class*='c-trend-value-key-filter-property'] {
width: 115px !important;
flex: 0 0 115px !important;
}
}
/* FIX 15-E: DISABLED — This fix was never applying due to wrong dual-class selector.
The sk-app SCSS already sets width: 160.281px on the tile at desktop.
Vendor-widgets tile uses width: 100% which is the correct responsive behavior.
At tablet, FIX 31-B overrides to width: 100%.
PROD desktop tile = 159.28px (100% of property content area).
sk-app SCSS tile = 160.281px (close enough, ~1px difference).
Re-enabling this would force a non-responsive fixed width that conflicts. */
/* [class*='key-filters-filters-tile'] {
width: 160.281px !important;
min-width: 0 !important;
max-width: none !important;
flex: 0 1 auto !important;
} */
/* FIX 15-F: ValuePicks GrayBlock wrapper - remove forced min-width
The value-picks-gray-block wrapper on LOCAL forces min-width: 1192px on desktop
which can cause horizontal overflow. Let it be natural width. */
[class*='value-picks-gray-block'] {
min-width: 0 !important;
max-width: 100% !important;
}
/* END BATCH 15 */
/* ==========================================================================
BATCH 16: TABLET BREAKPOINT FIXES (2026-02-12)
ROOT CAUSE: Legacy @import SCSS files compile ' * {
height: 100% !important;
}
}
/* FIX 16-B: SportFilter tablet height — PROD=40px, LOCAL=100px
The SportFilter's mobile layout (stacked icons) incorrectly activates at 768px.
PROD shows compact 40px horizontal filter bar at tablet width. */
@media (min-width: 768px) {
[class*='SportFilter_c-sport-filter-mobile'] {
display: none !important;
}
}
/* FIX 16-C: ValuePickCard mobile height — PROD cards=515px, LOCAL=663px (Δ148px each)
Each card is ~148px taller on LOCAL mobile. The card-wrap has extra padding/spacing.
Constrain card internal spacing to match PROD. */
@media (max-width: 767px) {
[class*='c-value-pick-card-wrap'] {
padding: 0 !important;
}
[class*='c-value-pick-card-wrap'] > * {
margin-bottom: 0 !important;
}
}
/* FIX 16-D: Footer mobile height — REVERTED (overshot: PROD=626, LOCAL went 696→535)
The padding removal was too aggressive. Footer at bottom of page doesn't affect
scroll-0% parity scores anyway. Leaving natural footer height. */
/* END BATCH 16 */
/* ============================================================
BATCH 17: GrayBlock Header Height Parity (Feb 2026)
ROOT CAUSE: GrayBlock headers 17-24px taller on LOCAL vs PROD
Empirical measurements at 768px tablet:
My Picks header: LOCAL=62px, PROD=45px (+17px)
Filters header: LOCAL=88px, PROD=64px (+24px)
VP header: LOCAL=65px, PROD=45px (+20px)
Three differences found:
1. title div align-items: normal (LOCAL) vs center (PROD) → +5px
2. first-line margin-bottom: 12px (LOCAL) vs 0px (PROD) → +12px [fixed by removing FIX #3 broad rule]
3. header margin-bottom: 12px (LOCAL) vs 0px (PROD) → +12px [fixed by removing FIX #3 broad rule]
4. icon font-size: 14px (LOCAL) vs 16px (PROD) → cosmetic
Expected savings: ~97px of 121px cumulative offset eliminated
============================================================ */
/* FIX 17-A: GrayBlock header title align-items: center (PROD)
LOCAL: align-items: normal → title div renders 26px (text baseline + icon stretch)
PROD: align-items: center → title div renders 21px (line-height controls)
Saves 5px per GrayBlock header × 3 headers = 15px total */
div[class*='c-gray-block-header-title'] {
align-items: center !important;
}
/* FIX 17-B: Chevron icon size match PROD (16px, not 14px)
LOCAL: inherits font-size:14px from header's !important override
PROD: icon renders at 16px with line-height 20.64px (matching title text)
The sk-components token $font-size-lg should be 16px+ but header's
font-size:14px !important cascades down. Override on icon directly. */
.sk-block-header-icon[class*='c-gray-block-icon'],
.sk-block-header-icon[class*='GrayBlock_c-gray-block-icon'] {
font-size: 16px !important;
line-height: 20.64px !important;
width: 16px !important;
height: 16px !important;
}
/* END BATCH 17 */
/* ============================================================
BATCH 18: Mobile Parity Fixes (Feb 2026)
Playwright confirmed mobile (375px) discrepancies:
FIX 18-A: ValuePicks tile height/width
PROD: h=148px, w=105px, padding="5px 0"
LOCAL: h=256px, w=160px, padding="10px 0px 5px"
Impact: -108px on VP container height → UM shifts up 108px
FIX 18-B: Footer nav item padding (in Footer.module.scss)
PROD: padding=0px, h=18px per item
LOCAL: padding=12px 0, h=43px per item (Batch 14 error)
Impact: -69px on footer height (696→627 target)
============================================================ */
/* FIX 18-A: ValuePicks tile mobile sizing
PROD tiles at 375px are 148×105px with 5px vertical padding.
LOCAL tiles at 256×160px are too tall, pushing UpcomingMatches
down 108px and causing significant scroll-0% mismatch. */
@media (max-width: 767px) {
[class*='key-filters-filters-tile'] {
height: 148px !important;
width: 105px !important;
min-width: 100px !important;
max-width: 110px !important;
padding: 5px 0px !important;
flex: 0 0 auto !important;
}
}
/* END BATCH 18 */
/* ============================================================
BATCH 19: SportFilter Mobile Padding Parity (Feb 2026)
ROOT CAUSE: core-legacyrestoration.spacing(4, 'padding') in
SportFilter.module.scss resolves to 32px on LOCAL, but PROD
renders 8px on mobile children. Plus the M2 rule (line ~958)
adds 8px horizontal padding to ALL c-sport-filter-mobile*
elements, which PROD doesn't have on wrapper/picks/footer.
Puppeteer measurements at 375×812 mobile:
| Child | PROD pad | LOCAL pad | PROD h | LOCAL h |
|-----------------|-------------|-------------|--------|---------|
| wrapper | 0px | 0px 8px | 278 | 384 |
| mobile-header | 8px 12px | 32px 8px | 56 | 104 |
| leagues div | 8px | 32px 8px | 107 | 170 |
| mobile-picks | 0px | 0px 8px | 65 | 60 |
| mobile-footer | 0px | 0px 8px | 45 | 45 |
Expected savings: ~106px (384→278) on SportFilter container
============================================================ */
@media (max-width: 767px) {
/* FIX 19-A: Base rule — set 8px padding on ALL c-sport-filter-mobile elements.
This catches the leagues div (class="c-sport-filter-mobile" without suffix)
which can't be targeted without also matching the suffixed children.
Children are overridden individually below. */
[class*='c-sport-filter-mobile'] {
padding: 8px !important;
}
/* FIX 19-B: Wrapper — PROD has 0px padding, remove M2 horizontal padding */
[class*='c-sport-filter-mobile-wrapper'] {
padding: 0 !important;
}
/* FIX 19-C: Header — PROD has 8px 12px (8px top/bottom, 12px left/right)
LOCAL had 32px 8px from spacing(4) + M2 rule */
[class*='c-sport-filter-mobile-header'] {
padding: 8px 12px !important;
}
/* FIX 19-D: Picks — PROD has 0px padding, remove M2 horizontal padding */
[class*='c-sport-filter-mobile-picks'] {
padding: 0 !important;
}
/* FIX 19-E: Footer — PROD has 0px padding, remove M2 horizontal padding */
[class*='c-sport-filter-mobile-footer'] {
padding: 0 !important;
}
/* FIX 19-F: ComboBox — FIX 19-A unintentionally added 8px padding to combobox
containers (class*='c-sport-filter-mobile-combobox'). PROD has 0px padding
on ComboBox containers. 46px→30px per combo, saves 32px total in picks. */
[class*='c-sport-filter-mobile-combobox'] {
padding: 0 !important;
}
}
/* END BATCH 19 */
/* ============================================================
BATCH 20: Mobile Layout Cascade Parity (2026-02-12)
Layout-container deep audit revealed:
- PROD mobile GrayBlock mt=8px, LOCAL mt=16px (global CSS line 1763 forces 16px)
- 8px cascade offset shifts ALL content below GrayBlock
- PROD mobile ComboBox inputs have border=1px, LOCAL has border=2px
============================================================ */
/* FIX 20-A: REVISED by FIX 29-B (Batch 29, 2026-02-13)
Original: Set margin-top: 8px but S23 diagnostic proves PROD mobile
GrayBlock margin = 0px (not 8px as previously assumed).
Desktop & tablet use margin-top: 16px (from global CSS), which is correct.
Mobile uses 0px on PROD — remove the artificial 8px margin. */
@media (max-width: 767px) {
.sk-block[class*='GrayBlock_c-gray-block'] {
margin-top: 0px !important;
}
}
/* FIX 20-B: ComboBox input border parity (all viewports).
PROD SportFilter ComboBox inputs render with border=1px.
LOCAL renders with border=2px (from design system variable override).
While box-sizing:border-box prevents height impact, the thicker border
affects pixel-level visual parity scoring. */
[class*='c-sport-filter-mobile-combobox'] input,
[class*='c-sport-filter'] [class*='combobox'] input {
border-width: 1px !important;
}
/* END BATCH 20 */
/* ============================================================
BATCH 21: GrayBlock Base Parity + Footer Mobile (2026-02-12)
ROOT CAUSE #1: GrayBlock container on LOCAL uses component defaults
(gray bg, 4px padding, 1px border, 5px radius) while PROD uses
transparent/0/none. This affects EVERY section wrapper on the page.
Comments in GrayBlock.module.scss document:
LOCAL: bg=rgb(245,245,245), padding=0px 4px, border=1px solid, radius=5px
PROD: bg=rgba(0,0,0,0), padding=0px, border=none, radius=0px
ROOT CAUSE #2: Footer mobile text uses desktop font-size (12.6px)
instead of PROD mobile (10px). Vendor-widgets codebase comparison
confirmed PROD mobile footer uses smaller fonts.
ROOT CAUSE #3: GrayBlock sibling spacing is 0 on LOCAL but 8px on
PROD. This affects vertical rhythm between all page sections.
============================================================ */
/* FIX 21-A: GrayBlock container — match PROD transparent/0/none
Component defaults: bg=rgb(245,245,245), padding=0px 4px, border=1px solid, radius=5px
PROD overrides: bg=transparent, padding=0, border=none, radius=0
Using .sk-block class to target ONLY the container (not header/content).
The .c-gray-block-content keeps its white bg via its own rules.
Previously reverted (2025-12-26) but that was because padding:0 was
applied WITHOUT bg:transparent. Applying BOTH together is correct. */
.sk-block[class*='GrayBlock_c-gray-block'] {
background-color: transparent !important;
padding: 0 !important;
border: none !important;
border-radius: 0 !important;
}
/* FIX 21-B: GrayBlock sibling margin — PROD 8px between siblings (desktop)
LOCAL SCSS: + div.c-gray-block { margin-top: 0 }
PROD vendor: + div.c-gray-block { margin-top: 8px }
Mobile already handled by FIX 20-A (8px for all GrayBlocks).
This fix adds desktop sibling spacing. */
.sk-block[class*='GrayBlock_c-gray-block'] + .sk-block[class*='GrayBlock_c-gray-block'] {
margin-top: 8px !important;
}
/* FIX 21-C: GrayBlock with-top-margin — PROD uses 16px (mobile 8px)
LOCAL SCSS: margin-top: 0
PROD vendor: margin-top: 16px !important (mobile: 8px !important)
This affects the first GrayBlock section's spacing from header. */
.sk-block[class*='GrayBlock_c-gray-block'][class*='c-gray-block-with-top-margin'] {
margin-top: 16px !important;
}
@media (max-width: 767px) {
.sk-block[class*='GrayBlock_c-gray-block'][class*='c-gray-block-with-top-margin'] {
margin-top: 8px !important;
}
}
/* FIX 21-D: Footer mobile copy text — PROD uses 10px at mobile
LOCAL: font-size: 12.6px !important (desktop value forced on all viewports)
PROD: 0.8em (11.2px) desktop, 10px mobile (vendor-widgets comparison)
The !important in SCSS blocks media queries, so we override here. */
@media (max-width: 767px) {
[class*='c-footer-copy-content-wrap'] p,
[class*='Footer_c-footer-copy-content-wrap'] p {
font-size: 10px !important;
line-height: 1.3 !important;
}
/* Footer disclaimer also smaller on PROD mobile */
[class*='c-footer-disclaimer'],
[class*='Footer_c-footer-disclaimer'] {
font-size: 11.9px !important; /* 0.85em at 14px base */
}
}
/* FIX 21-E: Footer nav item mobile spacing — PROD uses 16px gap
LOCAL SCSS: margin-top: 14px between stacked nav items
PROD vendor: margin-top: 16px (confirmed from codebase comparison)
2px per item × ~8 items = 16px total improvement */
@media (max-width: 767px) {
[class*='c-footer-nav-list'] + [class*='c-footer-nav-list'],
[class*='Footer_c-footer-nav-list'] + [class*='Footer_c-footer-nav-list'] {
margin-top: 16px !important;
}
}
/* END BATCH 21 */
/* ===================================================================
BATCH 22 — Tablet Parity + GrayBlock Viewport Margins
Date: 2026-02-12
Impact: Tablet parity (52.19% → target 70%+)
Root Causes:
1. UpcomingMatches table missing min-width:780px at tablet → LOCAL wraps
vertically instead of overflowing horizontally like PROD → +1000px height
2. GrayBlock missing tablet margin (0 12px) and padding (0 4px)
3. GrayBlock missing mobile margin (0 8px)
=================================================================== */
/* FIX 22-A: REVOKED by Batch 28 (FIX 28-A).
Live diagnostic shows PROD GrayBlock at tablet has margin: 16px 0 0 (NO side margin)
and padding: 0 (NO side padding). The vendor-widgets SCSS values were incorrect.
PROD tablet hierarchy: Layout(1009, pad=84px 32px 24px) → GrayBlock(945, mar=16px 0 0, pad=0)
LOCAL with FIX 22-A: GrayBlock(921, mar=16px 12px 0, pad=0 4px) — 32px narrower than PROD.
Removing restores: GrayBlock(945, mar=16px 0 0, pad=0) — matches PROD. */
/* @media (min-width: 768px) and (max-width: 1024px) {
.sk-block[class*='GrayBlock_c-gray-block'] {
margin-left: 12px !important;
margin-right: 12px !important;
padding: 0 4px !important;
}
} */
/* FIX 22-B: REVOKED by Batch 28 (FIX 28-B).
Live diagnostic shows PROD GrayBlock at mobile has margin: 0px (NO side margin).
PROD mobile hierarchy: Layout(360, pad=75px 8px 24px) → Screen(360) → Tickets(345) → GrayBlock(345, mar=0)
LOCAL with FIX 22-B: GrayBlock(329, mar=8px 8px 0) — 16px narrower than PROD equivalent.
Removing restores: GrayBlock fills Tickets container (345px) — matches PROD pattern. */
/* @media (max-width: 767px) {
.sk-block[class*='GrayBlock_c-gray-block'] {
margin-left: 8px !important;
margin-right: 8px !important;
}
} */
/* FIX 22-C: UpcomingMatches table min-width + overflow chain at tablet
PROD vendor-widgets UpcomingMatchesItems at <= lg (1024px):
.c-quick-pick-body { overflow-y: visible; }
:global(.sk-table) { min-width: 780px; }
On PROD, the table forces a minimum width of 780px at tablet (768px viewport).
On LOCAL, the table was constrained by:
1. Table.module.scss .c-table-wrap { overflow-x: auto } — clips table overflow
2. Table.module.scss .c-table { width: 100%; max-width: 100% } — constrains width
FIX: Override the overflow chain so the table can actually expand:
- c-table-wrap: overflow visible (don't clip with scrollbar)
- body: overflow-x auto (PROD behavior — body scrolls, not inner wrapper)
- table: min-width 780px (force horizontal layout)
Without this, LOCAL table squeezes at 768px → rows wrap → +1775px height gap. */
@media (min-width: 768px) and (max-width: 1024px) {
/* Step 1: Body overflow matches PROD at tablet — BOTH axes visible.
PROD vendor-widgets at <= lg: overflow-y: visible (overflow-x defaults to visible).
Line ~2276 sets overflow-x:auto !important with DOUBLE selector (specificity 0,2,0).
MUST use double selector here to override it. PROD does NOT have overflow-x:auto
on the body — only overflow-y:visible. Without this, the body CLIPS the table
at ~700px preventing the 780px min-width from taking effect. */
[class*='c-quick-pick-body'][class*='c-quick-pick-body'] {
overflow-x: visible !important;
overflow-y: visible !important;
}
/* Step 2: Table wrapper — overflow-x:auto for horizontal scroll.
Width:100% to constrain table to container, not expand beyond. */
[class*='UpcomingMatchesItems_c-quick-pick-body'] [class*='c-table-wrap'],
[class*='c-quick-pick-body'] [class*='Table_c-table-wrap'] {
width: 100% !important;
overflow-x: auto !important;
}
/* Step 3: Table width at tablet — PROD measures 765px (Sweep 17).
Previous min-width:780px was slightly too wide. Use width:100% + min-width:700px
to let it auto-size to container while preventing column wrapping.
NOTE: S31 tried min-width:765px + narrow columns → text wrapped → rows exploded
to 804px (PROD=143px). REVERTED to min-width:700px. The table naturally expands
to 937px due to column min-widths; the wrapper's overflow-x:auto handles scrolling. */
[class*='UpcomingMatchesItems_c-quick-pick-body'] table.sk-table,
[class*='UpcomingMatchesItems'] table.sk-table,
[class*='c-quick-pick-body'] table.sk-table {
min-width: 700px !important;
width: 100% !important;
max-width: 100% !important;
table-layout: auto !important;
}
/* Step 4: Team column names need min-width for readability.
PROD vendor-widgets uses white-space:nowrap on cells, allowing team columns to expand.
S31 REVERTED from min-width:0 back to 150px — removing min-width caused text wrapping
in narrow columns, making rows 60-111px tall (vs PROD ~14px). Better to keep columns
wide and let the wrapper scroll horizontally. */
[class*='UpcomingMatchesItems_c-quick-pick-table-col-team'],
[class*='c-quick-pick-table-col-team'] {
min-width: 150px !important;
}
/* Step 5: UpcomingMatches table cells — override Table.module.scss >mid rule
Table.module.scss >mid sets: padding: 2px 8px, line-height: 1.1, overflow: hidden.
These are designed for MatchupTable but leak to UpcomingMatches (both use .sk-table).
PROD UpcomingMatches cells: padding: 8px, line-height: 18.06px, overflow: visible.
S33: Override Table.module.scss to match PROD's UpcomingMatches cell styling.
Using [class*=X][class*=Y] double-attribute selector (specificity 0,2,1) to beat
CSS Modules .Table_c-table__xxx td (specificity 0,1,1). */
[class*='c-quick-pick-body'][class*='c-quick-pick-body'] table.sk-table td {
padding: 8px !important;
overflow: visible !important;
}
[class*='c-quick-pick-body'] table.sk-table th {
white-space: nowrap !important;
}
}
/* END BATCH 22 */
/* =====================================================================
FIX 33-A: UpcomingMatches cell override — ALL viewports above mobile
Problem: Table.module.scss >mid rule (.Table_c-table__xxx > tbody td) sets:
padding: 2px 8px !important; line-height: 1.1 !important; overflow: hidden !important
This is designed for MatchupTable but leaks to UpcomingMatches (both use .sk-table).
PROD UpcomingMatches cells: padding: 8px, line-height: 18.06px, overflow: visible.
Table.module.scss compiled specificity: 0,1,1 (.class > tbody td) with !important.
Our selector: [class*=X][class*=X] table.sk-table td = 0,2,2 — beats 0,1,1.
Using min-width:769px to match Table.module.scss's >mid breakpoint scope.
===================================================================== */
@media (min-width: 769px) {
[class*='c-quick-pick-body'][class*='c-quick-pick-body'] table.sk-table td {
padding: 8px !important;
overflow: visible !important;
line-height: 18.06px !important;
white-space: nowrap !important;
}
}
/* =====================================================================
BATCH 23: ValuePicks Tablet Height Fix
Issue: ValuePicks tiles have fixed height:256px (desktop parity fix)
but at tablet, container uses display:block, causing 7 tiles
to stack vertically: 7 × 256px = 1807px (PROD is only 285px).
Root cause: sk-app tiles have `height: 256px; width: 160.281px; min-width: 155px`
but PROD tiles have NO fixed height and `width: 100%` at div {
padding: 2px 0 !important;
}
}
/* FIX 25-F: FULLY REVERTED (Batch 26)
Originally set padding-bottom:0 on footer at mobile.
Reverted because: PROD footer=626px, but LOCAL with fix=586px (-40px SHORT).
The Footer SCSS already has padding-bottom:40px at mobile which brings LOCAL
to ~626px matching PROD. The fix was making LOCAL SHORTER than PROD. */
/* END BATCH 25 */
/* =====================================================================
BATCH 26: Score Recovery Fixes (Sweep 20 data: 2026-02-13)
Sweep 20: Desktop 85.90%, Tablet 72.95%, Mobile 74.47%
Key findings:
- FIX 25-F made footer 40px SHORTER than PROD (586 vs 626) → REVERTED
- FIX 25-C was unverifiable (MatchupTable not loading) → REVERTED
- Desktop score drop partly environmental (content availability varies)
- Mobile 75% score = screenshot timeout artifact (34.14%)
- Desktop 25% score = screenshot timeout artifact (55.20%)
Focus: Recover mobile score via footer fix, reduce ValuePicks height gap
===================================================================== */
/* FIX 26-A: ValuePicks desktop tile inner padding reduction
Issue: PROD ValuePicks container height=256px, LOCAL=271px (+15px)
FIX 25-D reduced card-wrap margin but 15px gap persists.
The tile itself has internal padding from ValuePickCard that adds height.
PROD tiles at desktop use minimal internal spacing.
Target: Reduce inner card padding to shrink total container height. */
@media (min-width: 1025px) {
[class*='key-filters-filters-tile'] [class*='c-value-pick-card'] {
padding: 2px !important;
}
}
/* FIX 26-B: ValuePicks mobile width recovery
Issue: PROD ValuePicks width=351px, LOCAL=327px (-24px)
Root cause: GrayBlock margin (8px each side = 16px) + container padding
compound to make LOCAL narrower than PROD.
PROD ValuePicks container fills parent width minus margins.
Fix: Set ValuePicks container to width:100% with box-sizing at mobile. */
@media (max-width: 767px) {
[class*='c-trend-value-key-filter'] {
width: 100% !important;
max-width: 100% !important;
box-sizing: border-box !important;
}
}
/* FIX 26-C: ValuePicks tablet width recovery
Issue: PROD ValuePicks width=673px, LOCAL=641px (-32px at 768px viewport)
Root cause: GrayBlock tablet margin (12px each side) + padding (4px each)
reduces available width. ValuePicks container at tablet should fill parent.
Fix: Ensure ValuePicks stretches to fill GrayBlock content area. */
@media (min-width: 768px) and (max-width: 1024px) {
[class*='c-trend-value-key-filter'] {
width: 100% !important;
max-width: 100% !important;
box-sizing: border-box !important;
}
}
/* FIX 26-D: REVISED (Batch 27) — Footer mobile padding-top correction
Issue: PROD footer padding = 28px 0px 40px. FIX 26-D incorrectly set 12px.
Sweep 21 deep inspection confirms: PROD padding-top=28px, LOCAL=12px.
Footer SCSS base already has padding-top:28px, but the < mid media query
doesn't reset it. This override is needed because some other rule was
overriding it to 0. Setting to 28px to match PROD exactly. */
@media (max-width: 767px) {
footer {
padding-top: 28px !important;
}
}
/* END BATCH 26 */
/* =====================================================================
BATCH 27: Root Cause Fixes — ValuePicks Container + Footer Tablet
(Sweep 21 data: 2026-02-13)
Sweep 21: Desktop 85.89%, Tablet 72.95%, Mobile 74.64%
ROOT CAUSE ANALYSIS from CSS Deep Inspection (all 3 viewports):
The R17-restored .key-filters-items.key-filters-items block in
ValuePicks.module.scss (lines 728-751) sets properties that DON'T
match PROD's computed values:
- padding: 0 10px 15px (PROD has 0px at desktop, 0px 0px 16px at tablet/mobile)
- background: $panel-content-bgColor → rgb(245,245,245) (PROD is transparent)
- border-radius: 0 0 5px 5px (PROD is 0px)
- overflow-y: auto (PROD is visible)
- justify-content: flex-start (PROD is normal)
- max-width: 100% from Batch 26 (PROD is none)
Additionally, Footer tablet has min-height: 0px vs PROD's 235px.
These fixes target the EXACT mismatches found in S21 deep inspection.
===================================================================== */
/* FIX 27-A: ValuePicks container padding — Match PROD exactly
Deep inspection confirms:
Desktop PROD: padding: 0px LOCAL: 0px 10px 15px (15px bottom + 10px sides!)
Tablet PROD: padding: 0px 0px 16px LOCAL: 0px 10px 15px (side padding + wrong bottom)
Mobile PROD: padding: 0px 0px 16px LOCAL: 0px 10px 15px (same)
The :not(:empty) rule in SCSS line 751 sets padding: 0 10px 15px universally.
Desktop: Override to 0px (no padding at all).
Tablet/Mobile: Override to 0px 0px 16px (bottom-only, matching PROD). */
@media (min-width: 1025px) {
[class*='c-trend-value-key-filter'][class*='key-filters-items'] {
padding: 0 !important;
}
}
@media (max-width: 1024px) {
[class*='c-trend-value-key-filter'][class*='key-filters-items'] {
padding: 0 0 16px !important;
}
}
/* FIX 27-B: ValuePicks container background — PROD is transparent
Deep inspection (all viewports): PROD background-color = rgba(0,0,0,0)
LOCAL: rgb(245,245,245) from SCSS .key-filters-items.key-filters-items { background: $panel-content-bgColor }
Fix: Override to transparent. */
[class*='c-trend-value-key-filter'][class*='key-filters-items'] {
background-color: transparent !important;
background: transparent !important;
}
/* FIX 27-C: ValuePicks container border-radius — PROD is 0px
Deep inspection (all viewports): PROD border-radius = 0px
LOCAL: 0px 0px 5px 5px from SCSS .key-filters-items.key-filters-items { border-radius: 0 0 5px 5px }
Fix: Override to 0px. */
[class*='c-trend-value-key-filter'][class*='key-filters-items'] {
border-radius: 0 !important;
}
/* FIX 27-D: ValuePicks container overflow — PROD is visible at desktop
Deep inspection desktop: PROD overflow = visible, LOCAL overflow = auto
SCSS: overflow-y: auto; overflow-x: hidden;
FIX 15-B: overflow-x: auto (for horizontal scrolling at tablet)
Desktop: Override both to visible (matching PROD).
Tablet/Mobile: Keep overflow-x: auto (FIX 15-B) for horizontal scrolling. */
@media (min-width: 1025px) {
[class*='c-trend-value-key-filter'][class*='key-filters-items'] {
overflow: visible !important;
}
}
/* FIX 27-E: ValuePicks container justify-content — PROD is normal
Deep inspection (all viewports): PROD justify-content = normal
LOCAL: flex-start from SCSS .key-filters-items.key-filters-items { justify-content: flex-start }
Fix: Override to normal. */
[class*='c-trend-value-key-filter'][class*='key-filters-items'] {
justify-content: normal !important;
}
/* FIX 27-F: ValuePicks container max-width — PROD is none
Deep inspection (all viewports): PROD max-width = none
LOCAL: 100% from Batch 26 (FIX 26-B, 26-C set max-width: 100%)
Removing the max-width constraint to match PROD.
Note: Batch 26 FIX 26-B/26-C targeted [class*='c-trend-value-key-filter']
(the PARENT), not the key-filters-items child. But the deep inspection shows
the combined element has max-width: 100%. This override ensures it's none. */
[class*='c-trend-value-key-filter'] {
max-width: none !important;
}
/* FIX 27-G: Footer tablet min-height — PROD is 235px
Deep inspection tablet: PROD min-height = 235px, LOCAL = 0px
The Footer SCSS has min-height: 235px at desktop, but the mobile query
sets min-height: auto. At tablet (768-1024px), neither applies correctly.
The desktop min-height: 235px should apply at tablet (768px+).
Fix: Explicitly set min-height at tablet to match PROD. */
@media (min-width: 768px) and (max-width: 1024px) {
footer {
min-height: 235px !important;
}
}
/* END BATCH 27 */
/* ===================================================================
BATCH 28 — GrayBlock Width Parity (Mobile + Tablet)
Date: 2026-02-13
Impact: Mobile VP width (327px → 337px to match PROD 337px)
Tablet GrayBlock width (913px → 945px to match PROD)
Root Causes (confirmed by live Playwright diagnostics on PROD vs LOCAL):
1. FIX 22-A added tablet side margin (12px) + padding (4px) that PROD doesn't have
PROD tablet: GrayBlock margin=16px 0 0, pad=0 → w=945
LOCAL with 22-A: margin=16px 12px 0, pad=0 4px → w=913 (-32px)
2. FIX 22-B added mobile side margin (8px) that PROD doesn't have
PROD mobile: GrayBlock margin=0 → w=345
LOCAL with 22-B: margin=8px 8px 0 → w=329 (-16px)
3. GrayBlock-content padding at mobile: PROD=4px, LOCAL=8px
PROD mobile: gbContent pad=4px → VP inner=337px
LOCAL mobile: gbContent pad=8px → VP inner=313px (-24px)
Fixes:
FIX 28-A: Revoke FIX 22-A (done inline above — commented out)
FIX 28-B: Revoke FIX 22-B (done inline above — commented out)
FIX 28-C: GrayBlock-content mobile padding 4px (below)
=================================================================== */
/* FIX 28-C: GrayBlock-content mobile padding — PROD uses 4px, not 8px.
Live diagnostic at 375px mobile viewport:
PROD gbContent: w=345, pad=4px, box-sizing=border-box → inner=337px
LOCAL gbContent: w=329, pad=8px → inner=313px
The SCSS sets padding:8px at all viewports. PROD overrides to 4px at mobile.
This override targets mobile (<768px) only — tablet keeps 8px (confirmed matching PROD). */
@media (max-width: 767px) {
[class*='GrayBlock_c-gray-block-content'] {
padding: 4px !important;
}
}
/* END BATCH 28 */
/* ===================================================================
BATCH 29 — Footer Height + GrayBlock Margin Corrections
Date: 2026-02-13
Impact: Tablet footer -32px (326→294 to match PROD),
Mobile GrayBlock margin-top 8→0px to match PROD
Root Causes (confirmed by live Playwright diagnostics on PROD vs LOCAL):
1. RC#66 at ~line 2684 forced tablet footer to 326px — BUT PROD is actually
294px (natural SCSS height: 293.90625px). WRONG assumption.
FIX 29-A: Commented out RC#66 inline above.
2. FIX 20-A at ~line 3087 set mobile GrayBlock margin-top: 8px — BUT PROD
mobile GrayBlock margin-top is actually 0px (not 8px as assumed).
FIX 29-B: Revised FIX 20-A inline above to use 0px.
=================================================================== */
/* END BATCH 29 */
/* ===================================================================
BATCH 30 — Footer Height Correction + CDP Diagnostics
Date: 2026-02-13
Root Causes (confirmed by FRESH CDP measurements via Chrome DevTools Protocol):
1. FIX 30-A (REVOKED → FIX 30-B): RC#66 restored 326px tablet footer height
based on S24 parity-data. BUT fresh CDP measurement proves PROD footer
= 293.906px (NOT 326px). FIX 30-B reverts RC#66 back to commented-out state.
The SCSS natural height (293.90625px) IS correct for tablet.
CDP Layout Comparison (tablet 1024×768):
PROD: footer boundingHeight=293.906px, bodyHeight=1991px
LOCAL: footer boundingHeight=293.906px (natural), bodyHeight=1919px
=================================================================== */
/* FIX 30-B: RC#66 reverted — see ~line 2684. No new CSS rules needed. */
/* END BATCH 30 */
/* ===================================================================
BATCH 31 — ValuePicks Tablet Layout Correction (CDP-verified)
Date: 2026-02-13
Sweep: S25 → S26 (target)
Root Cause Analysis (CDP measurements at tablet 1024×768):
┌───────────────────┬───────────────────────┬───────────────────────┐
│ Property │ PROD │ LOCAL (before B31) │
├───────────────────┼───────────────────────┼───────────────────────┤
│ items display │ block (w=140) │ flex (w=929) │
│ prop flex │ 0 0 auto │ 0 0 14.2857% │
│ prop width │ 150px │ 132.7px │
│ prop margin │ 6px 0 0 │ 0px │
│ tile width │ 140px (100% of prop) │ 160.281px (forced) │
│ tile height │ 248.4px (auto) │ 256px (forced) │
│ container scroll │ 1050px (overflows) │ 929px (no scroll) │
└───────────────────┴───────────────────────┴───────────────────────┘
FIX 31-A: Revised FIX 15-D inline above — flex: 0 0 150px (explicit PROD match)
FIX 31-B: Tablet tile width override — 100% (was 160.281px globally)
FIX 31-C: Tablet tile height override — auto (was 256px globally)
FIX 31-D: Tablet property margin — 6px 0 0 (was 0px)
FIX 31-E: Tablet tile padding — 10px 0 5px (was 0px, PROD CDP verified)
=================================================================== */
/* FIX 31-B + 31-C + 31-E: Tablet VP tile — match PROD (vendor-widgets) width: 100%
PROD vendor-widgets tile SCSS has width: 100% (not 160.281px like sk-app).
FIX 15-E sets width: 160.281px !important globally (correct for desktop).
At tablet, override back to 100% to match PROD behavior:
- Property (150px border-box) → content area 140px → tile 100% = 140px ✅
- Height: auto (PROD tile height is content-driven at 248px, not forced 256px)
- Padding: 10px 0 5px (PROD CDP verified, LOCAL was 0px) */
@media (max-width: 1024px) {
[class*='key-filters-filters-tile'] {
width: 100% !important;
height: auto !important;
/* FIX 31-E: Tile padding at tablet — PROD has 10px 0 5px, LOCAL has 0px
CDP verified: PROD tile padding: "10px 0px 5px", LOCAL: "0px"
FIX 32-A: Use longhand to ensure all four get !important (shorthand was
not overriding SCSS longhand padding-right/padding-left) */
padding-top: 10px !important;
padding-right: 0 !important;
padding-bottom: 5px !important;
padding-left: 0 !important;
}
/* FIX 31-D: Property margin-top: 6px at tablet — PROD has margin: 6px 0 0 */
[class*='c-trend-value-key-filter'] > [class*='c-trend-value-key-filter-property'] {
margin-top: 6px !important;
}
}
/* END BATCH 31 */
/* =====================================================================
BATCH 33: S33 — Table Cell Height Constraints + Dead Code Cleanup
Session 33 (2026-02-14)
Baseline: Desktop 90.43%, Tablet 84.64%, Mobile 83.68% (S32)
ROOT CAUSE ANALYSIS:
- sk-app UpcomingMatchesItems cells have padding: 8px + line-height: 18.06px
but NO height constraint → rows render at ~55.8px
- vendor-widgets (PROD) cells have height: 35px !important + max-height: 35px
+ overflow: hidden → rows render at ~35px + borders ≈ ~49px visible
- Delta: ~6.8px per row × 10 rows = ~68px + header diff ≈ 81px extra table height
- This accumulates into Y-position shifts affecting ALL scroll positions
FIX 33-A: Cell padding reduction — moved to existing infinite-scroll rule (line ~2288)
Updated padding: 8px → 2px 8px to match PROD's Table.module.scss >mid behavior.
Added line-height: 1.1 and overflow: hidden for content clipping.
The infinite-scroll rule has specificity 0,2,4 which beats all CSS Modules rules.
FIX 33-B: Footer mobile min-height — REMOVED (min-height:626px won't shrink
content that's naturally 635px, so it would be a no-op)
===================================================================== */
/* END BATCH 33 */
/* VISUAL PARITY FIX: Restore .sk-app layout class */
.sk-app {
min-height: 100vh;
display: flex;
flex-direction: column;
position: relative;
}
/* =====================================================================
BATCH 34: VP FIXES PORTED FROM LEGACY (2026-02-18)
Source: sk.web.react.legacy-styles/packages/sk-app/src/styles/css/index.css
Lines 3203-3497 (VP-34 through VP-MOBILE-QPH)
These fixes were developed and validated in the legacy-styles repo but
never ported to master. They address dev-only rendering artifacts and
CSS differences between LOCAL dev build and PROD.
SKIPPED (reverted in legacy — caused regressions):
- VP-37: Hide API errors (exposed gray bg through PermissionDialog overlay)
- VP-43: Hide CookieConsent desktop (same regression pattern)
- VP-60: Hide Proxy Error alerts (same regression pattern)
===================================================================== */
/* VP-34: Mobile buttons container padding/height fix
Without padding:8px, container renders at 40px tall (buttons only).
With padding:8px, container renders at 56px tall matching PROD. */
@media (max-width: 767px) {
header [class*='c-header-buttons'][class*='c-header-buttons'],
header [class*='Buttons_c-header-buttons'][class*='Buttons_c-header-buttons'],
[class*='Header_c-header'] [class*='c-header-buttons'][class*='c-header-buttons'] {
padding: 8px !important;
height: auto !important;
}
}
/* VP-35: Hide ReactQuery DevTools Panel
SINGLE LARGEST source of pixel diff — panel covers bottom ~65% of viewport.
Desktop band 11: 74.2% diff, Tablet band 11: 74.9% diff, Mobile band 8: 79.9% diff.
PROD does NOT include this panel. LOCAL dev build renders it via QueryProvider.jsx. */
#ReactQueryDevtoolsPanel,
.ReactQueryDevtoolsPanel,
[id='ReactQueryDevtoolsPanel'],
[class*='ReactQueryDevtools'] {
display: none !important;
visibility: hidden !important;
height: 0 !important;
width: 0 !important;
overflow: hidden !important;
opacity: 0 !important;
pointer-events: none !important;
}
/* Also hide the ReactQuery devtools toggle button if present */
[aria-label='Open React Query Devtools'],
[aria-label='Close React Query Devtools'],
button[class*='ReactQueryDevtools'] {
display: none !important;
}
/* VP-36: Hide webpack-dev-server error overlay iframe
webpack-dev-server injects a full-viewport invisible iframe at z-index max
for HMR error catching. Exists ONLY on LOCAL. Affects sub-pixel rendering. */
iframe[style*='z-index: 2147483647'],
iframe[style*='z-index:2147483647'],
iframe[style*='position: fixed'][style*='width: 100%'][style*='height: 100%'] {
display: none !important;
visibility: hidden !important;
width: 0 !important;
height: 0 !important;
pointer-events: none !important;
}
/* VP-38 + VP-42: Fix html background-color and color to match PROD
PROD html: bg=transparent, color=rgb(0,0,0)
LOCAL html: bg=transparent (already correct), color=#5b5b5b (wrong)
This overrides the color set at line ~220 */
html {
background-color: transparent !important;
color: rgb(0, 0, 0) !important;
}
/* VP-41: Fix #root position to static (PROD=static, LOCAL had relative)
position:relative creates a stacking context that affects z-index and
sub-pixel rendering. PROD uses static. Overrides line ~1781. */
#root {
position: static !important;
}
/* VP-45: Mobile burger menu icon bg — white to match PROD
LOCAL burger icon span has bg=transparent (invisible middle line).
PROD has bg=rgb(255,255,255) (white visible hamburger line). */
[class*='Header_c-header-burger-btn-icon'] {
background-color: rgb(255, 255, 255) !important;
}
/* VP-46: PermissionDialog title line-height responsive fix
Line-heights are SWAPPED between viewports in React 18 vs pre-migration. */
@media (max-width: 767px) {
[class*='PermissionDialog_c-prompt-notification-title'] {
line-height: 19.35px !important;
}
}
@media (min-width: 768px) {
[class*='PermissionDialog_c-prompt-notification-title'] {
line-height: 21.1302px !important;
}
}
/* VP-51: UpcomingMatches keyhint wrapper margin-right 8px (PROD) */
[class*='UpcomingMatches_c-live-keyhint-wrapper'],
[class*='c-live-keyhint-wrapper'] {
margin-right: 8px !important;
}
/* VP-52: Menu wrap flex-basis: PROD=0% (not auto) */
[class*='Menu_c-header-menu-wrap__'][class*='Menu_c-header-menu-wrap__'],
[class*='c-header-menu-wrap__'][class*='c-header-menu-wrap__'],
.c-header-menu-wrap.c-header-menu-wrap {
flex: 1 1 !important;
}
/* VP-53: LegendIcon c-key-legend line-height + border-color */
span[class*='LegendIcon_c-key-legend'][class*='LegendIcon_c-key-legend'],
[class*='c-key-legend'][class*='c-key-legend'] {
line-height: 20.64px !important;
border-color: rgb(91, 91, 91) !important;
}
/* VP-54: Body secondary buttons min-width and overflow
PROD: min-width=0, overflow=visible. LOCAL forced 90px and hidden. */
.c-body .o-btn--secondary,
.c-body [class*='Button_o-btn--secondary'],
main .o-btn--secondary,
main [class*='Button_o-btn--secondary'],
.c-block .o-btn--secondary,
.c-block [class*='Button_o-btn--secondary'] {
min-width: 0px !important;
overflow: visible !important;
}
/* VP-72: LegendIcon color, font-weight, text-align */
span[class*='LegendIcon_c-key-legend'][class*='LegendIcon_c-key-legend'] {
color: rgb(91, 91, 91) !important;
font-weight: 400 !important;
text-align: center !important;
}
/* VP-73: Table TrendIcon container */
[class*='UpcomingMatches'] [class*='TrendIconLetter_c-trendIcon-container'],
[class*='UpcomingMatches'] [class*='c-trendIcon-container'],
table [class*='TrendIconLetter_c-trendIcon-container'],
table [class*='c-trendIcon-container'] {
line-height: 18.06px !important;
font-size: 14px !important;
font-weight: 400 !important;
color: rgb(91, 91, 91) !important;
}
/* VP-73: Inner badge in table context */
[class*='UpcomingMatches'] [class*='c-trendIcon']:not([class*='container']),
table [class*='c-trendIcon']:not([class*='container']) {
font-weight: 600 !important;
color: rgb(0, 0, 0) !important;
border-radius: 50% !important;
}
/* VP-MOBILE-QPH: quick-pick-header padding+bg fix for mobile
PROD: padding=8px, bg=rgb(245,245,245). LOCAL: padding=32px, bg=transparent.
52px difference PER header × 5 headers = 260px cumulative shift on mobile. */
@media (max-width: 767px) {
[class*='UpcomingMatchesItems_c-quick-pick-header']:not([class*='text']) {
padding: 8px !important;
background-color: rgb(245, 245, 245) !important;
}
}
/* END BATCH 34 */
/* =====================================================================
BATCH 35 - VISUAL PARITY COMPREHENSIVE FIXES (Feb 16, 2026)
CSS Intelligence-driven: Card reversal, SeoTitle, SportFilter, Carousel
===================================================================== */
/* FIX: SeoTitle h1 layout — PROD uses display:inline, 16px bold
LOCAL renders as display:block which adds vertical displacement (+719px y-shift).
PROD confirmed via css-property-diff.json: display:inline, font-size:16px, weight:600 */
h1[class*='SeoTitle'],
[class*='SeoTitle_c-seo-title'],
[class*='c-seo-title'],
[class*='SeoTitle'][class*='SeoTitle'] {
display: inline !important;
height: auto !important;
width: auto !important;
font-size: 16px !important;
font-weight: 600 !important;
margin: 10.72px 0px !important;
line-height: 20.64px !important;
}
/* FIX: SportFilter header-right sub-element — PROD=flex 315x40
LOCAL renders as block 1208x178px. Only target sub-element (NOT root!).
Root display:flex caused VP-64 regression (-11.84pp). */
[class*='SportFilter_c-sport-filter-header-right'][class*='SportFilter_c-sport-filter-header-right'],
[class*='c-sport-filter-header-right'][class*='c-sport-filter-header-right'] {
display: flex !important;
width: 315px !important;
height: 40px !important;
align-items: center !important;
z-index: 109 !important;
}
/* FIX: SportFilter header-right-picker sub-element */
[class*='SportFilter_c-sport-filter-header-right-picker'][class*='SportFilter_c-sport-filter-header-right-picker'],
[class*='c-sport-filter-header-right-picker'][class*='c-sport-filter-header-right-picker'] {
width: 300px !important;
display: flex !important;
font-size: 14px !important;
color: rgb(91, 91, 91) !important;
}
/* FIX: Carousel scroll container — PROD=flex, position:relative
SCSS has correct values but theme/global CSS overrides to block/static.
CSS Intelligence: PROD 1171x79 display:flex, LOCAL 1208x83 display:block */
[class*='Carousel_c-carousel-scroll'],
[class*='c-carousel-scroll'] {
display: flex !important;
position: relative !important;
overflow-x: auto !important;
overflow-y: hidden !important;
border: 0 none !important;
border-radius: 0 !important;
scroll-behavior: smooth !important;
font-weight: 400 !important;
}
/* END BATCH 35 */
/* =====================================================================
BATCH 36: UpcomingMatches Row Height + First Column Padding (CORRECTED)
Pipeline: viewport-capture-1771172028214 (92.05%)
Investigation: cell3-detail.cjs + compare-qp.cjs puppeteer comparison
Root causes identified via side-by-side element inspection:
1. Team logo ![]()
has display:block (global CSS reset) vs PROD display:inline
→ Image stacks below text making row 58px instead of 49px
2. First column (team name + MembersOnly cell) needs padding-left:40px
→ PROD first td/th: padding 8px 8px 8px 40px
3. th line-height:15.4px (LOCAL) vs 18.06px (PROD)
===================================================================== */
/* FIX 36-A: Team logo image display — override global img{display:block}
ROOT CAUSE: A global CSS reset sets all ![]()
to display:block.
In quick-pick table, team logo images should be display:inline so they
sit beside the team name text instead of stacking below it.
PROD: ![]()
display:inline, vertical-align:middle → row height 49px
LOCAL: ![]()
display:block → text(14px) + image(25px) = 39px link, 58px row
This single fix saves ~9px per row × 6+ rows = 54px+ total savings. */
[class*='c-quick-pick-body'] img[class*='c-team-logo'],
[class*='c-quick-pick-body'] [class*='c-team'] img,
[class*='c-quick-pick-body'] [class*='link-button'] img,
[class*='c-quick-pick-body'] [class*='c-team-link'] img {
display: inline !important;
}
/* FIX 36-B: Table head cell line-height + first column padding
PROD th: line-height:18.06px, padding:8px 8px 8px 40px, height:35px
LOCAL th: line-height:15.4px, padding:8px, height:32px
The 40px left padding on the first th matches PROD's indented header style.
UPDATED Batch 37: Changed min-width:769px → 768px to include tablet viewport. */
@media (min-width: 768px) {
[class*='c-quick-pick-body'][class*='c-quick-pick-body'] table.sk-table th {
line-height: 18.06px !important;
}
[class*='c-quick-pick-body'][class*='c-quick-pick-body'] table.sk-table th:first-child {
padding: 8px 8px 8px 40px !important;
}
}
/* FIX 36-C: First column td left padding
PROD first td (MembersOnly/team cell): padding 8px 8px 8px 40px
LOCAL first td: padding 8px (uniform from Batch 33-A)
The 40px left padding on the first data column matches PROD's indented layout.
UPDATED Batch 37: Changed min-width:769px → 768px to include tablet viewport. */
@media (min-width: 768px) {
[class*='c-quick-pick-body'] table.sk-table td:first-child {
padding: 8px 8px 8px 40px !important;
}
}
/* END BATCH 36 */
/* =====================================================================
BATCH 37: REVERTED (Test 15 regression analysis)
Reverted because Test 15 showed a broad regression across ALL viewports
including Desktop (which Batch 37 didn't target). Root cause analysis:
- Desktop dropped 13-20% across ALL scroll positions — CSS can't cause this
- Tablet had 2 screenshot timeouts (25%, 50%) — unreliable captures
- Mobile 0% was STABLE (+0.06%) — only reliable data point
- Conclusion: PROD content changed between Test 12 (Feb 12) and Test 15 (Feb 19)
- The 7-day gap means different games/scores/data displayed
- Batch 37 fixes were architecturally correct but regression is content-driven
- Will re-apply selectively after establishing new baseline with stable PROD content
===================================================================== */
/* =====================================================================
BATCH 38: REVERTED (Test 18 regression analysis)
Reverted because Test 18 showed regressions across ALL viewports:
Desktop: 77.39% → 77.7% (+0.3% marginal)
Tablet: 70.22% → 68.1% (-2.1% REGRESSION)
Mobile: 80.96% → 78.0% (-2.96% REGRESSION — dropped below 80% threshold!)
Root cause analysis:
- FIX 38-A (scrollbar hide): Changed LOCAL tablet from 753px → 768px,
causing full page reflow. Every element repositioned = MORE pixel diffs
at every scroll position (-3 to -4% per tablet scroll position).
- FIX 38-B (ValuePicks min-width:206px): Applied globally including mobile
where PROD ValuePicks is only 126px wide. Created 80px over-correction
on mobile, major regression on mobile viewport.
- FIX 38-C (overflow-x:hidden): No measurable impact.
Key lesson: Hiding scrollbars to normalize viewport width is COUNTERPRODUCTIVE.
The layout reflow from width changes creates more pixel differences than
the original scrollbar width gap. Accept the 32px tablet width difference
as a viewport-level artifact, not a CSS fix target.
===================================================================== */
/* =====================================================================
BATCH 39: Viewport-scoped CSS fixes (lessons from Batch 38 applied)
Target: Desktop ValuePicks width (205→199px, Δ-6px)
Strategy: Apply min-width ONLY at ≥768px to avoid mobile over-correction
Mobile ValuePicks is 126px on PROD — must NOT apply desktop widths there
===================================================================== */
/* FIX 39-A: ValuePicks c-trend min-width for desktop+tablet ONLY
Issue: PROD=205.297px, LOCAL=199px (desktop), PROD=205.297px, LOCAL=204px (tablet)
Fix: Set min-width:206px at tablet+ viewport (≥768px) */
@media (min-width: 768px) {
[class*='ValuePicks_c-trend'] {
min-width: 206px !important;
}
}
/* FIX 39-B: REMOVED (Test 21 proved counterproductive)
Original: max-height:627px on mobile footer to constrain 8.3px overshoot
Problem: PROD footer height is DYNAMIC (changed from 627px to 642px due to
live content drift). Our 627px cap now clips 15px → HIGH severity mismatch.
Footer height differences are CONTENT-DRIVEN, not CSS-driven.
A static max-height will always be wrong when content changes. */
/* END BATCH 39 */
/* =====================================================================
BATCH 40 FIX #2: Eliminate vertical offset from extra wrapper elements
CRITICAL DOM STRUCTURAL DIFFERENCE:
PROD: ticker sits DIRECTLY in layout-container (NO wrapper elements)
LOCAL: 3 extra wrappers (ticker-global-header → c-cards → c-cards-carousel)
Segment analysis shows ALL viewports have 100% segment parity — the ENTIRE
pixel mismatch is from vertical positional offset, not CSS rendering.
Measurements from segment analysis:
Desktop: PROD My Picks Y=171, LOCAL Y=180 (9px offset starts here)
Mobile: PROD VPK Filter Y=154, LOCAL Y=171 (17px offset starts here)
Fix: Strip borders, explicit heights, and padding from all 3 wrapper
elements so they become transparent pass-through containers.
Keep overflow:hidden to prevent 129 ticker items from spilling.
Batch 12 visual styling (background, color, width, flex) preserved
since those properties are NOT re-declared here.
===================================================================== */
/* Wrapper 1: ticker-global-header (also has staticHeaderWrapper class)
PROD equivalent: this element does NOT EXIST on PROD
SCSS sets: height:79.47px, border:1px, overflow:hidden
Override: make transparent container, keep overflow clipping */
[class*='ticker-global-header'] {
overflow: hidden !important;
border: none !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
margin: 0 !important;
padding: 0 !important;
}
/* Wrapper 2: Ticker c-cards container
PROD equivalent: this element does NOT EXIST on PROD
SCSS sets: height:79-81.47px, border:1px, padding:0 4px
Override: transparent container */
[class*='Ticker_c-cards'] {
overflow: hidden !important;
border: none !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
margin: 0 !important;
padding: 0 !important;
max-width: 100% !important;
width: 100% !important;
}
/* Wrapper 3: c-cards-carousel height/border reset
PROD equivalent: this element does NOT EXIST on PROD
Overrides earlier Batch 11 height:81.4688px → auto
Keeps Batch 12 visual overrides (background, color, width, flex) */
[class*='c-cards-carousel'] {
border: none !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
margin: 0 !important;
padding: 0 !important;
}
/* END BATCH 40 FIX #2 */
/* ========================================================================
BATCH 40 FIX #3: Text-transform override for ticker card text
========================================================================
ROOT CAUSE: SCSS modules apply text-transform:uppercase to ticker card
wrappers (c-ticker-final-wrapper, c-ticker-live-wrapper) and date elements.
PROD renders mixed case: "Final", "Set 2", "19 Feb"
LOCAL renders uppercase: "FINAL", "SET 2", "19 FEB"
FIX: Override text-transform to none to match PROD rendering.
EVIDENCE: rapid-summary.json bodyTextPreview comparison
======================================================================== */
[class*='c-ticker-final-wrapper'] {
text-transform: none !important;
}
[class*='c-ticker-live-wrapper'] {
text-transform: none !important;
}
[class*='c-card-date'] {
text-transform: none !important;
}
/* END BATCH 40 FIX #3 */
/* =====================================================================
PHASE 1 (BATCH 41) — P0 CRITICAL VISUAL PARITY FIXES
Items 3, 5, 15, 16, 19 from 20-item workplan
Baseline: 77.46% parity | 695,017/3,083,520 mismatch pixels
Component chain: Items.jsx → BlockTwoFilters → Block → SeoTitle
Items.jsx → TopPicks → ValuePickCard
TodaysTopPicks.jsx → TicketsBlock → GrayBlock
===================================================================== */
/* P1-FIX-1: Ticker wrapper whitespace elimination (Item 3)
Batch 40 Fix #2 reset height/padding/margin/border on ticker wrappers.
Residual vertical offset from inline-level whitespace text nodes inside
wrapper containers. Setting line-height:0 and font-size:0 on wrappers
prevents text-node whitespace from generating vertical gaps.
Child ticker cards have their own explicit line-height/font-size. */
[class*='ticker-global-header'],
[class*='Ticker_c-cards'],
[class*='c-cards-carousel'] {
line-height: 0 !important;
font-size: 0 !important;
}
/* P1-FIX-2: My Picks (TicketsBlock) container alignment (Item 5)
PROD "My Picks" (TicketsBlock → GrayBlock) at 768px viewport:
- box-shadow with rgba(38,38,38,0.2) spread
- z-index layering above content
- min-height:0 to prevent expansion beyond content
GrayBlock margin-top already set (line ~2090). This addresses
the content wrapper structural properties. */
[class*='c-pick-ticket-wrap'] {
min-height: 0 !important;
box-sizing: border-box !important;
overflow: visible !important;
}
/* P1-FIX-3: Popular Picks header — Block with-top-margin (Item 15)
Block_c-block-with-top-margin SCSS: padding:spacing(4) spacing(3) = 12px 8px.
border-radius already 0px (line 501). margin-top: spacing(5) = 20px.
Ensuring display:block for consistent block-level header rendering
and preventing any flex-based shrinkage from parent. */
[class*='Block_c-block'][class*='c-block-with-top-margin'] {
display: block !important;
min-height: 0 !important;
}
/* P1-FIX-4: BlockTwoFilters header flex alignment at tablet (Item 15)
At >=768px, PROD renders pick-lineup-block-header as flex row
with 30px height, centered items, and white text.
Mobile rule at line 1184 sets display:block; this ensures tablet
maintains flex layout. Uses :not() guards to exclude sub-elements. */
@media (min-width: 768px) {
[class*='c-pick-lineup-block-header']:not([class*='containt']):not([class*='combobox']):not([class*='input']) {
display: flex !important;
height: 30px !important;
min-height: 0 !important;
align-items: center !important;
flex-wrap: nowrap !important;
}
}
/* P1-FIX-5: TopPicks card grid content area (Item 16)
TopPicks control renders .sk-top-picks with PickLineup.module.scss
which sets display:flex, flex-wrap:wrap, bg from theme var.
PROD page-level TopPicks.module.scss adds padding:5px on the grid.
Ensuring the card grid wrapper has consistent padding and
background to match PROD content area appearance. */
.sk-top-picks,
[class*='PickLineup_c-top-picks'] {
padding: 5px !important;
}
/* P1-FIX-6: SeoTitle container constraint removal (Item 19)
Batch 35 (line 4438) fixed: display:inline, font-size:16px,
font-weight:600, margin:10.72px 0px, line-height:20.64px.
This removes any max-width/max-height constraints from parent
layout that might displace the h1 relative to PROD positioning.
Also ensures no unexpected padding inflates the element box. */
h1[class*='SeoTitle'],
[class*='SeoTitle_c-seo'] {
max-width: none !important;
max-height: none !important;
padding: 0 !important;
box-sizing: content-box !important;
}
/* END PHASE 1 (BATCH 41) */
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.Button_o-btn__EJi6B{padding:8px 20px;border-radius:25px;border-radius:var(--sk-btn-border-radius, 25px);font-family:"Open Sans", sans-serif;font-family:var(--sk-font-family, "Open Sans", sans-serif);font-size:14px;font-weight:400;display:inline-block;vertical-align:middle;margin:0;overflow:visible;text-align:center;line-height:14px;border:1px solid rgba(0,0,0,0);-webkit-user-select:none;-moz-user-select:none;user-select:none;text-decoration:none;position:relative;cursor:pointer;transition:300ms;transition:var(--sk-transition-duration, 300ms)}.Button_o-btn__EJi6B:hover,.Button_o-btn__EJi6B:focus,.Button_o-btn__EJi6B:active,.Button_o-btn__EJi6B:visited{text-decoration:none}.Button_o-btn__EJi6B:not(:disabled){cursor:pointer}.Button_o-btn__EJi6B:disabled{background-color:#e9ecef;background-color:var(--sk-disabled-color, #e9ecef);color:#6c757d;color:var(--sk-disabled-text-color, #6c757d);border:1px solid #e9ecef;border:1px solid var(--sk-disabled-color, #e9ecef)}.Button_o-btn--tertiary__KXh21{background-color:var(--sk-color-background-base);background-color:var(--sk-background-color, #ffffff);color:var(--sk-color-text-primary);color:var(--sk-text-color, #5b5b5b);border-radius:25px}.Button_o-btn--tertiary__KXh21:hover{background-color:var(--sk-color-background-base);background-color:var(--sk-background-color, #ffffff);color:var(--sk-color-text-primary);color:var(--sk-text-color, #5b5b5b);border:1px solid var(--sk-color-text-primary);border:1px solid var(--sk-text-color, #5b5b5b)}.Button_o-btn--tertiary__KXh21:disabled:hover{background-color:#e9ecef;background-color:var(--sk-disabled-color, #e9ecef);color:#6c757d;color:var(--sk-disabled-text-color, #6c757d)}.Button_o-btn--secondary__6AHIq{display:inline-block;background-color:var(--sk-color-brand-secondary);background-color:var(--sk-secondary-color, #e67917);color:#ffffff;color:var(--sk-btn-primary-text-color, #ffffff);border:1px solid var(--sk-color-brand-secondary);border:1px solid var(--sk-secondary-color, #e67917);border-radius:25px}.Button_o-btn--secondary__6AHIq:hover{background-color:var(--sk-color-background-base);background-color:var(--sk-background-color, #ffffff);color:var(--sk-color-brand-secondary);color:var(--sk-secondary-color, #e67917);border:1px solid var(--sk-color-brand-secondary);border:1px solid var(--sk-secondary-color, #e67917)}.Button_o-btn--secondary__6AHIq:disabled:hover{background-color:#e9ecef;background-color:var(--sk-disabled-color, #e9ecef);color:#6c757d;color:var(--sk-disabled-text-color, #6c757d)}.Button_o-btn--small__DWu\+a{padding:4px 12px;font-size:12px}.Button_o-btn--compact__usn0s{padding:8px;font-size:12px;line-height:12px}.Button_o-btn--small__DWu\+a.Button_o-btn--icon__8nwOU{padding:4px}.Button_o-btn--big__Uj5wJ{padding:9px 16px}.Button_o-btn--full-width__p02Y2{width:100%;display:block}.Button_o-btn__loading__VmDIw{opacity:.6;pointer-events:none}.Button_o-btn--icon__8nwOU{padding:6px 7px}.Button_o-btn__loader__FFha\+{position:absolute;left:0;top:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center}.Button_o-btn-spinner__a3DRz{position:absolute;top:0;left:50%;margin-left:-15px}.Button_o-btn-loading__wCTOY{opacity:.5}.Button_o-btn__EJi6B>div{display:block;white-space:nowrap;line-height:inherit}.Button_o-btn--primary__LbqvH{background-color:#e67917;background-color:var(--sk-btn-primary-bg, #e67917);color:#ffffff;color:var(--sk-btn-primary-text-color, #ffffff);border:1px solid #e67917;border:1px solid var(--sk-btn-primary-border, #e67917);border-radius:25px;border-radius:var(--sk-btn-border-radius, 25px)}.Button_o-btn--primary__LbqvH:hover:not(:disabled),.Button_o-btn--primary__LbqvH:focus:not(:disabled){background-color:#d06000;background-color:var(--sk-btn-primary-bg-hover, #d06000);color:#ffffff;color:var(--sk-btn-primary-text-hover, #ffffff)}.Button_o-btn--primary__LbqvH:disabled:hover{background-color:#e9ecef;background-color:var(--sk-disabled-color, #e9ecef);color:#6c757d;color:var(--sk-disabled-text-color, #6c757d)}.Button_o-btn--minor__FHM5P{background-color:var(--sk-color-brand-secondary);background-color:var(--sk-secondary-color, #e67917);color:#ffffff;color:var(--sk-btn-primary-text-color, #ffffff);border:1px solid var(--sk-color-brand-secondary);border:1px solid var(--sk-secondary-color, #e67917);border-radius:25px}.Button_o-btn--minor__FHM5P:hover:not(:disabled),.Button_o-btn--minor__FHM5P:focus:not(:disabled){background-color:#FF6B00;background-color:var(--sk-secondary-color-hover, #FF6B00);color:#ffffff;color:var(--sk-btn-primary-text-color, #ffffff)}.Button_o-btn--blue__IDw86{background-color:var(--sk-color-brand-info);background-color:var(--sk-info-color, #55c2c2);color:var(--sk-color-text-primary);color:var(--sk-text-color, #ffffff);border:1px solid var(--sk-color-brand-info);border:1px solid var(--sk-info-color, #55c2c2);border-radius:25px}.Button_o-btn--blue__IDw86:hover{background-color:#128293;background-color:var(--sk-info-color-hover, #128293);color:var(--sk-color-text-primary);color:var(--sk-text-color, #ffffff)}.Button_o-btn--gray__KTD0d{background-color:#f9f9f9;background-color:var(--sk-panel-content-background-color, #f9f9f9);color:var(--sk-color-brand-secondary);color:var(--sk-secondary-color, #e67917);border-radius:25px}.Button_c-button__tbDYY{border-radius:5px;border-radius:var(--sk-border-radius, 5px)}
/**
* Custom Icon System CSS - Font Awesome Replacement
*
* Base styles for the custom SVG icon system.
* Provides consistent sizing, hover states, and interactive styles.
*/
/* Base icon styles */
.sk-icon {
display: inline-block;
/* VISUAL PARITY FIX 2025-12-22: Match FontAwesome vertical-align (-1.75px vs middle) */
vertical-align: -1.75px;
line-height: 1;
transition: all 0.2s ease-in-out;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
/* VISUAL PARITY FIX 2025-12-22: Match PROD icon margin (8px vs 12px) */
margin-right: 8px;
}
/* Size classes for consistent dimensions */
/* VISUAL PARITY FIX 2025-12-19: Match FontAwesome sizing for visual consistency */
/* FA uses 1em base which at 14px font-size = 14px, we match PROD icon sizes */
.sk-icon--sm {
width: 12px;
height: 12px;
font-size: 12px; /* FA compatibility */
}
.sk-icon--md {
width: 14px; /* PROD uses 14px icons in most places, not 16px */
height: 14px;
font-size: 14px; /* FA compatibility - matches PROD line-height */
}
.sk-icon--lg {
width: 18px; /* Slightly smaller to match PROD proportions */
height: 18px;
font-size: 18px; /* FA compatibility */
}
.sk-icon--xl {
width: 24px;
height: 24px;
}
.sk-icon--xxl {
width: 32px;
height: 32px;
}
/* Interactive icon styles */
.sk-icon--interactive {
cursor: pointer;
}
.sk-icon--interactive:hover {
opacity: 0.8;
transform: scale(1.05);
}
.sk-icon--interactive:active {
transform: scale(0.95);
}
.sk-icon--interactive:focus {
outline: 2px solid #007ACC;
outline: 2px solid var(--focus-color, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, #007ACC)))));
outline-offset: 2px;
border-radius: 2px;
}
/* Icon color variants */
.sk-icon--primary {
color: #007ACC;
color: var(--primary-color, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, #007ACC)))));
}
.sk-icon--secondary {
color: #6C757D;
color: var(--secondary-color, var(--sk-color-6c757d, var(--sk-color-6c757d, #6C757D)));
}
.sk-icon--success {
color: #28A745;
color: var(--success-color, var(--sk-color-28a745, var(--sk-color-28a745, #28A745)));
}
.sk-icon--warning {
color: #FFC107;
color: var(--warning-color, var(--sk-color-ffc107, var(--sk-color-ffc107, #FFC107)));
}
.sk-icon--danger {
color: #DC3545;
color: var(--danger-color, var(--sk-color-dc3545, var(--sk-color-dc3545, #DC3545)));
}
.sk-icon--info {
color: #17A2B8;
color: var(--info-color, var(--sk-color-17a2b8, var(--sk-color-17a2b8, #17A2B8)));
}
/* Icon button style (for clickable icons) */
.sk-icon-button {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 4px;
border: none;
background: none;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.2s ease-in-out;
}
.sk-icon-button:hover {
background-color: rgba(0, 0, 0, 0.05);
background-color: var(--hover-bg-color, rgba(0, 0, 0, 0.05));
}
.sk-icon-button:active {
background-color: rgba(0, 0, 0, 0.1);
background-color: var(--active-bg-color, rgba(0, 0, 0, 0.1));
}
.sk-icon-button:focus {
outline: 2px solid #007ACC;
outline: 2px solid var(--focus-color, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, #007ACC)))));
outline-offset: 2px;
}
/* Icon with text combinations */
.sk-icon-text {
display: inline-flex;
align-items: center;
gap: 6px;
}
.sk-icon-text--reverse {
flex-direction: row-reverse;
}
/* Loading state for icons */
.sk-icon--loading,
.sk-icon--spin {
animation: sk-icon-spin 1s linear infinite;
}
@keyframes sk-icon-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.CookieConsent_c-cookie-consent__Q9Rh0{align-items:center;display:flex;flex-wrap:wrap;justify-content:space-between;position:fixed;left:0;width:100%;bottom:0;padding:8px;background-color:var(--sk-panel-content-background-color);color:var(--sk-text-color);z-index:9001 !important}@media(max-width: 767px){.CookieConsent_c-cookie-consent__Q9Rh0{top:auto;top:initial;z-index:99999 !important;bottom:0 !important}}@media(max-width: 413px){.CookieConsent_c-cookie-consent__Q9Rh0{flex-direction:column}}.CookieConsent_c-cookie-consent-content__QAkp5{flex:1 1;display:flex;align-items:center}.CookieConsent_c-cookie-consent-icon__UcYGl{margin-right:8px;font-size:20px;color:var(--sk-secondary-color)}.CookieConsent_c-cookie-consent-button-wrap__SOUgQ{margin-left:8px}@media(max-width: 413px){.CookieConsent_c-cookie-consent-button-wrap__SOUgQ{margin-left:0;margin-top:8px}}
/**
* Custom Icon System CSS - Font Awesome Replacement
*
* Base styles for the custom SVG icon system.
* Provides consistent sizing, hover states, and interactive styles.
*/
/* Base icon styles */
.sk-icon {
display: inline-block;
vertical-align: -0.125em; /* Match FontAwesome baseline alignment */
line-height: 1;
transition: all 0.2s ease-in-out;
-webkit-user-select: none;
user-select: none;
/* Ensure SVG inherits color for currentColor to work */
color: inherit;
}
/* Size classes for consistent dimensions */
.sk-icon--sm {
width: 12px;
height: 12px;
}
.sk-icon--md {
width: 16px;
height: 16px;
}
.sk-icon--lg {
width: 20px;
height: 20px;
}
.sk-icon--xl {
width: 24px;
height: 24px;
}
.sk-icon--xxl {
width: 32px;
height: 32px;
}
/* Interactive icon styles */
.sk-icon--interactive {
cursor: pointer;
}
.sk-icon--interactive:hover {
opacity: 0.8;
transform: scale(1.05);
}
.sk-icon--interactive:active {
transform: scale(0.95);
}
.sk-icon--interactive:focus {
outline: 2px solid #007acc;
outline: 2px solid var(--focus-color, #007acc);
outline-offset: 2px;
border-radius: 2px;
}
/* Icon color variants */
.sk-icon--primary {
color: #007acc;
color: var(--primary-color, #007acc);
}
.sk-icon--secondary {
color: #6c757d;
color: var(--secondary-color, #6c757d);
}
.sk-icon--success {
color: #28a745;
color: var(--success-color, #28a745);
}
.sk-icon--warning {
color: #ffc107;
color: var(--warning-color, #ffc107);
}
.sk-icon--danger {
color: #dc3545;
color: var(--danger-color, #dc3545);
}
.sk-icon--info {
color: #17a2b8;
color: var(--info-color, #17a2b8);
}
/* Icon button style (for clickable icons) */
.sk-icon-button {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 4px;
border: none;
background: none;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.2s ease-in-out;
}
.sk-icon-button:hover {
background-color: rgba(0, 0, 0, 0.05);
background-color: var(--hover-bg-color, rgba(0, 0, 0, 0.05));
}
.sk-icon-button:active {
background-color: rgba(0, 0, 0, 0.1);
background-color: var(--active-bg-color, rgba(0, 0, 0, 0.1));
}
.sk-icon-button:focus {
outline: 2px solid #007acc;
outline: 2px solid var(--focus-color, #007acc);
outline-offset: 2px;
}
/* Icon with text combinations */
.sk-icon-text {
display: inline-flex;
align-items: center;
gap: 6px;
}
.sk-icon-text--reverse {
flex-direction: row-reverse;
}
/* Loading state for icons */
.sk-icon--loading,
.sk-icon--spin {
animation: sk-icon-spin 1s linear infinite;
}
@keyframes sk-icon-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* DuoTone Support */
.sk-icon__secondary {
opacity: 0.4;
}
.sk-icon__primary {
opacity: 1;
}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.PushNotification_c-popup-notification-popup--wrapper__n\+9g-{position:fixed;z-index:9999;top:80px;right:10px;background-color:#262626;color:#5b5b5b;border-radius:1rem;border-radius:var(--spacing-x0_5, 1rem);width:300px;padding:12px 1rem 12px 12px;padding:12px var(--spacing-x3, 1rem) 12px 12px;border:1px solid #333;border:1px solid var(--theme-border-hover-color, #333);border-left:4px solid #333;border-left:4px solid var(--theme-secondary-color, #333);cursor:pointer}.PushNotification_c-popup-notification-popup--wrapper__n\+9g- .PushNotification_c-popup-notification-header__zlgcD{font-size:16px;font-weight:400;line-height:1.5;margin:0px 0 1rem;margin:0px 0 var(--spacing-x0_5, 1rem);color:#333;color:var(--theme-panel-head-color, #333);font-weight:700}.PushNotification_c-popup-notification-popup--wrapper__n\+9g- .PushNotification_c-popup-notification-desc__BxroS{font-size:16px;font-weight:400;line-height:1.5;color:#333;color:var(--theme-panel-head-color, #333);margin:0px;line-height:140%}.PushNotification_c-popup-notification-popup--wrapper__n\+9g- .PushNotification_c-popup-notification-close-icon__DPm2y{cursor:pointer;position:absolute;top:-10px;right:-7px;width:22px;height:22px;line-height:100%;font-size:16px;font-weight:400;line-height:1.5;background-color:#333;background-color:var(--theme-secondary-color, #333);border-radius:50%;color:#fff;color:var(--theme-color-white, #fff);display:flex;align-items:center;justify-content:center}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.PermissionDialog_c-prompt-notification--wrapper__HFUcC{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:flex;align-items:flex-start;justify-content:center;background:rgba(0,0,0,.7);z-index:9999;padding-top:170px}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-box--wrapper__L3LD3{position:relative;width:400px;z-index:999;margin:0px auto;box-shadow:0 0 10px 4px rgba(0,0,0,.46);margin:0px auto;box-shadow:0 0 10px 4px rgba(0,0,0,.46);background:#ffffff;background:var(--theme-panel-content-background-color, #ffffff);border:1px solid #dee2e6;border:1px solid var(--theme-table-border-color, #dee2e6)}@media(max-width: 599px){.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-box--wrapper__L3LD3{width:90%}}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification--content__DAnqM{text-align:center;padding:1rem 1rem 1rem;padding:var(--spacing-x4, 1rem) var(--spacing-x2, 1rem) var(--spacing-x3, 1rem)}@media(max-width: 599px){.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification--content__DAnqM{padding:1rem 12px 1rem;padding:var(--spacing-x3, 1rem) 12px var(--spacing-x2, 1rem)}}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-title__WWNy9{color:#5b5b5b;margin:0px 0 1rem;margin:0px 0 var(--spacing-x2, 1rem)}@media(max-width: 599px){.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-title__WWNy9{font-size:15px}}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-desc__jeKtE{font-size:16px;font-weight:400;line-height:1.5;line-height:160%;margin:0px}@media(max-width: 599px){.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-desc__jeKtE{font-size:13px}}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-close-icon__QycAG{position:absolute;right:-10px;top:-10px;width:30px;height:30px;background:#333;background:var(--theme-panel-content-background-color-highlight, #333);display:flex;align-items:center;justify-content:center;color:#5b5b5b;border-radius:50%;font-size:16px;font-weight:400;line-height:1.5;cursor:pointer}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-icon__H34hr{width:70px;height:70px;padding:12px;border-radius:50%;padding:12px;border-radius:50%;margin:-35px auto 0;background:#333;background:var(--theme-panel-content-background-color-highlight, #333);display:flex;align-items:center;justify-content:center}@media(max-width: 599px){.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-icon__H34hr{width:50px;height:50px;margin:-25px auto 0}}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-icon__H34hr>img{width:100%;height:100%;object-fit:contain}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-btn--warpper__UFTA7{display:flex;align-items:center;width:400px;margin:0px auto;background:#ffffff;background:var(--theme-panel-content-background-color, #ffffff);z-index:9;position:relative}@media(max-width: 768px){.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-btn--warpper__UFTA7{width:90%}}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-btn--warpper__UFTA7 .PermissionDialog_c-prompt-notification-btn__khLhv{flex:1 0 50%;max-width:50%;height:45px;color:#6c757d;border:0;cursor:pointer}@media(max-width: 599px){.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-btn--warpper__UFTA7 .PermissionDialog_c-prompt-notification-btn__khLhv{height:40px}}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-btn--warpper__UFTA7 .PermissionDialog_c-prompt-notification-btn__khLhv.PermissionDialog_c-prompt-notification-cancel-btn__m29PP{background:rgba(0,0,0,0);border:1px solid #ff6b6b;border:1px solid var(--theme-error-color, #ff6b6b);color:#5b5b5b}.PermissionDialog_c-prompt-notification--wrapper__HFUcC .PermissionDialog_c-prompt-notification-btn--warpper__UFTA7 .PermissionDialog_c-prompt-notification-btn__khLhv.PermissionDialog_c-prompt-notification-confirm-btn__UVng-{background:#68ff33;background:var(--theme-success-color, #68ff33)}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.NotificationAlert_c-popup-notification-popup--wrapper__bjoBF{justify-content:center;position:fixed;z-index:9999;top:10%;right:40%;background-color:#1c4e86;color:#5b5b5b;border-radius:4px;width:300px;text-align:left;padding:8px 24px 8px 8px;border:1px solid gray;border-left:4px solid #e67917;cursor:pointer}@media(max-width: 767px){.NotificationAlert_c-popup-notification-popup--wrapper__bjoBF{top:10%;right:10%}}.NotificationAlert_c-popup-notification-popup--wrapper__bjoBF .NotificationAlert_c-popup-notification-header__O-s0D{font-size:14px;margin:0 0 4px;color:#fff;font-weight:600}.NotificationAlert_c-popup-notification-popup--wrapper__bjoBF .NotificationAlert_c-popup-notification-desc__4Vk7X{font-size:12px;color:#fff;margin:0;line-height:140%}.NotificationAlert_c-popup-notification-popup--wrapper__bjoBF .NotificationAlert_c-popup-notification-close-icon__hBeU0{cursor:pointer;position:absolute;top:-10px;right:-7px;width:22px;height:22px;line-height:100%;font-size:14px;background-color:#e67917;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center}.NotificationAlert_c-popup-notification-header__O-s0D{font-size:14px;margin:0 0 4px;color:#fff;font-weight:600}.NotificationAlert_c-popup-notification-desc__4Vk7X{font-size:12px;color:#fff;margin:0;line-height:140%}.NotificationAlert_c-popup-notification-close-icon__hBeU0{cursor:pointer;position:absolute;top:-10px;right:-7px;width:22px;height:22px;line-height:100%;font-size:14px;background-color:#e67917;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center}
/*
Buttons style by http://nicolasgallagher.com/lab/css3-github-buttons/
Changed by Afshin Mehrabani
*/
/* overrides extra padding on button elements in Firefox */
@keyframes introjspulse {
0% {
transform: scale(0);
opacity: 0; }
25% {
transform: scale(0);
opacity: 0.1; }
50% {
transform: scale(0.1);
opacity: 0.3; }
75% {
transform: scale(0.5);
opacity: 0.5; }
100% {
transform: scale(1);
opacity: 0; } }
.introjs-overlay {
position: absolute;
box-sizing: content-box;
z-index: 999999;
opacity: 0;
transition: all 0.3s ease-out; }
.introjs-showElement {
z-index: 9999999 !important; }
tr.introjs-showElement > td {
z-index: 9999999 !important;
position: relative; }
tr.introjs-showElement > th {
z-index: 9999999 !important;
position: relative; }
.introjs-disableInteraction {
z-index: 99999999 !important;
position: absolute;
background-color: #ffffff;
opacity: 0;
filter: alpha(opacity=0); }
.introjs-relativePosition {
position: relative; }
.introjs-helperLayer {
box-sizing: content-box;
position: absolute;
z-index: 9999998;
border-radius: 4px;
transition: all 0.3s ease-out; }
.introjs-helperLayer * {
box-sizing: content-box; }
.introjs-helperLayer *:before {
box-sizing: content-box; }
.introjs-helperLayer *:after {
box-sizing: content-box; }
.introjs-tooltipReferenceLayer {
font-family: "Helvetica Neue", Inter, ui-sans-serif, "Apple Color Emoji", Helvetica, Arial, sans-serif;
box-sizing: content-box;
position: absolute;
visibility: hidden;
z-index: 100000000;
background-color: transparent;
transition: all 0.3s ease-out; }
.introjs-tooltipReferenceLayer * {
font-family: "Helvetica Neue", Inter, ui-sans-serif, "Apple Color Emoji", Helvetica, Arial, sans-serif; }
.introjs-helperNumberLayer {
font-family: "Helvetica Neue", Inter, ui-sans-serif, "Apple Color Emoji", Helvetica, Arial, sans-serif;
color: #9e9e9e;
text-align: center;
padding-top: 10px;
padding-bottom: 10px; }
.introjs-arrow {
border: 5px solid transparent;
content: "";
position: absolute; }
.introjs-arrow.top {
top: -10px;
left: 10px;
border-bottom-color: #ffffff; }
.introjs-arrow.top-right {
top: -10px;
right: 10px;
border-bottom-color: #ffffff; }
.introjs-arrow.top-middle {
top: -10px;
left: 50%;
margin-left: -5px;
border-bottom-color: #ffffff; }
.introjs-arrow.right {
right: -10px;
top: 10px;
border-left-color: #ffffff; }
.introjs-arrow.right-bottom {
bottom: 10px;
right: -10px;
border-left-color: #ffffff; }
.introjs-arrow.bottom {
bottom: -10px;
left: 10px;
border-top-color: #ffffff; }
.introjs-arrow.bottom-right {
bottom: -10px;
right: 10px;
border-top-color: #ffffff; }
.introjs-arrow.bottom-middle {
bottom: -10px;
left: 50%;
margin-left: -5px;
border-top-color: #ffffff; }
.introjs-arrow.left {
left: -10px;
top: 10px;
border-right-color: #ffffff; }
.introjs-arrow.left-bottom {
left: -10px;
bottom: 10px;
border-right-color: #ffffff; }
.introjs-tooltip {
box-sizing: content-box;
position: absolute;
visibility: visible;
background-color: #ffffff;
min-width: 250px;
max-width: 300px;
border-radius: 5px;
box-shadow: 0 3px 30px rgba(33, 33, 33, 0.3);
transition: opacity 0.1s ease-out; }
.introjs-tooltiptext {
padding: 20px; }
.introjs-tooltip-title {
font-size: 18px;
margin: 0;
padding: 0;
font-weight: 700;
float: left;
line-height: 32px; }
.introjs-tooltip-header {
padding-left: 20px;
padding-right: 20px;
padding-top: 10px; }
.introjs-tooltip-header:after {
content: ".";
visibility: hidden;
display: block;
height: 0;
clear: both; }
.introjs-tooltipbuttons {
border-top: 1px solid #e0e0e0;
padding: 10px;
text-align: right;
white-space: nowrap; }
.introjs-tooltipbuttons:after {
content: "";
visibility: hidden;
display: block;
height: 0;
clear: both; }
.introjs-button {
box-sizing: content-box;
position: relative;
overflow: visible;
display: inline-block;
padding: 0.5rem 1rem;
border: 1px solid #bdbdbd;
text-decoration: none;
text-shadow: 1px 1px 0 #ffffff;
font-size: 14px;
color: #424242;
white-space: nowrap;
cursor: pointer;
outline: none;
background-color: #f4f4f4;
border-radius: 0.2em;
zoom: 1;
*display: inline; }
.introjs-button:hover {
outline: none;
text-decoration: none;
border-color: #9e9e9e;
background-color: #e0e0e0;
color: #212121; }
.introjs-button:focus {
outline: none;
text-decoration: none;
background-color: #eeeeee;
box-shadow: 0 0 0 0.2rem rgba(158, 158, 158, 0.5);
border: 1px solid #616161;
color: #212121; }
.introjs-button:active {
outline: none;
text-decoration: none;
background-color: #e0e0e0;
border-color: #9e9e9e;
color: #212121; }
.introjs-button::-moz-focus-inner {
padding: 0;
border: 0; }
.introjs-skipbutton {
box-sizing: content-box;
color: #616161;
float: right;
font-size: 20px;
cursor: pointer;
font-weight: bold;
line-height: 1;
text-align: center;
padding: 7px 10px; }
.introjs-skipbutton:hover, .introjs-skipbutton:focus {
color: #212121;
outline: none;
text-decoration: none; }
.introjs-prevbutton {
float: left; }
.introjs-nextbutton {
float: right; }
.introjs-disabled {
color: #9e9e9e;
border-color: #bdbdbd;
box-shadow: none;
cursor: default;
background-color: #f4f4f4;
background-image: none;
text-decoration: none; }
.introjs-disabled:hover, .introjs-disabled:focus {
color: #9e9e9e;
border-color: #bdbdbd;
box-shadow: none;
cursor: default;
background-color: #f4f4f4;
background-image: none;
text-decoration: none; }
.introjs-hidden {
display: none; }
.introjs-bullets {
text-align: center;
padding-top: 10px;
padding-bottom: 10px; }
.introjs-bullets ul {
box-sizing: content-box;
clear: both;
margin: 0 auto 0;
padding: 0;
display: inline-block; }
.introjs-bullets ul li {
box-sizing: content-box;
list-style: none;
float: left;
margin: 0 2px; }
.introjs-bullets ul li a {
transition: width 0.1s ease-in;
box-sizing: content-box;
display: block;
width: 6px;
height: 6px;
background: #ccc;
border-radius: 10px;
text-decoration: none;
cursor: pointer; }
.introjs-bullets ul li a:hover, .introjs-bullets ul li a:focus {
width: 15px;
background: #999;
text-decoration: none;
outline: none; }
.introjs-bullets ul li a.active {
width: 15px;
background: #999; }
.introjs-progress {
box-sizing: content-box;
overflow: hidden;
height: 10px;
margin: 10px;
border-radius: 4px;
background-color: #e0e0e0; }
.introjs-progressbar {
box-sizing: content-box;
float: left;
width: 0%;
height: 100%;
font-size: 10px;
line-height: 10px;
text-align: center;
background-color: #08c; }
.introjsFloatingElement {
position: absolute;
height: 0;
width: 0;
left: 50%;
top: 50%; }
.introjs-fixedTooltip {
position: fixed; }
.introjs-hint {
box-sizing: content-box;
position: absolute;
background: transparent;
width: 20px;
height: 15px;
cursor: pointer; }
.introjs-hint:focus {
border: 0;
outline: 0; }
.introjs-hint:hover > .introjs-hint-pulse {
border: 5px solid rgba(60, 60, 60, 0.57); }
.introjs-hidehint {
display: none; }
.introjs-fixedhint {
position: fixed; }
.introjs-hint-pulse {
box-sizing: content-box;
width: 10px;
height: 10px;
border: 5px solid rgba(60, 60, 60, 0.27);
border-radius: 30px;
background-color: rgba(136, 136, 136, 0.24);
z-index: 10;
position: absolute;
transition: all 0.2s ease-out; }
.introjs-hint-no-anim .introjs-hint-dot {
animation: none; }
.introjs-hint-dot {
box-sizing: content-box;
border: 10px solid rgba(146, 146, 146, 0.36);
background: transparent;
border-radius: 60px;
height: 50px;
width: 50px;
animation: introjspulse 3s ease-out;
animation-iteration-count: infinite;
position: absolute;
top: -25px;
left: -25px;
z-index: 1;
opacity: 0; }
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.Tour_c-upcoming-matches__tlJ2D{display:flex;flex-direction:column;grid-gap:0.5rem;grid-gap:var(--spacing-x1, 0.5rem);gap:0.5rem;gap:var(--spacing-x1, 0.5rem);margin-bottom:1rem;margin-bottom:var(--spacing-x3, 1rem)}@media(min-width: 768px)and (max-width: 1024px){.Tour_c-upcoming-matches__tlJ2D{gap:8px !important;grid-gap:8px !important}}.Tour_c-match__0roAB{display:flex;flex-direction:column;padding:0.5rem;padding:var(--spacing-x1, 0.5rem);border:1px solid #333;border:1px solid var(--theme-border-color, #333);border-radius:initial;border-radius:var(--border-radius-md, initial);background-color:#fff;background-color:var(--theme-panel-content-background-color, #fff);color:#5b5b5b;transition:all .2s ease;cursor:pointer}.Tour_c-match__0roAB:hover{box-shadow:0 1px 3px rgba(0,0,0,.12);transform:translateY(-2px)}.Tour_c-match-teams__Tmv7T{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.Tour_c-match-team__pVdUk{flex:1 1;text-align:center}.Tour_c-match-team-name__96PUU{font-weight:700;font-size:16px;font-weight:400;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.Tour_c-match-vs__CLg-K{margin:0px 12px;color:#333;color:var(--theme-text-minor-color, #333);font-size:16px;font-weight:400;line-height:1.5}.Tour_c-match-info__NerLK{display:flex;justify-content:space-between;color:#333;color:var(--theme-text-minor-color, #333);font-size:16px;font-weight:400;line-height:1.5}.Tour_c-match-league__5UIVx{font-weight:700;color:#5b5b5b}.Tour_c-match-time__o1dNx{color:#333;color:var(--theme-text-minor-color, #333);font-size:16px;font-weight:400;line-height:1.5;line-height:1.5}.Tour_c-upcoming-matches--footer__HL5ur{display:flex;justify-content:center;margin-top:1rem;margin-top:var(--spacing-x2, 1rem)}.Tour_c-upcoming-view-more-btn__Emmsj{display:flex;align-items:center;grid-gap:12px;gap:12px;font-weight:700;color:#5b5b5b;text-decoration:none}.Tour_c-upcoming-view-more-btn--icon__fgvzG{font-size:16px;font-weight:400;line-height:1.5}.Tour_c-upcoming-view-more-btn__Emmsj:hover{text-decoration:underline}.Tour_c-upcoming-matches-error__BDZmX{padding:1rem;padding:var(--spacing-x3, 1rem);text-align:center;color:#ff6b6b;color:var(--theme-error-color, #ff6b6b);font-weight:700}.Tour_tourProvider__3LPUF{position:relative}.Tour_tourStep__hclHe{position:relative;z-index:1000}.Tour_tourOverlay__ePP3P{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);z-index:999}.Tour_tourContent__o\+DOV{box-shadow:0 4px 12px rgba(0,0,0,.15)}.Tour_c-tour-tooltip__D3gUV{max-width:450px;min-width:350px}.Tour_c-tour-tooltip__D3gUV .introjs-tooltiptext{overflow-y:auto;max-height:450px}.Tour_c-tour-tooltip__D3gUV .introjs-tooltip-header{display:flex;align-items:center}.Tour_c-tour-tooltip__D3gUV .introjs-tooltip-title{flex:1 1}.Tour_c-tour-tooltip__D3gUV .introjs-skipbutton{padding:0}.Tour_c-tour-tooltip__D3gUV .introjs-button{box-shadow:none;text-shadow:none;border-radius:25px}.Tour_c-tour-tooltip__D3gUV .introjs-disabled{opacity:.2}.Tour_c-tour-youtube__nUBBI{position:relative;padding-bottom:56.25%;padding-top:25px;height:0;overflow:hidden}.Tour_c-tour-youtube__nUBBI iframe{position:absolute;top:0;left:0;width:100%;height:100%}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.GoProButton_c-btn-pro-container__gU\+i2{display:flex;justify-content:center;align-items:center}.GoProButton_c-btn-pro-container__gU\+i2 .GoProButton_c-btn-pro__gTrJP{min-width:auto;width:90px;padding:8px 10px}.GoProButton_c-btn-pro-text__R\+qyE{color:#fff;font-size:16px;font-weight:400;line-height:1.5;margin-top:0;text-align:center;padding-left:4px}.GoProButton_c-btn-pro__gTrJP.GoProButton_c-btn-pro__gTrJP{text-decoration:none;display:inline-block;background:#e67917;background-color:#e67917;color:#fff;border-radius:25px;border:1px solid #e67917;padding:12px 20px;height:40px;width:90px;position:relative;cursor:pointer;line-height:normal;text-align:center;text-transform:uppercase;font-weight:600;font-family:"Open Sans",sans-serif;font-size:14px;min-width:auto;max-width:none;overflow:visible;text-overflow:clip;white-space:nowrap;box-sizing:border-box}.GoProButton_c-btn-pro__gTrJP.GoProButton_c-btn-pro__gTrJP:hover,.GoProButton_c-btn-pro__gTrJP.GoProButton_c-btn-pro__gTrJP:focus,.GoProButton_c-btn-pro__gTrJP.GoProButton_c-btn-pro__gTrJP:active,.GoProButton_c-btn-pro__gTrJP.GoProButton_c-btn-pro__gTrJP:visited{text-decoration:none;background:#c8640f;background-color:#c8640f;color:#fff}@media(max-width: 767px){.GoProButton_c-btn-pro__gTrJP.GoProButton_c-btn-pro__gTrJP{width:auto;min-width:40px;padding:8px 12px;font-size:12px}}.GoProButton_c-btn-pro-icon__\+8Vk6{margin-right:0px !important;width:14px !important;height:14px !important;display:inline-block;flex:0 0 auto !important}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.Menu_c-header-menu-wrap__Nndwn{flex:1 1 auto;max-width:none;display:flex;align-items:center;justify-content:space-between;height:70px;text-align:start;color:#fff !important;transition:all;line-height:18.06px;overflow:visible;border:0 !important;border-color:rgba(0,0,0,0) !important}@media(max-width: 767px){.Menu_c-header-menu-wrap__Nndwn{overflow:hidden;height:60px}}.Menu_c-header-menu__irSKD{list-style-type:none;margin:0;padding:0;display:block;flex:0 1 auto;max-width:none}@media(max-width: 767px){.Menu_c-header-menu__irSKD{display:none !important}}a.Menu_c-header-menu-item-link__XiuF6{color:#fff !important;text-decoration:none;font-weight:400;letter-spacing:normal;font-size:14px;text-transform:uppercase;transition:color .2s ease;display:flex;align-items:center;padding:0 12px;line-height:18.06px;height:70px;border:0 !important;border-color:rgba(0,0,0,0) !important;font-family:"Open Sans",sans-serif !important;-webkit-font-smoothing:antialiased;white-space:normal;cursor:pointer}a.Menu_c-header-menu-item-link__XiuF6:hover{color:#e67917}a.Menu_c-header-menu-item-link__XiuF6.Menu_is-selected__8aX6F{color:#e67917}div.Menu_c-header-menu-item-link__XiuF6{color:#fff !important;text-decoration:none;font-weight:400;letter-spacing:normal;font-size:14px;text-transform:uppercase;transition:color .2s ease;display:flex;align-items:center;padding:0 12px;line-height:18.06px;height:70px;white-space:normal;cursor:pointer;border:0 !important;border-color:rgba(0,0,0,0) !important}div.Menu_c-header-menu-item-link__XiuF6:hover{color:#e67917}div.Menu_c-header-menu-item-link--gopro__tBzbP{display:flex;background:rgba(0,0,0,0);background-color:rgba(0,0,0,0);color:#fff;border-radius:0;border:none;padding:0 12px;height:40px;width:auto;position:static;font-weight:400;font-size:14px;text-transform:none;cursor:pointer;align-items:center;line-height:normal}.Menu_c-header-btn-pro__PgLK-{background:#e67917 !important;background-color:#e67917 !important;border:1px solid #e67917 !important;border-radius:25px !important;padding:12px 20px !important;width:auto !important;height:40px !important;min-width:auto !important;display:inline-block !important;align-items:center !important;color:#fff !important;font-weight:600 !important;vertical-align:middle}.Menu_c-header-btn-pro__PgLK-:hover,.Menu_c-header-btn-pro__PgLK-:focus,.Menu_c-header-btn-pro__PgLK-:active{background:#c8640f !important;background-color:#c8640f !important}.Menu_c-header-menu-item-chevron__oNd43{margin-left:6px;margin-right:0px !important;fill:currentColor;font-size:10px;transition:transform .2s ease;width:8.75px;height:10px}li.Menu_c-header-menu-item__3ROqi{position:static;display:inline-block;vertical-align:middle;text-transform:none;margin:0;padding:0px;color:#fff !important;line-height:18.06px;border:0 !important;border-color:rgba(0,0,0,0) !important;height:70px}li.Menu_c-header-menu-item__3ROqi:hover .Menu_c-header-submenu__n8I-L{display:block;opacity:1;visibility:visible}li.Menu_c-header-menu-item__3ROqi.Menu_c-header-menu-item--topLevel__bQFx4{display:inline-block !important;text-transform:uppercase;font-weight:400;vertical-align:middle;position:static;margin:0;padding:0;height:70px}.Menu_c-header-menu-item-chevron__open__sc3Cg{transform:rotate(180deg)}.Menu_c-header-submenu__n8I-L{position:absolute;top:100%;left:0;min-width:200px;margin:0;padding:0px;list-style-type:none;background-color:#262626;color:#fff !important;border:0 !important;border-color:rgba(0,0,0,0) !important;border-radius:0;box-shadow:0 4px 12px rgba(0,0,0,.3);z-index:9000;display:none;opacity:0;visibility:hidden}.Menu_c-header-submenu__n8I-L .Menu_c-header-menu-item__3ROqi{display:block !important;text-transform:none;padding:0 12px;height:auto !important}.Menu_c-header-submenu__n8I-L .Menu_c-header-menu-item__3ROqi:hover{background-color:hsla(0,0%,100%,.05)}.Menu_c-header-submenu__n8I-L .Menu_c-header-menu-item-link__XiuF6{padding:0 12px;font-size:14px}.Menu_c-header-icon-pro__RXfB7{margin-right:4px}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.TileMenuItem_c-menu-item-row__jG9lP{display:flex;align-items:center}.TileMenuItem_c-menu-item-row__jG9lP:not(:first-child){margin-top:8.8px}.TileMenuItem_c-menu-item-tile__2FESE{border-radius:8px;border-radius:var(--border-radius-panel, 8px);background:#333;background:var(--theme-primary-color, #333);display:block;text-align:center;padding:8px 0 5px;cursor:pointer;text-decoration:none;width:70px;height:70px;transition:all 0.3s ease;transition:var(--transition-default, all 0.3s ease);margin-right:8.8px;border-radius:4px;margin-right:8.8px;border-radius:4px;flex:none;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center}.TileMenuItem_c-menu-item-tile-name__Ke0zB{color:#fff;color:var(--theme-color-white, #fff);text-align:center;margin-top:3px;font-size:11px;letter-spacing:.3px;overflow:hidden}.TileMenuItem_c-menu-item-tile-description__e7o8d{width:100%;color:#fff;color:var(--theme-color-white, #fff);width:100%;padding:2px;color:var(--theme-color-white, #fff);text-align:center;font-size:13px;align-self:center}.TileMenuItem_c-menu-item-tile-icon__Z2QTG{color:#fff;color:var(--theme-color-white, #fff);font-size:16px;font-weight:400;line-height:1.5;font-weight:800}
.ImageLoader_container__zed7a{display:inline-block}.ImageLoader_img__v-StV{object-fit:contain}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.MenuSports_c-menu-leagues__mRWZT{width:100%;display:flex;flex-flow:row;overflow-x:auto}.MenuSports_c-league-tile__hihO1{border-radius:0.5rem;border-radius:var(--theme-panel-border-radius, 0.5rem);background:#333;background:var(--theme-primary-color, #333);display:block;text-align:center;padding:4px 0 5px;cursor:pointer;text-decoration:none;width:50px;transition:all 150ms ease-in-out;margin-right:4.4px;border-radius:4px;margin-right:4.4px;border-radius:4px;flex:none}.MenuSports_c-league-tile__hihO1:hover{background-color:#333;background-color:var(--theme-panel-content-background-color-highlight, #333)}.MenuSports_c-league-tile__hihO1.MenuSports_is-selected__XF2dD{background-color:#333;background-color:var(--theme-panel-content-background-color-highlight, #333)}.MenuSports_c-league-tile__hihO1.MenuSports_is-selected__XF2dD .MenuSports_c-league-tile-icon__70wUP,.MenuSports_c-league-tile__hihO1.MenuSports_is-selected__XF2dD .MenuSports_c-league-tile-name__Od3\+M{color:#333;color:var(--theme-panel-head-color, #333)}.MenuSports_c-league-tile-icon__70wUP{color:#5b5b5b;font-size:16px;transition:all 150ms ease-in-out}@media(max-width: 768px){.MenuSports_c-league-tile-icon__70wUP{font-size:30px}}.MenuSports_c-league-tile-image__zEZHh.MenuSports_c-league-tile-image__zEZHh{width:30px;height:40px;object-fit:contain}@media(max-width: 768px){.MenuSports_c-league-tile-image__zEZHh.MenuSports_c-league-tile-image__zEZHh{height:30px}}.MenuSports_c-league-tile-name__Od3\+M{color:#fff;text-transform:uppercase;text-align:center;margin-top:0;font-size:9px;height:25px;padding-top:3px;letter-spacing:.3px;overflow:hidden}@media(max-width: 768px){.MenuSports_c-league-tile-name__Od3\+M{font-size:9px}}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.BurgerMenuV2_c-menu-sections__P5kBL{padding:2px 6px}@media(max-width: 768px){.BurgerMenuV2_c-menu-sections__P5kBL{width:100%;max-width:100%;margin:0 auto}}.BurgerMenuV2_c-menu-section__T\+eQs{margin-bottom:8px}.BurgerMenuV2_c-menu-section-heading__Veur3{color:#fff;text-transform:uppercase;font-weight:700;font-size:16px;font-weight:400;line-height:1.5;margin-bottom:4px;margin-top:0;margin-bottom:4px;border-bottom:1px solid #565656}.BurgerMenuV2_c-menu-section-column__-Ldf9{width:100%;display:flex;flex-flow:column;overflow-x:auto}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.MenuMatchups_c-menu-matchups__\+VYmy{width:100%;display:flex;flex-flow:row;overflow-x:auto}.MenuMatchups_c-menu-match__jT70M{float:left;width:60px;height:60px;background:var(--theme-primary-color);position:relative;margin-right:4.4px;border-radius:4px;margin-right:4.4px;border-radius:4px;flex:none}.MenuMatchups_c-menu-match-league-img__imJfG{object-fit:cover;padding:var(--spacing-x2);opacity:.2;width:100%;height:100%}.MenuMatchups_c-menu-match-at-icon__woN4E{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-size:16px;font-weight:400;line-height:1.5;color:#fff;color:var(--theme-color-white, #fff)}.MenuMatchups_c-menu-match-team-img__h4LNk{position:absolute;width:45px;height:45px;filter:drop-shadow(2px 4px 2px rgba(0, 0, 0, 0.36));filter:drop-shadow(2px 4px 2px rgba(var(--theme-color-black-rgb, 0, 0, 0), 0.36))}@media(max-width: 768px){.MenuMatchups_c-menu-match-team-img__h4LNk{width:20px;height:20px}}.MenuMatchups_c-menu-match-team-img-first__1jqGs{top:4px;left:4px}.MenuMatchups_c-menu-match-team-img-second__zu0iY{bottom:4px;right:4px}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.LeagueTiles_c-league-tile__aUHqg{border-radius:0.5rem;border-radius:var(--theme-panel-border-radius, 0.5rem);background:#333;background:var(--theme-primary-color, #333);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding:0px;cursor:pointer;text-decoration:none;width:60px;height:40px;min-height:auto;transition:all 150ms ease-in-out;margin-right:4.4px;border-radius:4px;flex:none;font-family:Arial;border:none}.LeagueTiles_c-league-tile__aUHqg:hover{background-color:#333;background-color:var(--theme-panel-content-background-color-highlight, #333)}.LeagueTiles_c-league-tile__aUHqg.LeagueTiles_is-selected__oqYrf{background-color:#333;background-color:var(--theme-panel-content-background-color-highlight, #333)}.LeagueTiles_c-league-tile__aUHqg.LeagueTiles_is-selected__oqYrf .LeagueTiles_c-league-tile-icon__L1p5x,.LeagueTiles_c-league-tile__aUHqg.LeagueTiles_is-selected__oqYrf .LeagueTiles_c-league-tile-name__zywiV{color:#333;color:var(--theme-panel-head-color, #333)}.LeagueTiles_c-league-tile-icon__L1p5x{color:#5b5b5b;font-size:40px;display:block;margin:0 auto;transition:all 150ms ease-in-out}@media(max-width: 768px){.LeagueTiles_c-league-tile-icon__L1p5x{font-size:30px}}.LeagueTiles_c-league-tile-image__7h2ZY{width:70px;height:90px;object-fit:contain;margin:0 auto}@media(max-width: 768px){.LeagueTiles_c-league-tile-image__7h2ZY{height:90px}}.LeagueTiles_c-league-tile-name__zywiV{color:#fff;text-transform:uppercase;text-align:center;margin-top:3px;font-size:9px;height:27px;padding-top:3px;letter-spacing:.3px;overflow:hidden}@media(max-width: 768px){.LeagueTiles_c-league-tile-name__zywiV{font-size:9px}}.LeagueTiles_c-menu-leagueTiles__3gp7U{width:100%;display:flex;flex-flow:row;overflow-x:auto}.LeagueTiles_c-menu-subSection-title__jbYqY{color:#fff;margin-top:0;width:90px;font-size:16px;font-weight:400;line-height:1.5;text-align:center}.LeagueTiles_c-menu-matchups__sPQp6{width:100%;display:flex;flex-flow:row;overflow-x:auto;align-items:center;margin-bottom:8.8px}
.Price_c-price__L9cJ4{color:#333;color:var(--theme-secondary-color, #333);font-size:26px}.Price_c-price_cross__-DJm\+{position:relative;color:#333;color:var(--theme-text-minor-color, #333)}.Price_c-price_cross__-DJm\+:after{position:absolute;content:"";top:50%;left:0;width:100%;height:1px;background:#333;background:var(--theme-secondary-color, #333)}.Price_c-price_cross__-DJm\+:after{transform:rotate(-20deg)}.Price_c-price-currency__jswTO{font-size:65%;vertical-align:text-top;color:#333;color:var(--theme-text-minor-color, #333);margin-right:2px}.Price_c-price-decimal__LghL1{font-size:75%}
.ColorValue_c-color-value__win__hYU22{color:#28a745}.ColorValue_c-color-value__lost__v4yoV{color:#ff6b6b;color:var(--theme-error-color, #ff6b6b)}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}div.Team_c-team__N7dfc{display:flex;align-items:center}span.Team_c-team-score__Qlc7Y{margin-right:12px;font-weight:700;font-size:16px;vertical-align:middle}span.Team_c-team-score__Qlc7Y.Team_c-team-reverse__71Hl0{margin-right:0;margin-left:12px}img.Team_c-team-logo__pm9Et,svg.svg-inline--fa.Team_c-team-logo__pm9Et{margin-right:8px;border-radius:50%;padding:1px;border:none;vertical-align:middle;width:25px;width:var(--icon-size, 25px);height:25px;height:var(--icon-size, 25px);background-color:rgba(0,0,0,0)}img.Team_c-team-logo__pm9Et.Team_c-team-reverse__71Hl0,svg.svg-inline--fa.Team_c-team-logo__pm9Et.Team_c-team-reverse__71Hl0{margin-right:0;margin-left:8px}img.Team_c-team-logo-middle__R5rEI{width:30px;height:30px}
div.Teams_c-teams__YN-R\+{display:flex;align-items:center;color:#262626;font-weight:600;overflow:hidden}@media(max-width: 767px){div.Teams_c-teams__YN-R\+{max-height:20px;white-space:nowrap}}a.Teams_c-team-link-btn__8LyNw{display:inline-flex;align-items:center;text-decoration:none;background:rgba(0,0,0,0);border:0;padding:0;color:inherit;cursor:pointer}span.Teams_c-teams-vs__Gw20I{display:inline-block;margin:0 8px;font-weight:600}div.Teams_c-teams-counter-box-wrap__Cvu7O{display:flex;justify-content:center}div.Teams_c-teams-counter-box-team-group__n9P63{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;grid-gap:4px;gap:4px}div.Teams_c-teams-counter-box-team-wrap__rC6gj{display:flex;align-items:center;justify-content:center}.Teams_c-teams-counter-box-score-group__kxkqw{display:flex;align-items:center;gap:4px}.Teams_c-teams-counter-box-score-box-group__1s4ZP{display:inline-flex;gap:2px}.Teams_c-teams-counter-box-score-box-item__8r-Jn{display:inline-flex;align-items:center;justify-content:center;min-width:2ch;padding:0 2px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}
.LinkButton_link-button__5ejEI{color:var(--sk-link-color);cursor:pointer;text-decoration:underline;text-align:center;font-family:"Open Sans",sans-serif;background-color:rgba(0,0,0,0);border:none;outline:none;padding:0;line-height:1}.LinkButton_link-button__5ejEI:disabled{cursor:none;opacity:.5}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}div.GameDescription_c-game-description__A4C-I{font-weight:600;font-weight:var(--font-weight-600, 600);color:#333;color:var(--theme-text-highlight-color, #333);display:block;align-items:center;flex-wrap:wrap}div.GameDescription_c-game-description-no-color__S01yW{color:inherit}div.GameDescription_c-game-description-no-wrap__y9Tl-{flex-wrap:nowrap;white-space:nowrap;overflow:hidden}img.GameDescription_c-game-description-sport__M\+PPS,div.GameDescription_c-game-description-sport__M\+PPS{width:25px;height:25px;object-fit:contain;margin-right:4px;vertical-align:middle;display:inline-block}span.GameDescription_c-game-description-title__vBp\+L{margin-right:1rem;margin-right:var(--spacing-x2, 1rem);display:flex;justify-content:space-between;align-items:center;grid-gap:4px;gap:4px}div.GameDescription_c-game-description-wrap-team-info__wtxnP{flex-flow:column;align-items:flex-start;margin-bottom:1rem;margin-bottom:var(--spacing-x0_5, 1rem)}div.GameDescription_c-game-description-wrap-team-info__wtxnP div.GameDescription_c-game-description-gameInfo__-TNKO{display:flex;align-items:center;font-size:11px;margin-bottom:2px}div.GameDescription_c-game-description-wrap-team-info__wtxnP div.GameDescription_c-game-description-gameInfo__-TNKO img.GameDescription_c-game-description-sport__M\+PPS,div.GameDescription_c-game-description-wrap-team-info__wtxnP div.GameDescription_c-game-description-gameInfo__-TNKO div.GameDescription_c-game-description-sport__M\+PPS{width:15px;height:15px}div.GameDescription_c-game-description-wrap-team-info__wtxnP div.GameDescription_c-game-description-teaminfo__ghItK{display:flex;align-items:center}div.GameDescription_c-game-description-wrap-team-info__wtxnP div.GameDescription_c-game-description-teaminfo__ghItK>div{display:flex;flex-flow:row;width:100%}div.GameDescription_c-game-description-wrap-team-info__wtxnP div.GameDescription_c-game-description-teaminfo__ghItK>div>div{flex:1 0 50%;display:flex}div.GameDescription_c-game-description-wrap-team-info__wtxnP div.GameDescription_c-game-description-teaminfo__ghItK>div>div>button{display:flex;align-items:center;justify-content:flex-start}span.GameDescription_c-game-image-wrapper__7Xy44{display:flex;align-items:center;font-size:16px;font-weight:400;line-height:1.5}span.GameDescription_c-game-description-teams-wrapper__trQGd{display:flex;align-items:center}span.GameDescription_c-game-description-teams-wrapper--fixwidth__GBIQp{flex:1 0 auto}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.TeamDescription_c-game-description__-vXgo{font-weight:600;font-weight:var(--font-weight-600, 600);color:#333;color:var(--theme-text-highlight-color, #333);display:flex;align-items:center;flex-wrap:wrap}.TeamDescription_c-game-description-no-color__Lis8j{color:inherit}.TeamDescription_c-game-description-no-wrap__HZQxJ{flex-wrap:nowrap;white-space:nowrap;overflow:hidden}.TeamDescription_c-game-description-sport__Cwg6W{width:25px;height:25px;object-fit:contain;margin-right:4.4px;vertical-align:text-bottom}.TeamDescription_c-game-description-title__h1nH6{margin-right:1rem;margin-right:var(--spacing-x2, 1rem)}.TeamDescription_c-team-logo__ddaFT{margin-right:0px;border-radius:0px;padding:0px;vertical-align:middle;width:25px;width:var(--icon-size, 25px);height:25px;height:var(--icon-size, 25px);display:inline-block;background-color:rgba(0,0,0,0);font-size:12px}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.SportDescription_c-game-description__cVep3{font-weight:600;font-weight:var(--font-weight-600, 600);color:#333;color:var(--theme-text-highlight-color, #333);display:flex;align-items:center;flex-wrap:wrap}.SportDescription_c-game-description-no-color__8ZpL7{color:inherit}.SportDescription_c-game-description-no-wrap__jgEtA{flex-wrap:nowrap;white-space:nowrap;overflow:hidden}.SportDescription_c-game-description-sport__wf--X{width:25px;height:25px;object-fit:contain;margin-right:4.4px;vertical-align:text-bottom}.SportDescription_c-game-description-title__jjtAe{margin-right:1rem;margin-right:var(--spacing-x2, 1rem)}.SportDescription_c-team-logo__m3Bg9{margin-right:8px;border-radius:50%;padding:1px;vertical-align:middle;width:25px;width:var(--icon-size, 25px);height:25px;height:var(--icon-size, 25px);background-color:rgba(0,0,0,0);font-size:12px}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.GlobalSearch_c-searchpanel-input__EucdT.GlobalSearch_c-searchpanel-input__EucdT{width:95%;border:none;height:100%;padding-left:5px;background:rgba(0,0,0,0);color:inherit}@media(max-width: 768px){.GlobalSearch_c-searchpanel-input__EucdT.GlobalSearch_c-searchpanel-input__EucdT{font-size:16px;font-weight:400;line-height:1.5}}.GlobalSearch_search-wrapper-main__qkyzk{display:flex;background:hsla(0,0%,100%,.1);align-items:center;margin-right:12px;height:36px;min-width:240px;padding:0 12px;border-radius:18px;border:1px solid hsla(0,0%,100%,.2);color:#fff;transition:all .2s ease}.GlobalSearch_search-wrapper-main__qkyzk:hover{background:hsla(0,0%,100%,.2)}@media(max-width: 768px){.GlobalSearch_search-wrapper-main__qkyzk{width:100%;min-width:0;min-width:initial;margin-right:0}}.GlobalSearch_search-icon-close__kO8-i{cursor:pointer}.GlobalSearch_c-search-wrapper-active__1pDOm.GlobalSearch_c-search-wrapper-active__1pDOm{display:flex;background:#ffffff;background:var(--theme-form-control-background-color, #ffffff);align-items:center;height:40px;min-width:300px;padding:12px;border-radius:4px;border:1px solid #e0e0e0;border:1px solid var(--theme-color-border, #e0e0e0)}@media(max-width: 768px){.GlobalSearch_c-search-wrapper-active__1pDOm.GlobalSearch_c-search-wrapper-active__1pDOm{width:calc(100% - 36px);margin-left:13.2px}}.GlobalSearch_search-icon-input__xTRR-{margin-top:0}@media(max-width: 768px){.GlobalSearch_search-icon-input__xTRR-{margin-top:0}}.GlobalSearch_c-searchItems-container__LhwuQ{padding:4px;color:#5b5b5b;color:var(--theme-color-text, #5b5b5b);overflow-y:scroll;max-height:100vh;padding-bottom:5px;background-color:#fff;scrollbar-width:thin;scrollbar-color:#1c4e86 #f5f5f5;scrollbar-color:var(--sk-color-primary-500, #1c4e86) var(--sk-color-gray-100, #f5f5f5)}.GlobalSearch_c-searchItems-container__LhwuQ::-webkit-scrollbar{width:8px;height:8px}.GlobalSearch_c-searchItems-container__LhwuQ::-webkit-scrollbar-track{background:#f5f5f5;background:var(--sk-color-gray-100, #f5f5f5);border-radius:4px}.GlobalSearch_c-searchItems-container__LhwuQ::-webkit-scrollbar-thumb{background:#1c4e86;background:var(--sk-color-primary-500, #1c4e86);border-radius:4px}.GlobalSearch_c-searchItems-container__LhwuQ::-webkit-scrollbar-thumb:hover{background:#1c4e86;background:var(--sk-color-primary-500, #1c4e86)}@media(max-width: 768px){.GlobalSearch_c-searchItems-container__LhwuQ{padding-top:0px;width:100%;height:100vh;max-height:calc(100vh - 40px)}}.GlobalSearch_c-search-wrapper-mobile__X--CO{height:100vh;width:100%;padding:4px;color:#262626;position:absolute;background:#fff;border-radius:4px;z-index:1050;z-index:var(--z-modal, 1050)}.GlobalSearch_c-search-wrapper-mobile__X--CO .GlobalSearch_c-search-container--footer__nCds1{height:10%;margin-bottom:5px}.GlobalSearch_c-search-panel-header__YDnUN{display:flex;align-items:center;position:absolute;left:-25px}.GlobalSearch_c-search-panel-header__YDnUN .GlobalSearch_c-search-panel-header--title__H1L7O{margin:0px 0 0 12px}.GlobalSearch_c-game-description-search-block__J2eX2 .GlobalSearch_c-game-description-sport__J9aNe{width:35px;height:35px}.GlobalSearch_c-search-loader-wrap__X-qO0{transform:scale(0.6)}.GlobalSearch_c-search-no-result-wrap__dmVhP{text-align:center}.GlobalSearch_c-search-no-result-wrap__dmVhP .GlobalSearch_c-search-svgIcon__tfQkn{height:200px;width:auto;display:inline-block;text-align:center;margin:12px}.GlobalSearch_c-search-no-result-wrap__dmVhP small{display:block;margin:12px}.GlobalSearch_c-search-item__tyuoY{cursor:pointer;padding:2px 0px;text-decoration:none;color:#333;color:var(--theme-color-text, #333)}.GlobalSearch_c-search-item__tyuoY:hover{background:#e0e0e0 .5%;background:var(--theme-panel-head-background-color-highlight, #e0e0e0) .5%}.GlobalSearch_c-search-item__tyuoY+.GlobalSearch_c-search-item__tyuoY{border-top:1px solid rgba(0,0,0,.1)}.GlobalSearch_c-searchItems-block-title__fCNen{margin:12px 0 1rem 0;margin:12px 0 var(--spacing-x0_5, 1rem) 0;font-size:16px;font-weight:400;line-height:1.5;display:flex;justify-content:space-between;background:#1c4e86;background:var(--theme-panel-head-background-color, #1c4e86);padding:1rem;padding:var(--spacing-x0_5, 1rem);color:#333;color:var(--theme-panel-head-color, #333);font-weight:700}.GlobalSearch_c-search-view-more-btn__Vz0Lj{font-size:16px;font-weight:400;line-height:1.5;cursor:pointer;display:inline-block;font-weight:700;color:#f50057;color:var(--theme-color-secondary, #f50057);margin-left:12px}.GlobalSearch_c-header-search-button__spbGQ.GlobalSearch_c-header-search-button__spbGQ{background:rgba(0,0,0,0);transition:all 150ms ease-in-out;transition:var(--theme-default-transition, all 150ms ease-in-out);color:#5b5b5b;color:var(--theme-header-text-color, #5b5b5b);border:1px solid #e0e0e0;border:1px solid var(--theme-color-border, #e0e0e0);margin-right:5px}@media(max-width: 768px){.GlobalSearch_c-header-search-button__spbGQ.GlobalSearch_c-header-search-button__spbGQ{padding:0px 17.6px}}.GlobalSearch_c-header-search-button__spbGQ.GlobalSearch_c-header-search-button__spbGQ:hover{background-color:#fff;background-color:var(--theme-color-white, #fff);color:#333;color:var(--theme-secondary-color, #333)}.GlobalSearch_c-search-wrapper-section__xYKO7{position:absolute;right:15%;top:60px;z-index:1060;z-index:var(--z-popover, 1060);box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);max-width:100%;min-width:600px;background:#ffffff;background:var(--theme-panel-content-background-color, #ffffff);padding:12px;border-radius:5px;border-radius:var(--theme-border-radius, 5px)}@media(max-width: 768px){.GlobalSearch_c-search-wrapper-section__xYKO7{top:0;width:100%;right:0;min-width:100%;border-radius:0;position:fixed}}.GlobalSearch_c-search-panel-mobile__P6nUC{display:flex;background-color:#fff}.GlobalSearch_c-search-panel-mobile__P6nUC .GlobalSearch_c-searchpanel-mobile-close--icon__qBVxC{margin-top:13.2px;margin-left:3px;cursor:pointer}
.ConcurrentGlobalSearch_search-pending__0cjl\+{opacity:.8;transition:opacity 200ms ease-in-out}.ConcurrentGlobalSearch_search-results-pending__sWwcu{opacity:.7;transition:opacity 150ms ease-in-out}.ConcurrentGlobalSearch_c-search-loader-wrap__MqoMa{display:flex;align-items:center;justify-content:center;padding:8px;min-height:24px}.ConcurrentGlobalSearch_c-searchpanel-input__R0DEJ:focus{outline:2px solid #007bff;outline:2px solid var(--primary-color, #007bff);outline-offset:2px;border-color:rgba(0,0,0,0)}.ConcurrentGlobalSearch_c-search-item__7FLZ9{transform:translateZ(0);will-change:transform,opacity}.ConcurrentGlobalSearch_c-search-item__7FLZ9:hover{transform:translateY(-1px);transition:transform 150ms ease-out}.ConcurrentGlobalSearch_c-searchItems-container__w5udF{transition:opacity 200ms ease-in-out}@media(max-width: 768px){.ConcurrentGlobalSearch_c-search-panel-mobile__coipT{position:relative;z-index:1000}.ConcurrentGlobalSearch_c-searchpanel-mobile-close--icon__OQhW7{cursor:pointer;padding:8px;color:#666;color:var(--text-secondary, #666)}.ConcurrentGlobalSearch_c-searchpanel-mobile-close--icon__OQhW7 .ConcurrentGlobalSearch_c-search-view-more-btn__SVl2p:hover{color:#0056b3;color:var(--primary-hover, #0056b3);text-decoration:underline}.ConcurrentGlobalSearch_c-searchpanel-mobile-close--icon__OQhW7 .ConcurrentGlobalSearch_c-search-view-more-btn__SVl2p small{margin-left:4px;font-size:.8em}}
.TextInput_text-input__JO4k\+{width:100%;font-size:14px;word-wrap:break-word;line-height:1em;outline:0;white-space:normal;min-height:2em;background-color:var(--sk-form-control-background-color);display:inline-block;padding:.7em 1em .7em 1em;box-shadow:none;border:1px solid var(--sk-border-color);border-radius:.3rem;color:var(--sk-form-control-text-color);transition:box-shadow .1s ease,width .1s ease;font-family:inherit}.TextInput_text-input__JO4k\+:hover{border-color:var(--sk-border-color-hover)}.TextInput_text-input__JO4k\+::-moz-placeholder{color:var(--sk-form-control-text-color);font-style:italic;opacity:.5}.TextInput_text-input__JO4k\+::placeholder{color:var(--sk-form-control-text-color);font-style:italic;opacity:.5}@supports(-webkit-overflow-scrolling: touch){.TextInput_text-input__JO4k\+:focus{font-size:16px}}.TextInput_text-input__invalid__vkm-K{border-color:var(--sk-error-color)}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.ComboBox_combobox__ggHBz{position:relative;font-size:12px;color:#5b5b5b;margin:0px 0px 0px 8px}input.ComboBox_combobox-input__gvcAn{padding-right:35px;color:#5b5b5b !important;background-color:#fff !important}input.ComboBox_combobox-input__open__ZmnOu{border-bottom-left-radius:0;border-bottom-right-radius:0}.ComboBox_combobox-toggle__du690{background-color:rgba(0,0,0,0);border:none;position:absolute;right:0;top:0;bottom:0;cursor:pointer;color:gray;display:flex;align-items:center;justify-content:center;width:35px}.ComboBox_combobox-toggle__open__jJGhZ{transform:rotate(180deg)}.ComboBox_combobox-dropdown__Rctwn{position:absolute;left:0;right:0;z-index:10;background-color:#fff;max-height:20rem;overflow-y:auto;overflow-x:hidden;outline:0;border-radius:0 0 .3rem .3rem;transition:opacity .1s ease;box-shadow:0 2px 3px 0 rgba(34,36,38,.15);border:0 solid #b8b8b8;color:#5b5b5b}.ComboBox_combobox-dropdown__open__X2egQ{border-right-width:1px;border-bottom-width:1px;border-left-width:1px}.ComboBox_combobox-dropdown-item__gmOEl{position:relative;cursor:pointer;display:block;height:auto;text-align:left;line-height:calc(smart-typography-line-height(1)*1em);text-transform:none;padding:.4rem 1.1rem;white-space:normal;word-wrap:normal;overflow:hidden;text-overflow:ellipsis;box-shadow:none}.ComboBox_combobox-dropdown-item__wrap__zJnPJ.ComboBox_combobox-dropdown-item__wrap__zJnPJ{white-space:normal}.ComboBox_combobox-dropdown-item__hl__rsEZB{background-color:#f5f5f5}.ComboBox_combobox-dropdown-item__active__4rjOc{background-color:#f5f5f5}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.SportbookSelector_c-sportbook-selector-icon__opQ5l{width:100px;height:30px;background-repeat:no-repeat;background-position:center;background-color:rgba(0,0,0,0);background-size:contain;width:25px;height:25px}.SportbookSelector_c-sportbook-selector-name__EokH8{padding:4px 0 0 6px;font-size:16px;font-weight:400;line-height:1.5}.SportbookSelector_c-sportbook-selector-item__dLo2e{display:flex}.SportbookSelector_c-sportbook-selector-input__vgfgs{margin-top:4px}@media(max-width: 768px){@supports(-webkit-overflow-scrolling: touch){.SportbookSelector_c-sportbook-selector-input__vgfgs:focus{font-size:16px;font-weight:400;line-height:1.5}}}.SportbookSelector_c-sportbook-selector__APSyq{width:110px;margin:0px 6px}.SportbookSelector_c-sportbook-selector-comboBox-item__Jpqsc.SportbookSelector_c-sportbook-selector-comboBox-item__Jpqsc{padding:4px}.SportbookSelector_c-sportbook-selector-list__Jm6ot::-webkit-scrollbar{width:5px}.SportbookSelector_c-sportbook-selector-list__Jm6ot::-webkit-scrollbar-thumb{background-color:#333;background-color:var(--theme-border-color, #333)}
.Tooltip_tooltip__dRZMF{color:var(--sk-tooltip-text-color);background-color:var(--sk-tooltip-background-color)}.Tooltip_tooltip__dRZMF .tippy-arrow{color:var(--sk-tooltip-background-color)}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.Profile_profile__xWcvS{display:flex;align-items:center;gap:.75rem}.Profile_profile__xWcvS .Profile_avatar__pTZg0{width:32px;height:32px;border-radius:50%;background:#f5f5f5;background:var(--sk-panel-content-background-color-highlight, #f5f5f5);border:2px solid #a7a7a7;overflow:hidden}.Profile_profile__xWcvS .Profile_avatar__pTZg0 img{width:100%;height:100%;object-fit:cover}.Profile_profile__xWcvS .Profile_info__LCBhX{display:flex;flex-direction:column}.Profile_profile__xWcvS .Profile_info__LCBhX .Profile_name__5AKAR{font-weight:500;font-size:.875rem;color:#5b5b5b}.Profile_profile__xWcvS .Profile_info__LCBhX .Profile_role__muXeJ{font-size:.75rem;color:#7d7d7d}.Profile_profile__xWcvS .Profile_dropdown__taK5a{position:relative}.Profile_profile__xWcvS .Profile_dropdown__taK5a .Profile_menu__HKDI7{position:absolute;top:100%;right:0;background:#fff;border:1px solid #a7a7a7;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.1);min-width:150px;z-index:1000}.Profile_profile__xWcvS .Profile_dropdown__taK5a .Profile_menu__HKDI7 .Profile_menuItem__RViQU{padding:24px 40px;cursor:pointer;border-bottom:1px solid #eee}.Profile_profile__xWcvS .Profile_dropdown__taK5a .Profile_menu__HKDI7 .Profile_menuItem__RViQU:hover{background:#f5f5f5;background:var(--sk-panel-content-background-color-highlight, #f5f5f5)}.Profile_profile__xWcvS .Profile_dropdown__taK5a .Profile_menu__HKDI7 .Profile_menuItem__RViQU:last-child{border-bottom:none}.Profile_c-header-profile-name__bMKlq{text-transform:lowercase;margin-left:5px;font-weight:400}@media(max-width: 767px){.Profile_c-header-profile-name__bMKlq{text-transform:uppercase;font-weight:500;font-size:11px;margin-top:6px;margin-left:0;display:inline-block}}.Profile_c-header-profile-button__TDiDE{display:flex;align-items:center}@media(max-width: 767px){.Profile_c-header-profile-button__TDiDE{flex-flow:column;background-color:rgba(0,0,0,0);border:none;color:#f1f2f3}}.Profile_c-header-profile-icon__DluEN{height:17px}@media(max-width: 767px){.Profile_c-header-profile-icon__DluEN{font-size:17px;height:auto}}.Profile_c-header-profile-tooltip__NqyEv{color:#5b5b5b;background-color:#fff;box-shadow:0 0 10px #505050}.Profile_c-header-profile-tooltip__NqyEv .tippy-arrow{color:#fff}.Profile_c-header-profile-tooltip__NqyEv .tippy-content{padding:0}.Profile_c-header-profile-menu-item__Ue-Hw{display:flex;align-items:center;padding:10px 15px 10px 10px;width:100%;border:none;outline:none;color:#5b5b5b;background-color:rgba(0,0,0,0);text-decoration:none;cursor:pointer}.Profile_c-header-profile-menu-item__Ue-Hw:hover{background-color:#dbdbdb}.Profile_c-header-profile-menu-item__Ue-Hw:first-child{border-top-right-radius:5px;border-top-left-radius:5px}.Profile_c-header-profile-menu-item__Ue-Hw:last-child{border-bottom-right-radius:5px;border-bottom-left-radius:5px}.Profile_c-header-profile-menu-item__Ue-Hw+.Profile_c-header-profile-menu-item__Ue-Hw{border-top:1px solid #dbdbdb}.Profile_c-header-profile-menu-item-icon__uc98s{margin-right:7px}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.Buttons_c-header-button--register__wv7mq.Buttons_c-header-button--register__wv7mq,.Buttons_c-header-button--login__C0F8V.Buttons_c-header-button--login__C0F8V,.Buttons_c-header-button__HRl7z{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-align:start;border-radius:25px;padding:0 1.2em;cursor:pointer;border:none;font-family:"Open Sans",sans-serif;font-size:14px;font-weight:600;line-height:18.06px;text-transform:uppercase;height:40px;width:auto;white-space:nowrap;min-width:auto;min-height:auto}.Buttons_c-header-button--register__wv7mq:hover,.Buttons_c-header-button--login__C0F8V:hover,.Buttons_c-header-button__HRl7z:hover,.Buttons_c-header-button--register__wv7mq:focus,.Buttons_c-header-button--login__C0F8V:focus,.Buttons_c-header-button__HRl7z:focus,.Buttons_c-header-button--register__wv7mq:active,.Buttons_c-header-button--login__C0F8V:active,.Buttons_c-header-button__HRl7z:active,.Buttons_c-header-button--register__wv7mq:visited,.Buttons_c-header-button--login__C0F8V:visited,.Buttons_c-header-button__HRl7z:visited{text-decoration:none}.Buttons_buttons__TOYLB{display:flex;align-items:center;gap:1rem}.Buttons_c-header-button__HRl7z{background-color:rgba(0,0,0,0);font-family:"Open Sans",sans-serif;color:#5b5b5b !important;font-weight:400 !important;border:1px solid #eaeded;border-radius:25px;padding:0px 16.8px;margin:0px 5px 0px 0px;width:auto;line-height:18.06px}@media(max-width: 767px){.Buttons_c-header-button__HRl7z{height:40px}}@media(min-width: 768px)and (max-width: 1024px){.Buttons_c-header-button__HRl7z{height:40px;padding:0 12px}}.Buttons_c-header-button--login__C0F8V.Buttons_c-header-button--login__C0F8V{background:#e67917 !important;background-color:#e67917 !important;transition:.2s ease-in-out;color:#fff !important;border:0 none !important;font-weight:600 !important;min-width:auto;justify-content:normal;gap:normal;font-family:"Open Sans",sans-serif !important;padding:0px 16.8px !important;border-radius:25px !important;margin:0px 0px 0px 5px !important;width:auto !important;font-size:14px !important;line-height:18.06px}@media(max-width: 767px){.Buttons_c-header-button--login__C0F8V.Buttons_c-header-button--login__C0F8V{padding:0px 20px !important;font-size:12.6px !important;line-height:16.254px !important}}.Buttons_c-header-button--login__C0F8V.Buttons_c-header-button--login__C0F8V:hover{background-color:hsla(0,0%,100%,.1);color:#fff}.Buttons_c-header-button--login__C0F8V.Buttons_c-header-button--login__C0F8V+.Buttons_c-header-button--register__wv7mq,.Buttons_c-header-button--login__C0F8V.Buttons_c-header-button--login__C0F8V+.Buttons_c-header-button--login__C0F8V{margin-left:5px}.Buttons_c-header-buttons__EF882{flex:0 1 auto;display:flex;align-items:center;justify-content:normal;background-color:rgba(0,0,0,0);border:none;border-radius:0;padding:0;margin:0;height:40px;line-height:18.06px;gap:normal !important}@media(max-width: 767px){.Buttons_c-header-buttons__EF882{gap:normal !important;padding:8px;height:56px;justify-content:flex-end;margin-left:auto;text-align:start}}.Buttons_c-header-search-button__u2myA.Buttons_c-header-search-button__u2myA{background:rgba(0,0,0,0) !important;background-color:rgba(0,0,0,0) !important;transition:.2s ease-in-out;color:#fff !important;border:1px solid #eaeded !important;font-family:Arial !important;font-weight:600 !important;font-size:14px;line-height:normal;padding:0px 16.8px !important;margin:0px 5px 0px 0px !important;border-radius:25px !important;width:auto;min-width:auto;height:40px;display:flex;align-items:center;justify-content:normal;gap:normal;position:static;text-align:center;text-decoration:none;text-transform:uppercase}.Buttons_c-header-search-button__u2myA.Buttons_c-header-search-button__u2myA svg,.Buttons_c-header-search-button__u2myA.Buttons_c-header-search-button__u2myA .Buttons_sk-icon__23jlb,.Buttons_c-header-search-button__u2myA.Buttons_c-header-search-button__u2myA [class*=icon]{color:inherit;fill:currentColor}@media(max-width: 767px){.Buttons_c-header-search-button__u2myA.Buttons_c-header-search-button__u2myA{padding:0 12px !important;font-size:12.6px !important}}.Buttons_c-header-search-button__u2myA.Buttons_c-header-search-button__u2myA:hover{background-color:rgba(0,0,0,.05);color:#e67917}.Buttons_search-icon__H-Kmy{color:#fff !important;fill:#fff !important;width:14px !important;height:14px !important;margin-right:0 !important}@media(max-width: 767px){.Buttons_search-icon__H-Kmy{width:12.59px !important;height:12.59px !important}}.Buttons_c-header-button--register__wv7mq.Buttons_c-header-button--register__wv7mq{background:rgba(0,0,0,0) !important;background-color:rgba(0,0,0,0) !important;border:1px solid #a7a7a7 !important;border-radius:25px !important;color:#fff !important;font-weight:600 !important;justify-content:normal;gap:normal;padding:0px 16.8px !important;margin:0px 0px 0px 5px !important;transition:.2s ease-in-out;font-family:"Open Sans",sans-serif !important;width:auto !important;min-width:auto;line-height:18.06px !important}.Buttons_c-header-button--register__wv7mq.Buttons_c-header-button--register__wv7mq:hover{background-color:rgba(230,121,23,.9) !important;color:#fff}@media(max-width: 767px){.Buttons_c-header-button--register__wv7mq.Buttons_c-header-button--register__wv7mq{padding:0 10px !important;min-width:auto;color:#f1c884 !important;border-color:#f1c884 !important}}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.Header_c-header__5bu95{height:70px;background-color:#262626;color:#5b5b5b;margin-bottom:32px;position:fixed;top:0;left:0;width:100%;z-index:9000;transition:.3s ease-in,background .5s ease-in;box-shadow:none;box-sizing:border-box;line-height:18.06px;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased}@media(max-width: 767px){.Header_c-header__5bu95{margin-bottom:0;text-align:start;background-color:#262626}}.Header_c-header-open__ZT-NR{height:100%;overflow-y:scroll}.Header_c-header-sub-wrap__7R9wh{max-width:1300px;margin-left:auto;margin-right:auto;display:flex;align-items:center;height:70px}@media(max-width: 767px){.Header_c-header-sub-wrap__7R9wh{max-width:100%;padding:0px 8px}}.Header_c-header-logo__\+drYV{display:block;padding:0 8px 0 0;margin:0}@media(max-width: 767px){.Header_c-header-logo__\+drYV{padding-right:0}}.Header_c-header-burger-btn__I-0Hn>input[type=checkbox]{display:none}.Header_c-header-burger-btn__I-0Hn{cursor:pointer;-webkit-user-select:none;user-select:none;display:none;padding:0 8px;align-items:normal;justify-content:normal}@media(max-width: 767px){.Header_c-header-burger-btn__I-0Hn{display:block}}.Header_c-header-burger-btn-icon__4Vbnf{margin:auto;height:2px;width:20px;border-radius:2px;background-color:#fff;background-color:var(--theme-color-white, #fff);position:relative;display:block;transition:all .2s ease-in-out}.Header_c-header-burger-btn-icon__4Vbnf:before{top:-7px;visibility:visible}.Header_c-header-burger-btn-icon__4Vbnf:after{top:7px}.Header_c-header-burger-btn-icon__4Vbnf:before,.Header_c-header-burger-btn-icon__4Vbnf:after{height:2px;width:20px;border-radius:2px;background-color:#fff;background-color:var(--theme-color-white, #fff);position:absolute;content:"";transition:all .2s ease-in-out}.Header_c-header-burger-btn__I-0Hn>input[type=checkbox]:checked~.Header_c-header-burger-btn-icon__4Vbnf{background:rgba(0,0,0,0)}.Header_c-header-burger-btn__I-0Hn>input[type=checkbox]:checked~.Header_c-header-burger-btn-icon__4Vbnf:before{transform:rotate(45deg) translate(5px, 5px);opacity:1}.Header_c-header-burger-btn__I-0Hn>input[type=checkbox]:checked~.Header_c-header-burger-btn-icon__4Vbnf:after{transform:rotate(-45deg) translate(5px, -5px)}.Header_c-tour-button__MJfTg,.Header_c-theme-button__QNP5b{width:35px;height:35px;background:rgba(0,0,0,0);color:#fff;color:var(--theme-color-white, #fff);border:1px solid #333;border:1px solid var(--theme-color-text, #333);border-radius:5px;margin-left:auto}.Header_c-tour-button__MJfTg.Header_c-theme-button__QNP5b,.Header_c-theme-button__QNP5b.Header_c-theme-button__QNP5b{margin-left:12px}.Header_c-tour-button-circle-icon__hcor\+{color:#fff;color:var(--theme-color-white, #fff)}.Header_c-tour-button-help-icon__I04HY{color:#ff9800;color:var(--theme-color-secondary, #ff9800)}.Header_c-tour-button-wrapper__KUK02{background:rgba(0,0,0,0);border:none;padding:0;transition:all 150ms ease-in-out;transition:var(--theme-default-transition, all 150ms ease-in-out);cursor:pointer}.Header_c-tour-button-wrapper__KUK02:hover{transform:scale(1.4)}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.Footer_c-footer__NpXII{display:block;max-height:none;margin-top:auto;color:#fff;background-color:#424242;width:100%;padding-top:28px;padding-bottom:0;padding-left:0;padding-right:0;box-sizing:border-box;line-height:18.06px;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;overflow:visible;height:293.9px;min-height:235px}@media(min-width: 768px)and (max-width: 1023px){.Footer_c-footer__NpXII{height:auto;min-height:326px}}@media(max-width: 767px){.Footer_c-footer__NpXII{padding-bottom:40px;text-align:start;height:auto;min-height:235px;max-width:none;max-height:none;overflow:visible}}.Footer_c-footer-icon-wrap__W-L2P{text-align:center;padding:0px 1em;background-color:rgba(0,0,0,0)}.Footer_c-footer-icon-wrap__W-L2P .Footer_c-footer-icon-list__9Ik5q.Footer_c-footer-icon-list__9Ik5q{font-size:1.4em;color:#fff;line-height:25.284px;text-decoration:none;transition:.15s ease-in-out}.Footer_c-footer-icon-wrap__W-L2P .Footer_c-footer-icon-list__9Ik5q.Footer_c-footer-icon-list__9Ik5q:hover{color:#ccc;text-decoration:none}.Footer_c-footer-icon-wrap__W-L2P .Footer_c-footer-icon-list__9Ik5q.Footer_c-footer-icon-list__9Ik5q+.Footer_c-footer-icon-list__9Ik5q{margin-left:2em;transition:.15s ease-in-out}.Footer_c-footer-nav-wrap__Xw-KK{text-align:center;background-color:rgba(0,0,0,0);margin:22.4px 0px;padding:0px 1em;background-color:rgba(0,0,0,0)}.Footer_c-footer-nav-wrap__Xw-KK .Footer_c-footer-nav-list__qW3QC{color:#fff;text-decoration:none;transition:.15s ease-in-out}.Footer_c-footer-nav-wrap__Xw-KK .Footer_c-footer-nav-list__qW3QC:hover{color:#ccc}@media(max-width: 767px){.Footer_c-footer-nav-wrap__Xw-KK .Footer_c-footer-nav-list__qW3QC{display:block;padding:4.2px 0}}.Footer_c-footer-nav-wrap__Xw-KK .Footer_c-footer-nav-list__qW3QC+.Footer_c-footer-nav-list__qW3QC{margin-left:2em}@media(max-width: 767px){.Footer_c-footer-nav-wrap__Xw-KK .Footer_c-footer-nav-list__qW3QC+.Footer_c-footer-nav-list__qW3QC{margin-left:0;margin-top:.25em;transition:.15s ease-in-out}}.Footer_c-footer-copy-content-wrap__WNkk8{text-align:center;background-color:rgba(0,0,0,0);padding:0px 1em;background-color:rgba(0,0,0,0)}@media(max-width: 767px){.Footer_c-footer-copy-content-wrap__WNkk8{padding-bottom:5.8px}}.Footer_c-footer-copy-content-wrap__WNkk8 p{max-width:1100px;font-size:.9em;line-height:16.254px;display:inline-block;margin-top:0;margin-bottom:0;transition:all}.Footer_c-footer-copy-wrap__sgRIM{text-align:center;border-top:1px solid #444;border-top:1px solid var(--theme-border-color, #444);padding:16.8px;margin-top:28px;transition:all;background-color:rgba(0,0,0,0)}.Footer_c-footer-nav-item__nmqUe{margin-right:12px;color:#fff;text-decoration:none;text-transform:uppercase}.Footer_c-footer-nav-item__nmqUe:hover{color:#fff;text-decoration:none;border-bottom:2px solid #607d8b}.Footer_c-footer-copy__zxryS{color:#aaa;line-height:1.333}.Footer_c-footer-social__510TB{height:35px}.Footer_c-footer-socialIcon__8Mlko{float:right;margin-left:4px;cursor:pointer;height:35px;width:35px}.Footer_c-footer-disclaimer__Nao72{padding-top:10px;margin:0px;line-height:16.254px;font-size:.85em;transition:all}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.BottomMenu_c-bottom-menu__X23Lg{display:flex;align-items:center;justify-content:space-between;height:50px;background-color:#353535;position:fixed;bottom:0;left:0;width:100%;z-index:9999;padding:0px 4px}@media(min-width: 769px){.BottomMenu_c-bottom-menu__X23Lg{display:none !important}}.BottomMenu_c-bottom-menu-item__\+aPSk{position:relative;display:flex;flex-direction:column;align-items:center;font-size:11px;border:none;background:rgba(0,0,0,0);color:#5b5b5b}.BottomMenu_c-bottom-menu-item__active__1Z3uk{color:#333;color:var(--theme-secondary-color, #333)}.BottomMenu_c-bottom-menu-item-icon__jxTs1{margin-bottom:5px;font-size:16px;font-weight:400;line-height:1.5}.BottomMenu_c-bottom-menu-item-badge__bYUo3{position:absolute;top:-6px;right:6px;background-color:#333;background-color:var(--theme-secondary-color, #333);color:#fff;color:var(--theme-color-white, #fff);font-size:11px;border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center}.BottomMenu_c-bottom-button__cURgV{display:flex;justify-content:center;align-items:center;cursor:pointer;border-radius:25px;color:#fff;color:var(--theme-color-white, #fff);font-size:16px;font-weight:400;line-height:1.5;text-decoration:none;font-weight:600;font-weight:var(--font-weight-600, 600);height:30px;width:35px;background:rgba(0,0,0,0);border:1px solid #a7a7a7;transition:all 150ms ease-in-out}.BottomMenu_c-bottom-menu-group-item--box-link__Fg2S7{color:#f1f2f3 !important;text-decoration:none;font-weight:400 !important}.BottomMenu_c-bottom-menu-group-wrapper__dWvW\+{display:flex;justify-content:space-between;width:100%}.BottomMenu_c-bottom-menu-group-wrapper__dWvW\+ .BottomMenu_c-bottom-menu-group-item__EwqOt{flex:1 0 20% !important;width:auto;height:50px;display:flex;align-items:center;justify-content:center;color:#f1f2f3 !important}.BottomMenu_c-bottom-menu-group-wrapper__dWvW\+ .BottomMenu_c-bottom-menu-group-item__EwqOt.BottomMenu_c-bottom-menu-group-item--badge__R5Zps{top:0;position:relative}.BottomMenu_c-bottom-menu-group-wrapper__dWvW\+ .BottomMenu_c-bottom-menu-group-item__EwqOt.BottomMenu_c-bottom-menu-group-item--badge__R5Zps .BottomMenu_c-bottom-menu-group-item--box__0Weof{border-radius:4px;padding:4px;width:55px}.BottomMenu_c-bottom-menu-group-wrapper__dWvW\+ .BottomMenu_c-bottom-menu-group-item--box__0Weof{background-color:rgba(0,0,0,0);border:none;border-radius:0;padding:0;width:auto;height:auto;display:flex;align-items:center;flex-flow:column;justify-content:center;text-align:center;position:static;color:#f1f2f3 !important;font-weight:400}.BottomMenu_c-bottom-menu-group-wrapper__dWvW\+ .BottomMenu_c-bottom-menu-item-icon__jxTs1{color:#f1f2f3 !important;font-size:17px;margin:0px 0px 5px !important}.BottomMenu_c-bottom-menu-group-wrapper__dWvW\+ .BottomMenu_c-bottom-menu-group-item--label__sCuYv{text-transform:uppercase;font-weight:500 !important;font-size:11px !important;margin:2px 0px 0px !important;color:#f1f2f3}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.Layout_layout-container__0nCRo{padding-top:84px;width:100%;max-width:1272px;margin:0 auto -235px;padding-left:32px;padding-right:32px;padding-bottom:24px;box-sizing:border-box;min-height:100%;height:auto}@media(max-width: 767px){.Layout_layout-container__0nCRo{padding-top:75px;padding-left:8px;padding-right:8px;overflow:hidden}}.Layout_c-footer-push__BEFWC{min-height:235px;display:block}.Layout_u-clearfix__bwmRt:after{content:" ";display:table;clear:both}
.AuthRoute_auth-loading__7Sm1A{height:50vh;display:flex;align-items:center;justify-content:center}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.NoItems_no-items__WHaD1{text-align:center;padding:12px 0}@media(max-width: 767px){.NoItems_no-items__WHaD1{display:flex;flex-direction:column;align-items:center;justify-content:center}}.NoItems_no-items--compact__Gw6AY{padding:4px 0}.NoItems_no-items--ticker__zd7g\+{padding:4px 0;height:70px;display:flex;align-items:center;justify-content:center;flex-direction:column}.NoItems_no-items-image__3mROa.NoItems_no-items-image__3mROa{width:100%;max-width:120px;max-height:120px;display:block;margin:0px auto;object-fit:contain}@media(max-width: 767px){.NoItems_no-items-image__3mROa.NoItems_no-items-image__3mROa{max-width:80px;max-height:80px}}.NoItems_no-items-image--compact__cLU9S.NoItems_no-items-image--compact__cLU9S{max-width:60px;max-height:60px}@media(max-width: 767px){.NoItems_no-items-image--compact__cLU9S.NoItems_no-items-image--compact__cLU9S{max-width:40px;max-height:40px}}.NoItems_no-items-image--ticker__fF18P.NoItems_no-items-image--ticker__fF18P{max-width:40px;max-height:40px;margin-bottom:2px}@media(max-width: 767px){.NoItems_no-items-image--ticker__fF18P.NoItems_no-items-image--ticker__fF18P{max-width:30px;max-height:30px}}
.SeoTitle_c-seoTitle__l8CSU{display:inline !important;font-size:16px;font-weight:600}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.FantasyDraftResults_c-fantasy-draft-results__1uGPn{display:flex;flex-direction:column;height:100%;min-height:100vh;background-color:#121212;color:#f0f0f0;position:relative}.FantasyDraftResults_c-fantasy-draft-results-header__Ua\+xl{justify-content:space-between;align-items:center;padding:12px 20px;background-color:#1a1a1a;border-bottom:1px solid #2a2a2a;z-index:10}.FantasyDraftResults_c-fantasy-draft-results-header-back__Ofvit{display:inline-flex;text-decoration:none;font-size:16px;margin-bottom:8.8px}.FantasyDraftResults_c-fantasy-draft-results-header-back__Ofvit:hover{color:#333;color:var(--theme-primary-color, #333)}.FantasyDraftResults_c-fantasy-draft-results-header-back__Ofvit svg{margin-right:5px}.FantasyDraftResults_c-fantasy-draft-results-header-content__KrSoL{flex:1 1;justify-content:center;padding:8px}.FantasyDraftResults_c-fantasy-draft-results-header-title__lNyhJ{font-size:1.8rem;font-weight:700}.FantasyDraftResults_c-fantasy-draft-results-header-description__2NwOq{color:#aaa;margin-bottom:13.2px}.FantasyDraftResults_c-fantasy-draft-results-header-share-text__vEQd6{margin-right:8.8px;font-size:.9rem}.FantasyDraftResults_c-fantasy-draft-results-header-share-button__2GpS8{background-color:#333;border:none;border-radius:4px;padding:8px 12px;cursor:pointer}.FantasyDraftResults_c-fantasy-draft-results-header-share-button__2GpS8:hover{background-color:#444}.FantasyDraftResults_c-fantasy-draft-results-header-tabs-tab__vUV7I{border-bottom:3px solid rgba(0,0,0,0)}.FantasyDraftResults_c-fantasy-draft-results-header-tabs-tab-active__t\+dok{border-color:#333;border-color:var(--theme-primary-color, #333);background-color:rgba(28,78,134,.2);border:1px solid #333;border:1px solid var(--theme-primary-color, #333);background-color:#333;background-color:var(--theme-primary-color, #333)}.FantasyDraftResults_c-fantasy-draft-results-header-tabs-tab__vUV7I:hover{background-color:#252525}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector__TpTpK{overflow-x:auto}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector__TpTpK::-webkit-scrollbar{height:4px}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector__TpTpK::-webkit-scrollbar-track{background:#252525}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector__TpTpK::-webkit-scrollbar-thumb{background:#444}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-item__WJihF{flex:0 0 auto;padding:4px 10px;border-radius:20px}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-item-icon__SV5YH{width:25px;height:25px;background-color:#555;color:#fff;border-radius:50%;font-size:.8rem;width:35px;height:35px}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-item-name__8j5fr{text-align:center;font-size:1.2rem;width:20px;height:20px}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-content__fQjAf{padding:20px;background-color:#181818;overflow-y:auto}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-team__\+NcfY{display:grid;grid-template-columns:repeat(1, 1fr);grid-gap:10.8px;gap:10.8px;margin-left:8.8px}@media(min-width: 640px){.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-team__\+NcfY{grid-template-columns:repeat(2, 1fr)}}@media(min-width: 1024px){.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-team__\+NcfY{grid-template-columns:repeat(3, 1fr)}}@media(min-width: 1280px){.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-team__\+NcfY{grid-template-columns:repeat(4, 1fr)}}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-player-card__2mfbt{border-radius:8px;overflow:hidden;border:1px solid #333;box-shadow:0 2px 4px rgba(0,0,0,.2)}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector-player-card-header__5dLYD{padding:12px;border-bottom:1px solid #333;font-size:16px}.FantasyDraftResults_c-fantasy-draft-results-header-name__pkqX0{font-size:1.1rem}.FantasyDraftResults_c-fantasy-draft-results-header-pick__acSk8{display:inline-block;padding:3px 8px;border-radius:12px}.FantasyDraftResults_c-fantasy-draft-results-header-stats__XZG6j{grid-gap:7.2px;gap:7.2px}.FantasyDraftResults_c-fantasy-draft-results-header-empty-slot__lIfZr{background-color:#262626;border:1px dashed #505050;color:#7d7d7d;height:180px}@media(min-width: 768px){.FantasyDraftResults_c-fantasy-draft-results-header-tabs__ZW9i0{padding:0px}.FantasyDraftResults_c-fantasy-draft-results-header-team-selector__TpTpK{padding:4px}}
.TeamNameInput_teamNameInput__Qhz2I{display:flex;align-items:center;width:100%;margin-bottom:8px}.TeamNameInput_index__33SyA{min-width:2rem;text-align:right;margin-right:1rem;margin-right:var(--spacing-x1, 1rem);color:#fff;font-size:16px}.TeamNameInput_inputWrapper__Irs35{flex:1 1;display:flex;flex-direction:column;width:100%}.TeamNameInput_input__AaGBr{flex:1 1;padding:8px .75rem;border:1px solid rgba(0,0,0,0);border-radius:4px;font-size:16px;color:#fff;background:#181818;transition:border-color .2s}.TeamNameInput_input__AaGBr:focus{outline:none;border-color:#5b5b5b}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.FantasySportsOrderGenerator_resultsPageWrapper__eT7Q8{min-height:calc(100vh - 160px);display:flex;flex-direction:column;justify-content:flex-start;align-items:center;position:relative;padding:32px 1rem;width:100%;box-sizing:border-box;margin-top:60px}.FantasySportsOrderGenerator_widgetContainer__YwhKK{background:#252525;border:1px solid #333;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.2);padding:17.6px;width:100%;margin:0px auto;box-sizing:border-box}@media(max-width: 768px){.FantasySportsOrderGenerator_widgetContainer__YwhKK{padding:16px}}.FantasySportsOrderGenerator_blockTitle__s9xID{font-size:1.6rem;font-weight:800;color:#333;color:var(--theme-primary-color, #333);margin-bottom:17.6px;letter-spacing:.5px}@media(max-width: 768px){.FantasySportsOrderGenerator_blockTitle__s9xID{font-size:1.4rem;margin-bottom:22px}}.FantasySportsOrderGenerator_instructions__RAwzj{background:#303030;border-radius:6px;padding:16px;margin-bottom:17.6px}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj{padding:12px;margin-bottom:22px}}.FantasySportsOrderGenerator_instructions__RAwzj h3{font-size:16px;font-weight:600}.FantasySportsOrderGenerator_instructions__RAwzj p{color:#aaa;font-size:.98rem;margin:0px}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj p{font-size:.9rem}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_form__UJ1lF{display:flex;flex-direction:column;grid-gap:18px;gap:18px}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_form__UJ1lF{grid-gap:14.4px;gap:14.4px}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_label__-uzR7{font-weight:700;color:#fff;margin-bottom:.35rem;display:block;font-size:16px}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_label__-uzR7{font-size:.95rem}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_input__5OV1c,.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_select__9AcSQ{width:100%;padding:8px .75rem;border:1px solid #444;border-radius:4px;font-size:16px;color:#fff;background:#181818;margin-bottom:.05rem;transition:border-color .2s;width:auto;min-width:80px;max-width:120px}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_input__5OV1c,.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_select__9AcSQ{font-size:.95rem;padding:8px .65rem}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_input__5OV1c:focus,.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_select__9AcSQ:focus{outline:none;border-color:#333;border-color:var(--theme-primary-color, #333)}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_input__5OV1c{width:100%;max-width:100%;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_teamInputGroup__m8JVL{position:relative;background:#252525;padding:1rem;padding:var(--spacing-x1_25, 1rem);border-radius:8px;border:1px solid #333;width:100%;box-sizing:border-box;box-shadow:0 2px 4px rgba(0,0,0,.1);transition:all .3s ease}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_teamInputGroup__m8JVL:hover{box-shadow:0 4px 8px rgba(0,0,0,.15);transform:translateY(-2px)}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_teamInputGroup__m8JVL{padding:16px}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_teamNumber__8nh7C{position:absolute;top:-12px;left:-12px;width:24px;height:24px;background-color:#f0f0f0;color:#252525;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;font-weight:400;line-height:1.5;z-index:1;box-shadow:0 2px 4px rgba(0,0,0,.2)}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_teamNameToggle__tz7w7{width:100%;margin-bottom:8.8px}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_toggleLabel__gkzzs{display:inline-flex;align-items:center;grid-gap:7.2px;gap:7.2px;color:#fff;font-size:.95rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_toggleInput__6ubvf{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_toggleSlider__QZFCs{position:relative;display:inline-block;width:44px;height:24px;background-color:#444;border-radius:12px;transition:.3s}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_toggleSlider__QZFCs:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;border-radius:50%;transition:.3s}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_toggleInput__6ubvf:checked+.FantasySportsOrderGenerator_toggleSlider__QZFCs{background-color:#333;background-color:var(--theme-primary-color, #333)}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_toggleInput__6ubvf:checked+.FantasySportsOrderGenerator_toggleSlider__QZFCs:before{transform:translateX(20px)}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_toggleInput__6ubvf:focus+.FantasySportsOrderGenerator_toggleSlider__QZFCs{box-shadow:0 0 1px #333;box-shadow:0 0 1px var(--theme-primary-color, #333)}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_emailInputWrapper__CG0Z4{width:100%;margin-top:4.4px}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_emailRow__c568f{display:flex;align-items:center;margin-bottom:2.2px}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_emailLabel__NfQUJ{display:flex;align-items:center;font-size:16px;color:#fff;grid-gap:.5rem;gap:.5rem}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_emailLabel__NfQUJ{font-size:.95rem}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_emailLabel__NfQUJ input[type=checkbox]{margin-right:8.8px}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_button__lL2gd{width:100%;padding:12px 0;background:#333;background:var(--theme-primary-color, #333);color:#fff;border:none;border-radius:4px;font-size:1.1rem;font-weight:800;cursor:pointer;margin-top:22px;box-shadow:0 1px 4px rgba(0,0,0,.08);letter-spacing:.5px;transition:background .2s,color .2s}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_button__lL2gd{padding:8px 0;font-size:16px;margin-top:17.6px}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_button__lL2gd:hover,.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_button__lL2gd:focus{background:rgb(25.2,70.2,120.6);color:#fff}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_error__cy89y{color:#ff7675;font-size:.95rem;margin-bottom:.1rem;margin-top:.05rem}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_error__cy89y{font-size:.9rem}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsContainer__kr6ib{margin-top:1rem;margin-top:var(--spacing-x4, 1rem);text-align:center}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_successHeading__eLC5W{color:#4caf50;font-size:16px;font-weight:800;margin:0px 0 24px;text-shadow:0 2px 4px rgba(0,0,0,.2);text-align:center}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_successHeading__eLC5W{font-size:1.75rem;margin-bottom:22px}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_results__y66ZZ{background:#252525;border-radius:8px;padding:17.6px;margin-bottom:17.6px;border-radius:8px;padding:17.6px;margin-bottom:17.6px;border:1px solid #333;box-shadow:0 2px 8px rgba(0,0,0,.15)}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_results__y66ZZ h4{color:#333;color:var(--theme-primary-color, #333);font-size:1.4rem;font-weight:700;margin:0px 0 16px 0}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_results__y66ZZ ol{margin:0px;padding-left:24px;text-align:left}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_results__y66ZZ ol li{color:#fff;font-size:1.1rem;margin-bottom:13.2px;line-height:1.5}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_results__y66ZZ ol li:last-child{margin-bottom:0}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_results__y66ZZ{padding:1rem;padding:var(--spacing-x1_25, 1rem);margin-bottom:22px}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_results__y66ZZ h4{font-size:1.2rem;margin-bottom:13.2px}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_results__y66ZZ ol li{font-size:16px;margin-bottom:8.8px}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_tableWrapper__tUyOA{width:100%;overflow-x:auto;margin:0px -16px;padding:0px 16px;-webkit-overflow-scrolling:touch}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_tableWrapper__tUyOA{margin:0px -12px;padding:0px 12px}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh{width:100%;min-width:600px;border-collapse:collapse;margin:16px 0;background:#181818;border:1px solid #333;border-radius:6px;overflow:hidden}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh th,.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh td{padding:12px 16px;text-align:left;border-bottom:1px solid #333;color:#fff;font-size:16px;word-wrap:break-word;overflow-wrap:break-word}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh th,.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh td{padding:8px 12px;font-size:.95rem}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh th{background:#252525;color:#333;color:var(--theme-primary-color, #333);font-weight:800;font-size:1.05rem;white-space:nowrap}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh th:first-child{width:15%}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh th:nth-child(2){width:45%}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh th:nth-child(3){width:40%}@media(max-width: 768px){.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh th{font-size:16px}}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh td:first-child{font-weight:700;color:#333;color:var(--theme-primary-color, #333)}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh tr:last-child td{border-bottom:none}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_resultsTable__-jroh tr:hover td{background:#2a2a2a}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_inputGroup__jGEH4{display:flex;flex-direction:column;grid-gap:0;gap:0;margin-bottom:.2rem;width:100%;max-width:100%}.FantasySportsOrderGenerator_instructions__RAwzj .FantasySportsOrderGenerator_offWhite__GQjM6.FantasySportsOrderGenerator_offWhite__GQjM6{color:#f0f0f0}.FantasySportsOrderGenerator_instructions__RAwzj .c-popup-notification-popup--wrapper{z-index:9999 !important}.FantasySportsOrderGenerator_emailSection__PW3Xo{width:100%;max-width:100%;margin-top:17.6px}.FantasySportsOrderGenerator_emailInputGroup__42aKO{width:100%;max-width:100%;margin-top:8.8px}.teamNameInput{flex:1 1;min-width:0;margin-bottom:0}@media(max-width: 768px){.teamNameInput{width:100%}}.FantasySportsOrderGenerator_teamsGrid__N9VhO{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));grid-gap:18px;gap:18px;margin-bottom:22px;width:100%;box-sizing:border-box;max-width:1200px;margin-left:auto;margin-right:auto}@media(max-width: 768px){.FantasySportsOrderGenerator_teamsGrid__N9VhO{grid-template-columns:1fr;grid-gap:14.4px;gap:14.4px}}.FantasySportsOrderGenerator_resultsSection__px-Cf{background:#303030;border-radius:6px;padding:1rem;padding:var(--spacing-x1_25, 1rem);margin-top:1rem;margin-top:var(--spacing-x4, 1rem)}@media(max-width: 768px){.FantasySportsOrderGenerator_resultsSection__px-Cf{padding:16px;margin-top:22px}}
/**
* Custom Icon System CSS - Font Awesome Replacement
*
* Base styles for the custom SVG icon system.
* Provides consistent sizing, hover states, and interactive styles.
*/
/* Base icon styles */
.sk-icon {
display: inline-block;
/* VISUAL PARITY FIX 2025-12-22: Match FontAwesome vertical-align (-1.75px vs middle) */
vertical-align: -1.75px;
line-height: 1;
transition: all 0.2s ease-in-out;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
/* VISUAL PARITY FIX 2025-12-22: Match PROD icon margin (8px vs 12px) */
margin-right: 8px;
}
/* Size classes for consistent dimensions */
/* VISUAL PARITY FIX 2025-12-19: Match FontAwesome sizing for visual consistency */
/* FA uses 1em base which at 14px font-size = 14px, we match PROD icon sizes */
.sk-icon--sm {
width: 12px;
height: 12px;
font-size: 12px; /* FA compatibility */
}
.sk-icon--md {
width: 14px; /* PROD uses 14px icons in most places, not 16px */
height: 14px;
font-size: 14px; /* FA compatibility - matches PROD line-height */
}
.sk-icon--lg {
width: 18px; /* Slightly smaller to match PROD proportions */
height: 18px;
font-size: 18px; /* FA compatibility */
}
.sk-icon--xl {
width: 24px;
height: 24px;
}
.sk-icon--xxl {
width: 32px;
height: 32px;
}
/* Interactive icon styles */
.sk-icon--interactive {
cursor: pointer;
}
.sk-icon--interactive:hover {
opacity: 0.8;
transform: scale(1.05);
}
.sk-icon--interactive:active {
transform: scale(0.95);
}
.sk-icon--interactive:focus {
outline: 2px solid #007ACC;
outline: 2px solid var(--focus-color, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, #007ACC)))));
outline-offset: 2px;
border-radius: 2px;
}
/* Icon color variants */
.sk-icon--primary {
color: #007ACC;
color: var(--primary-color, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, #007ACC)))));
}
.sk-icon--secondary {
color: #6C757D;
color: var(--secondary-color, var(--sk-color-6c757d, var(--sk-color-6c757d, #6C757D)));
}
.sk-icon--success {
color: #28A745;
color: var(--success-color, var(--sk-color-28a745, var(--sk-color-28a745, #28A745)));
}
.sk-icon--warning {
color: #FFC107;
color: var(--warning-color, var(--sk-color-ffc107, var(--sk-color-ffc107, #FFC107)));
}
.sk-icon--danger {
color: #DC3545;
color: var(--danger-color, var(--sk-color-dc3545, var(--sk-color-dc3545, #DC3545)));
}
.sk-icon--info {
color: #17A2B8;
color: var(--info-color, var(--sk-color-17a2b8, var(--sk-color-17a2b8, #17A2B8)));
}
/* Icon button style (for clickable icons) */
.sk-icon-button {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 4px;
border: none;
background: none;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.2s ease-in-out;
}
.sk-icon-button:hover {
background-color: rgba(0, 0, 0, 0.05);
background-color: var(--hover-bg-color, rgba(0, 0, 0, 0.05));
}
.sk-icon-button:active {
background-color: rgba(0, 0, 0, 0.1);
background-color: var(--active-bg-color, rgba(0, 0, 0, 0.1));
}
.sk-icon-button:focus {
outline: 2px solid #007ACC;
outline: 2px solid var(--focus-color, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, var(--sk-color-007acc, #007ACC)))));
outline-offset: 2px;
}
/* Icon with text combinations */
.sk-icon-text {
display: inline-flex;
align-items: center;
gap: 6px;
}
.sk-icon-text--reverse {
flex-direction: row-reverse;
}
/* Loading state for icons */
.sk-icon--loading,
.sk-icon--spin {
animation: sk-icon-spin 1s linear infinite;
}
@keyframes sk-icon-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.NotificationAlert_c-popup-notification-popup--wrapper__QDCip{justify-content:center;position:fixed;z-index:9999;top:10%;right:40%;background-color:#1c4e86;color:#5b5b5b;border-radius:4px;width:300px;text-align:left;padding:8px 24px 8px 8px;border:1px solid gray;border-left:4px solid #e67917;cursor:pointer}@media(max-width: 767px){.NotificationAlert_c-popup-notification-popup--wrapper__QDCip{top:10%;right:10%}}.NotificationAlert_c-popup-notification-popup--wrapper__QDCip .NotificationAlert_c-popup-notification-header__Q8Rld{font-size:14px;margin:0 0 4px;color:#fff;font-weight:600}.NotificationAlert_c-popup-notification-popup--wrapper__QDCip .NotificationAlert_c-popup-notification-desc__L8Wxp{font-size:12px;color:#fff;margin:0;line-height:140%}.NotificationAlert_c-popup-notification-popup--wrapper__QDCip .NotificationAlert_c-popup-notification-close-icon__v8fPh{cursor:pointer;position:absolute;top:-10px;right:-7px;width:22px;height:22px;line-height:100%;font-size:14px;background-color:#e67917;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center}.NotificationAlert_c-popup-notification-header__Q8Rld{font-size:14px;margin:0 0 4px;color:#fff;font-weight:600}.NotificationAlert_c-popup-notification-desc__L8Wxp{font-size:12px;color:#fff;margin:0;line-height:140%}.NotificationAlert_c-popup-notification-close-icon__v8fPh{cursor:pointer;position:absolute;top:-10px;right:-7px;width:22px;height:22px;line-height:100%;font-size:14px;background-color:#e67917;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center}
.DraftOrderGenerator_c-fantasy-draft-order-generator-page__gaBtf{padding:32px 0;display:flex;justify-content:center;align-items:flex-start;min-height:80vh;position:relative;z-index:0}
.FantasyDraft_c-fantasy-draft__qqRYE{display:flex;flex-direction:column;height:100%;width:100%}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.ErrorBoundary_errorBoundary__M0w0r{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;padding:1rem;padding:var(--spacing-x4, 1rem);text-align:center}.ErrorBoundary_errorBoundary__M0w0r .ErrorBoundary_errorContainer__indL7{max-width:600px;padding:1rem;padding:var(--spacing-x4, 1rem);background:rgba(26,26,46,.9);border:1px solid #333;border:1px solid var(--theme-border-color, #333);border-radius:1rem;border-radius:var(--spacing-x3, 1rem);box-shadow:0 8px 32px rgba(0,0,0,.3)}.ErrorBoundary_errorContainer__indL7{max-width:600px;text-align:center;background:rgba(26,26,46,.9);border-radius:1rem;border-radius:var(--spacing-x3, 1rem);padding:1rem;padding:var(--spacing-x6, 1rem);box-shadow:0 8px 32px rgba(0,0,0,.1);border:1px solid #333;border:1px solid var(--theme-border-color, #333)}@media(max-width: 768px){.ErrorBoundary_errorContainer__indL7{padding:1rem;padding:var(--spacing-x4, 1rem);max-width:100%}}.ErrorBoundary_errorIcon__n7tTV{margin-bottom:1rem;margin-bottom:var(--spacing-x4, 1rem);color:#333;color:var(--theme-error-color, #333)}.ErrorBoundary_errorIcon__n7tTV svg{width:64px;height:64px}@media(max-width: 768px){.ErrorBoundary_errorIcon__n7tTV svg{width:48px;height:48px}}.ErrorBoundary_errorContent__jvFd2{display:flex;flex-direction:column;grid-gap:1rem;grid-gap:var(--spacing-x3, 1rem);gap:1rem;gap:var(--spacing-x3, 1rem)}.ErrorBoundary_errorTitle__ZYNB5{font-size:16px;font-weight:700;color:#5b5b5b;margin:0px}@media(max-width: 768px){.ErrorBoundary_errorTitle__ZYNB5{font-size:16px}}.ErrorBoundary_errorMessage__rLhZD{font-size:16px;color:#333;color:var(--theme-text-minor-color, #333);line-height:1.5;margin:0px}.ErrorBoundary_errorDetails__lixgs{text-align:left;margin-top:1rem;margin-top:var(--spacing-x2, 1rem)}.ErrorBoundary_errorDetails__lixgs summary{cursor:pointer;font-weight:700;color:#5b5b5b;margin-bottom:1rem;margin-bottom:var(--spacing-x2, 1rem)}.ErrorBoundary_errorDetails__lixgs summary:hover{color:#333;color:var(--theme-primary-color, #333)}.ErrorBoundary_errorStack__tTdLe{background:#f5f5f5;border:1px solid #333;border:1px solid var(--theme-border-color, #333);border-radius:1rem;border-radius:var(--spacing-x1, 1rem);padding:1rem;padding:var(--spacing-x2, 1rem);font-family:"Consolas","Monaco","Courier New",monospace;font-size:16px;color:#e74c3c;white-space:pre-wrap;word-break:break-word;max-height:200px;overflow-y:auto}.ErrorBoundary_errorActions__q7\+98{display:flex;grid-gap:1rem;grid-gap:var(--spacing-x2, 1rem);gap:1rem;gap:var(--spacing-x2, 1rem);justify-content:center;margin-top:1rem;margin-top:var(--spacing-x4, 1rem)}@media(max-width: 768px){.ErrorBoundary_errorActions__q7\+98{flex-direction:column;align-items:center}}.ErrorBoundary_retryButton__xUuvb,.ErrorBoundary_reloadButton__5MxbP,.ErrorBoundary_backButton__q4R-3{padding:1rem 1rem;padding:var(--spacing-x2, 1rem) var(--spacing-x4, 1rem);border-radius:1rem;border-radius:var(--spacing-x1, 1rem);font-weight:700;font-size:16px;cursor:pointer;transition:all .2s ease;border:none;min-width:120px;background:rgba(0,0,0,0);color:#333;color:var(--theme-text-minor-color, #333);border:1px solid #333;border:1px solid var(--theme-border-color, #333)}.ErrorBoundary_retryButton__xUuvb:focus,.ErrorBoundary_reloadButton__5MxbP:focus,.ErrorBoundary_backButton__q4R-3:focus{outline:2px solid #333;outline:2px solid var(--theme-primary-color, #333);outline-offset:2px}@media(max-width: 768px){.ErrorBoundary_retryButton__xUuvb,.ErrorBoundary_reloadButton__5MxbP,.ErrorBoundary_backButton__q4R-3{width:100%;min-width:auto}}.ErrorBoundary_retryButton__xUuvb:hover,.ErrorBoundary_reloadButton__5MxbP:hover,.ErrorBoundary_backButton__q4R-3:hover{background:#333;background:var(--theme-border-color, #333);color:#5b5b5b;transform:translateY(-1px)}.ErrorBoundary_retryButton__xUuvb:active,.ErrorBoundary_reloadButton__5MxbP:active,.ErrorBoundary_backButton__q4R-3:active{transform:translateY(0)}.ErrorBoundary_retryButton__xUuvb{background:#333;background:var(--theme-success-color, #333);color:#fff}.ErrorBoundary_retryButton__xUuvb:hover{background:#25b318;transform:translateY(-1px);box-shadow:0 4px 12px rgba(37,179,24,.3)}.ErrorBoundary_retryButton__xUuvb:active{transform:translateY(0)}.ErrorBoundary_reloadButton__5MxbP{background:#333;background:var(--theme-primary-color, #333);color:#fff}.ErrorBoundary_reloadButton__5MxbP:hover{background:#06c;transform:translateY(-1px);box-shadow:0 4px 12px rgba(28,78,134,.3)}.ErrorBoundary_reloadButton__5MxbP:active{transform:translateY(0)}.ErrorBoundary_errorHelp__V\+xd1{margin-top:1rem;margin-top:var(--spacing-x4, 1rem);padding-top:1rem;padding-top:var(--spacing-x3, 1rem);border-top:1px solid #333;border-top:1px solid var(--theme-border-color, #333);text-align:left}.ErrorBoundary_errorHelp__V\+xd1 p{font-weight:700;color:#5b5b5b;margin:0px 0 1rem 0;margin:0px 0 var(--spacing-x2, 1rem) 0;font-size:16px}.ErrorBoundary_errorHelp__V\+xd1 ul{list-style:none;padding:0px;margin:0px}.ErrorBoundary_errorHelp__V\+xd1 ul li{padding:1rem 0;padding:var(--spacing-x1, 1rem) 0;color:#333;color:var(--theme-text-minor-color, #333);font-size:16px;position:relative;padding-left:1rem;padding-left:var(--spacing-x3, 1rem)}.ErrorBoundary_errorHelp__V\+xd1 ul li::before{content:"→";position:absolute;left:0;color:#333;color:var(--theme-primary-color, #333);font-weight:800}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.RangeSlider_c-range-slider-item__XUqed{display:flex;flex-direction:column;margin-bottom:1rem;margin-bottom:var(--spacing-x3, 1rem)}.RangeSlider_c-range-slider-label__sEfBh{font-weight:700;margin-bottom:1rem;margin-bottom:var(--spacing-x1, 1rem);color:#fff;font-size:.95rem}.RangeSlider_c-range-slider-value__TIYr-{font-weight:600;color:#aaa}.RangeSlider_c-range-slider-input__IYYga{width:100%;margin-bottom:1rem;margin-bottom:var(--spacing-x1, 1rem);-webkit-appearance:none;appearance:none;height:10px;background-color:rgba(0,0,0,.3);border:1px solid hsla(0,0%,100%,.2);border-radius:4px;outline:none;padding:0px;opacity:.9;transition:opacity .2s}.RangeSlider_c-range-slider-input__IYYga:hover{opacity:1;border-color:hsla(0,0%,100%,.4)}.RangeSlider_c-range-slider-input__IYYga:focus{border-color:#1c4e86;box-shadow:0 0 0 2px rgba(28,78,134,.3)}.RangeSlider_c-range-slider-input__IYYga::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:#1c4e86;border-radius:50%;cursor:pointer;border:2px solid #fff;box-shadow:0 0 5px rgba(0,0,0,.3);margin-top:-5px}.RangeSlider_c-range-slider-input__IYYga::-moz-range-thumb{width:18px;height:18px;background:#1c4e86;border-radius:50%;cursor:pointer;border:2px solid #fff;box-shadow:0 0 5px rgba(0,0,0,.3)}.RangeSlider_c-range-slider-input__IYYga:disabled{opacity:.5;cursor:not-allowed;background-color:rgba(0,0,0,.2);border-color:hsla(0,0%,100%,.1)}.RangeSlider_c-range-slider-input__IYYga:disabled::-webkit-slider-thumb{background:#777;cursor:not-allowed}.RangeSlider_c-range-slider-input__IYYga:disabled::-moz-range-thumb{background:#777;cursor:not-allowed}.RangeSlider_c-range-slider-hint__2YxgD{font-size:.85rem;color:hsla(0,0%,100%,.7);margin-top:1rem;margin-top:var(--spacing-x0_5, 1rem);line-height:1.5}
.FantasyDraft_c-fantasy-draft-page__fltvH{height:100%;width:100%;display:flex;flex-direction:column}
.u-flex{display:flex}.u-flex-center{display:flex;align-items:center}.u-flex-center-all{display:flex;align-items:center;justify-content:center}.u-flex-between{display:flex;align-items:center;justify-content:space-between}.u-flex-column{display:flex;flex-direction:column}.u-flex-column-center{display:flex;flex-direction:column;align-items:center}.u-flex-wrap{display:flex;flex-wrap:wrap}.u-align-center{align-items:center}.u-align-start{align-items:flex-start}.u-align-end{align-items:flex-end}.u-justify-center{justify-content:center}.u-justify-between{justify-content:space-between}.u-justify-start{justify-content:flex-start}.u-justify-end{justify-content:flex-end}.u-text-center{text-align:center}.u-text-right{text-align:right}.u-text-left{text-align:left}.u-block{display:block}.u-inline-block{display:inline-block}.u-hidden{display:none}.u-w-100{width:100%}.u-h-100{height:100%}.u-object-contain{object-fit:contain}.u-object-cover{object-fit:cover}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.FantasyDraftSettings_c-fantasy-draft-settings-page__YVXiV{background:#181c24;color:#f5f7fa;min-height:100vh;margin:1rem auto;margin:var(--spacing-x4, 1rem) auto;max-width:600px;border-radius:10px;margin:0px;overflow:hidden}.FantasyDraftSettings_c-fantasy-draft-settings-header__\+v4ST{padding:8px 16px;background:rgba(0,0,0,0)}.FantasyDraftSettings_c-fantasy-draft-settings-content__w6Hzg{padding:12px 16px 24px 16px;background:rgba(0,0,0,0)}.FantasyDraftSettings_c-fantasy-draft-settings-header-row__z\+EcQ{margin-bottom:2.2px}.FantasyDraftSettings_c-fantasy-draft-settings-title__4II98{font-size:16px;font-weight:800;margin:0px;color:#fff;grid-gap:14.4px;gap:14.4px;background:none;color:#00cfff;margin:8px 0;font-weight:700;font-size:16px;cursor:pointer;padding:0px 8px}.FantasyDraftSettings_c-fantasy-draft-settings-section__cUvi0{grid-gap:3.6px;gap:3.6px;margin-bottom:8.8px;background:#232a36;border-radius:10px;padding:16px 16px 10px 16px;box-shadow:0 1px 4px rgba(0,0,0,.1)}.FantasyDraftSettings_c-fantasy-draft-settings-label-row__wWnNZ{margin-bottom:2.2px}.FantasyDraftSettings_c-fantasy-draft-settings-label__jkDKg{margin:4px 0 0 0;font-weight:800;letter-spacing:1px;color:#a0aec0;grid-gap:10.8px;gap:10.8px;flex-direction:row;align-items:center;justify-content:space-between;grid-gap:14.4px;gap:14.4px;margin-bottom:26.4px;grid-gap:14.4px;gap:14.4px;align-items:flex-start;justify-content:center;min-width:0}.FantasyDraftSettings_c-fantasy-draft-settings-time__1UCJM{grid-gap:3.6px;gap:3.6px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od{background:#00cfff;color:#181c24;border:none;border-radius:24px;padding:4px 20px;font-weight:700;margin-right:2.2px;cursor:pointer;transition:background .2s;margin-left:2.2px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od:hover{background:#009ec3}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-divider__DKX5r{border-bottom:1px solid #2d3748;margin:8px 0}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-desc__sXtau{font-size:.95rem;color:#a0aec0}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-switch__ee8g-{position:relative;display:inline-block;width:38px;height:22px;background:rgba(0,0,0,0);flex-shrink:0}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-switch__ee8g- input{opacity:0;width:0;height:0}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-slider__ehv7C{position:absolute;top:0;left:0;right:0;bottom:0;background:#2d3748;border-radius:22px;transition:.2s}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-slider__ehv7C:before{content:"";height:16px;width:16px;left:3px;bottom:3px;background:#fff;border-radius:50%}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-switch__ee8g- input:checked+.FantasyDraftSettings_c-fantasy-draft-settings-slider__ehv7C{background:#00cfff}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-switch__ee8g- input:checked+.FantasyDraftSettings_c-fantasy-draft-settings-slider__ehv7C:before{transform:translateX(16px)}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-group__v7ryL{display:flex;flex-wrap:wrap;grid-gap:10.8px;gap:10.8px;margin:12px 0 0 0}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-btn__AzCwF{flex-direction:column;align-items:center;justify-content:center;min-width:110px;padding:8px 18px 8px 18px;background:#222733;border:2px solid #2d3748;border-radius:24px;color:#f5f7fa;font-size:16px;outline:none;transition:border .2s,background .2s,color .2s;text-align:center}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-btn__AzCwF:focus{border-color:#00cfff}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-btn__AzCwF.FantasyDraftSettings_active__fM9KS,.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-btn__AzCwF.FantasyDraftSettings_active__fM9KS:focus{background:#00cfff;color:#181c24}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-label__OS2hv{font-weight:800;letter-spacing:1px;color:#fff}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-sub__tt7xW{font-size:.85rem;font-weight:600;color:#616161;margin-top:2.2px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-reversal-row__KMCzY{justify-content:space-between;margin-top:17.6px;margin-bottom:0;grid-gap:14.4px;gap:14.4px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-reversal-desc__QFmK8{font-size:.95rem;color:#a0aec0;margin:4px 0 0 0}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-player-group__eg3Qj{grid-gap:10.8px;gap:10.8px;margin:12px 0 0 0;justify-content:flex-start}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-player-btn__acnev{padding:8px 16px;justify-content:center;background:#222733;margin-bottom:8.8px;color:#f5f7fa;grid-gap:14.4px;gap:14.4px;padding:4px 20px;transition:border .2s,background .2s}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-player-btn__acnev.FantasyDraftSettings_active__fM9KS{padding:8px 18px 8px 18px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-player-btn__acnev.FantasyDraftSettings_active__fM9KS:focus{padding:4px;color:#181c24;margin-bottom:26.4px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-picktime-group__ATEyN{flex-direction:row;grid-gap:10.8px;gap:10.8px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;padding-bottom:4px;max-width:100%;scrollbar-width:thin}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-picktime-btn__q3\+eP{flex-direction:column;width:56px;height:56px;min-width:56px;min-height:56px;max-width:56px;max-height:56px;border-radius:50%;color:#f5f7fa;font-weight:700;font-size:16px;transition:border .2s,background .2s,color .2s;box-sizing:border-box;padding:0px;line-height:1.1}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-picktime-btn__q3\+eP.FantasyDraftSettings_active__fM9KS,.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-picktime-btn__q3\+eP.FantasyDraftSettings_active__fM9KS:focus{background:#00cfff;color:#181c24}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-picktime-btn__q3\+eP .FantasyDraftSettings_c-fantasy-draft-type-label__OS2hv{font-size:1.1rem;font-weight:800}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-picktime-btn__q3\+eP .FantasyDraftSettings_c-fantasy-draft-type-sub__tt7xW{font-size:.8rem;font-weight:600;color:#a0aec0;margin-top:0px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-picktime-btn__q3\+eP.FantasyDraftSettings_active__fM9KS .FantasyDraftSettings_c-fantasy-draft-type-sub__tt7xW{color:#181c24}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-sorting-row__tSAnq{justify-content:space-between;grid-gap:14.4px;gap:14.4px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-sorting-desc__-aY3U{font-size:16px;color:#a0aec0;margin-top:2.2px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-reset-row__65Wky{align-items:flex-start;grid-gap:3.6px;gap:3.6px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-reset-btn__71VYc{align-items:center;grid-gap:7.2px;gap:7.2px;background:none;color:#e53950;border:none;font-weight:800;font-size:1.1rem;margin-bottom:2.2px;transition:color .2s}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-reset-btn__71VYc:hover,.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-reset-btn__71VYc:focus{color:#ff1744}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-reset-icon__v\+pAL{display:inline-block;width:20px;height:20px;border:2px solid #e53950;border-right-color:rgba(0,0,0,0);position:relative}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-reset-icon__v\+pAL:after{position:absolute;top:-2px;left:13px;width:6px;height:6px;border-top:2px solid #e53950;border-right:2px solid #e53950;border-radius:0 2px 0 0;transform:rotate(95deg)}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-reset-desc__iWpOm{font-size:16px;color:#a0aec0;font-weight:600}@media(min-width: 768px){.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-header__\+v4ST{padding:25px 1rem 10px;padding:25px var(--spacing-x4, 1rem) 10px;padding:20px 30px 0px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-content__w6Hzg{padding:16px 1rem 1rem 1rem;padding:16px var(--spacing-x4, 1rem) var(--spacing-x4, 1rem) var(--spacing-x4, 1rem);padding:24px 30px 40px 30px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-title__4II98{font-size:1.8rem}}@media(min-width: 1024px){.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-page__YVXiV{max-width:100%}}@media(max-width: 600px){.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-group__v7ryL,.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-player-group__eg3Qj{flex-direction:row;grid-gap:7.2px;gap:7.2px;grid-gap:7.2px;gap:7.2px;grid-gap:14.4px;gap:14.4px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-btn__AzCwF,.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-player-btn__acnev{min-width:90px;max-width:120px;min-width:120px;font-size:1.05rem}}@media(min-width: 601px)and (max-width: 1023px){.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-picktime-group__ATEyN{grid-template-columns:repeat(3, 1fr);grid-gap:10.8px;gap:10.8px;grid-template-columns:repeat(6, 1fr);grid-gap:14.4px;gap:14.4px}}@media(min-width: 1024px){.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-type-group__v7ryL{grid-gap:14.4px;gap:14.4px}}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-section__iyLZg{margin-top:1rem;margin-top:var(--spacing-x4, 1rem);display:flex;flex-direction:column;grid-gap:14.4px;gap:14.4px;background:#232a36;border-radius:10px;padding:16px;margin-bottom:8.8px;box-shadow:0 1px 4px rgba(0,0,0,.1)}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-header-row__h3Zfq{margin-bottom:2.2px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-subtext__OA73A{font-size:16px;margin-bottom:8.8px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-randomize-btn__boGaU{background:none;border:2px solid #00cfff;color:#00cfff;border-radius:24px;font-weight:800;padding:4px 18px;transition:background .2s,color .2s}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-randomize-btn__boGaU:hover,.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-randomize-btn__boGaU:focus{background:#00cfff;color:#181c24}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-selected-badge__m2JiQ{background:#2d3748;color:#fff;padding:8px 15px 8px 8px;font-weight:700;font-size:1.05rem;grid-gap:10.8px;gap:10.8px;width:-webkit-fit-content;width:fit-content}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-avatar__XhSzB{width:36px;height:36px;border-radius:50%;background:#3a4a5d;display:inline-block;margin-right:8.8px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-list__wxgMV{list-style:none;padding:0px;margin:0px;display:flex;grid-gap:7.2px;gap:7.2px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-slot__Nu5N-{grid-gap:10.8px;gap:10.8px;padding:8px 12px;border-radius:8px;grid-gap:10.8px;gap:10.8px;background:#222733;transition:background .2s,border .2s;border:2px solid #2d3748;color:#f5f7fa}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-slot__Nu5N-:hover,.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-slot__Nu5N-:focus{background:#232a36}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-slot__Nu5N-.FantasyDraftSettings_selected__5Ukk5{background:#00cfff;color:#181c24}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-slot-num__6Uxqj{font-size:1.1rem;font-weight:800;width:22px;text-align:right;color:#a0aec0}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-slot__Nu5N-.FantasyDraftSettings_selected__5Ukk5 .FantasyDraftSettings_c-fantasy-draft-order-slot-num__6Uxqj{color:#181c24}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-slot-info__t2-hV{grid-gap:1.8px;gap:1.8px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-slot-label__I7wBb{font-size:16px;font-weight:700;color:#fff}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-order-slot-note__bApSf{font-size:.95rem;color:#a0aec0;font-weight:600}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-header-actions__mX9c-{grid-gap:10.8px;gap:10.8px;background:rgba(0,0,0,0)}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-close__Wy47D{background:none;border:none;padding:4px;border-radius:50%;justify-content:center;transition:background .2s}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-close__Wy47D:hover,.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-close__Wy47D:focus{background:#232a36}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-close-icon__KhFA9{display:block;width:18px;height:18px;position:relative}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-close-icon__KhFA9:before,.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-close-icon__KhFA9:after{content:"";position:absolute;left:8px;top:2px;width:2px;height:14px;background:#a0aec0;border-radius:2px}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-close-icon__KhFA9:before{transform:rotate(45deg)}.FantasyDraftSettings_c-fantasy-draft-settings-set-btn__Lg8od .FantasyDraftSettings_c-fantasy-draft-settings-close-icon__KhFA9:after{transform:rotate(-45deg)}
.FantasyGames_c-fantasy-games__container__b1MKT{display:flex;flex-direction:column}.FantasyGames_c-fantasy-games__header__1R1wr{margin-bottom:16px}.FantasyGames_c-fantasy-games__content__hO3Ug{flex:1 1}
.FantasyGames_c-fantasy-games-page__LOS12{height:100%;width:100%;display:flex;flex-direction:column;padding:16px;background-color:#121212;color:#f0f0f0}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.FantasyDashboard_c-fantasy-dashboard__TbZWc{padding:20px;min-height:100vh;background-color:#121212;color:#f0f0f0}.FantasyDashboard_c-fantasy-dashboard-header__mX64Z{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.FantasyDashboard_c-fantasy-dashboard-logo__TieZS{display:flex;align-items:center}.FantasyDashboard_c-fantasy-dashboard-logo-icon__Ee8GX{width:40px;height:40px;margin-right:8.8px}.FantasyDashboard_c-fantasy-dashboard-logo-icon__Ee8GX img{width:100%;height:100%;object-fit:contain}.FantasyDashboard_c-fantasy-dashboard-title__C\+ppG{font-size:1.8rem;font-weight:700;color:var(--theme-primary-color)}.FantasyDashboard_c-fantasy-dashboard-actions__9Z3--{display:flex;align-items:center}.FantasyDashboard_c-fantasy-dashboard-header-play__pnZ3U{display:inline-block;padding:8px 20px;background-color:var(--theme-primary-color);color:#fff;text-decoration:none;font-weight:700;border-radius:4px;margin-right:13.2px;border-radius:4px;margin-right:13.2px}.FantasyDashboard_c-fantasy-dashboard-header-play__pnZ3U:hover{background-color:#0056b3}.FantasyDashboard_c-fantasy-dashboard-header-draft-order__9a7q9{display:block;padding:16px 20px;color:#fff;text-decoration:none;font-weight:700;border-radius:4px;margin-right:auto;margin-left:auto;border:none;transition:background .2s;margin-top:17.6px}.FantasyDashboard_c-fantasy-dashboard-menu-button__jlTQF{width:40px;height:40px;background:none;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer}.FantasyDashboard_c-fantasy-dashboard-menu-button__jlTQF:focus{outline:none}.FantasyDashboard_c-fantasy-dashboard-menu-icon__FB56S{display:block;position:relative;width:25px;height:3px;background-color:#f0f0f0}.FantasyDashboard_c-fantasy-dashboard-menu-icon__FB56S:before,.FantasyDashboard_c-fantasy-dashboard-menu-icon__FB56S:after{content:"";position:absolute;width:100%;height:100%;background-color:#f0f0f0;left:0}.FantasyDashboard_c-fantasy-dashboard-menu-icon__FB56S:before{top:-8px}.FantasyDashboard_c-fantasy-dashboard-menu-icon__FB56S:after{bottom:-8px}.FantasyDashboard_c-fantasy-dashboard-game-card__D3UGk{display:flex;align-items:center;padding:20px;background-color:#252525;border-radius:8px;margin-bottom:22px;border-radius:8px;margin-bottom:22px;box-shadow:0 2px 8px rgba(0,0,0,.2);border:1px solid #333}.FantasyDashboard_c-fantasy-dashboard-game-card__D3UGk:hover{box-shadow:0 4px 12px rgba(0,0,0,.3);background-color:#303030}.FantasyDashboard_c-fantasy-dashboard-game-icon__EfUwQ{width:60px;height:60px;margin-right:13.2px;display:flex;align-items:center;justify-content:center;background-color:#333;border-radius:12px}.FantasyDashboard_c-fantasy-dashboard-game-icon__EfUwQ img{width:70%;height:70%;object-fit:contain}.FantasyDashboard_c-fantasy-dashboard-game-info__LFT6C{flex:1 1}.FantasyDashboard_c-fantasy-dashboard-game-title__6wql5{font-size:1.3rem;font-weight:700;margin-bottom:5px}.FantasyDashboard_c-fantasy-dashboard-game-description__hAlKu{font-size:.9rem;color:#aaa}.FantasyDashboard_c-fantasy-dashboard-section__qssnG{margin-top:30px}.FantasyDashboard_c-fantasy-dashboard-section-header__uQxdQ{margin-bottom:22px}.FantasyDashboard_c-fantasy-dashboard-section-title__R--Vj{font-size:1.4rem;font-weight:700;margin-bottom:5px;color:var(--theme-primary-color)}.FantasyDashboard_c-fantasy-dashboard-section-subtitle__B9-F\+{font-size:.9rem;color:#aaa}.FantasyDashboard_c-fantasy-dashboard-other-game__uoQzr{display:flex;align-items:center;padding:12px;background-color:#252525;border-radius:8px;border:1px dashed #444;cursor:pointer}.FantasyDashboard_c-fantasy-dashboard-other-game__uoQzr:hover{background-color:#303030}.FantasyDashboard_c-fantasy-dashboard-other-game-icon__z9xzf{width:50px;height:50px;margin-right:13.2px;background-color:#333;border-radius:50%;display:flex;align-items:center;justify-content:center}.FantasyDashboard_c-fantasy-dashboard-plus-icon__jbrzF{position:relative;width:20px;height:2px;background-color:#aaa}.FantasyDashboard_c-fantasy-dashboard-plus-icon__jbrzF:after{content:"";position:absolute;width:2px;height:20px;background-color:#aaa;left:9px;top:-9px}.FantasyDashboard_c-fantasy-dashboard-other-game-text__IA74M{flex:1 1;font-size:1.1rem;color:#aaa}.FantasyDashboard_c-fantasy-dashboard-chevron__SfpZc{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.FantasyDashboard_c-fantasy-dashboard-chevron-icon__Zi1hI{display:block;width:10px;height:10px;border-top:2px solid #aaa;border-right:2px solid #aaa;transform:rotate(45deg)}@media(max-width: 768px){.FantasyDashboard_c-fantasy-dashboard__TbZWc{padding:12px}.FantasyDashboard_c-fantasy-dashboard-header__mX64Z{margin-bottom:13.2px}.FantasyDashboard_c-fantasy-dashboard-logo-icon__Ee8GX{width:35px;height:35px}.FantasyDashboard_c-fantasy-dashboard-title__C\+ppG{font-size:24px}.FantasyDashboard_c-fantasy-dashboard-header-play__pnZ3U{padding:4px 15px;font-size:.9rem}.FantasyDashboard_c-fantasy-dashboard-game-card__D3UGk{padding:12px}.FantasyDashboard_c-fantasy-dashboard-game-icon__EfUwQ{width:50px;height:50px}.FantasyDashboard_c-fantasy-dashboard-game-title__6wql5{font-size:1.1rem}.FantasyDashboard_c-fantasy-dashboard-game-description__hAlKu{font-size:.8rem}.FantasyDashboard_c-fantasy-dashboard-section-title__R--Vj{font-size:1.2rem}}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.FantasyHome_c-fantasy-home-page__\+BwOf{height:100%;width:100%;display:flex;flex-direction:column;background-color:#262626;background-color:var(--theme-color-black, #262626)}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.PlayerAvatarGroup_c-player-avatar-group__zkgeo{display:flex;flex-direction:column}.PlayerAvatarGroup_c-player-avatar-group--horizontal__6zkRX .PlayerAvatarGroup_c-player-avatar-group-container__1eL3T{flex-direction:row;flex-direction:column}.PlayerAvatarGroup_c-player-avatar-group-label__2dGEQ{color:#757575;color:var(--theme-text-minor-color, #757575);font-size:16px;margin-bottom:5px;font-weight:700}.PlayerAvatarGroup_c-player-avatar-group-container__1eL3T{display:flex;grid-gap:5px;gap:5px;align-items:center}.PlayerAvatarGroup_c-player-avatar-group-avatar__nowc8{position:relative;border-radius:50%;overflow:hidden;border:1px solid #e0e0e0;border:1px solid var(--theme-color-border, #e0e0e0);background-color:#ffffff;background-color:var(--theme-panel-content-background-color, #ffffff);flex-shrink:0}.PlayerAvatarGroup_c-player-avatar-group-avatar--small__zhccx{width:24px;height:24px}.PlayerAvatarGroup_c-player-avatar-group-avatar--medium__J2Q26{width:48px;height:48px;border:2px solid #333;border:2px solid var(--theme-border-color, #333)}.PlayerAvatarGroup_c-player-avatar-group-avatar--large__rojxa{width:80px;height:80px;border:3px solid #1976d2;border:3px solid var(--theme-color-primary, #1976d2)}.PlayerAvatarGroup_c-player-avatar-group-avatar--clickable__wJ3yE{cursor:pointer;transition:transform .2s ease}.PlayerAvatarGroup_c-player-avatar-group-avatar--clickable__wJ3yE:hover{transform:scale(1.05)}.PlayerAvatarGroup_c-player-avatar-group-image__zB\+jn{width:100%;height:100%;object-fit:cover;display:block}.PlayerAvatarGroup_c-player-avatar-group-team-logo__Tslh8{position:absolute;bottom:0;right:0;width:30%;height:30%;min-width:12px;min-height:12px;border-radius:50%;background-color:#fff;background-color:var(--theme-color-white, #fff);display:flex;align-items:center;justify-content:center;border:1px solid #e0e0e0;border:1px solid var(--theme-color-border, #e0e0e0)}.PlayerAvatarGroup_c-player-avatar-group-team-image__dB9Vo{width:100%;height:100%;object-fit:contain}.PlayerAvatarGroup_c-fantasy-draft-item__EInnu .PlayerAvatarGroup_c-player-avatar-group-label__2dGEQ{color:#a0a0a0}.PlayerAvatarGroup_c-fantasy-draft-item__EInnu .PlayerAvatarGroup_c-player-avatar-group-avatar__nowc8{border-color:#444;background-color:#1a1a1a}.PlayerAvatarGroup_c-fantasy-draft-item__EInnu .PlayerAvatarGroup_c-player-avatar-group-team-logo__Tslh8{background-color:#1a1a1a;border-color:#444;width:60px;height:60px;grid-gap:3px;gap:3px}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap{min-height:100vh;background-color:#121212;color:#212529;padding-bottom:1rem;padding-bottom:var(--spacing-x10, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts-header__hJEac{padding:1rem;padding:var(--spacing-x2, 1rem);position:relative;display:flex;align-items:center;justify-content:space-between;padding:1rem 1rem 1rem 1rem;padding:var(--spacing-x3, 1rem) var(--spacing-x3, 1rem) var(--spacing-x2, 1rem) var(--spacing-x3, 1rem);border-bottom:1px solid #333}.FantasyMockDrafts_c-fantasy-mock-drafts-header__hJEac h2{font-size:16px;font-weight:600}.FantasyMockDrafts_c-fantasy-mock-drafts-back-button__XjvH3{position:absolute;left:1rem;left:var(--spacing-x2, 1rem);top:1rem;top:var(--spacing-x3, 1rem);font-size:24px;text-decoration:none;width:40px;height:40px}.FantasyMockDrafts_c-fantasy-mock-drafts-title__VRSKC{font-size:40px;margin-bottom:1rem;margin-bottom:var(--spacing-x1, 1rem);color:#fff;text-align:center;margin-top:0}.FantasyMockDrafts_c-fantasy-mock-drafts-subtitle__xsB4U{font-size:1.1rem;color:#333;color:var(--theme-text-minor-color, #333);margin-bottom:1rem;margin-bottom:var(--spacing-x5, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts-categories__kgJy2{justify-content:center;grid-gap:1rem;grid-gap:var(--spacing-x3, 1rem);gap:1rem;gap:var(--spacing-x3, 1rem);margin-bottom:1rem;margin-bottom:var(--spacing-x2, 1rem);padding:0px 1rem;padding:0px var(--spacing-x2, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts-section__Ie8WQ{margin-bottom:1rem;margin-bottom:var(--spacing-x3, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts-section-title__-ISrn{font-weight:700;letter-spacing:1px;padding-left:1rem;padding-left:var(--spacing-x1, 1rem);font-weight:800;margin-bottom:1rem;margin-bottom:var(--spacing-x0_5, 1rem);color:#fff;color:var(--theme-color-white, #fff)}.FantasyMockDrafts_c-fantasy-mock-drafts-list__dQDQz{flex-direction:column;grid-gap:1rem;grid-gap:var(--spacing-x1, 1rem);gap:1rem;gap:var(--spacing-x1, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts-empty__l2cvn{padding:1rem 1rem;padding:var(--spacing-x5, 1rem) var(--spacing-x2, 1rem);font-size:16px}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category__kDWvj{cursor:pointer}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-link__A58WO{color:inherit}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-link__A58WO:hover{color:#fff}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-icon__mdiBw{width:70px;height:70px;background-color:#252525;border-radius:50%;font-size:16px;box-shadow:0 4px 10px rgba(0,0,0,.3);transition:all .2s;background-color:#1a1a1a;margin-right:1rem;margin-right:var(--spacing-x2, 1rem);flex-shrink:0;order:1;width:100%;height:100%;object-fit:cover}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-icon__mdiBw img{max-width:60%;max-height:60%}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category__kDWvj svg{color:gold;font-size:1.2rem}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-name__UOUF7{font-size:.9rem}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category__kDWvj:hover .FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-icon__mdiBw{background-color:#333}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-active__gKuhu .FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-icon__mdiBw{background-color:#333;background-color:var(--theme-primary-color, #333)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-active__gKuhu .FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-name__UOUF7{color:#5b5b5b}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-loading__0gzlv{pointer-events:none;opacity:.8}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-loading__0gzlv .FantasyMockDrafts_c-fantasy-sport-category-icon__mdiBw svg{color:#fff}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf{border-radius:8px;border:1px solid #333;border:1px solid var(--theme-border-color, #333);flex:0 0 auto;order:3}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item-clickable__6YDBf{transition:all .2s ease}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item-clickable__6YDBf:hover{transform:translateY(-2px);border-color:rgba(0,123,255,.4)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item-content__lsgdQ{flex:1 1;order:2;margin-top:1rem;margin-top:var(--spacing-x1, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item-content-details__BVnRH{font-size:.8rem;grid-gap:1rem;grid-gap:var(--spacing-x2, 1rem);gap:1rem;gap:var(--spacing-x2, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item-content-detail-icon__qMvqK{margin-right:1rem;margin-right:var(--spacing-x0_5, 1rem);opacity:.7}@media(min-width: 769px){.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf{margin-left:1rem;margin-left:var(--spacing-x2, 1rem)}}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item-actions__jFQ5e{align-items:flex-end;order:4}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item-status-clickable__8P8CU:hover{transform:scale(1.05)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item-button__ap1mj{background-color:rgba(28,78,134,.2);color:#333;color:var(--theme-primary-color, #333);border:1px solid #333;border:1px solid var(--theme-primary-color, #333);padding:1rem 17.6px;padding:var(--spacing-x0_5, 1rem) 17.6px;border-radius:4px}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-status-badge__iXDKv{background-color:rgba(255,193,7,.15);color:#ffc107;font-size:.7rem;letter-spacing:.5px}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-completed-status-badge__vxZY7{color:#333;color:var(--theme-success-color, #333)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-inprogress-status-badge__dxbWe{background-color:rgba(33,150,243,.15);color:#42a5f5}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-scheduled-status-badge__vBe\+y{background-color:rgba(156,39,176,.15);color:#ba68c8}@media(max-width: 768px){.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-mock-drafts__uzeap{padding:1rem 1rem;padding:var(--spacing-x0_5, 1rem) var(--spacing-x1, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-mock-drafts-categories__kgJy2{grid-gap:1rem;grid-gap:var(--spacing-x4, 1rem);gap:1rem;gap:var(--spacing-x4, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-icon__mdiBw{width:60px;height:60px;font-size:1.7rem}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-sport-category-name__UOUF7{font-size:1.75rem}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf{flex-wrap:wrap;order:initial;margin-left:auto;text-align:right;flex:initial}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-mock-drafts-actions__lp66I{flex-direction:row;justify-content:flex-start;margin-top:-10px;margin-bottom:8.8px;width:45px;height:45px;font-size:16px}}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal__U6nU2{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-overlay__5wI0u{background-color:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-content__W9K7W{border-radius:12px;border:1px solid #333;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 40px rgba(0,0,0,.5)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-close__\+iCnU{background:none;border:none;color:#aaa;padding:1rem;padding:var(--spacing-x1, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-close__\+iCnU:hover{background-color:hsla(0,0%,100%,.1)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-body__WcLJ9{padding:1rem;padding:var(--spacing-x3, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-footer__Ymg9m{padding:1rem 1rem 1rem 1rem;padding:var(--spacing-x2, 1rem) var(--spacing-x3, 1rem) var(--spacing-x3, 1rem) var(--spacing-x3, 1rem);border-top:1px solid #333;justify-content:flex-end}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-cancel__\+HS2P{border:1px solid #555;color:#ccc;padding:1rem 1rem;padding:var(--spacing-x2, 1rem) var(--spacing-x3, 1rem);border-radius:6px;font-weight:700}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-cancel__\+HS2P:hover{border-color:#777;background-color:hsla(0,0%,100%,.05)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-confirm__TM3fi{background:#333;background:var(--theme-primary-color, #333);color:#000}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-modal-confirm__TM3fi:hover{background:rgb(34.0148148148,94.7555555556,162.7851851852);transform:translateY(-1px)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-grid__-g3E6{display:grid}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-item__6sPb3 label{font-size:.95rem}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-item__6sPb3 input{border:1px solid #444;background-color:#2a2a2a}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-item__6sPb3 input:focus{outline:none;border-color:#333;border-color:var(--theme-primary-color, #333);box-shadow:0 0 0 2px rgba(85,197,251,.2)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-item__6sPb3 input:hover{border-color:#555}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-hint__6LBhi{line-height:1.3}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-info__iAt\+Z{background-color:rgba(85,197,251,.1);border:1px solid rgba(85,197,251,.2);margin-top:1rem;margin-top:var(--spacing-x2, 1rem)}.FantasyMockDrafts_c-fantasy-mock-drafts__uzeap .FantasyMockDrafts_c-fantasy-draft-item__Ty3Kf .FantasyMockDrafts_c-fantasy-draft-config-info__iAt\+Z p{margin:0px;line-height:1.5}
.FantasyMockDrafts_c-fantasy-mock-drafts-page__9jfXt{height:100%;width:100%;display:flex;flex-direction:column}
.Compare_compare-container__fjz\+X{width:100%;height:100vh;margin:0;padding:0}.Compare_compare-iframe__mCSTK{width:100%;height:100%;border:0;display:block}
.VisualParityDashboard_page__Z6GoP{padding:2rem;max-width:1400px;margin:0 auto;font-family:"Inter",sans-serif;color:#1e293b}.VisualParityDashboard_header__d0bC1{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2rem}.VisualParityDashboard_header__d0bC1 h1{font-size:2rem;font-weight:700;margin:0 0 .5rem 0;background:linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0)}.VisualParityDashboard_header__d0bC1 p{color:#64748b;margin:0;font-size:1.1rem}.VisualParityDashboard_generatedAt__vT8qs{font-size:.9rem;color:#94a3b8;background:#f8fafc;padding:.5rem 1rem;border-radius:2rem;border:1px solid #e2e8f0}.VisualParityDashboard_breadcrumbs__BQRrE{margin-bottom:2rem;font-size:.9rem;color:#64748b}.VisualParityDashboard_breadcrumbs__BQRrE a{color:#3b82f6;text-decoration:none}.VisualParityDashboard_breadcrumbs__BQRrE a:hover{text-decoration:underline}.VisualParityDashboard_breadcrumbs__BQRrE span{margin:0 .5rem}.VisualParityDashboard_summaryGrid__JNY2n{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));grid-gap:1.5rem;gap:1.5rem;margin-bottom:3rem}.VisualParityDashboard_summaryCard__\+q3vS{background:#fff;padding:1.5rem;border-radius:12px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);border:1px solid #e2e8f0;display:flex;flex-direction:column;align-items:center;text-align:center;transition:transform .2s}.VisualParityDashboard_summaryCard__\+q3vS:hover{transform:translateY(-2px)}.VisualParityDashboard_summaryCard__\+q3vS .VisualParityDashboard_icon__rOuLi{font-size:2rem;margin-bottom:.5rem}.VisualParityDashboard_summaryCard__\+q3vS .VisualParityDashboard_score__aU\+q1{font-size:2.5rem;font-weight:800;margin-bottom:.25rem}.VisualParityDashboard_summaryCard__\+q3vS .VisualParityDashboard_label__qpnn5{color:#64748b;font-size:.9rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em}.VisualParityDashboard_summaryCard__\+q3vS.VisualParityDashboard_good__NIriZ{border-top:4px solid #22c55e}.VisualParityDashboard_summaryCard__\+q3vS.VisualParityDashboard_good__NIriZ .VisualParityDashboard_score__aU\+q1{color:#22c55e}.VisualParityDashboard_summaryCard__\+q3vS.VisualParityDashboard_warning__NilrM{border-top:4px solid #eab308}.VisualParityDashboard_summaryCard__\+q3vS.VisualParityDashboard_warning__NilrM .VisualParityDashboard_score__aU\+q1{color:#eab308}.VisualParityDashboard_summaryCard__\+q3vS.VisualParityDashboard_bad__QTijD{border-top:4px solid #ef4444}.VisualParityDashboard_summaryCard__\+q3vS.VisualParityDashboard_bad__QTijD .VisualParityDashboard_score__aU\+q1{color:#ef4444}.VisualParityDashboard_section__lauW7{background:#fff;border-radius:12px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);border:1px solid #e2e8f0;padding:2rem;margin-bottom:2rem}.VisualParityDashboard_section__lauW7 h2{font-size:1.5rem;margin:0 0 1.5rem 0;color:#1e293b;display:flex;align-items:center;gap:.5rem}.VisualParityDashboard_issuesList__0EvhH{display:flex;flex-direction:column;gap:1rem}.VisualParityDashboard_issueCard__P1uHt{padding:1rem;border-radius:8px;background:#f8fafc;border:1px solid #e2e8f0;border-left-width:4px}.VisualParityDashboard_issueCard__P1uHt.VisualParityDashboard_critical__bcRLE{border-left-color:#dc2626;background:#fef2f2}.VisualParityDashboard_issueCard__P1uHt.VisualParityDashboard_high__yyEd6{border-left-color:#ea580c;background:#fff7ed}.VisualParityDashboard_issueCard__P1uHt.VisualParityDashboard_medium__Nsi\+8{border-left-color:#ca8a04;background:#fefce8}.VisualParityDashboard_issueCard__P1uHt.VisualParityDashboard_low__AttgL{border-left-color:#65a30d;background:#f0fdf4}.VisualParityDashboard_issueCard__P1uHt .VisualParityDashboard_issueHeader__Bl9dq{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.VisualParityDashboard_issueCard__P1uHt h3{margin:0;font-size:1rem;font-weight:600;color:#1e293b}.VisualParityDashboard_issueCard__P1uHt .VisualParityDashboard_badge__6XNWp{padding:.25rem .75rem;border-radius:4px;font-size:.75rem;font-weight:700;text-transform:uppercase;color:#fff}.VisualParityDashboard_issueCard__P1uHt .VisualParityDashboard_badge__6XNWp.VisualParityDashboard_critical__bcRLE{background:#dc2626}.VisualParityDashboard_issueCard__P1uHt .VisualParityDashboard_badge__6XNWp.VisualParityDashboard_high__yyEd6{background:#ea580c}.VisualParityDashboard_issueCard__P1uHt .VisualParityDashboard_badge__6XNWp.VisualParityDashboard_medium__Nsi\+8{background:#ca8a04}.VisualParityDashboard_issueCard__P1uHt .VisualParityDashboard_badge__6XNWp.VisualParityDashboard_low__AttgL{background:#65a30d}.VisualParityDashboard_issueCard__P1uHt p{margin:0 0 .5rem 0;color:#64748b;font-size:.9rem}.VisualParityDashboard_issueCard__P1uHt .VisualParityDashboard_meta__vYa0G{display:flex;gap:1rem;font-size:.8rem}.VisualParityDashboard_issueCard__P1uHt .VisualParityDashboard_meta__vYa0G span{display:flex;align-items:center;gap:.25rem;padding:.25rem .5rem;background:hsla(0,0%,100%,.5);border-radius:4px;border:1px solid rgba(0,0,0,.05)}.VisualParityDashboard_componentTable__GXS96{width:100%;border-collapse:collapse}.VisualParityDashboard_componentTable__GXS96 th,.VisualParityDashboard_componentTable__GXS96 td{padding:1rem;text-align:left;border-bottom:1px solid #e2e8f0}.VisualParityDashboard_componentTable__GXS96 th{font-weight:600;color:#64748b;text-transform:uppercase;font-size:.8rem;letter-spacing:.05em}.VisualParityDashboard_componentTable__GXS96 tr:last-child td{border-bottom:none}.VisualParityDashboard_componentTable__GXS96 .VisualParityDashboard_score__aU\+q1{font-weight:700}.VisualParityDashboard_componentTable__GXS96 .VisualParityDashboard_good__NIriZ{color:#22c55e}.VisualParityDashboard_componentTable__GXS96 .VisualParityDashboard_warning__NilrM{color:#eab308}.VisualParityDashboard_componentTable__GXS96 .VisualParityDashboard_bad__QTijD{color:#ef4444}.VisualParityDashboard_loading__d\+5se,.VisualParityDashboard_error__NAh\+4{display:flex;align-items:center;justify-content:center;min-height:50vh;font-size:1.2rem;color:#64748b}.VisualParityDashboard_error__NAh\+4{color:#dc2626;flex-direction:column;gap:1rem}
.VisualIntelligenceHub_container__c85Ft{max-width:1400px;margin:0 auto;padding:2rem;font-family:"Inter",sans-serif;color:#1e293b}.VisualIntelligenceHub_header__rtfFS{background:#fff;border-radius:12px;padding:2rem;margin-bottom:2rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);text-align:center;border:1px solid #e2e8f0}.VisualIntelligenceHub_header__rtfFS h1{font-size:2.2rem;margin:0 0 1rem 0;color:#1e293b;font-weight:800;display:flex;align-items:center;justify-content:center;gap:1rem}.VisualIntelligenceHub_header__rtfFS p{color:#64748b;font-size:1.1rem;margin:0}.VisualIntelligenceHub_statusBadge__kFAIw{display:inline-flex;align-items:center;padding:.5rem 1rem;border-radius:2rem;font-weight:600;font-size:.9rem;text-transform:uppercase;gap:.5rem}.VisualIntelligenceHub_statusBadge__kFAIw.VisualIntelligenceHub_operational__b6HZq{background:#3b82f6;color:#fff}.VisualIntelligenceHub_statusBadge__kFAIw.VisualIntelligenceHub_good__UezVY{background:#22c55e;color:#fff}.VisualIntelligenceHub_statusBadge__kFAIw.VisualIntelligenceHub_warning__plUHt{background:#eab308;color:#fff}.VisualIntelligenceHub_statusBadge__kFAIw.VisualIntelligenceHub_critical__NL3FO{background:#ef4444;color:#fff}.VisualIntelligenceHub_tabNav__Msfjp{display:flex;background:#f8fafc;border-bottom:1px solid #e2e8f0;border-radius:12px 12px 0 0;padding:0 1rem;overflow-x:auto;gap:1rem}.VisualIntelligenceHub_tabNav__Msfjp button{background:rgba(0,0,0,0);border:none;padding:1rem 1.5rem;cursor:pointer;font-size:1rem;font-weight:500;color:#64748b;border-bottom:3px solid rgba(0,0,0,0);transition:all .2s;white-space:nowrap}.VisualIntelligenceHub_tabNav__Msfjp button:hover{color:#1e293b;background:#f1f5f9}.VisualIntelligenceHub_tabNav__Msfjp button.VisualIntelligenceHub_active__96zFy{color:#3b82f6;border-bottom-color:#3b82f6;font-weight:600;background:#fff}.VisualIntelligenceHub_tabContent__m0Ejg{background:#fff;padding:2rem;border-radius:0 0 12px 12px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);border:1px solid #e2e8f0;border-top:none;min-height:400px}.VisualIntelligenceHub_grid__ReWSN{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));grid-gap:1.5rem;gap:1.5rem;margin-bottom:2rem}.VisualIntelligenceHub_card__QLWgz{background:#fff;border-radius:12px;padding:1.5rem;border:1px solid #e2e8f0;box-shadow:0 2px 4px rgba(0,0,0,.05);transition:transform .2s,box-shadow .2s}.VisualIntelligenceHub_card__QLWgz:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px rgba(0,0,0,.1)}.VisualIntelligenceHub_card__QLWgz h3{margin:0 0 1rem 0;font-size:1.25rem;color:#1e293b;display:flex;align-items:center;gap:.75rem}.VisualIntelligenceHub_metricValue__cMI6E{font-size:2.5rem;font-weight:800;margin:1rem 0;color:#1e293b}.VisualIntelligenceHub_metricValue__cMI6E.VisualIntelligenceHub_good__UezVY{color:#22c55e}.VisualIntelligenceHub_metricValue__cMI6E.VisualIntelligenceHub_warning__plUHt{color:#eab308}.VisualIntelligenceHub_metricValue__cMI6E.VisualIntelligenceHub_critical__NL3FO{color:#ef4444}.VisualIntelligenceHub_quickLaunch__DX0mO{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));grid-gap:1rem;gap:1rem;margin-top:2rem}.VisualIntelligenceHub_quickLaunch__DX0mO button{padding:1.5rem;border:1px solid #e2e8f0;border-radius:12px;background:#fff;text-align:center;cursor:pointer;transition:all .2s}.VisualIntelligenceHub_quickLaunch__DX0mO button .VisualIntelligenceHub_icon__46M\+H{font-size:2rem;margin-bottom:.5rem;display:block}.VisualIntelligenceHub_quickLaunch__DX0mO button .VisualIntelligenceHub_title__6oe-g{font-weight:600;font-size:1.1rem;color:#1e293b;display:block}.VisualIntelligenceHub_quickLaunch__DX0mO button .VisualIntelligenceHub_desc__eikI1{font-size:.85rem;color:#64748b;margin-top:.5rem;display:block}.VisualIntelligenceHub_quickLaunch__DX0mO button:hover{border-color:#3b82f6;background:#f8fafc;transform:translateY(-2px)}.VisualIntelligenceHub_statsBar__t5qnT{display:flex;justify-content:center;gap:2rem;margin-top:1rem;color:#64748b;font-size:.9rem}.VisualIntelligenceHub_statsBar__t5qnT strong{color:#1e293b}.VisualIntelligenceHub_tableContainer__syA1q{overflow-x:auto;border:1px solid #e2e8f0;border-radius:8px;width:100%}.VisualIntelligenceHub_table__IqY4O{width:100%;border-collapse:collapse;font-size:.9rem}.VisualIntelligenceHub_table__IqY4O th{background:#f8fafc;padding:.75rem 1rem;text-align:left;font-weight:600;color:#64748b;border-bottom:1px solid #e2e8f0}.VisualIntelligenceHub_table__IqY4O td{padding:.75rem 1rem;border-bottom:1px solid #f1f5f9;color:#334155}.VisualIntelligenceHub_table__IqY4O tr:last-child td{border-bottom:none}.VisualIntelligenceHub_table__IqY4O tr:hover td{background:#f8fafc}.VisualIntelligenceHub_statusIndicator__rkVMn{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:.5rem}.VisualIntelligenceHub_statusIndicator__rkVMn.VisualIntelligenceHub_success__8Uxj1{background:#22c55e}.VisualIntelligenceHub_statusIndicator__rkVMn.VisualIntelligenceHub_failure__Kh-av{background:#ef4444}.VisualIntelligenceHub_statusIndicator__rkVMn.VisualIntelligenceHub_pending__EeED-{background:#eab308}
.TeamDashboard_container__8j1am{max-width:1400px;margin:0 auto;padding:2rem;font-family:"Inter",sans-serif;color:#1e293b}.TeamDashboard_header__EeDZC{background:#fff;border-radius:12px;padding:2rem;margin-bottom:2rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1);text-align:center;border:1px solid #e2e8f0}.TeamDashboard_header__EeDZC h1{font-size:2rem;margin:0 0 .5rem 0;color:#1e293b;font-weight:800}.TeamDashboard_header__EeDZC p{color:#64748b;font-size:1rem;margin:0}.TeamDashboard_grid__\+Vuik{display:grid;grid-template-columns:repeat(auto-fit, minmax(350px, 1fr));grid-gap:1.5rem;gap:1.5rem;margin-bottom:2rem}.TeamDashboard_card__xxNqA{background:#fff;border-radius:12px;padding:1.5rem;border:1px solid #e2e8f0;box-shadow:0 2px 4px rgba(0,0,0,.05)}.TeamDashboard_card__xxNqA h3{margin:0 0 1rem 0;font-size:1.1rem;color:#1e293b;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.TeamDashboard_badge__Mf3DP{font-size:.7rem;padding:.2rem .5rem;border-radius:4px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.TeamDashboard_badge__Mf3DP.TeamDashboard_phase2__d-rjC{background:#dbeafe;color:#1e40af;border:1px solid #93c5fd}.TeamDashboard_badge__Mf3DP.TeamDashboard_phase3__Uc7qd{background:#f3e8ff;color:#6b21a8;border:1px solid #d8b4fe}.TeamDashboard_badge__Mf3DP.TeamDashboard_phase4__Nk8\+I{background:#ffe4e6;color:#9f1239;border:1px solid #fda4af}.TeamDashboard_metricRow__gqDyX{display:flex;justify-content:space-between;align-items:center;padding:.75rem 0;border-bottom:1px solid #f1f5f9}.TeamDashboard_metricRow__gqDyX:last-child{border-bottom:none}.TeamDashboard_metricRow__gqDyX .TeamDashboard_label__H\+1CA{color:#64748b;font-size:.9rem;display:flex;align-items:center;gap:.5rem}.TeamDashboard_metricRow__gqDyX .TeamDashboard_value__EHfuQ{font-weight:600;color:#1e293b}.TeamDashboard_analyticsList__6av9\+{display:grid;grid-gap:.5rem;gap:.5rem}.TeamDashboard_analyticsItem__cAZgC{background:#f8fafc;padding:.75rem;border-radius:6px;border:1px solid #e2e8f0;font-size:.9rem;display:flex;justify-content:space-between;align-items:center}.TeamDashboard_analyticsItem__cAZgC strong{color:#334155}.TeamDashboard_analyticsItem__cAZgC .TeamDashboard_trend__rDJsv{font-size:.8rem;font-weight:600}.TeamDashboard_analyticsItem__cAZgC .TeamDashboard_positive__Ugcf\+{color:#16a34a}.TeamDashboard_analyticsItem__cAZgC .TeamDashboard_negative__y5sOI{color:#dc2626}.TeamDashboard_recommendation__3EU3S{background:#f0f9ff;border-left:3px solid #0ea5e9;padding:.75rem;margin-bottom:.5rem;border-radius:0 4px 4px 0}.TeamDashboard_recommendation__3EU3S h4{margin:0 0 .25rem 0;font-size:.9rem;color:#0c4a6e}.TeamDashboard_recommendation__3EU3S p{margin:0;font-size:.85rem;color:#0ea5e9}.TeamDashboard_loading__aLhY2{text-align:center;padding:2rem;color:#94a3b8;font-style:italic}.TeamDashboard_backButton__DBt7q{margin-bottom:1rem;background:none;border:none;color:#64748b;cursor:pointer;display:flex;align-items:center;gap:.5rem;font-size:.9rem;padding:0}.TeamDashboard_backButton__DBt7q:hover{color:#3b82f6}
html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{font-family:"Open Sans", sans-serif;font-family:var(--theme-text-font, "Open Sans", sans-serif);font-size:14px;color:#5b5b5b;color:var(--theme-text-color, #5b5b5b);background-color:#eaeaea !important;background-color:var(--sk-background-color, #eaeaea) !important;line-height:1.29;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}h1,h2,h3,h4,h5,h6{color:#212529;color:var(--theme-text-header-color, var(--theme-text-color, #212529));margin:0 0 .5rem 0}p{margin:0 0 1rem 0}a{color:#1c4e86;color:var(--theme-link-color, var(--sk-link-color, #1c4e86));text-decoration:none}a:hover,a:focus{color:#153d6b;color:var(--theme-link-hover-color, #153d6b)}:focus-visible{outline:2px solid #60a5fa;outline:2px solid var(--theme-focus-color, #60a5fa);outline-offset:2px}::selection{background:rgba(37, 99, 235, 0.25);background:var(--theme-selection-bg, rgba(37, 99, 235, 0.25));color:currentColor;color:var(--theme-selection-fg, currentColor)}button,input,select,textarea{font:inherit;color:inherit}button,[role=button]{cursor:pointer}img,svg,video,canvas,audio,iframe,embed,object{display:block;max-width:100%}ul,ol{padding-left:1.5rem;margin:0 0 1rem}hr{border:0;border-top:1px solid #e5e7eb;border-top:1px solid var(--theme-border-color, #e5e7eb);margin:1.5rem 0}small{font-size:.875em}@media(prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}*,*::before,*::after{box-sizing:border-box}html{background-color:rgba(0,0,0,0);color:#5b5b5b;font-family:"Open Sans",sans-serif;line-height:18.06px;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0)}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:"Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;font-family:var(--theme-text-font, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif);font-size:14px;font-weight:400;line-height:1.29;color:#5b5b5b;text-align:start;background-color:var(--sk-color-background-base) !important;background-color:var(--sk-background-color, #eaeaea) !important}[tabindex="-1"]:focus:not(:focus-visible){outline:0 !important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.75rem;font-weight:600;line-height:1.29;color:var(--theme-text-primary)}h1{font-size:16px}h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-top:0;margin-bottom:1.25rem}a{color:var(--theme-text-link);text-decoration:underline;transition:color .2s ease-in-out}a:hover{color:var(--theme-text-link-hover)}ul,ol{margin-bottom:1.25rem;padding-left:1.5rem}li{margin-bottom:.25rem}table{border-collapse:collapse;width:100%;margin-bottom:1.25rem}th,td{padding:.75rem;text-align:left;border-bottom:1px solid var(--theme-border-primary)}th{font-weight:600;background-color:var(--theme-bg-secondary)}img{max-width:100%;height:auto;display:block}code{font-family:"SFMono-Regular","Monaco","Inconsolata","Roboto Mono",monospace;font-size:.875rem;padding:.125rem .25rem;background-color:var(--theme-bg-tertiary);border-radius:2px}pre{background-color:var(--theme-bg-tertiary);border-radius:var(--theme-border-radius);padding:1rem;overflow-x:auto;margin-bottom:1.25rem}pre code{background:none;padding:0}:focus{outline:2px solid var(--theme-border-accent);outline-offset:2px}:focus:not(:focus-visible){outline:none}abbr[title],abbr[data-original-title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1.25rem;font-style:normal;line-height:inherit}ol,ul,dl{margin-top:0;margin-bottom:1.25rem;padding-left:0;list-style-type:none}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:700}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}a{color:#1c4e86;text-decoration:none}a:not([class*=btn]):not([class*=Button]){background-color:rgba(0,0,0,0)}a:hover{color:#0056b3;text-decoration:underline}a:not([href]){color:inherit;text-decoration:none}a:not([href]):hover{color:inherit;text-decoration:none}pre,code,kbd,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:1em}pre{margin-top:0;margin-bottom:1.25rem;overflow:auto}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:1rem;padding-bottom:1rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.75rem}button{border-radius:0}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}select{word-wrap:normal}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{padding:0;border-style:none}input[type=radio],input[type=checkbox]{box-sizing:border-box;padding:0}input[type=date],input[type=time],input[type=datetime-local],input[type=month]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.75rem;line-height:inherit;color:inherit}legend [hidden]{display:none !important}
:root{--sk-text-color: var(--sk-color-text-primary);--sk-text-color-minor: var(--sk-color-text-secondary);--sk-text-color-light: var(--sk-color-text-light);--sk-text-color-highlight: var(--sk-color-text-highlight);--sk-background-color: var(--sk-color-background-base);--sk-primary-color: var(--sk-color-brand-primary);--sk-secondary-color: var(--sk-color-brand-secondary);--sk-success-color: var(--sk-color-brand-success);--sk-danger-color: var(--sk-color-brand-danger);--sk-warning-color: var(--sk-color-brand-warning);--sk-info-color: var(--sk-color-brand-info);--sk-border-color: var(--sk-color-border-base);--sk-border-color-hover: var(--sk-color-border-hover);--sk-color-white: var(--sk-color-background-base)}html,body,#root{height:auto !important;height:initial !important}.sk-widget{position:relative}
/* ================================================= */
/* 🏷️ WHITE-LABEL PARTNER THEMES */
/* Migrated from R17 SASS $themes map (Nov 2025) */
/* ================================================= */
/* R17 PARITY: All 40+ partner themes from R17 */
/* Each theme applied via body.{theme-name}-theme */
/* ================================================= */
/* ================================================= */
/* 📌 DOCSPORTS THEME */
/* ================================================= */
body.docsports-theme,
.docsports-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #161616;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #A70D00;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #bb1b0d;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #A70D00;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #474749;
--sk-table-border-color: #A70D00;
}
/* ================================================= */
/* 📌 EVANALYTICS THEME */
/* ================================================= */
body.evanalytics-theme,
.evanalytics-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d6d6d6;
--sk-panel-head-background-color-highlight: #bfbfbf;
--sk-panel-head-color: #333333;
--sk-panel-content-background-color: #efefef;
--sk-panel-content-background-color-highlight: #d6d6d6;
--sk-border-color: #dddddd;
--sk-border-color-hover: #a8a8a8;
--sk-text-color: #333333;
--sk-text-color-minor: #808080;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #1266AA;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #efefef;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #333333;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #ffffff;
--sk-link-color: #1266AA;
--sk-error-color: #bb1b0d;
--sk-primary-color: #1266AA;
--sk-secondary-color: #1266AA;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 50px;
--sk-btn-disabled-background-color: #d6d6d6;
--sk-btn-disabled-color: #333333;
--sk-table-border-color: #1266AA;
}
/* ================================================= */
/* 📌 PICKDAWGZ THEME */
/* ================================================= */
body.pickdawgz-theme,
.pickdawgz-theme {
--sk-background-color: #efefef;
--sk-panel-head-background-color: #dddddd;
--sk-panel-head-background-color-highlight: #c9c9c9;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #ffffff;
--sk-panel-content-background-color-highlight: #dddddd;
--sk-border-color: #dddddd;
--sk-border-color-hover: #a8a8a8;
--sk-text-color: #222222;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #dddddd;
--sk-table-header-text-color: #222222;
--sk-table-row-odd-background-color: #efefef;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #222222;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #ffffff;
--sk-link-color: #FF3D00;
--sk-error-color: #bb1b0d;
--sk-primary-color: #FF3D00;
--sk-secondary-color: #FF3D00;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #dddddd;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #dddddd;
}
/* ================================================= */
/* 📌 VEGASWHISPERS THEME */
/* ================================================= */
body.vegaswhispers-theme,
.vegaswhispers-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #dddddd;
--sk-panel-head-background-color-highlight: #c9c9c9;
--sk-panel-head-color: #b88029;
--sk-panel-content-background-color: #ebebeb;
--sk-panel-content-background-color-highlight: #dddddd;
--sk-border-color: #eeeeee;
--sk-border-color-hover: #b8b8b8;
--sk-text-color: #000000;
--sk-text-color-minor: #808080;
--sk-text-color-highlight: #222222;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #dddddd;
--sk-table-header-text-color: #000000;
--sk-table-row-odd-background-color: #efefef;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #000000;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #ffffff;
--sk-link-color: #b88029;
--sk-error-color: #bb1b0d;
--sk-primary-color: #b88029;
--sk-secondary-color: #b88029;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 2px;
--sk-btn-disabled-background-color: #dddddd;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #dddddd;
}
/* ================================================= */
/* 📌 COVERS THEME */
/* ================================================= */
body.covers-theme,
.covers-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #253341;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #fd4f00;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #fd4f00;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #fd4f00;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #cccccc;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #fd4f00;
}
/* ================================================= */
/* 📌 STADIUUM THEME */
/* ================================================= */
body.stadiuum-theme,
.stadiuum-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #001b2e;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #ffffff;
--sk-panel-content-background-color-highlight: #e6e6e6;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #001b2e;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e6e6e6;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #001b2e;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #00823a;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #eeeeee;
}
/* ================================================= */
/* 📌 BOOKIES THEME */
/* ================================================= */
body.bookies-theme,
.bookies-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #2c3e59;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #0176d0;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #0176d0;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #0176d0;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #0176d0;
}
/* ================================================= */
/* 📌 BARSTOOLSPORTS THEME */
/* ================================================= */
body.barstoolsports-theme,
.barstoolsports-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #000000;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #eb3e3e;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #eb3e3e;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #eb3e3e;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #eb3e3e;
}
/* ================================================= */
/* 📌 BETTINGPROS THEME */
/* ================================================= */
body.bettingpros-theme,
.bettingpros-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #071c40;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #1861de;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #1861de;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #1861de;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #1861de;
}
/* ================================================= */
/* 📌 PICKSWISE THEME */
/* ================================================= */
body.pickswise-theme,
.pickswise-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #041c2c;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #0176b8;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #0176b8;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #0176b8;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #0176b8;
}
/* ================================================= */
/* 📌 SPORTSBETTINGDIME THEME */
/* ================================================= */
body.sportsbettingdime-theme,
.sportsbettingdime-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #000000;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #d72429;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #d72429;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #d72429;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #d72429;
}
/* ================================================= */
/* 📌 THELINES THEME */
/* ================================================= */
body.thelines-theme,
.thelines-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #252726;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #248f3e;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #248f3e;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #248f3e;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #248f3e;
}
/* ================================================= */
/* 📌 KYLECOVERS THEME */
/* ================================================= */
body.kylecovers-theme,
.kylecovers-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #d9d9d9;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #1c4e86;
--sk-secondary-color: #45bf1c;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #d9d9d9;
}
/* ================================================= */
/* 📌 ON3 THEME */
/* ================================================= */
body.on3-theme,
.on3-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #3b4147;
--sk-panel-head-background-color-highlight: #ffffff;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #ffffff;
--sk-panel-content-background-color-highlight: #ffffff;
--sk-border-color: #E9ECF3;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #ffffff;
--sk-table-header-text-color: #000000;
--sk-table-row-odd-background-color: #ffffff;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #bb1b0d;
--sk-error-color: #ff0000;
--sk-primary-color: #29f085;
--sk-secondary-color: #FE3B1F;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 10px;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #474749;
--sk-table-border-color: #29f085;
}
/* ================================================= */
/* 📌 MAYHEM THEME (Dark) */
/* ================================================= */
body.mayhem-theme,
.mayhem-theme {
--sk-background-color: #1f1f1f;
--sk-panel-head-background-color: #131313;
--sk-panel-head-background-color-highlight: #5d5d5d;
--sk-panel-head-color: #dbc464;
--sk-panel-content-background-color: #2d2d2d;
--sk-panel-content-background-color-highlight: #424242;
--sk-border-color: #363636;
--sk-border-color-hover: #8e8e8e;
--sk-text-color: #c2c2c2;
--sk-text-color-minor: #b2b2b2;
--sk-text-color-highlight: #ffffff;
--sk-table-background-color: #1f1f1f;
--sk-table-header-background-color: #424242;
--sk-table-header-text-color: #f5f5f5;
--sk-table-row-odd-background-color: #1f1f1f;
--sk-form-control-background-color: #424242;
--sk-form-control-text-color: #c2c2c2;
--sk-tooltip-background-color: #f5f5f5;
--sk-tooltip-text-color: #5b5b5b;
--sk-link-color: #dbc464;
--sk-error-color: #e40000;
--sk-primary-color: #dbc464;
--sk-secondary-color: #dbc464;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #5d5d5d;
--sk-btn-disabled-color: #ffffff;
--sk-table-border-color: #3e3e3e;
}
/* ================================================= */
/* 📌 PLAYERPROFILER THEME */
/* ================================================= */
body.playerprofiler-theme,
.playerprofiler-theme {
--sk-background-color: #06172d;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #173159;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #000000;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #4DBDFF;
--sk-error-color: #bb1b0d;
--sk-primary-color: #1c4e86;
--sk-secondary-color: #5099e4;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #1E4177;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #A5B3C9;
}
/* ================================================= */
/* 📌 CIRCASPORTS THEME */
/* ================================================= */
body.circasports-theme,
.circasports-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #0c1f8f;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #0c1f8f;
--sk-secondary-color: #0c1f8f;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #0c1f8f;
}
/* ================================================= */
/* 📌 UNABATED THEME */
/* ================================================= */
body.unabated-theme,
.unabated-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #00ac64;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #00ac64;
--sk-secondary-color: #00ac64;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #00ac64;
}
/* ================================================= */
/* 📌 VSIN THEME */
/* ================================================= */
body.vsin-theme,
.vsin-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #db0000;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #db0000;
--sk-secondary-color: #db0000;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #db0000;
}
/* ================================================= */
/* 📌 PLAYUP THEME */
/* ================================================= */
body.playup-theme,
.playup-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #01ca6e;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #01ca6e;
--sk-secondary-color: #01ca6e;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #01ca6e;
}
/* ================================================= */
/* 📌 HANDICAPPER THEME */
/* ================================================= */
body.handicapper-theme,
.handicapper-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #157347;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #157347;
--sk-secondary-color: #157347;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #157347;
}
/* ================================================= */
/* 📌 BASEBALLAMERICA THEME */
/* ================================================= */
body.baseballamerica-theme,
.baseballamerica-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #ebebeb;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #d9d9d9;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #0071ae;
--sk-error-color: #bb1b0d;
--sk-primary-color: #006da7;
--sk-secondary-color: #006da7;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #d9d9d9;
}
/* More themes can be added here as needed */
/* See R17 _theme.scss for complete list */
/* ================================================= */
/* 📌 SPORTS20 THEME */
/* ================================================= */
body.sports20-theme,
.sports20-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #0e2949;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #0e2949;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #e54f5d;
--sk-error-color: #ff0000;
--sk-primary-color: #0e2949;
--sk-secondary-color: #e54f5d;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #0e2949;
}
/* ================================================= */
/* 📌 TONYSPICKS THEME */
/* ================================================= */
body.tonyspicks-theme,
.tonyspicks-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #222222;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #15b21e;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #15b21e;
--sk-error-color: #ff0000;
--sk-primary-color: #161616;
--sk-secondary-color: #15b21e;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #15b21e;
}
/* ================================================= */
/* 📌 SPORTINGSOLUTIONS THEME */
/* ================================================= */
body.sportingsolutions-theme,
.sportingsolutions-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #212529;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #37be76;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #37be76;
--sk-error-color: #ff0000;
--sk-primary-color: #212529;
--sk-secondary-color: #37be76;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #37be76;
}
/* ================================================= */
/* 📌 SCCGMANAGEMENT THEME */
/* ================================================= */
body.sccgmanagement-theme,
.sccgmanagement-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #232f3e;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #232f3e;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #ec7211;
--sk-error-color: #ff0000;
--sk-primary-color: #232f3e;
--sk-secondary-color: #ec7211;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #ec7211;
}
/* ================================================= */
/* 📌 THESPORTSGEEK THEME */
/* ================================================= */
body.thesportsgeek-theme,
.thesportsgeek-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #161d25;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #ef6f18;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #ef6f18;
--sk-error-color: #ff0000;
--sk-primary-color: #161d25;
--sk-secondary-color: #ef6f18;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #ef6f18;
}
/* ================================================= */
/* 📌 SPORTSREFERENCE THEME */
/* ================================================= */
body.sportsreference-theme,
.sportsreference-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #334568;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #334568;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #dd4814;
--sk-error-color: #ff0000;
--sk-primary-color: #334568;
--sk-secondary-color: #dd4814;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #dd4814;
}
/* ================================================= */
/* 📌 GAMBLING THEME */
/* ================================================= */
body.gambling-theme,
.gambling-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #222222;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #222222;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #0066cc;
--sk-error-color: #ff0000;
--sk-primary-color: #222222;
--sk-secondary-color: #4FC1E9;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #4FC1E9;
}
/* ================================================= */
/* 📌 THEATHLETIC THEME */
/* ================================================= */
body.theathletic-theme,
.theathletic-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #191f25;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #191f25;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #191f25;
--sk-error-color: #ff0000;
--sk-primary-color: #191f25;
--sk-secondary-color: #d4a75a;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #191f25;
--sk-btn-border-radius: 4px;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #d4a75a;
}
/* ================================================= */
/* 📌 SATURDAYDOWNSOUTH THEME */
/* ================================================= */
body.saturdaydownsouth-theme,
.saturdaydownsouth-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #18424e;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #18424e;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #eb3c38;
--sk-error-color: #ff0000;
--sk-primary-color: #18424e;
--sk-secondary-color: #eb3c38;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #eb3c38;
}
/* ================================================= */
/* 📌 BETTINGEXPERT THEME */
/* ================================================= */
body.bettingexpert-theme,
.bettingexpert-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #28343f;
--sk-panel-head-background-color-highlight: #494949;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #e5e5e5;
--sk-panel-content-background-color-highlight: #cccccc;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #808080;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-text-color-highlight: #434242;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #28343f;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #e5e5e5;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #474749;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #3DA83D;
--sk-error-color: #ff0000;
--sk-primary-color: #28343f;
--sk-secondary-color: #3DA83D;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 0;
--sk-btn-disabled-background-color: #c9c9c9;
--sk-btn-disabled-color: #434242;
--sk-table-border-color: #3DA83D;
}
/* ================================================= */
/* 📌 ANALYTICSBET THEME */
/* ================================================= */
body.analyticsbet-theme,
.analyticsbet-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #2e6ad1;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #2e6ad1;
--sk-secondary-color: #2e6ad1;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #2e6ad1;
}
/* ================================================= */
/* 📌 OUTTHEGATE THEME */
/* ================================================= */
body.outthegate-theme,
.outthegate-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #2f3132;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #2f3132;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #2f3132;
--sk-secondary-color: #2f3132;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #2f3132;
}
/* ================================================= */
/* 📌 PROPHETBETTINGEXCHANGE THEME */
/* ================================================= */
body.prophetbettingexchange-theme,
.prophetbettingexchange-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #4a91a4;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #4a91a4;
--sk-secondary-color: #4a91a4;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #4a91a4;
}
/* ================================================= */
/* 📌 PICKINGDUCK THEME */
/* ================================================= */
body.pickingduck-theme,
.pickingduck-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #f89a36;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #f89a36;
--sk-secondary-color: #f89a36;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #f89a36;
}
/* ================================================= */
/* 📌 PLAYBYPLAY THEME */
/* ================================================= */
body.playbyplay-theme,
.playbyplay-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #d9d9d9;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #1c4e86;
--sk-secondary-color: #e67917;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #d9d9d9;
}
/* ================================================= */
/* 📌 FOURDEEP THEME */
/* ================================================= */
body.fourdeep-theme,
.fourdeep-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #4f2f94;
--sk-table-header-text-color: #ffffff;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #4f2f94;
--sk-error-color: #bb1b0d;
--sk-primary-color: #4f2f94;
--sk-secondary-color: #4f2f94;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #4f2f94;
}
/* ================================================= */
/* 📌 BETTORCULTURE THEME */
/* ================================================= */
body.bettorculture-theme,
.bettorculture-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #fcb92c;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #01265e;
--sk-secondary-color: #fcb92c;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #000000;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #fcb92c;
}
/* ================================================= */
/* 📌 SPORTSCONTENTPRO THEME */
/* ================================================= */
body.sportscontentpro-theme,
.sportscontentpro-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #3AB0FF;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #3AB0FF;
--sk-secondary-color: #3AB0FF;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #3AB0FF;
}
/* ================================================= */
/* 📌 SOFTBALLAMERICA THEME */
/* ================================================= */
body.softballAmerica-theme,
.softballAmerica-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #d9d9d9;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #f7c300;
--sk-error-color: #bb1b0d;
--sk-primary-color: #002d72;
--sk-secondary-color: #f7c300;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #000000;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #d9d9d9;
}
/* ================================================= */
/* 📌 BLEACHERBROTHERS THEME */
/* ================================================= */
body.bleacherbrothers-theme,
.bleacherbrothers-theme {
--sk-background-color: #ffffff;
--sk-panel-head-background-color: #d8d8d8;
--sk-panel-head-background-color-highlight: #a8a8a8;
--sk-panel-head-color: #000000;
--sk-panel-content-background-color: #f5f5f5;
--sk-panel-content-background-color-highlight: #d8d8d8;
--sk-border-color: #b8b8b8;
--sk-border-color-hover: #808080;
--sk-text-color: #5b5b5b;
--sk-text-color-minor: #7d7d7d;
--sk-text-color-highlight: #000000;
--sk-table-background-color: #ffffff;
--sk-table-header-background-color: #d9d9d9;
--sk-table-header-text-color: #2d2d2d;
--sk-table-row-odd-background-color: #f8f8f8;
--sk-form-control-background-color: #ffffff;
--sk-form-control-text-color: #5b5b5b;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #f5f5f5;
--sk-link-color: #266abd;
--sk-error-color: #bb1b0d;
--sk-primary-color: #f67b41;
--sk-secondary-color: #3c5896;
--sk-btn-primary-text-color: #ffffff;
--sk-btn-secondary-text-color: #ffffff;
--sk-btn-border-radius: 25px;
--sk-btn-disabled-background-color: #a8a8a8;
--sk-btn-disabled-color: #000000;
--sk-table-border-color: #d9d9d9;
}
/* Theme System CSS Variables */
:root {
/* ================================================= */
/* 🎨 SK- PREFIX ALIASES (R17 COMPATIBILITY) */
/* Required for component SCSS using var(--sk-*) */
/* SYNCED TO PRODUCTION R17 VALUES - Dec 2025 */
/* ================================================= */
--sk-background-color: #eaeaea; /* R17 prod: rgb(234,234,234) gray */
--sk-header-background: #262626; /* Design Spec: Dark Grey for Main Header */
--sk-panel-head-background-color: #1c4e86; /* Design Spec: Blue for Panel Headers */
--sk-panel-head-background-color-highlight: #b2b2b2; /* FIXED: Match production (Light gray) */
--sk-panel-head-color: #ffffff; /* White text for dark background */
--sk-panel-content-background-color: #fff;
--sk-panel-content-background-color-highlight: #f5f5f5;
--sk-border-color: #eaeded; /* R17 prod: slightly different gray */
--sk-border-color-hover: #a8a8a8;
--sk-text-color: #5b5b5b; /* R17 prod: exact match */
--sk-text-color-minor: #7d7d7d; /* R17 prod: slightly lighter */
--sk-text-color-highlight: #262626; /* R17 prod: dark gray, not pure black */
--sk-table-background-color: #fff;
--sk-table-header-background-color: #f5f5f5; /* R17 prod: light gray, not dark */
--sk-table-header-text-color: #3e3e3e; /* R17 prod: dark gray text */
--sk-table-row-odd-background-color: #fff;
--sk-table-border-color: #d9d9d9; /* R17 prod: slightly darker border */
--sk-form-control-background-color: #fff; /* R17 prod: white, not dark */
--sk-form-control-text-color: #5b5b5b; /* R17 prod: text color match */
--sk-tooltip-background-color: #333; /* R17 prod: dark tooltip */
--sk-tooltip-text-color: #f5f5f5; /* R17 prod: light text */
--sk-link-color: #e67917;
--sk-error-color: #e40000; /* R17 prod: brighter red */
--sk-primary-color: #1c4e86;
--sk-secondary-color: #e67917;
--sk-btn-primary-text-color: #fff;
--sk-btn-secondary-text-color: #fff;
--sk-btn-border-radius: 25px; /* R17 prod: rounded buttons */
--sk-btn-disabled-background-color: #b2b2b2; /* R17 prod: gray disabled */
--sk-btn-disabled-color: #262626; /* R17 prod: dark disabled text */
--sk-color-white: #ffffff;
--sk-font-size-panel: 14px;
--sk-border-radius: 0; /* R17 prod: square borders by default */
/* ================================================= */
/* 🎨 BASE VARIABLES - DESIGN PRIMITIVES */
/* ================================================= */
/* GRAYSCALE SYSTEM */
--base-gray-50: #fafafa;
--base-gray-100: #f5f5f5;
--base-gray-200: #e9ecf3;
--base-gray-300: #d4d4d4;
--base-gray-400: #a8a8a8;
--base-gray-500: #999999;
--base-gray-600: #666666;
--base-gray-700: #5b5b5b; /* R17 parity: was #474749, now matches prod text color */
--base-gray-800: #424242;
--base-gray-900: #131313;
--base-gray-950: #000000;
--base-white: #ffffff;
/* BRAND COLOR SCALES - R17 PARITY */
--base-orange-500: #e67917;
--base-blue-500: #1c4e86;
--base-red-600: #bb1b0d;
/* ================================================= */
/* 🔥 SEMANTIC THEME VARIABLES - TIER 2 */
/* ================================================= */
/* Primary Color Scheme - R17 PARITY: Blue primary, Orange secondary */
--theme-primary-color: var(--base-blue-500);
--theme-secondary-color: var(--base-orange-500);
/* Typography Colors */
--theme-text-color: var(--base-gray-700);
--theme-text-color-minor: var(--base-gray-600);
--theme-text-color-highlight: var(--base-white);
/* Background Colors */
--theme-background-color: #eaeaea; /* R17 parity: rgb(234, 234, 234) */
--theme-color-white: var(--base-white);
--theme-color-black: var(--base-gray-950);
/* RGB helpers for alpha-safe usage */
--theme-color-white-rgb: 255, 255, 255;
--theme-color-black-rgb: 0, 0, 0;
/* Panel Colors - CSS PARITY FIX 2025-12-09: Values from style-diff-analyzer intelligence report */
--theme-panel-head-background-color: #1c4e86; /* Production blue - verified by style-diff-analyzer */
--theme-panel-head-background-color-highlight: #b2b2b2; /* Production highlight - verified */
--theme-panel-head-color: #ffffff; /* Production white text - verified */
--theme-panel-content-background-color: var(--base-white);
--theme-panel-content-background-color-highlight: var(--base-gray-100);
/* Border Colors */
--theme-border-color: var(--base-gray-200);
--theme-border-color-hover: var(--base-gray-400);
/* Table Colors - R17 PARITY: Light gray headers, not dark gray */
--theme-table-background-color: var(--base-white);
--theme-table-header-background-color: var(--base-gray-100);
--theme-table-header-text-color: #3e3e3e; /* R17 PARITY: $light-black value */
--theme-table-row-odd-background-color: var(--base-white);
--theme-table-border-color: var(--base-gray-200);
/* Form Control Colors - R17 PARITY: White backgrounds, not dark gray */
--theme-form-control-background-color: var(--base-white);
--theme-form-control-text-color: var(--base-gray-700);
--theme-form-control-border-color: var(--base-gray-200);
/* Base spacing and layout */
--base-spacing-xs: 0.25rem;
--base-spacing-sm: 0.5rem;
--base-border-radius-sm: 0.25rem;
/* Button styles */
--button-padding-y: 0.5rem;
--button-padding-x: 1rem;
--button-border-radius: 0.375rem;
--button-font-weight: 500;
--button-transition: all 0.2s ease;
--button-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
--button-min-height: 2.5rem;
--button-gap: 0.5rem;
--button-shadow-hover: 0 4px 6px rgba(0, 0, 0, 0.1);
/* Button variants */
--button-primary-bg: #2563eb;
--button-primary-text: #ffffff;
--button-primary-border: #2563eb;
--button-primary-bg-hover: #1d4ed8;
--button-primary-border-hover: #1d4ed8;
--button-secondary-bg: #f8fafc;
--button-secondary-text: #334155;
--button-secondary-border: #e2e8f0;
--button-secondary-bg-hover: #f1f5f9;
--button-secondary-text-hover: #1e293b;
--button-ghost-bg: transparent;
--button-ghost-text: #475569;
--button-ghost-border: transparent;
--button-ghost-bg-hover: #f8fafc;
/* Card styles */
--card-padding: 1.5rem;
--card-bg: #ffffff;
--card-border: 1px solid #e2e8f0;
--card-border-radius: 0.5rem;
--card-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
--card-header-border: 1px solid #e2e8f0;
--card-gap: 1rem;
/* Typography */
--base-font-weight-medium: 500;
/* ================================================= */
/* 🎯 COMPREHENSIVE THEME VARIABLES - PRODUCTION */
/* Essential theme variables for sk-app */
/* ================================================= */
/* ESSENTIAL SPACING VARIABLES */
--spacing-x0_125: 2px;
--spacing-x0_25: 4px;
--spacing-x0_5: 8px;
--spacing-x1: 16px;
--spacing-x1_25: 20px;
--spacing-x1_5: 24px;
--spacing-x2: 32px;
--spacing-x3: 48px;
--spacing-x4: 64px;
--spacing-x5: 80px;
--spacing-x6: 96px;
--spacing-x10: 160px;
--spacing-base: 16px;
/* BUTTON THEME VARIABLES - R17 PARITY */
--theme-btn-primary-bgColor: #1c4e86;
--theme-btn-primary-textColor: #ffffff;
--theme-btn-primary-bgColor--hover: #153d6a;
--theme-btn-primary-bgColor--highlight: #0e2c4e;
--theme-btn-secondary-bgColor: #6b7280;
--theme-btn-secondary-textColor: #ffffff;
--theme-btn-secondary-bgColor--hover: #4b5563;
--theme-btn-secondary-bgColor--highlight: #374151;
--theme-btn-tertiary-bgColor: transparent;
--theme-btn-tertiary-textColor: #1c4e86;
--theme-btn-tertiary-bgColor--highlight: #fef3c7;
--theme-btn-disabled-background-color: #b2b2b2; /* R17 PARITY: gray disabled */
--theme-btn-disabled-color: #262626; /* R17 PARITY: dark disabled text */
--theme-btn-border-radius: 25px; /* R17 PARITY: rounded buttons */
/* COMPONENT THEME VARIABLES */
--theme-header-height: 70px;
--theme-header-background-color: #ffffff; /* VISUAL PARITY FIX 2025-12-13: Production header is WHITE, not dark */
--theme-header-text-color: #5b5b5b; /* VISUAL PARITY FIX 2025-12-13: Production text is dark gray rgb(91,91,91) */
--theme-header-border-color: #5b5b5b; /* VISUAL PARITY FIX 2025-12-13: Production border matches text color */
--theme-color-link: #e67917;
--theme-text-font: 'Open Sans', sans-serif;
/* CSS PARITY FIX: Font rendering improvements to match production */
text-rendering: optimizelegibility;
-webkit-font-smoothing: antialiased;
--theme-default-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
--theme-default-transition: 150ms ease-in-out;
--theme-font-size-panel: 14px;
--theme-font-size-panel-small: 12px;
--theme-font-style-italic: italic;
--theme-font-weight-bold: 700;
--theme-font-weight-semi-bold: 600;
--theme-icon-size: 20px;
--spinner-size: 32px;
/* GRADE AND STATUS COLORS - R17 Bootstrap parity */
--theme-grade-aplus-color: #28a745;
--theme-grade-a-color: #28a745;
--theme-grade-bplus-color: #6ab547;
--theme-grade-b-color: #ffc107;
--theme-grade-cplus-color: #ffc107;
--theme-grade-c-color: #fd7e14;
--theme-grade-d-color: #dc3545;
--theme-grade-f-color: #6f42c1;
--theme-win-color: #28a745;
--theme-total-color: #17a2b8;
--theme-spread-color: #6f42c1;
--theme-dark-light: #6b7280;
/* ERROR THEME VARIABLES */
--theme-background-color-error: #fef2f2;
--theme-border-color-error: #fecaca;
--theme-text-color-error: #dc2626;
/* TOOLTIP VARIABLES - R17 PARITY */
--theme-tooltip-background-color: #333; /* R17 PARITY: matches sk-tooltip-background-color */
--theme-tooltip-text-color: #f5f5f5; /* R17 PARITY: $light-white */
/* ZINDEX VARIABLES */
--z-fixed: 1000;
--z-dropdown: 1050;
--z-modal: 1100;
--z-popover: 1075;
/* BORDER VARIABLES */
--border-radius-md: 8px;
--border-radius-small: 4px;
/* Button styles */
--button-padding-y: 0.5rem;
--button-padding-x: 1rem;
--button-border-radius: 0.375rem;
--button-font-weight: 500;
--button-transition: all 0.2s ease;
--button-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
--button-min-height: 2.5rem;
--button-gap: 0.5rem;
--button-shadow-hover: 0 4px 6px rgba(0, 0, 0, 0.1);
--input-padding-x: 0.75rem;
--input-border: 1px solid #d1d5db;
--input-border-radius: 0.375rem;
--input-bg: #ffffff;
--input-text: #111827;
--input-min-height: 2.5rem;
--input-transition: border-color 0.2s ease, box-shadow 0.2s ease;
--input-placeholder: #9ca3af;
--input-border-focus: #2563eb;
--input-shadow-focus: 0 0 0 3px rgba(37, 99, 235, 0.1);
/* Select dropdown */
--select-arrow-size: 1rem;
/* Badge styles */
--badge-padding-y: 0.25rem;
--badge-padding-x: 0.5rem;
--badge-border-radius: 0.25rem;
--badge-font-size: 0.75rem;
--badge-font-weight: 500;
--badge-primary-bg: #dbeafe;
--badge-primary-text: #1e40af;
--badge-secondary-bg: #f3f4f6;
--badge-secondary-text: #374151;
--badge-success-bg: #dcfce7;
--badge-success-text: #166534;
--badge-error-bg: #fef2f2;
--badge-error-text: #dc2626;
}
/* ================================================= */
/* 📝 CSS PARITY FIX (Nov 25, 2025) */
/* @font-face declarations for Open Sans */
/* MUST BE LOADED FIRST - fonts before everything! */
/* ================================================= */
/* MOVED TO index.css
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url_DISABLED('/fonts/open-sans-v17-latin-regular.woff2') format('woff2'),
url_DISABLED('/fonts/open-sans-v17-latin-regular.woff') format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url_DISABLED('/fonts/open-sans-v17-latin-600.woff2') format('woff2'),
url_DISABLED('/fonts/open-sans-v17-latin-600.woff') format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url_DISABLED('/fonts/open-sans-v17-latin-700.woff2') format('woff2'),
url_DISABLED('/fonts/open-sans-v17-latin-700.woff') format('woff');
}
*/
/* MOVED TO index.css
Global body font application - R17 PARITY FIX
html, body {
font-family: 'Open Sans', sans-serif;
font-size: 14px !important;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
overflow-y: scroll;
width: 100%;
}
*/
body {
margin: 0 !important; /* R17 parity: production has no body margin */
color: #5b5b5b; /* R17 parity: rgb(91, 91, 91) */
background-color: #eaeaea; /* R17 parity: rgb(234, 234, 234) */
line-height: 1.29; /* R17 parity: 18.06px / 14px = 1.29 */
font-weight: 400;
}
/* Apply to all elements as fallback */
*, *::before, *::after {
font-family: 'Open Sans', sans-serif;
}
/* ================================================= */
/* 🌙 DARK THEME OVERRIDES */
/* Applied when body.dark-theme is active */
/* Merged from both upstream and stashed changes */
/* ================================================= */
body.dark-theme,
.dark-theme {
/* GRAYSCALE - Dark theme inverts the scale */
--base-gray-50: #1f1f1f;
--base-gray-100: #2d2d2d;
--base-gray-200: #363636;
--base-gray-300: #424242;
--base-gray-400: #5d5d5d;
--base-gray-500: #7d7d7d;
--base-gray-600: #a8a8a8;
--base-gray-700: #cccccc;
--base-gray-800: #e0e0e0;
--base-gray-900: #f5f5f5;
--base-gray-950: #ffffff;
--base-white: #1f1f1f;
/* Semantic - Background */
--theme-background-color: #1f1f1f;
--theme-color-white: #ffffff;
--theme-color-black: #000000;
--theme-color-white-rgb: 255, 255, 255;
--theme-color-black-rgb: 0, 0, 0;
/* Typography - Light text on dark */
--theme-text-color: #cccccc;
--theme-text-color-minor: #7d7d7d;
--theme-text-color-highlight: #ffffff;
--theme-text-header-color: #ffffff;
/* Panel Colors - Dark theme values from React 17 */
--theme-panel-head-background-color: #424242;
--theme-panel-head-background-color-highlight: #5d5d5d;
--theme-panel-head-color: #ffffff;
--theme-panel-content-background-color: #2d2d2d;
--theme-panel-content-background-color-highlight: #424242;
/* Table Colors */
--theme-table-background-color: #1f1f1f;
--theme-table-header-background-color: #2d2d2d;
--theme-table-header-text-color: #e0e0e0;
--theme-table-row-odd-background-color: #1f1f1f;
/* Borders */
--theme-border-color: #363636;
--theme-border-color-hover: #5d5d5d;
/* Form Controls */
--theme-form-control-background-color: transparent;
--theme-form-control-text-color: #cccccc;
/* Links - R17 PARITY: Orange links */
--theme-link-color: #e67917;
--theme-link-hover-color: #d04106;
/* Input overrides */
--input-bg: #2d2d2d;
--input-text: #cccccc;
--input-border: 1px solid #363636;
--input-placeholder: #7d7d7d;
/* SK prefix aliases for dark theme
VISUAL PARITY FIX 2026-01-23: Match PROD background (was #131313, now #1f1f1f)
Parity data: PROD=rgb(31,31,31)=#1f1f1f, LOCAL was rgb(19,19,19)=#131313 */
--sk-background-color: #1f1f1f;
--sk-panel-head-background-color: #424242;
--sk-panel-head-background-color-highlight: #5d5d5d;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #2d2d2d;
--sk-panel-content-background-color-highlight: #424242;
--sk-border-color: #424242;
--sk-border-color-hover: #6b6b6b;
--sk-text-color: #ffffff;
--sk-text-color-minor: #b8b8b8;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #ffffff;
--sk-btn-disabled-background-color: #b8b8b8;
--sk-btn-disabled-color: #ffffff;
}
/* ================================================= */
/* 🎰 US-ODDS THEME OVERRIDES */
/* Applied when body.us-odds-theme is active */
/* ================================================= */
body.us-odds-theme,
.us-odds-theme {
--sk-panel-head-background-color: #003c7c;
--sk-panel-head-background-color-highlight: #1f5ca3;
--sk-panel-head-color: #ffffff;
--sk-panel-content-background-color: #f0f0f0;
--sk-panel-content-background-color-highlight: #e0e0e0;
--sk-border-color: #c9c9c9;
--sk-border-color-hover: #a4a4a4;
--sk-text-color: #474749;
--sk-text-color-minor: #666666;
--sk-tooltip-background-color: #333333;
--sk-tooltip-text-color: #ffffff;
--sk-link-color: #bb1b0d;
--sk-error-color: #ff0000;
--sk-primary-color: #003c7c;
--sk-secondary-color: #ffc131;
--sk-btn-border-radius: 5px;
--sk-btn-disabled-background-color: #b8b8b8;
--sk-btn-disabled-color: #ffffff;
}
/*# sourceMappingURL=main.fe20e50f.css.map*/