@import url('https://fonts.googleapis.com/css2?family=Anuphan:wght@400;500;600;700&display=swap');

/* ============================================================
   UFABET CENTRAL UI CORE V8
   TYPOGRAPHY + SEMANTIC COLOR AUTHORITY
   Desktop / Tablet / Mobile use one visual language.
   V8 is a clean authority layer: font, size, weight, line-height,
   text color, status color, value color and information hierarchy.
   ============================================================ */

:root{
  --uf8-font:"Anuphan","Leelawadee UI",Tahoma,Arial,sans-serif;

  --uf8-heading:#ffffff;
  --uf8-body:#e7eff4;
  --uf8-body-soft:#c7d4db;
  --uf8-meta:#a9bac4;
  --uf8-faint:#8ea3af;

  --uf8-label:#8fd9ff;
  --uf8-section:#5de5dc;
  --uf8-value:#ffffff;
  --uf8-identity:#6fcaff;
  --uf8-info:#73dce8;
  --uf8-code:#cabaff;
  --uf8-date:#b7b1ff;
  --uf8-link:#7fc3ff;
  --uf8-money:#ffd56f;
  --uf8-count:#67ded4;

  --uf8-success:#6de7a7;
  --uf8-warning:#ffca61;
  --uf8-danger:#ff7f91;
  --uf8-neutral:#c2cfd6;

  --uf8-floor:14px;
  --uf8-body-size:16px;
  --uf8-body-leading:1.62;
  --uf8-label-size:14.5px;
  --uf8-value-size:15.5px;
  --uf8-meta-size:14px;
  --uf8-control-size:15.5px;
  --uf8-button-size:14.5px;
  --uf8-table-size:15px;
  --uf8-table-head:14px;
  --uf8-section-title:19px;
  --uf8-page-title:40px;
}

/* ============================================================
   01. GLOBAL FONT + READABILITY
   ============================================================ */

html body.ops-app[data-ui-core="ufabet-ui-core-v8"],
html body.ops-login-page[data-ui-core="ufabet-ui-core-v8"]{
  font-family:var(--uf8-font)!important;
  color:var(--uf8-body)!important;
  font-size:var(--uf8-body-size)!important;
  font-weight:500!important;
  line-height:var(--uf8-body-leading)!important;
  font-synthesis:none!important;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"kern" 1,"liga" 1;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] *,
