@font-face { font-family: "99LAJU Open Sans"; src: url("/fonts/99laju/open-sans-400.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "99LAJU Open Sans"; src: url("/fonts/99laju/open-sans-600.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "99LAJU Open Sans"; src: url("/fonts/99laju/open-sans-700.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "99LAJU Lexend"; src: url("/fonts/99laju/lexend-400.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "99LAJU Lexend"; src: url("/fonts/99laju/lexend-500.ttf") format("truetype"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "99LAJU Lexend"; src: url("/fonts/99laju/lexend-600.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "99LAJU Lexend"; src: url("/fonts/99laju/lexend-700.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  --background: #090909;
  --foreground: #171717;
  --surface: #1b1b1b;
  --surface-2: #222222;
  --primary: #00df4f;
  --primary-hover: #32f56d;
  --muted: #ffad24;
  --text: #f7f7f7;
  --soft: #b9b9b9;
  --radius: 7px;
  --brand-page-bg: #090909;
  --brand-surface: #171717;
  --brand-accent: #ffad24;
  --brand-success: #00df4f;
  --brand-success-deep: #00a93c;
  --brand-text: #f7f7f7;
  --brand-border: rgba(0, 223, 79, .34);
  --brand-shadow: 0 12px 30px rgba(0, 0, 0, .42);
}

html, body { background: var(--brand-page-bg); color: var(--brand-text); }
body { font-family: "99LAJU Open Sans", Arial, sans-serif; }
h1, h2, h3, h4, .nav-link, .btn, .section-title, .section-head h2, .hero-card-title { font-family: "99LAJU Lexend", "99LAJU Open Sans", Arial, sans-serif; }
.site-header { padding-top: 0; background: #050505; border-bottom: 1px solid rgba(0, 223, 79, .25); }
.header-shell { min-height: 76px; max-width: 1280px; margin-inline: auto; padding-inline: 15px; border: 0; border-bottom: 1px solid rgba(255,255,255,.06); border-radius: 0; background: #050505; box-shadow: none; }
.brand-link img, .footer-logo img { width: auto; height: auto; object-fit: contain; }
.brand-link img { width: 190px; max-height: 40px; }
.footer-logo img { width: 182px; }
.primary-nav ul { gap: 18px; }
.nav-link { color: #a9a9a9; }
.nav-link:hover, .nav-link:focus, .nav-link.is-active { color: var(--brand-success); }
.nav-link::after { background: var(--brand-success); }
.menu-toggle { background: var(--brand-success) !important; }
.menu-toggle span { background: #050505; }
.locale-switcher { display: inline-flex; align-items: center; gap: 4px; color: #a9a9a9; font-size: 18px; line-height: 1; white-space: nowrap; }
.locale-switcher small { color: #777; font-size: 12px; }
.auth-actions .btn { text-transform: uppercase; letter-spacing: .02em; }

.btn-primary, .arrow-btn.next, .menu-toggle {
  background: var(--brand-success) !important;
  color: #050505;
  box-shadow: 0 6px 18px rgba(0, 223, 79, .18);
}
.btn-primary:hover, .btn-primary:focus-visible, .arrow-btn.next:hover, .arrow-btn.next:focus-visible { background: var(--brand-success-hover, #32f56d) !important; color: #050505; }
.btn-outline { background: transparent; border-color: var(--brand-success); color: #fff; }
.btn-outline:hover, .btn-outline:focus-visible { background: rgba(0, 223, 79, .14); border-color: var(--brand-success); color: #fff; }
.hero-card, .section-shell, .content-panel, .page-card { border: 1px solid rgba(255,255,255,.08); box-shadow: var(--brand-shadow); background: var(--surface); }
.hero-overlay { background: linear-gradient(90deg, rgba(0,0,0,.92), rgba(0,0,0,.54) 52%, rgba(0,0,0,.12)); }
.hero-card:not(.hero-main) .hero-overlay { background: linear-gradient(0deg, rgba(0,0,0,.88), rgba(0,0,0,.18)); }
.hero-tag, .hero-content span, .section-title, .section-head h2, .info-table th { color: var(--brand-success); }
.hero-content h1, .hero-content h2, .hero-card-title { color: #fff; }
.content-panel a:not(.btn), .page-card a:not(.btn), .breadcrumb a { color: var(--brand-success); text-decoration: underline; text-underline-offset: 2px; }
.content-panel a:not(.btn):hover, .page-card a:not(.btn):hover, .breadcrumb a:hover { color: var(--brand-accent); }

.primary-nav .nav-dropdown { position: relative; display: flex; align-items: center; gap: 3px; }
.primary-nav .nav-dropdown > .nav-link { min-height: 70px; }
.submenu-toggle { border: 0; border-radius: 6px; background: transparent; color: var(--brand-success); cursor: pointer; padding: 6px 8px; }
.submenu-toggle:hover, .submenu-toggle:focus-visible { background: rgba(0, 223, 79, .14); color: var(--brand-accent); }
.primary-nav ul.nav-submenu { display: none; position: absolute; top: calc(100% - 4px); left: -12px; z-index: 20; min-width: 210px; margin: 0; padding: 8px; border: 1px solid var(--brand-border); border-radius: 7px; background: #121212; box-shadow: var(--brand-shadow); }
.primary-nav .nav-dropdown:hover > .nav-submenu, .primary-nav .nav-dropdown:focus-within > .nav-submenu, .primary-nav .nav-dropdown.is-open > .nav-submenu { display: flex; flex-direction: column; }
.primary-nav .nav-dropdown > .nav-submenu > li > .nav-link { min-height: 38px; padding: 8px 10px; }

.route-content table, .content-panel table, .home-editorial-section table, .page-card table { width: 100%; margin: 18px 0; border-collapse: collapse; background: #101010; color: var(--brand-text); }
.route-content th, .route-content td, .content-panel th, .content-panel td, .home-editorial-section th, .home-editorial-section td, .page-card th, .page-card td { padding: 10px 12px; border: 1px solid rgba(0, 223, 79, .22); text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.route-content th, .content-panel th, .home-editorial-section th, .page-card th { background-color: rgba(0, 223, 79, .12); color: var(--brand-success); font-weight: 700; }

.content-cta { display: flex; justify-content: center; align-items: center; width: 100%; margin: 1.25rem 0 1.75rem; }
.content-cta .btn { min-width: 148px; text-align: center; }
.page-hero.container { max-width: 1220px; }
.page-card { max-width: 1180px; border-radius: 7px; padding: 36px; }
.page-card h1 { color: #fff; }
.page-visual { width: min(100%, 900px); margin: 1.25rem auto 1.5rem; overflow: hidden; border: 1px solid rgba(0, 223, 79, .3); border-radius: 7px; background: #050505; box-shadow: 0 12px 28px rgba(0, 0, 0, .3); }
.page-visual__image { display: block; width: 100%; height: auto; object-fit: contain; }
.page-visual[data-page-illustration*="login-route"], .page-visual[data-page-illustration*="login-security"], .page-visual[data-page-illustration*="signup-form"], .page-visual[data-page-illustration*="signup-verification"] { max-width: 380px; }
.page-visual[data-page-illustration*="promo-code-entry"], .page-visual[data-page-illustration*="withdrawal-cashier"], .page-visual[data-page-illustration*="freespins-games"], .page-visual[data-page-illustration*="games-lobby"] { max-width: 180px; }
.page-visual[data-page-illustration*="app-"] { max-width: 760px; }
.faq-item { border-color: rgba(0, 223, 79, .28); background: #121212; }
.faq-item[open] { background: rgba(0, 223, 79, .08); }
.icon-card { background: #111; border: 1px solid rgba(255,255,255,.07); }
.provider-card:nth-child(n+7) { display: none; }
.match-card { background: #171717; border-color: rgba(0,223,79,.22); }
.match-bg { background: linear-gradient(135deg, rgba(0,223,79,.14), transparent 38%), radial-gradient(circle at 80% 10%, rgba(255,173,36,.12), transparent 28%), linear-gradient(0deg, rgba(0,0,0,.88), rgba(23,23,23,.94)); }
.game-actions { background: rgba(0,0,0,.78); }
.payment-strip { opacity: .95; filter: none; gap: 18px; }
.payment-strip img { max-width: 82px; max-height: 42px; object-fit: contain; filter: none; opacity: .92; }
.site-footer { background: #050505; border-top: 1px solid rgba(0, 223, 79, .22); }
.footer-nav a, .copyright { color: #bdbdbd; }
.footer-nav a:hover, .footer-nav a:focus { color: var(--brand-success); }
.social-row { border-top-color: rgba(255,255,255,.08); }
.back-to-top, .chat-float { background: var(--brand-success); color: #050505; }

@media (max-width: 980px) {
  .primary-nav { background: #101010; box-shadow: var(--brand-shadow); }
  .primary-nav ul.nav-submenu { position: static; min-width: 0; margin: 4px 0 0; box-shadow: none; background: #181818; }
  .primary-nav .nav-dropdown:hover > .nav-submenu { display: none; }
  .primary-nav .nav-dropdown.is-open > .nav-submenu, .primary-nav .nav-dropdown:focus-within > .nav-submenu { display: flex; }
}

@media (max-width: 640px) {
  .page-card table, .route-content table, .content-panel table, .home-editorial-section table { display: table !important; overflow: visible !important; white-space: normal !important; }
  .page-card table th, .page-card table td, .route-content table th, .route-content table td, .content-panel table th, .content-panel table td, .home-editorial-section table th, .home-editorial-section table td { white-space: normal !important; overflow-wrap: anywhere; word-break: normal; }
  table[data-table-columns="2"], table[data-table-columns="3"] { width: 100% !important; min-width: 0 !important; table-layout: fixed !important; }
  table[data-table-columns="4"] { min-width: 600px; }
  .brand-link img { width: 150px; max-height: 32px; }
  .page-card { padding: 22px 18px; }
}