html body.ops-login-page[data-ui-core="ufabet-ui-core-v8"] *{
  font-family:var(--uf8-font)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content{
  color:var(--uf8-body)!important;
  font-size:var(--uf8-body-size)!important;
  line-height:var(--uf8-body-leading)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-readable="1"],
html body.ops-login-page[data-ui-core="ufabet-ui-core-v8"] [data-ui-readable="1"]{
  font-size:var(--uf8-floor)!important;
  line-height:1.5!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(p,li,dd,dt){
  font-size:15.5px!important;
  line-height:1.66!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content strong,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content b{
  font-weight:700!important;
}

/* ============================================================
   02. SHELL — LARGE ENOUGH TO SCAN, NOT DECORATIVE MICROTEXT
   ============================================================ */

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-brand>span,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-nav-section{
  color:#9db5c1!important;
  font-size:14px!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
  line-height:1.35!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-nav a{
  color:#d7e2e7!important;
  font-size:15.5px!important;
  font-weight:600!important;
  line-height:1.4!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-nav a.active{
  color:#ffffff!important;
  font-weight:700!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-top-title strong{
  color:var(--uf8-heading)!important;
  font-size:17px!important;
  font-weight:700!important;
  line-height:1.28!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-top-title span{
  color:#b3c4cd!important;
  font-size:14px!important;
  font-weight:500!important;
  line-height:1.35!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-search input{
  color:var(--uf8-value)!important;
  font-size:15px!important;
  font-weight:500!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-production,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-clock{
  font-size:14px!important;
  font-weight:600!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-admin summary strong,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-sidebar-health strong{
  color:var(--uf8-heading)!important;
  font-size:14.5px!important;
  font-weight:700!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-admin summary small,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-sidebar-health small,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-admin-menu>div,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-admin-menu button{
  color:var(--uf8-meta)!important;
  font-size:14px!important;
  font-weight:500!important;
  line-height:1.4!important;
}

/* ============================================================
   03. PAGE + SECTION HIERARCHY
   ============================================================ */

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-page-head>div:first-child>span,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content [class*="eyebrow"],
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content [class*="kicker"]{
  color:var(--uf8-section)!important;
  font-size:14px!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
  line-height:1.35!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-page-head h1,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content h1{
  color:var(--uf8-heading)!important;
  font-size:clamp(36px,2.35vw,var(--uf8-page-title))!important;
  font-weight:700!important;
  line-height:1.16!important;
  letter-spacing:-.018em!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-page-head p{
  color:var(--uf8-body-soft)!important;
  font-size:16px!important;
  font-weight:500!important;
  line-height:1.68!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content h2,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-panel-head h2,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-subhead strong{
  color:var(--uf8-money)!important;
  font-size:var(--uf8-section-title)!important;
  font-weight:700!important;
  line-height:1.34!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content h3{
  color:var(--uf8-section)!important;
  font-size:17px!important;
  font-weight:700!important;
  line-height:1.4!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-panel-head>div>span,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-subhead>span{
  color:var(--uf8-section)!important;
  font-size:14px!important;
  font-weight:700!important;
  letter-spacing:.07em!important;
  line-height:1.35!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-panel-head>small,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content [class*="meta"],
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content [class*="hint"],
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content [class*="help"],
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content [class*="note"]{
  color:var(--uf8-meta)!important;
  font-size:var(--uf8-meta-size)!important;
  font-weight:500!important;
  line-height:1.55!important;
  opacity:1!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-panel-head>a,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-panel-head nav a,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-subhead a{
  color:var(--uf8-link)!important;
  font-size:14px!important;
  font-weight:600!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-head-stat span{
  color:var(--uf8-label)!important;
  font-size:14px!important;
  font-weight:600!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-head-stat strong{
  color:var(--uf8-value)!important;
  font-size:24px!important;
  font-weight:700!important;
  font-variant-numeric:tabular-nums;
}

/* ============================================================
   04. FORMS + ACTIONS
   ============================================================ */

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content label,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content label>span,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content dt,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .payment-bank-field-label{
  color:var(--uf8-label)!important;
  font-size:var(--uf8-label-size)!important;
  font-weight:600!important;
  line-height:1.45!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content input,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content select,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content textarea{
  min-height:44px;
  color:var(--uf8-value)!important;
  font-size:var(--uf8-control-size)!important;
  font-weight:500!important;
  line-height:1.5!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content input::placeholder,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content textarea::placeholder{
  color:#93a8b4!important;
  opacity:1!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-btn,button,.ui-btn,.ops-drawer>summary){
  font-size:var(--uf8-button-size)!important;
  font-weight:700!important;
  line-height:1.35!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-btn-sm{
  font-size:14px!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-btn-gold,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-drawer>summary,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-banner-v3-add,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-banner-v3-save{
  background-color:#c9952d!important;
  color:#071721!important;
  font-weight:700!important;
}

/* ============================================================
   05. TABLES + LISTS
   ============================================================ */

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-table{
  color:var(--uf8-body)!important;
  font-size:var(--uf8-table-size)!important;
  line-height:1.55!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-table th,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-grid-head{
  color:var(--uf8-label)!important;
  font-size:var(--uf8-table-head)!important;
  font-weight:700!important;
  line-height:1.4!important;
  letter-spacing:.008em!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-table td,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-grid-row{
  color:var(--uf8-body)!important;
  font-size:var(--uf8-table-size)!important;
  font-weight:500!important;
  line-height:1.58!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-table td strong,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-grid-row b{
  color:var(--uf8-value)!important;
  font-size:15.5px!important;
  font-weight:700!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-table td:first-child,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-table td:first-child strong,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-grid-row>:first-child{
  color:var(--uf8-identity)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-table-empty,.ops-empty,[class*="empty"]){
  color:var(--uf8-body-soft)!important;
  font-size:14.5px!important;
  font-weight:500!important;
  line-height:1.6!important;
  opacity:1!important;
}

/* ============================================================
   06. KPI + SEMANTIC VALUES
   ============================================================ */

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(
  .ops-kpis,.ops-member-history-kpis,.ops-promo-kpis,.ops-seo-bi-kpis,
  .mw-summary,.mw-metric,.fo-kpi,.fo-wallet-card,.ops-checkin-kpis,
  .ops-system-summary,.ops-seo-bi-kpi
) span{
  color:var(--uf8-label)!important;
  font-size:14px!important;
  font-weight:600!important;
  line-height:1.4!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(
  .ops-kpis,.ops-member-history-kpis,.ops-promo-kpis,.ops-seo-bi-kpis,
  .mw-summary,.mw-metric,.fo-kpi,.fo-wallet-card,.ops-checkin-kpis,
  .ops-system-summary,.ops-seo-bi-kpi
) strong{
  color:var(--uf8-value)!important;
  font-size:27px!important;
  font-weight:700!important;
  line-height:1.18!important;
  font-variant-numeric:tabular-nums;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(
  .ops-kpis,.ops-member-history-kpis,.ops-promo-kpis,.ops-seo-bi-kpis,
  .mw-summary,.mw-metric,.fo-kpi,.fo-wallet-card,.ops-checkin-kpis,
  .ops-system-summary,.ops-seo-bi-kpi
) small{
  color:var(--uf8-meta)!important;
  font-size:14px!important;
  font-weight:500!important;
}

/* Stable visual rhythm for KPI groups. */
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-kpis,.ops-member-history-kpis,.ops-promo-kpis,.ops-seo-bi-kpis)>:nth-child(6n+1) strong{color:var(--uf8-info)!important}
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-kpis,.ops-member-history-kpis,.ops-promo-kpis,.ops-seo-bi-kpis)>:nth-child(6n+2) strong{color:var(--uf8-section)!important}
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-kpis,.ops-member-history-kpis,.ops-promo-kpis,.ops-seo-bi-kpis)>:nth-child(6n+3) strong{color:var(--uf8-success)!important}
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-kpis,.ops-member-history-kpis,.ops-promo-kpis,.ops-seo-bi-kpis)>:nth-child(6n+4) strong{color:var(--uf8-money)!important}
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-kpis,.ops-member-history-kpis,.ops-promo-kpis,.ops-seo-bi-kpis)>:nth-child(6n+5) strong{color:var(--uf8-code)!important}
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-kpis,.ops-member-history-kpis,.ops-promo-kpis,.ops-seo-bi-kpis)>:nth-child(6n+6) strong{color:var(--uf8-danger)!important}

/* ============================================================
   07. MEMBER DIRECTORY + MEMBER HISTORY
   ============================================================ */

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-member-info-item,.ops-member-history-member) strong{
  color:var(--uf8-identity)!important;
  font-size:16px!important;
  font-weight:700!important;
  line-height:1.35!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-member-info-item,.ops-member-history-member) span{
  color:var(--uf8-body)!important;
  font-size:14.5px!important;
  font-weight:500!important;
  line-height:1.5!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-member-info-item,.ops-member-history-member) small:not([data-ui-tone]){
  color:var(--uf8-meta)!important;
  font-size:14px!important;
  font-weight:600!important;
  line-height:1.4!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-member-info-item,.ops-member-history-member).is-active small{
  color:var(--uf8-section)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-empty{
  min-height:120px!important;
  justify-content:flex-start!important;
  text-align:left!important;
  padding:20px 22px!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-empty strong{
  color:var(--uf8-value)!important;
  font-size:19px!important;
  font-weight:700!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-empty span{
  color:var(--uf8-body-soft)!important;
  font-size:14.5px!important;
  font-weight:500!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-empty-grid{
  grid-template-columns:minmax(0,1fr)!important;
  gap:12px!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-empty-grid>.ops-panel{
  min-height:138px!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-profile{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-profile>div{
  min-height:86px!important;
  padding:15px 17px!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-profile span,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-info-summary span{
  color:var(--uf8-label)!important;
  font-size:14px!important;
  font-weight:600!important;
  line-height:1.4!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-profile strong,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-info-summary strong{
  color:var(--uf8-value)!important;
  font-size:16px!important;
  font-weight:700!important;
  line-height:1.4!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-profile>div:nth-child(1) strong,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-info-summary>div:nth-child(1) strong{
  color:var(--uf8-identity)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-profile>div:nth-child(3) strong{
  color:var(--uf8-info)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-profile>div:nth-child(5) strong,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-info-summary>div:nth-child(2) strong{
  color:var(--uf8-money)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-jump a{
  min-height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  padding:8px 12px!important;
  color:var(--uf8-link)!important;
  font-size:14px!important;
  font-weight:700!important;
}

/* ============================================================
   08. KNOWN MODULE FAMILIES
   ============================================================ */

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(
  .payment-bank-selected-copy,.payment-bank-option-copy,
  .mbank-select-copy,.mbank-option-copy,.mbank-existing-main,
  .support-preview,.support-person-meta,.support-bubble-meta,
  .ops-promo-description
) small{
  color:var(--uf8-meta)!important;
  font-size:14px!important;
  font-weight:500!important;
  line-height:1.55!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(
  .support-name,.support-chat-head strong,.ops-contact-card-head strong,
  .ops-promo-card-head strong
){
  color:var(--uf8-identity)!important;
  font-size:15.5px!important;
  font-weight:700!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .support-preview,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .support-bubble{
  color:var(--uf8-body)!important;
  font-size:14.5px!important;
  line-height:1.65!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content code,
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-banner-v3-page code{
  font-family:var(--uf8-font)!important;
  font-size:14px!important;
  line-height:1.5!important;
  color:var(--uf8-code)!important;
  font-weight:600!important;
  overflow-wrap:anywhere;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-banner-v3-page{
  --banner-text:var(--uf8-value)!important;
  --banner-text-soft:var(--uf8-body-soft)!important;
  --banner-text-muted:var(--uf8-meta)!important;
  --banner-success:var(--uf8-success)!important;
  --banner-title-page:38px!important;
  --banner-title-group:22px!important;
  --banner-title-section:19px!important;
  --banner-text-body:15px!important;
  --banner-text-small:14px!important;
  --banner-text-meta:14px!important;
}

/* ============================================================
   09. RUNTIME SEMANTIC TONES — VALUE ROLES MUST LOOK DIFFERENT
   ============================================================ */

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="body"]{
  color:var(--uf8-body)!important;
  font-weight:500!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="label"]{
  color:var(--uf8-label)!important;
  font-weight:600!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="value"]{
  color:var(--uf8-value)!important;
  font-weight:600!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="meta"]{
  color:var(--uf8-meta)!important;
  font-weight:500!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="identity"]{
  color:var(--uf8-identity)!important;
  font-weight:700!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="info"]{
  color:var(--uf8-info)!important;
  font-weight:600!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="code"]{
  color:var(--uf8-code)!important;
  font-weight:600!important;
  font-variant-numeric:tabular-nums;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="date"]{
  color:var(--uf8-date)!important;
  font-weight:600!important;
  font-variant-numeric:tabular-nums;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="money"]{
  color:var(--uf8-money)!important;
  font-weight:700!important;
  font-variant-numeric:tabular-nums;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="count"]{
  color:var(--uf8-count)!important;
  font-weight:700!important;
  font-variant-numeric:tabular-nums;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="link"]{
  color:var(--uf8-link)!important;
  font-weight:600!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="success"],
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.positive,.ops-state.is-ok,.fo-status.is-ok,.mw-badge.is-ok){
  color:var(--uf8-success)!important;
  font-weight:700!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="warning"],
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-state.is-warn,.fo-status.is-warn,.mw-badge.is-warn){
  color:var(--uf8-warning)!important;
  font-weight:700!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="danger"],
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.negative,.ops-state.is-bad,.fo-status.is-bad,.mw-badge.is-bad){
  color:var(--uf8-danger)!important;
  font-weight:700!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] [data-ui-tone="neutral"]{
  color:var(--uf8-neutral)!important;
  font-weight:600!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(.ops-state,[class*="badge"],[class*="status"]){
  font-size:14px!important;
  font-weight:700!important;
  line-height:1.4!important;
}

/* Generic structural roles before JS classification. */
html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(label>span,dt,.ops-table th,.ops-grid-head){
  color:var(--uf8-label)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content :is(dd,.ops-table td,.ops-grid-row){
  color:var(--uf8-body)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content a:not(.ops-btn){
  color:var(--uf8-link)!important;
}

html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content small:not([data-ui-tone]){
  color:var(--uf8-meta)!important;
  font-size:14px!important;
  font-weight:500!important;
  line-height:1.5!important;
}

/* ============================================================
   10. LOGIN — SAME TYPOGRAPHY SOURCE
   ============================================================ */

html body.ops-login-page[data-ui-core="ufabet-ui-core-v8"] .ops-login-heading h1{
  color:var(--uf8-heading)!important;
  font-size:clamp(36px,2.3vw,42px)!important;
  font-weight:700!important;
  line-height:1.18!important;
}

html body.ops-login-page[data-ui-core="ufabet-ui-core-v8"] .ops-login-heading p{
  color:var(--uf8-body-soft)!important;
  font-size:16px!important;
  font-weight:500!important;
  line-height:1.6!important;
}

html body.ops-login-page[data-ui-core="ufabet-ui-core-v8"] .ops-login-form label>span{
  color:var(--uf8-label)!important;
  font-size:14.5px!important;
  font-weight:600!important;
}

html body.ops-login-page[data-ui-core="ufabet-ui-core-v8"] .ops-login-field input{
  color:var(--uf8-value)!important;
  font-size:16px!important;
  font-weight:500!important;
}

html body.ops-login-page[data-ui-core="ufabet-ui-core-v8"] .ops-login-submit{
  font-size:16px!important;
  font-weight:700!important;
}

html body.ops-login-page[data-ui-core="ufabet-ui-core-v8"] :is(
  .ops-login-runtime,.ops-login-heading>small,.ops-login-security strong,
  .ops-login-security small,.ops-login-footer
){
  color:var(--uf8-meta)!important;
  font-size:14px!important;
  line-height:1.5!important;
}

/* ============================================================
   11. RESPONSIVE — LAYOUT ONLY, TYPOGRAPHY LANGUAGE UNCHANGED
   ============================================================ */

@media(max-width:1440px){
  html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-layout{
    grid-template-columns:minmax(0,1fr)!important;
  }

  html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-directory{
    position:static!important;
  }

  html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-list{
    max-height:360px!important;
  }
}

@media(max-width:760px){
  html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-profile,
  html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:520px){
  html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content{
    font-size:15.5px!important;
  }

  html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-page-head h1{
    font-size:32px!important;
  }

  html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-profile,
  html body.ops-app[data-ui-core="ufabet-ui-core-v8"] .ops-content .ops-member-history-kpis{
    grid-template-columns:minmax(0,1fr)!important;
  }
}