/* BERANDA KECIL — HOMEPAGE PRODUCTION CSS / POLISHING 5.9 */
/* Consolidated to reduce render-blocking request fan-out. */

/* BERANDA KECIL — HOME LIVE CARD POLISH 5.1 */

.market-logo-stage img {
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,.98))
    drop-shadow(0 0 5px rgba(255,255,255,.62))
    drop-shadow(0 0 13px rgba(255,255,255,.24))
    drop-shadow(0 4px 8px rgba(0,0,0,.28)) !important;
}

.live-card-footer-actions {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-top:20px;
}

.live-card-footer-actions .live-discuss-link {
  margin-top:0;
  min-width:0;
}

.live-recap-link {
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  padding:5px 0 3px 8px;
  color:#fffdf5;
  font-size:10px;
  font-weight:850;
  line-height:1.2;
  text-decoration:none;
  text-shadow:
    0 1px 3px rgba(0,0,0,.55),
    0 0 8px rgba(255,255,255,.14);
  opacity:.88;
}

.live-recap-link:hover,
.live-recap-link:focus-visible {
  color:#fff;
  opacity:1;
  text-decoration:underline;
}

.live-recap-link:focus-visible {
  outline:1px solid rgba(255,255,255,.7);
  outline-offset:4px;
  border-radius:4px;
}

@media(max-width:620px) {
  .market-logo-stage img {
    filter:
      drop-shadow(0 0 1px rgba(255,255,255,.98))
      drop-shadow(0 0 4px rgba(255,255,255,.58))
      drop-shadow(0 0 10px rgba(255,255,255,.22))
      drop-shadow(0 3px 6px rgba(0,0,0,.28)) !important;
  }

  .live-card-footer-actions {
    gap:10px;
    margin-top:17px;
  }

  .live-recap-link {
    font-size:9px;
  }
}

/* ============================================================
   BERANDA KECIL — SEO ON-PAGE + REVERSE SILO V1
   Visible contextual content only. No hidden SEO text.
   ============================================================ */

.bk-seo-context {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  margin-top:18px;
  padding:18px;
}

.bk-seo-context-copy {
  min-width:0;
  max-width:820px;
}

.bk-seo-context h2 {
  margin:5px 0 7px;
  font-size:18px;
  line-height:1.25;
}

.bk-seo-context p {
  margin:0;
  color:var(--muted);
  font-size:10px;
  line-height:1.75;
}

.bk-seo-context p a,
.bk-seo-parent-link a {
  color:var(--text);
  font-weight:800;
  text-decoration:none;
  border-bottom:1px solid rgba(192,168,136,.45);
}

.bk-seo-context p a:hover,
.bk-seo-parent-link a:hover {
  border-bottom-color:var(--accent);
}

.bk-seo-primary-link {
  flex:0 0 auto;
}

.bk-seo-parent-link {
  margin:16px 0 -4px;
  font-size:9px;
}

.bk-seo-context-compact {
  padding-block:15px;
}

@media(max-width:760px) {
  .bk-seo-context {
    align-items:flex-start;
    flex-direction:column;
    gap:13px;
    padding:15px;
  }

  .bk-seo-context h2 {
    font-size:16px;
  }

  .bk-seo-context p {
    font-size:9px;
    line-height:1.7;
  }

  .bk-seo-primary-link {
    width:100%;
  }
}

/* ============================================================
   BERANDA KECIL — ACCESSIBLE TYPOGRAPHY V1
   Readability target: comfortable for users including age 50–60+
   ============================================================ */

:root {
  --bk-type-xs: 13px;
  --bk-type-sm: 14px;
  --bk-type-base: 16px;
  --bk-type-md: 17px;
  --bk-type-lg: 18px;
  --bk-type-xl: 22px;
  --bk-type-2xl: 28px;
  --bk-type-3xl: 32px;

  --bk-line-tight: 1.3;
  --bk-line-normal: 1.55;
  --bk-line-relaxed: 1.7;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-size: var(--bk-type-base) !important;
  line-height: var(--bk-line-normal) !important;
}

/* Base readable text */
p,
li,
dd,
dt,
label,
legend,
summary {
  font-size: var(--bk-type-base);
  line-height: var(--bk-line-relaxed);
}

small,
.small,
.tiny,
.helper,
.muted.tiny,
.field-error,
.form-status {
  font-size: var(--bk-type-sm) !important;
  line-height: var(--bk-line-normal) !important;
}

/* Headings */
h1 {
  font-size: clamp(28px, 2.4vw, 32px) !important;
  line-height: var(--bk-line-tight) !important;
}

h2 {
  font-size: clamp(22px, 1.9vw, 24px) !important;
  line-height: var(--bk-line-tight) !important;
}

h3 {
  font-size: var(--bk-type-lg) !important;
  line-height: 1.4 !important;
}

h4,
h5,
h6 {
  font-size: var(--bk-type-base) !important;
  line-height: 1.45 !important;
}

/* Navigation */
.navlinks a,
.account-pill,
.logout-btn,
.mobile-menu-toggle,
.nav-actions button,
.nav-actions a {
  font-size: var(--bk-type-base) !important;
}

/* Forms and buttons */
button,
.btn,
input,
select,
textarea,
.password-toggle,
.tab-btn {
  font-size: var(--bk-type-base) !important;
  line-height: 1.35 !important;
}

input,
select,
textarea {
  min-height: 44px;
}

textarea {
  line-height: var(--bk-line-normal) !important;
}

/* Small UI labels: never micro-sized */
.eyebrow,
.chip,
.badge,
.state,
.beta-pill,
.tool-summary-kicker,
.status-title,
.profile-handle,
.profile-meta,
.market-sub,
.live-published-time {
  font-size: var(--bk-type-xs) !important;
  line-height: 1.45 !important;
}

/* General card/helper text */
.card p,
.notice,
.notice p,
.live-bridge-card p,
.status-card .muted,
.tool-summary-body,
.tools-card-head p,
.section-head p,
.page-hero p,
.compact-hero p,
.bk-seo-context p {
  font-size: var(--bk-type-sm) !important;
  line-height: var(--bk-line-relaxed) !important;
}

/* Homepage / Live */
.market,
.market-copy .market {
  font-size: var(--bk-type-lg) !important;
  line-height: 1.35 !important;
}

.market-sub {
  font-size: var(--bk-type-sm) !important;
}

.countdown {
  font-size: clamp(30px, 3vw, 36px) !important;
  line-height: 1.2 !important;
}

.previous-result-strip span,
.previous-result-strip small,
.result-reference-row,
.waiting-result-box span,
.live-discuss-link,
.live-recap-link {
  font-size: var(--bk-type-sm) !important;
}

.previous-result-strip strong,
.waiting-result-box strong {
  font-size: var(--bk-type-base) !important;
}

/* Community */
.community-feed,
.community-feed p,
.post-card p,
.post-card .post-body,
.post-meta,
.post-actions,
.post-actions button,
.comment-item,
.comment-item p,
.reply-item,
.reply-item p,
.community-sidebar,
.community-sidebar li,
.notification-item,
.notification-item small {
  font-size: var(--bk-type-sm) !important;
  line-height: var(--bk-line-relaxed) !important;
}

.post-card h3,
.post-card h2 {
  font-size: var(--bk-type-lg) !important;
}

.post-author,
.post-author-name,
.comment-author,
.reply-author {
  font-size: var(--bk-type-sm) !important;
}

/* Tools */
.tool-summary-card,
.tool-summary-card p,
.tool-summary-body,
.tool-point-indicator,
.tools-progress-shell,
.tools-progress-shell p,
.tools-progress-shell span,
.tool-workspace,
.tool-workspace p,
.tool-workspace label,
.latest-reference-card,
.latest-reference-card p {
  font-size: var(--bk-type-sm) !important;
  line-height: var(--bk-line-relaxed) !important;
}

.tool-summary-card h3,
.tools-workspace-page h3 {
  font-size: var(--bk-type-lg) !important;
}

.tool-point-indicator strong,
.tools-progress-shell strong {
  font-size: var(--bk-type-sm) !important;
}

/* Paito */
.paito-summary-card span {
  font-size: var(--bk-type-sm) !important;
}

.paito-summary-card strong {
  font-size: var(--bk-type-base) !important;
}

.paito-table th {
  font-size: var(--bk-type-xs) !important;
  line-height: 1.45 !important;
}

.paito-table td,
.paito-date,
.paito-day,
.paito-reference {
  font-size: var(--bk-type-sm) !important;
  line-height: 1.55 !important;
}

.paito-mobile-hint,
.paito-period-control label,
.paito-market-tab,
.paito-live-indicator {
  font-size: var(--bk-type-sm) !important;
}

/* Profile */
.profile-social-info,
.profile-description-block,
.profile-description-block p,
.profile-meta,
.profile-handle,
.profile-social-stats span,
.rank-progress-head,
.profile-content-tabs,
.profile-tab-panel,
.profile-tab-panel p {
  font-size: var(--bk-type-sm) !important;
  line-height: var(--bk-line-relaxed) !important;
}

.profile-identity h1 {
  font-size: var(--bk-type-2xl) !important;
}

.profile-social-stats strong {
  font-size: var(--bk-type-lg) !important;
}

/* Buku Mimpi */
.dream-book-page,
.dream-book-page p,
.book-search-help,
.book-page-meta,
.book-modal,
.book-modal p {
  font-size: var(--bk-type-sm) !important;
  line-height: var(--bk-line-relaxed) !important;
}

/* SEO context */
.bk-seo-context h2 {
  font-size: var(--bk-type-xl) !important;
}

.bk-seo-context p,
.bk-seo-parent-link {
  font-size: var(--bk-type-sm) !important;
}

.bk-seo-context .btn {
  font-size: var(--bk-type-base) !important;
}

/* Tables */
table th {
  font-size: var(--bk-type-xs) !important;
  line-height: 1.45 !important;
}

table td {
  font-size: var(--bk-type-sm) !important;
  line-height: 1.55 !important;
}

/* Footer */
footer,
.footer-wrap,
.footer-wrap span,
.footer-wrap a {
  font-size: var(--bk-type-sm) !important;
  line-height: 1.55 !important;
}

/* ============================================================
   ADMIN PANEL
   ============================================================ */

.admin-console-shell,
.admin-console-main,
.admin-console-workspace,
.admin-console-card,
.admin-panel-card {
  font-size: var(--bk-type-base) !important;
}

.admin-console-sidebar,
.admin-console-sidebar a,
.admin-side-link,
.admin-side-group-toggle,
.admin-console-topbar,
.admin-console-topbar button,
.admin-console-topbar a {
  font-size: var(--bk-type-sm) !important;
  line-height: 1.5 !important;
}

.admin-console-heading,
.admin-console-heading p,
.admin-workspace-head p,
.admin-section-head p,
.admin-console-card p,
.admin-panel-card p,
.admin-result-list,
.admin-result-list p,
.admin-publish-message,
.admin-market-today-status {
  font-size: var(--bk-type-sm) !important;
  line-height: var(--bk-line-relaxed) !important;
}

.admin-console-heading h1,
.admin-workspace-head h1 {
  font-size: var(--bk-type-2xl) !important;
}

.admin-section-head h2,
.admin-console-card h2,
.admin-panel-card h2 {
  font-size: var(--bk-type-xl) !important;
}

.admin-console-card h3,
.admin-panel-card h3 {
  font-size: var(--bk-type-lg) !important;
}

.admin-console-workspace label,
.admin-console-workspace .field label,
.admin-market-day-option,
.admin-market-schedule-state,
.admin-market-today-status,
.admin-achievement-meta,
.admin-report-meta,
.admin-recap-meta {
  font-size: var(--bk-type-sm) !important;
  line-height: 1.55 !important;
}

.admin-console-workspace input,
.admin-console-workspace select,
.admin-console-workspace textarea,
.admin-console-workspace button,
.admin-console-workspace .btn {
  font-size: var(--bk-type-base) !important;
}

.admin-console-workspace table th {
  font-size: var(--bk-type-xs) !important;
}

.admin-console-workspace table td {
  font-size: var(--bk-type-sm) !important;
}

.admin-moderation-list,
.admin-moderation-item,
.admin-moderation-item p,
.admin-report-list,
.admin-report-item,
.admin-report-item p,
.admin-achievement-list,
.admin-achievement-card,
.admin-achievement-card p,
.admin-recap-grid,
.admin-recap-grid p {
  font-size: var(--bk-type-sm) !important;
  line-height: var(--bk-line-relaxed) !important;
}

.admin-console-workspace .chip,
.admin-console-workspace .badge,
.admin-console-workspace .eyebrow,
.admin-console-workspace .state {
  font-size: var(--bk-type-xs) !important;
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 760px) {
  :root {
    --bk-type-xs: 13px;
    --bk-type-sm: 15px;
    --bk-type-base: 16px;
    --bk-type-md: 17px;
  }

  body {
    line-height: 1.6 !important;
  }

  .navlinks a {
    font-size: var(--bk-type-md) !important;
  }

  .btn,
  button {
    min-height: 44px;
  }

  .admin-console-sidebar,
  .admin-console-sidebar a,
  .admin-side-link,
  .admin-side-group-toggle {
    font-size: var(--bk-type-base) !important;
  }
}

/* ============================================================
   POLISHING 5.9 — LIGHT MODE CONTRAST STABILITY
   WCAG-oriented foreground contrast without changing layout.
   ============================================================ */

html[data-theme="light"] {
  /* Previous muted/ok/warn values were borderline for normal-size text. */
  --muted:#586052;
  --danger:#8a3f31;
  --ok:#526842;
  --warn:#735325;
  --bk-accent-text:#705439;
}

/* Tan remains the UI accent background, but textual uses get a darker tone. */
html[data-theme="light"] .age-gate-badge,
html[data-theme="light"] .beta-pill,
html[data-theme="light"] .password-toggle,
html[data-theme="light"] .rank-progress-head span,
html[data-theme="light"] .rank-celebration-card > strong,
html[data-theme="light"] .summary-result,
html[data-theme="light"] .history-reference,
html[data-theme="light"] .latest-result-foot strong,
html[data-theme="light"] .result-reference-row strong,
html[data-theme="light"] .olah-final strong,
html[data-theme="light"] .following-new-indicator,
html[data-theme="light"] .post-pin-status,
html[data-theme="light"] .admin-pin-status {
  color:var(--bk-accent-text) !important;
}

/*
 * #9b805d against the previous white button text is below 4.5:1.
 * Dark text on the same tan keeps the visual identity and passes normal text.
 */
html[data-theme="light"] .btn-accent,
html[data-theme="light"] .tab-btn.active {
  color:#1a1d16 !important;
}

/* Secondary text that was previously close to the WCAG threshold. */
html[data-theme="light"] .muted,
html[data-theme="light"] .helper,
html[data-theme="light"] .tiny,
html[data-theme="light"] .field-help,
html[data-theme="light"] .post-time,
html[data-theme="light"] .market-sub,
html[data-theme="light"] .tool-summary-body,
html[data-theme="light"] .workspace-description,
html[data-theme="light"] .paito-table td,
html[data-theme="light"] .paito-table th,
html[data-theme="light"] footer,
html[data-theme="light"] .footer-wrap,
html[data-theme="light"] .footer-wrap a {
  color:var(--muted) !important;
}

/* Preserve market-card contrast from the dark market backgrounds. */
html[data-theme="light"] .live-card-sydney .market-sub,
html[data-theme="light"] .live-card-singapore .market-sub,
html[data-theme="light"] .live-card-hongkong .market-sub,
html[data-theme="light"] .live-card-sydney .tiny,
html[data-theme="light"] .live-card-singapore .tiny,
html[data-theme="light"] .live-card-hongkong .tiny {
  color:rgba(255,253,247,.86) !important;
}

html[data-theme="light"] .live-card-sydney .live-discuss-link,
html[data-theme="light"] .live-card-singapore .live-discuss-link,
html[data-theme="light"] .live-card-hongkong .live-discuss-link {
  color:#ead3a8 !important;
}

/* ============================================================
   BERANDA KECIL — SEO REFINEMENT / FRESHNESS V1
   Visible, data-based context. No hidden SEO content.
   ============================================================ */

.bk-freshness-line,
.bk-paito-data-context {
  display:flex;
  align-items:flex-start;
  gap:9px;
  color:var(--muted);
}

.bk-freshness-line {
  margin:0 0 12px;
  padding:0 2px;
  font-size:14px;
  line-height:1.55;
}

.bk-freshness-dot {
  width:8px;
  height:8px;
  flex:0 0 8px;
  margin-top:.42em;
  border-radius:50%;
  background:#9cad82;
  box-shadow:0 0 0 4px rgba(156,173,130,.10);
}

.bk-paito-data-context {
  padding:0 3px;
  font-size:14px;
  line-height:1.6;
}

.bk-paito-data-context p {
  margin:0;
  font-size:inherit !important;
  line-height:inherit !important;
}

.bk-seo-context {
  margin-top:20px;
}

/* Keep contextual links visible but not visually over-optimized. */
.bk-seo-context p a,
.bk-seo-parent-link a {
  font-weight:750;
  border-bottom-color:rgba(192,168,136,.32);
}

@media(max-width:760px) {
  .bk-freshness-line,
  .bk-paito-data-context {
    font-size:15px;
    line-height:1.65;
  }
}

/* ============================================================
   BERANDA KECIL — POLISHING 5.7
   LIVE MARKET BACKGROUND V1

   Tujuan:
   - Menyatukan visual language Sydney / Singapore 4D / Hongkong.
   - Mengurangi ornamen dominan.
   - Menjaga identitas market melalui accent, bukan background ramai.
   - Meningkatkan fokus pada hasil, status, dan previous result.
   ============================================================ */

.live-card-sydney,
.live-card-singapore,
.live-card-hongkong {
  border-color:rgba(202,194,168,.22);
  box-shadow:
    0 10px 28px rgba(12,16,12,.10),
    inset 0 1px 0 rgba(255,255,255,.035);
}

/* Common calm overlay. */
.live-card-sydney::after,
.live-card-singapore::after,
.live-card-hongkong::after {
  opacity:1;
  background:
    radial-gradient(
      circle at 88% 10%,
      rgba(255,255,255,.055) 0,
      rgba(255,255,255,.018) 22%,
      transparent 43%
    ) !important;
}

/* Sydney — navy identity, no large diagonal flag geometry. */
.live-card-sydney {
  background:
    linear-gradient(
      155deg,
      rgba(24,43,70,.98) 0%,
      rgba(31,52,82,.96) 58%,
      rgba(34,54,76,.97) 100%
    ),
    var(--panel) !important;
}

.live-card-sydney::before {
  background:#6f86a7 !important;
  opacity:.82;
}

/* Singapore — neutral olive body with restrained warm-red identity. */
.live-card-singapore {
  background:
    radial-gradient(
      circle at 94% 4%,
      rgba(153,61,65,.28) 0%,
      rgba(153,61,65,.11) 23%,
      transparent 46%
    ),
    linear-gradient(
      155deg,
      rgba(58,67,53,.98) 0%,
      rgba(65,73,59,.97) 58%,
      rgba(68,75,62,.98) 100%
    ),
    var(--panel) !important;
}

.live-card-singapore::before {
  background:#a96466 !important;
  opacity:.85;
}

/* Hongkong — muted burgundy/olive blend, flower motif removed. */
.live-card-hongkong {
  background:
    radial-gradient(
      circle at 94% 5%,
      rgba(139,67,72,.20) 0%,
      rgba(139,67,72,.08) 23%,
      transparent 45%
    ),
    linear-gradient(
      155deg,
      rgba(74,54,53,.98) 0%,
      rgba(73,61,54,.97) 54%,
      rgba(65,69,56,.98) 100%
    ),
    var(--panel) !important;
}

.live-card-hongkong::before {
  background:#9c6466 !important;
  opacity:.82;
}

/* Keep readable light text on all three market cards. */
.live-card-sydney,
.live-card-singapore,
.live-card-hongkong {
  color:#f7f4e9;
}

.live-card-sydney .market-sub,
.live-card-singapore .market-sub,
.live-card-hongkong .market-sub,
.live-card-sydney .tiny,
.live-card-singapore .tiny,
.live-card-hongkong .tiny {
  color:rgba(247,244,233,.82) !important;
}

/* Result digits become a consistent system across markets. */
.live-card-sydney .digit,
.live-card-singapore .digit,
.live-card-hongkong .digit {
  background:rgba(244,238,219,.11);
  border-color:rgba(245,239,219,.25);
  color:#fffdf7;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
}

.live-card-sydney .digit.is-reference,
.live-card-singapore .digit.is-reference,
.live-card-hongkong .digit.is-reference {
  background:rgba(207,187,145,.14);
  border-color:rgba(214,192,147,.44);
}

/* Status pill: same hierarchy on every market card. */
.live-card-sydney .state,
.live-card-singapore .state,
.live-card-hongkong .state {
  background:rgba(16,20,16,.30) !important;
  border-color:rgba(247,244,233,.20) !important;
  box-shadow:none;
}

/* Previous result is intentionally darker than card background. */
.live-card-sydney .previous-result-strip,
.live-card-singapore .previous-result-strip,
.live-card-hongkong .previous-result-strip {
  background:rgba(15,19,15,.28) !important;
  border-color:rgba(247,244,233,.16) !important;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

/* Footer links inside the cards get the same contrast. */
.live-card-sydney .live-discuss-link,
.live-card-singapore .live-discuss-link,
.live-card-hongkong .live-discuss-link,
.live-card-sydney .live-recap-link,
.live-card-singapore .live-recap-link,
.live-card-hongkong .live-recap-link {
  color:#d2b889 !important;
}

.live-card-sydney .live-recap-link,
.live-card-singapore .live-recap-link,
.live-card-hongkong .live-recap-link {
  color:#f6f1e5 !important;
}

/* Logo remains an identity cue without a large white box. */
.live-card-sydney .market-logo,
.live-card-singapore .market-logo,
.live-card-hongkong .market-logo {
  background:rgba(255,255,255,.035) !important;
  border-color:transparent !important;
  box-shadow:none !important;
}

.live-card-sydney .market-logo img,
.live-card-singapore .market-logo img,
.live-card-hongkong .market-logo img {
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,.95))
    drop-shadow(0 0 4px rgba(255,255,255,.38))
    drop-shadow(0 2px 3px rgba(0,0,0,.34));
}

/* Light mode still uses the same calm market cards to preserve contrast. */
html[data-theme="light"] .live-card-sydney,
html[data-theme="light"] .live-card-singapore,
html[data-theme="light"] .live-card-hongkong {
  color:#fffdf7;
  border-color:rgba(70,69,58,.18);
  box-shadow:
    0 9px 24px rgba(55,48,39,.10),
    inset 0 1px 0 rgba(255,255,255,.04);
}

/* Mobile: reduce decorative glow even further. */
@media(max-width:700px) {
  .live-card-sydney::after,
  .live-card-singapore::after,
  .live-card-hongkong::after {
    background:
      radial-gradient(
        circle at 92% 7%,
        rgba(255,255,255,.04) 0,
        transparent 37%
      ) !important;
  }
}


/* ============================================================
   POLISHING — LIVE MARKET CARD V2 / 12-MARKET READY
   Blueprint hierarchy translated into Beranda Kecil palette.
   ============================================================ */

#live .live-grid {
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  align-items:stretch;
  gap:14px;
}

#live .live-card {
  --market-accent:#a8aa88;
  --market-accent-strong:#c3b58f;
  --market-glow:rgba(168,170,136,.13);
  --market-surface:rgba(14,18,13,.38);

  min-height:520px;
  padding:0 !important;
  border-radius:18px !important;
  border:1px solid rgba(203,195,163,.22) !important;
  background:
    radial-gradient(circle at 92% 0,var(--market-glow),transparent 36%),
    linear-gradient(160deg,rgba(31,38,28,.98),rgba(19,24,18,.99)) !important;
  box-shadow:
    0 14px 34px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
  overflow:hidden;
}

#live .live-card::before {
  display:none !important;
}

#live .live-card::after {
  background:
    linear-gradient(115deg,transparent 0 58%,rgba(255,255,255,.018) 58% 59%,transparent 59% 100%) !important;
  opacity:1 !important;
}

#live .live-card-sydney {
  --market-accent:#9ca99b;
  --market-accent-strong:#bdc1aa;
  --market-glow:rgba(109,131,123,.18);
}

#live .live-card-singapore {
  --market-accent:#b6a27d;
  --market-accent-strong:#cfba8e;
  --market-glow:rgba(178,151,105,.17);
}

#live .live-card-hongkong {
  --market-accent:#aa8d7c;
  --market-accent-strong:#c3a38b;
  --market-glow:rgba(151,103,84,.17);
}

#live .live-card-content {
  min-height:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  position:relative;
  z-index:1;
}

#live .live-market-header {
  padding:15px 15px 12px;
  border-bottom:1px solid rgba(239,233,211,.12);
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0));
}

#live .live-market-brand {
  display:grid;
  grid-template-columns:92px minmax(0,1fr);
  align-items:center;
  min-width:0;
  gap:12px;
}

#live .market-logo-stage {
  width:92px !important;
  height:92px !important;
  min-width:92px;
  margin:0 !important;
  display:grid;
  place-items:center;
  overflow:visible;
}

#live .market-logo-stage img {
  width:82px !important;
  height:82px !important;
  max-width:82px !important;
  max-height:82px !important;
  object-fit:contain;
  object-position:center;
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,.82))
    drop-shadow(0 3px 7px rgba(0,0,0,.30)) !important;
}

#live .live-market-brand .market {
  margin:0;
  color:#f5f1df !important;
  font-size:19px !important;
  line-height:1.15 !important;
  font-weight:900;
  letter-spacing:-.025em;
}

#live .live-market-schedule-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:9px;
}

#live .live-market-schedule {
  min-width:0;
  display:flex;
  align-items:center;
  gap:5px;
  color:rgba(244,240,221,.76);
  font-size:11px;
  line-height:1.35;
  white-space:nowrap;
}

#live .live-market-schedule i {
  font-style:normal;
  opacity:.46;
}

#live .live-schedule-icon {
  color:var(--market-accent-strong);
  font-size:13px;
}

#live .live-card .state {
  flex:0 0 auto;
  min-height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:5px 8px;
  border-color:rgba(220,210,178,.22) !important;
  border-radius:999px;
  background:rgba(11,15,10,.42) !important;
  color:#f6f1df !important;
  font-size:10px !important;
  line-height:1 !important;
  text-align:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

#live .live-card .state.wait {
  color:#d7c49e !important;
}

#live .live-card .state.done {
  color:#bdc9a5 !important;
}

#live .live-card-body {
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  padding:14px 14px 0;
}

#live .live-result-panel,
#live .live-countdown-panel,
#live .live-state-panel,
#live .previous-result-strip {
  border:1px solid rgba(233,226,201,.14);
  background:
    linear-gradient(180deg,rgba(255,255,255,.023),rgba(255,255,255,.008)),
    rgba(10,14,10,.27);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

#live .live-result-panel {
  padding:12px;
  border-radius:14px;
}

#live .live-result-digits {
  margin:0 !important;
  display:flex;
  flex-wrap:nowrap;
  justify-content:center;
  gap:6px;
}

#live .live-result-digits .digit {
  flex:1 1 35px;
  width:auto;
  max-width:46px;
  min-width:34px;
  aspect-ratio:1;
  height:auto;
  border-radius:50% !important;
  border:1px solid rgba(231,220,183,.22) !important;
  background:
    radial-gradient(circle at 38% 30%,rgba(255,255,255,.12),transparent 36%),
    rgba(22,28,20,.86) !important;
  color:#f7f3e6 !important;
  font-size:21px !important;
  line-height:1 !important;
  box-shadow:
    inset 0 -6px 12px rgba(0,0,0,.18),
    0 4px 12px rgba(0,0,0,.18) !important;
}

#live .live-result-digits .digit.digit-last-four {
  border-color:color-mix(in srgb,var(--market-accent-strong) 55%,transparent) !important;
}

#live .live-result-meta {
  display:grid;
  gap:0;
  margin-top:11px;
  border:1px solid rgba(233,226,201,.10);
  border-radius:11px;
  overflow:hidden;
  background:rgba(5,8,5,.13);
}

#live .live-result-meta > div {
  min-height:32px;
  display:grid;
  grid-template-columns:17px minmax(0,1fr) auto;
  align-items:center;
  gap:6px;
  padding:7px 9px;
  color:rgba(244,240,221,.72);
  font-size:10px;
}

#live .live-result-meta > div + div {
  border-top:1px solid rgba(233,226,201,.09);
}

#live .live-result-meta strong {
  color:var(--market-accent-strong);
  font-size:10px;
  font-weight:850;
  white-space:nowrap;
}

#live .live-meta-icon {
  color:var(--market-accent-strong);
  text-align:center;
}

#live .live-state-panel {
  min-height:74px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:12px;
  border-radius:13px;
}

#live .live-state-icon,
#live .live-section-icon,
#live .live-action-icon {
  display:grid;
  place-items:center;
  color:var(--market-accent-strong);
  border:1px solid rgba(213,201,160,.20);
  background:rgba(140,145,112,.08);
}

#live .live-state-icon {
  width:38px;
  height:38px;
  border-radius:12px;
  font-size:17px;
}

#live .live-state-panel > div {
  display:grid;
  gap:4px;
}

#live .live-state-panel strong {
  color:#f3efdf;
  font-size:12px !important;
  line-height:1.3;
  text-transform:uppercase;
  letter-spacing:.015em;
}

#live .live-state-panel span:not(.live-state-icon) {
  color:rgba(242,238,219,.68);
  font-size:10px !important;
  line-height:1.45;
}

#live .live-countdown-panel {
  margin-top:10px;
  padding:12px;
  border-radius:13px;
  background:
    radial-gradient(circle at 95% 15%,var(--market-glow),transparent 36%),
    linear-gradient(155deg,rgba(51,55,39,.28),rgba(8,11,8,.32));
}

#live .live-next-result-panel {
  border-color:rgba(195,181,143,.18);
}

#live .live-panel-kicker {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:rgba(244,240,221,.64);
  font-size:9px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.055em;
}

#live .live-panel-kicker strong {
  color:var(--market-accent-strong);
  font-size:9px;
}

#live .live-countdown-panel .countdown {
  margin:9px 0 0 !important;
  color:#f7f3e5 !important;
  font-size:34px !important;
  line-height:1 !important;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.04em;
}

#live .live-countdown-caption {
  margin-top:5px;
  color:rgba(244,240,221,.65);
  font-size:10px;
  line-height:1.35;
}

#live .previous-result-strip {
  min-height:58px;
  margin-top:10px !important;
  padding:9px 10px !important;
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  border-radius:12px !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

#live .live-section-icon {
  width:32px;
  height:32px;
  border-radius:10px;
  font-size:14px;
}

#live .previous-result-copy {
  min-width:0;
  display:grid;
  gap:2px;
}

#live .previous-result-strip span:not(.live-section-icon) {
  color:#f0ecd9 !important;
  font-size:10px !important;
  line-height:1.15 !important;
  font-weight:850;
  letter-spacing:.015em;
}

#live .previous-result-strip small {
  color:rgba(240,236,217,.60) !important;
  font-size:9px !important;
  line-height:1.25 !important;
}

#live .previous-result-strip strong {
  color:#f5e8bd !important;
  font-size:13px !important;
  letter-spacing:.13em !important;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}

#live .live-card-footer-actions {
  margin-top:14px !important;
  padding:11px 14px 14px;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px !important;
  border-top:1px solid rgba(233,226,201,.10);
  background:rgba(4,7,4,.13);
}

#live .live-card-action {
  min-width:0;
  min-height:52px;
  padding:8px 9px !important;
  display:grid !important;
  grid-template-columns:30px minmax(0,1fr) 10px;
  align-items:center;
  gap:7px;
  border:1px solid rgba(197,184,143,.18);
  border-radius:12px;
  background:
    radial-gradient(circle at 0 0,var(--market-glow),transparent 55%),
    rgba(83,91,64,.18);
  color:#f4eedc !important;
  text-decoration:none !important;
  text-shadow:none !important;
  opacity:1 !important;
}

#live .live-card-action:hover {
  border-color:rgba(205,191,148,.34);
  background:
    radial-gradient(circle at 0 0,var(--market-glow),transparent 58%),
    rgba(93,102,71,.25);
  transform:translateY(-1px);
}

#live .live-action-icon {
  width:30px;
  height:30px;
  border-radius:9px;
  font-size:13px;
}

#live .live-card-action > span:nth-child(2) {
  min-width:0;
  display:grid;
  gap:1px;
}

#live .live-card-action small {
  color:rgba(241,236,218,.58);
  font-size:8px;
  line-height:1.15;
}

#live .live-card-action strong {
  overflow:hidden;
  color:#f5f0de;
  font-size:10px;
  line-height:1.2;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#live .live-card-action b {
  color:var(--market-accent-strong);
  font-size:18px;
  line-height:1;
  font-weight:500;
  text-align:right;
}

#live .live-swipe-hint {
  display:none !important;
}

/* Tablet: two full cards per row. */
@media(max-width:900px) {
  #live .live-grid {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  #live .live-card {
    min-height:500px;
  }
}

/* Mobile: vertical cards, not a 12-item horizontal rail. */
@media(max-width:620px) {
  #live .live-grid {
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-auto-flow:row !important;
    grid-auto-columns:auto !important;
    gap:12px !important;
    overflow:visible !important;
    padding:0 !important;
    margin-bottom:14px !important;
    scroll-snap-type:none !important;
    cursor:default !important;
  }

  #live .live-grid .live-card {
    width:100% !important;
    min-height:0;
    scroll-snap-align:none !important;
  }

  #live .live-market-header {
    padding:13px 13px 11px;
  }

  #live .market-logo-stage {
    width:84px !important;
    height:84px !important;
    min-width:84px;
  }

  #live .market-logo-stage img {
    width:76px !important;
    height:76px !important;
    max-width:76px !important;
    max-height:76px !important;
  }

  #live .live-market-brand {
    grid-template-columns:84px minmax(0,1fr);
    align-items:center;
    gap:11px;
  }

  #live .live-market-brand .market {
    font-size:18px !important;
  }

  #live .live-market-schedule-row {
    align-items:flex-start;
  }

  #live .live-market-schedule {
    white-space:normal;
    flex-wrap:wrap;
    row-gap:2px;
    font-size:10px;
  }

  #live .live-card .state {
    min-height:27px;
    max-width:46%;
    white-space:normal;
  }

  #live .live-card-body {
    padding:12px 12px 0;
  }

  #live .live-result-digits {
    gap:5px;
  }

  #live .live-result-digits .digit {
    min-width:0;
    max-width:44px;
    font-size:20px !important;
  }

  #live .live-countdown-panel .countdown {
    font-size:32px !important;
  }

  #live .previous-result-strip {
    grid-template-columns:30px minmax(0,1fr) auto;
  }

  #live .previous-result-strip strong {
    font-size:12px !important;
    letter-spacing:.10em !important;
  }

  #live .live-card-footer-actions {
    padding:10px 12px 12px;
  }
}

/* Very small screens: keep six digits and two CTAs usable. */
@media(max-width:380px) {
  #live .live-card-footer-actions {
    grid-template-columns:1fr;
  }

  #live .live-card-action {
    min-height:48px;
  }

  #live .live-result-digits .digit {
    font-size:18px !important;
  }

  #live .previous-result-strip {
    grid-template-columns:28px minmax(0,1fr);
  }

  #live .previous-result-strip strong {
    grid-column:2;
    justify-self:start;
    margin-top:2px;
  }
}

/* Light mode keeps the same card identity, with slightly lifted surfaces. */
html[data-theme="light"] #live .live-card {
  color:#f8f3e6;
  border-color:rgba(79,75,60,.24) !important;
  box-shadow:
    0 12px 28px rgba(66,56,42,.13),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

html[data-theme="light"] #live .live-card-action {
  border-color:rgba(229,217,178,.16);
}


/* FEATURE 12 MARKETS — restrained Beranda Kecil market identities */
#live .live-card-thailand-lottery {
  --market-accent:#a6a47a;
  --market-accent-strong:#c2b889;
  --market-glow:rgba(166,164,122,.16);
}
#live .live-card-shinjuku {
  --market-accent:#899b8b;
  --market-accent-strong:#aeb9a0;
  --market-glow:rgba(111,137,115,.15);
}
#live .live-card-cameroon {
  --market-accent:#a69a76;
  --market-accent-strong:#c4b184;
  --market-glow:rgba(163,144,101,.15);
}
#live .live-card-slovenia {
  --market-accent:#8e9c83;
  --market-accent-strong:#b0ba9a;
  --market-glow:rgba(119,137,108,.15);
}
#live .live-card-seoul {
  --market-accent:#8b9892;
  --market-accent-strong:#b1bbb2;
  --market-glow:rgba(115,134,127,.15);
}
#live .live-card-magnum4d {
  --market-accent:#a99a79;
  --market-accent-strong:#c6b58b;
  --market-glow:rgba(168,147,104,.16);
}
#live .live-card-macau-lottery,
#live .live-card-macau-sweep,
#live .live-card-macau-6d {
  --market-accent:#9d8f79;
  --market-accent-strong:#bfa889;
  --market-glow:rgba(151,127,96,.16);
}


/* ============================================================
   POLISHING — ICONIC BACKGROUNDS FOR 12 LIVE MARKET CARDS
   Subtle country/market silhouettes while preserving readability.
   ============================================================ */
#live .live-card {
  position:relative;
  isolation:isolate;
}

#live .live-card-overlay {
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
}

#live .live-card-overlay::before,
#live .live-card-overlay::after {
  content:"";
  position:absolute;
  inset:0;
}

#live .live-card-overlay::before {
  background-repeat:no-repeat;
  background-image:var(--market-iconic-bg);
  background-position:var(--market-iconic-position, center center);
  background-size:var(--market-iconic-size, 116% auto);
  opacity:.24;
  filter:saturate(.9) contrast(1.02);
  transform:translateZ(0);
}

#live .live-card-overlay::after {
  background:
    radial-gradient(circle at 88% 12%, rgba(255,255,255,.05), transparent 22%),
    radial-gradient(circle at 16% 84%, rgba(0,0,0,.20), transparent 33%),
    linear-gradient(180deg, rgba(7,9,7,.10) 0%, rgba(7,9,7,.04) 24%, rgba(7,9,7,.18) 100%);
}

#live .live-card-body,
#live .live-market-header,
#live .live-card-footer-actions,
#live .previous-result-strip,
#live .live-result-panel,
#live .live-countdown-panel,
#live .live-state-panel {
  position:relative;
  z-index:1;
}

#live .live-card-sydney {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23d2b889%27%20stop-opacity%3D%27.22%27%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23f1e0b5%27%20stop-opacity%3D%27.08%27%2F%3E%0A%20%20%20%20%3C%2FlinearGradient%3E%0A%20%20%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%279%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M62%20458c34-14%2060-29%2083-44%2018-12%2038-30%2054-51%2016%2032%2037%2056%2060%2071%2027-51%2045-96%2054-138%2045%2034%2078%2085%2092%20150%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M111%20438h360%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M82%20452h409%27%20opacity%3D%27.45%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M118%20424c38-36%2074-57%20121-73%2026-9%2051-14%2087-17%2053-5%20106%203%20155%2023%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%20%20%3Cg%20fill%3D%27%23f6efdd%27%20opacity%3D%27.13%27%3E%0A%20%20%20%20%3Ccircle%20cx%3D%27125%27%20cy%3D%27120%27%20r%3D%274%27%2F%3E%3Ccircle%20cx%3D%27158%27%20cy%3D%27154%27%20r%3D%273%27%2F%3E%3Ccircle%20cx%3D%27482%27%20cy%3D%27136%27%20r%3D%274%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 130% auto;
  --market-iconic-position: center 58%;
}

#live .live-card-singapore {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23d6c08f%27%20stop-opacity%3D%27.20%27%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23f4e8c0%27%20stop-opacity%3D%27.07%27%2F%3E%0A%20%20%20%20%3C%2FlinearGradient%3E%0A%20%20%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27url%28%23g%29%27%20opacity%3D%27.95%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M104%20450h390v8H104z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M132%20450v-90h30v90zm45%200v-118h34v118zm55%200v-72h28v72zm53%200v-96h31v96zm49%200v-148h28v148zm46%200v-116h24v116z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M196%20312h190l-12%2014H208z%27%20opacity%3D%27.65%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M437%20418c-13-39-32-63-60-75%2029-8%2042-22%2044-48-29-8-53%202-77%2026-13%2013-20%2028-22%2045-6%201-11%206-14%2015%2017%202%2031%207%2044%2015%2017%2010%2029%2023%2040%2040h45c3-6%203-12%200-18z%27%2F%3E%0A%20%20%20%20%3Ccircle%20cx%3D%27452%27%20cy%3D%27225%27%20r%3D%2718%27%20opacity%3D%27.28%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 122% auto;
  --market-iconic-position: center 54%;
}

#live .live-card-hongkong {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23d0b18e%27%20stop-opacity%3D%27.20%27%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23f3ddc5%27%20stop-opacity%3D%27.08%27%2F%3E%0A%20%20%20%20%3C%2FlinearGradient%3E%0A%20%20%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27url%28%23g%29%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M96%20451h408v8H96z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M122%20451v-86h22v86zm36%200v-132h28v132zm43%200v-101h20v101zm32%200v-160h34v160zm52%200v-120h18v120zm30%200v-190h30v190zm48%200v-148h22v148zm35%200v-112h18v112z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M150%20376c36%206%2068%206%20103%200%2026-5%2049-15%2080-35%208%2031%2011%2058%209%2080H167c-14-15-19-29-17-45z%27%20opacity%3D%27.72%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M255%20332c19-19%2043-39%2071-59%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%277%27%20fill%3D%27none%27%20stroke-linecap%3D%27round%27%2F%3E%0A%20%20%20%20%3Ccircle%20cx%3D%27432%27%20cy%3D%27153%27%20r%3D%277%27%20opacity%3D%27.3%27%2F%3E%3Ccircle%20cx%3D%27464%27%20cy%3D%27182%27%20r%3D%274%27%20opacity%3D%27.22%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 124% auto;
  --market-iconic-position: center 58%;
}

#live .live-card-thailand-lottery {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23d3c286%27%20stop-opacity%3D%27.20%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23efe1b8%27%20stop-opacity%3D%27.08%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%278%27%20stroke-linejoin%3D%27round%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M132%20432h330%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M165%20432v-83h35v83m63%200v-119h34v119m63%200v-86h33v86%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M145%20348h75l-18-27%2030%209%2022-30%2023%2030%2028-8-16%2026h78l-23-35%2041%2012%2032-39%2034%2039%2039-11-23%2034h48%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M262%20313h130%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M274%20281h106%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 122% auto;
  --market-iconic-position: center 56%;
}

#live .live-card-shinjuku {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23bfc8a6%27%20stop-opacity%3D%27.18%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23eef2dc%27%20stop-opacity%3D%27.08%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27url%28%23g%29%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M102%20451h396v8H102z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M138%20451v-118h26v118zm40%200v-170h32v170zm47%200v-124h21v124zm34%200v-198h36v198zm52%200v-142h20v142zm32%200v-184h27v184zm41%200v-110h18v110z%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%20%20%3Cg%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%2710%27%20stroke-linecap%3D%27round%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M181%20394h116%27%2F%3E%3Cpath%20d%3D%27M193%20394v-92m93%200v92%27%2F%3E%3Cpath%20d%3D%27M170%20302h138%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%20%20%3Cg%20fill%3D%27%23f5ebd7%27%20opacity%3D%27.08%27%3E%3Crect%20x%3D%27236%27%20y%3D%27171%27%20width%3D%2721%27%20height%3D%2771%27%20rx%3D%274%27%2F%3E%3Crect%20x%3D%27274%27%20y%3D%27190%27%20width%3D%2722%27%20height%3D%2783%27%20rx%3D%274%27%2F%3E%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 122% auto;
  --market-iconic-position: center 56%;
}

#live .live-card-cameroon {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23d2bf8c%27%20stop-opacity%3D%27.20%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23f1e2b7%27%20stop-opacity%3D%27.08%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27url%28%23g%29%27%3E%0A%20%20%20%20%3Ccircle%20cx%3D%27463%27%20cy%3D%27168%27%20r%3D%2728%27%20opacity%3D%27.24%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M76%20446h450v9H76z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M102%20446c22-57%2052-99%2092-128%2029-21%2056-31%2080-31%2030%200%2054%208%2073%2025%2024%2022%2045%2062%2060%20120H102z%27%20opacity%3D%27.72%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M237%20320c23-56%2046-84%2071-84%2015%200%2028%208%2039%2023%2011%2016%2021%2036%2030%2061%27%20opacity%3D%27.55%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%20%20%3Cg%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%276%27%20opacity%3D%27.48%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M122%20176h78M112%20204h97M138%20232h72M98%20260h85%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M450%20226h76M438%20254h90M466%20282h62%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 126% auto;
  --market-iconic-position: center 60%;
}

#live .live-card-slovenia {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23c7cfb5%27%20stop-opacity%3D%27.18%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23eef4dd%27%20stop-opacity%3D%27.08%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27url%28%23g%29%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M88%20443c42-51%2073-86%2096-103%2017-12%2033-18%2049-18%2019%200%2036%208%2053%2024%2015-28%2035-52%2058-70%2018-14%2036-21%2054-21%2018%200%2039%208%2064%2023%2030%2018%2058%2053%2083%20104H88z%27%20opacity%3D%27.68%27%2F%3E%0A%20%20%20%20%3Cellipse%20cx%3D%27305%27%20cy%3D%27463%27%20rx%3D%27184%27%20ry%3D%2727%27%20opacity%3D%27.36%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M260%20448c12-21%2024-35%2036-42%2014-8%2028-9%2043-3%2015%206%2027%2017%2036%2034-16%206-31%2010-45%2012-16%202-39%202-70-1z%27%20opacity%3D%27.75%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M300%20396v42m-19-10h38m-23-44c6-7%2012-9%2018-4%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%277%27%20fill%3D%27none%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 126% auto;
  --market-iconic-position: center 58%;
}

#live .live-card-seoul {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23c3ccc4%27%20stop-opacity%3D%27.18%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23edf4ee%27%20stop-opacity%3D%27.08%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%278%27%20stroke-linejoin%3D%27round%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M101%20451h398%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M292%20451V244m0%200h17m-29%2026h41m-34%20123h29%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M300%20216a24%2024%200%201%201%200%2048a24%2024%200%200%201%200-48z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M124%20451v-75h130l-23-28h-84l-22%2028m149%2075v-64h91v64m-78-64l33-39%2034%2039%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 118% auto;
  --market-iconic-position: center 57%;
}

#live .live-card-magnum4d {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23d0bd88%27%20stop-opacity%3D%27.22%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23f1dfb6%27%20stop-opacity%3D%27.09%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27url%28%23g%29%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M110%20451h380v8H110z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M210%20451V194h60v257zm83%200V170h60v281z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M232%20194l27-41%2027%2041zm82-24l30-46%2030%2046z%27%20opacity%3D%27.82%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M253%20264h17v22h-17zm0%2041h17v22h-17zm0%2041h17v22h-17zm82-53h17v22h-17zm0%2041h17v22h-17z%27%20opacity%3D%27.45%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 116% auto;
  --market-iconic-position: center 56%;
}

#live .live-card-macau-lottery,
#live .live-card-macau-sweep,
#live .live-card-macau-6d {
  --market-iconic-bg: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20600%20600%27%3E%0A%20%20%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%23d1b08b%27%20stop-opacity%3D%27.21%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23f3dcc2%27%20stop-opacity%3D%27.08%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%0A%20%20%3Cg%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%278%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%0A%20%20%20%20%3Cpath%20d%3D%27M104%20451h392%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M176%20451V322m0%200h38m-56%2024h75%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M338%20451V214m0%200h31m-48%2034h66m-54%20145h45%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M232%20451v-96h65v96%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M226%20355h77l-39-43z%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M341%20214l23-43%2024%2043%27%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%27M430%20451v-141h34v141%27%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A");
  --market-iconic-size: 118% auto;
  --market-iconic-position: center 57%;
}

html[data-theme="light"] #live .live-card-overlay::before {
  opacity:.17;
}

@media(max-width:900px) {
  #live .live-card-overlay::before {
    opacity:.20;
    background-size:var(--market-iconic-size-mobile, 128% auto);
  }

  #live .live-card-sydney,
  #live .live-card-cameroon,
  #live .live-card-slovenia {
    --market-iconic-size-mobile: 136% auto;
  }
}

@media(max-width:620px) {
  #live .live-card-overlay::before {
    opacity:.18;
    background-position:center 54%;
  }
}


/* ============================================================
   ICONIC BACKGROUND V1B — VISUAL BALANCE HOTFIX
   Removes old diagonal stripe and lifts landmark visibility.
   ============================================================ */

/* The old diagonal accent competes with the new country/market silhouette. */
#live .live-card::after {
  display:none !important;
  content:none !important;
  background:none !important;
}

/* Slightly stronger landmark visibility, still below all functional content. */
#live .live-card-overlay::before {
  opacity:.30;
}

html[data-theme="light"] #live .live-card-overlay::before {
  opacity:.21;
}

@media(max-width:900px) {
  #live .live-card-overlay::before {
    opacity:.26;
  }
}

@media(max-width:620px) {
  #live .live-card-overlay::before {
    opacity:.23;
  }
}


/* ============================================================
   ICONIC BACKGROUND V2C — USER-PROVIDED PHOTO BACKGROUNDS
   Normalized portrait crops from user-supplied iconic photos.
   ============================================================ */
#live .live-card-overlay::before {
  background-image:
    linear-gradient(180deg, rgba(6,9,6,.10) 0%, rgba(6,9,6,.22) 36%, rgba(6,9,6,.52) 100%),
    var(--market-iconic-bg);
  background-size:100% 100%, var(--market-iconic-size, cover);
  background-position:center center, var(--market-iconic-position, center center);
  background-repeat:no-repeat, no-repeat;
  opacity:.42;
  filter:saturate(.92) contrast(1.02) brightness(.92);
}

html[data-theme="light"] #live .live-card-overlay::before {
  opacity:.34;
  filter:saturate(.88) contrast(1.01) brightness(.98);
}

#live .live-card-overlay::after {
  background:
    radial-gradient(circle at 86% 14%, rgba(255,255,255,.05), transparent 18%),
    radial-gradient(circle at 18% 82%, rgba(0,0,0,.24), transparent 32%),
    linear-gradient(180deg, rgba(7,9,7,.08) 0%, rgba(7,9,7,.03) 22%, rgba(7,9,7,.18) 100%);
}

#live .live-card-sydney {
  --market-iconic-bg:url("/assets/markets/iconic/market-sydney-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 55%;
}

#live .live-card-singapore {
  --market-iconic-bg:url("/assets/markets/iconic/market-singapore-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 52%;
}

#live .live-card-hongkong {
  --market-iconic-bg:url("/assets/markets/iconic/market-hongkong-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 48%;
}

#live .live-card-thailand-lottery {
  --market-iconic-bg:url("/assets/markets/iconic/market-thailand-lottery-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 50%;
}

#live .live-card-shinjuku {
  --market-iconic-bg:url("/assets/markets/iconic/market-shinjuku-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 43%;
}

#live .live-card-cameroon {
  --market-iconic-bg:url("/assets/markets/iconic/market-cameroon-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 42%;
}

#live .live-card-slovenia {
  --market-iconic-bg:url("/assets/markets/iconic/market-slovenia-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 48%;
}

#live .live-card-seoul {
  --market-iconic-bg:url("/assets/markets/iconic/market-seoul-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 38%;
}

#live .live-card-magnum4d {
  --market-iconic-bg:url("/assets/markets/iconic/market-magnum4d-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 42%;
}

#live .live-card-macau-lottery,
#live .live-card-macau-sweep,
#live .live-card-macau-6d {
  --market-iconic-bg:url("/assets/markets/iconic/market-macau-portrait-v1.webp");
  --market-iconic-size:cover;
  --market-iconic-size-mobile:cover;
  --market-iconic-position:center 40%;
}

@media(max-width:900px) {
  #live .live-card-overlay::before {
    opacity:.38;
  }

  html[data-theme="light"] #live .live-card-overlay::before {
    opacity:.30;
  }
}

@media(max-width:620px) {
  #live .live-card-overlay::before {
    opacity:.34;
  }

  html[data-theme="light"] #live .live-card-overlay::before {
    opacity:.27;
  }
}


/* ============================================================
   HOTFIX — HOMEPAGE LIVE GRID CLS STABILITY V1
   Reserves the 12-card live grid before app.js hydrates it.
   Static placeholders only; no loading animation.
   ============================================================ */

#live .live-card-skeleton {
  min-height:520px;
  pointer-events:none;
  user-select:none;
  background:
    radial-gradient(circle at 86% 8%, rgba(178,170,135,.08), transparent 28%),
    linear-gradient(160deg, rgba(31,38,28,.98), rgba(19,24,18,.99)) !important;
}

#live .live-card-skeleton::before,
#live .live-card-skeleton::after {
  display:none !important;
  content:none !important;
}

#live .live-skeleton-header {
  min-height:129px;
  padding:15px;
  display:grid;
  grid-template-columns:92px minmax(0,1fr);
  align-items:center;
  gap:12px;
  border-bottom:1px solid rgba(239,233,211,.10);
}

#live .live-skeleton-logo {
  width:82px;
  height:82px;
  border-radius:18px;
  background:rgba(236,230,207,.055);
  border:1px solid rgba(236,230,207,.07);
}

#live .live-skeleton-title {
  display:grid;
  gap:9px;
}

#live .live-skeleton-title span,
#live .live-skeleton-panel,
#live .live-skeleton-strip,
#live .live-skeleton-actions span {
  display:block;
  border:1px solid rgba(236,230,207,.055);
  background:rgba(236,230,207,.045);
}

#live .live-skeleton-title span:first-child {
  width:58%;
  height:18px;
  border-radius:7px;
}

#live .live-skeleton-title span:last-child {
  width:78%;
  height:11px;
  border-radius:999px;
}

#live .live-skeleton-body {
  flex:1 1 auto;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

#live .live-skeleton-panel {
  min-height:190px;
  border-radius:14px;
}

#live .live-skeleton-strip {
  min-height:58px;
  margin-top:auto;
  border-radius:12px;
}

#live .live-skeleton-actions {
  min-height:77px;
  padding:11px 14px 14px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:stretch;
  gap:8px;
  border-top:1px solid rgba(233,226,201,.08);
}

#live .live-skeleton-actions span {
  min-height:52px;
  border-radius:12px;
}

@media(max-width:900px) {
  #live .live-card-skeleton {
    min-height:500px;
  }

  #live .live-skeleton-panel {
    min-height:170px;
  }
}

@media(max-width:620px) {
  #live .live-card-skeleton {
    min-height:410px !important;
  }

  #live .live-skeleton-header {
    min-height:109px;
    padding:13px;
    grid-template-columns:84px minmax(0,1fr);
    gap:11px;
  }

  #live .live-skeleton-logo {
    width:76px;
    height:76px;
  }

  #live .live-skeleton-body {
    padding:12px;
  }

  #live .live-skeleton-panel {
    min-height:130px;
  }

  #live .live-skeleton-actions {
    min-height:72px;
    padding:10px 12px 12px;
  }
}

@media(max-width:380px) {
  #live .live-skeleton-actions {
    grid-template-columns:1fr;
  }

  #live .live-card-skeleton {
    min-height:455px !important;
  }
}


/* ============================================================
   HOTFIX — greener live card inner surfaces + no update timestamp row
   ============================================================ */
#live .live-result-panel,
#live .previous-result-strip,
#live .live-card-action {
  background:
    radial-gradient(circle at 0 0, rgba(126, 157, 102, .13), transparent 54%),
    linear-gradient(180deg, rgba(55, 79, 49, .64), rgba(24, 37, 22, .72)) !important;
  border-color: rgba(178, 206, 150, .20) !important;
}

#live .live-result-meta {
  background: rgba(18, 30, 17, .38) !important;
  border-color: rgba(178, 206, 150, .14) !important;
}

#live .live-card-action:hover {
  background:
    radial-gradient(circle at 0 0, rgba(126, 157, 102, .18), transparent 58%),
    linear-gradient(180deg, rgba(64, 91, 56, .72), rgba(28, 42, 25, .82)) !important;
}


/* ============================================================
   POLISHING — HOMEPAGE MITRA KAMI V1
   ============================================================ */

.home-partners {
  margin-top:22px;
}

.home-partners-head {
  margin-bottom:12px;
}

.home-partners-head .eyebrow {
  display:block;
  margin-bottom:4px;
}

.home-partners-head h2 {
  margin:0 0 5px;
}

.home-partners-head p {
  margin:0;
  color:var(--muted);
}

.home-partners-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}

.home-partner-card {
  min-width:0;
  min-height:138px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px 14px;
  overflow:hidden;
  border:1px solid rgba(176,194,151,.18);
  border-radius:16px;
  background:
    radial-gradient(circle at 50% 0, rgba(124,153,101,.10), transparent 58%),
    linear-gradient(180deg, rgba(36,51,32,.76), rgba(20,30,18,.88));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 10px 24px rgba(0,0,0,.10);
  text-decoration:none;
  transition:
    transform .16s ease,
    border-color .16s ease,
    background .16s ease;
}

.home-partner-card:hover,
.home-partner-card:focus-visible {
  transform:translateY(-2px);
  border-color:rgba(181,204,151,.34);
  background:
    radial-gradient(circle at 50% 0, rgba(130,166,103,.15), transparent 60%),
    linear-gradient(180deg, rgba(42,60,36,.82), rgba(23,35,20,.92));
}

.home-partner-card:focus-visible {
  outline:2px solid rgba(194,209,164,.58);
  outline-offset:3px;
}

.home-partner-card img {
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  max-height:108px;
  object-fit:contain;
  object-position:center;
}

html[data-theme="light"] .home-partner-card {
  border-color:rgba(71,91,60,.18);
  background:
    radial-gradient(circle at 50% 0, rgba(108,139,86,.10), transparent 58%),
    linear-gradient(180deg, rgba(241,244,235,.96), rgba(227,234,220,.96));
}

@media(max-width:920px) {
  .home-partners-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .home-partner-card {
    min-height:132px;
  }
}

@media(max-width:620px) {
  .home-partners {
    margin-top:18px;
  }

  .home-partners-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }

  .home-partner-card {
    min-height:108px;
    padding:12px 10px;
    border-radius:13px;
  }

  .home-partner-card img {
    max-height:82px;
  }
}

@media(max-width:390px) {
  .home-partners-grid {
    grid-template-columns:1fr;
  }

  .home-partner-card {
    min-height:112px;
  }

  .home-partner-card img {
    max-height:88px;
  }
}

@media(prefers-reduced-motion:reduce) {
  .home-partner-card {
    transition:none !important;
  }
}


/* ============================================================
   POLISHING — MITRA KAMI DARK GREEN CARDS V1B
   Force partner-logo cards to use the dark Beranda Kecil green
   surface in both dark and light appearance modes.
   ============================================================ */

.home-partner-card,
html[data-theme="light"] .home-partner-card {
  border-color:rgba(151,181,124,.26) !important;
  background:
    radial-gradient(circle at 50% 0, rgba(119,154,91,.13), transparent 58%),
    linear-gradient(180deg, #20331e 0%, #172617 52%, #101b11 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 10px 24px rgba(0,0,0,.16) !important;
}

.home-partner-card:hover,
.home-partner-card:focus-visible,
html[data-theme="light"] .home-partner-card:hover,
html[data-theme="light"] .home-partner-card:focus-visible {
  border-color:rgba(174,207,143,.42) !important;
  background:
    radial-gradient(circle at 50% 0, rgba(132,170,101,.18), transparent 60%),
    linear-gradient(180deg, #284126 0%, #1b2e1a 52%, #132015 100%) !important;
}

.home-partner-card img {
  filter:
    drop-shadow(0 2px 4px rgba(0,0,0,.30))
    drop-shadow(0 0 10px rgba(255,255,255,.035));
}

/* =========================================================
   BERANDAKECIL v4.0 — Singapore TOTO card
   ========================================================= */
#live .live-toto-panel{
  display:grid;
  gap:12px;
}
#live .live-toto-kicker{
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}
#live .live-toto-numbers{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:7px;
}
#live .live-toto-numbers > span{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  border:1px solid rgba(239,233,211,.18);
  border-radius:12px;
  background:rgba(13,17,12,.48);
  color:#fffdf2;
  font-size:16px;
  font-weight:900;
  font-variant-numeric:tabular-nums;
}
#live .live-toto-additional{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid rgba(239,233,211,.14);
  border-radius:12px;
  background:rgba(255,255,255,.035);
  color:var(--muted);
  font-size:12px;
}
#live .live-toto-additional strong{
  color:#f3dfad;
  font-size:18px;
}
#live .previous-result-toto{
  align-items:center;
}
#live .previous-toto-values{
  display:grid;
  justify-items:end;
  gap:6px;
}
#live .previous-toto-values .live-toto-numbers{
  grid-template-columns:repeat(6,26px);
  gap:4px;
}
#live .previous-toto-values .live-toto-numbers > span{
  min-height:26px;
  border-radius:8px;
  font-size:10px;
}
#live .previous-toto-values small{
  color:var(--muted);
}
html[data-theme="light"] #live .live-toto-numbers > span{
  background:rgba(255,255,255,.82);
  border-color:rgba(83,74,52,.16);
  color:#26261e;
}
html[data-theme="light"] #live .live-toto-additional{
  background:rgba(255,255,255,.70);
  border-color:rgba(83,74,52,.14);
}
html[data-theme="light"] #live .live-toto-additional strong{
  color:#6f5728;
}
@media(max-width:620px){
  #live .live-toto-numbers{grid-template-columns:repeat(3,minmax(0,1fr))}
  #live .previous-toto-values .live-toto-numbers{grid-template-columns:repeat(3,28px)}
}


/* BERANDAKECIL v4.2 — Singapore TOTO visual unity
   Keep TOTO data structure unique, but use the same dark circular
   number language as the other Live Result cards on Homepage. */
#live .live-toto-panel > .live-toto-numbers{
  display:flex;
  flex-wrap:nowrap;
  justify-content:center;
  gap:6px;
}

#live .live-toto-panel > .live-toto-numbers > span{
  flex:1 1 35px;
  width:auto;
  max-width:46px;
  min-width:34px;
  min-height:0;
  aspect-ratio:1;
  border-radius:50% !important;
  border:1px solid rgba(231,220,183,.22) !important;
  background:
    radial-gradient(circle at 38% 30%,rgba(255,255,255,.12),transparent 36%),
    rgba(22,28,20,.86) !important;
  color:#f7f3e6 !important;
  font-size:16px;
  line-height:1;
  font-weight:900;
  font-variant-numeric:tabular-nums;
  box-shadow:
    inset 0 -6px 12px rgba(0,0,0,.18),
    0 4px 12px rgba(0,0,0,.18) !important;
}

#live .live-toto-additional{
  min-height:52px;
  padding:7px 9px 7px 12px;
  border-color:rgba(233,226,201,.10) !important;
  background:rgba(5,8,5,.13) !important;
  color:rgba(244,240,221,.72) !important;
}

#live .live-toto-additional strong{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:1px solid rgba(231,220,183,.28);
  background:
    radial-gradient(circle at 38% 30%,rgba(255,255,255,.12),transparent 36%),
    rgba(22,28,20,.90);
  color:#f3dfad !important;
  font-size:16px;
  line-height:1;
  font-weight:900;
  font-variant-numeric:tabular-nums;
  box-shadow:
    inset 0 -6px 12px rgba(0,0,0,.18),
    0 4px 12px rgba(0,0,0,.18);
}

/* Homepage cards remain dark even when the page itself uses light mode. */
html[data-theme="light"] #live .live-toto-panel > .live-toto-numbers > span{
  border-color:rgba(231,220,183,.22) !important;
  background:
    radial-gradient(circle at 38% 30%,rgba(255,255,255,.12),transparent 36%),
    rgba(22,28,20,.86) !important;
  color:#f7f3e6 !important;
}

html[data-theme="light"] #live .live-toto-additional{
  border-color:rgba(233,226,201,.10) !important;
  background:rgba(5,8,5,.13) !important;
  color:rgba(244,240,221,.72) !important;
}

html[data-theme="light"] #live .live-toto-additional strong{
  border-color:rgba(231,220,183,.28) !important;
  background:
    radial-gradient(circle at 38% 30%,rgba(255,255,255,.12),transparent 36%),
    rgba(22,28,20,.90) !important;
  color:#f3dfad !important;
}

@media(max-width:620px){
  #live .live-toto-panel > .live-toto-numbers{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    justify-items:center;
  }

  #live .live-toto-panel > .live-toto-numbers > span{
    width:42px;
    min-width:42px;
    max-width:42px;
  }
}


/* BERANDAKECIL v4.3 — Macau 6D two-row result dates
   Homepage only. Internal Macau session-day storage remains unchanged. */
#live .live-card-macau-6d .live-macau6d-two-row{
  display:grid;
  gap:0;
  padding:0 !important;
  overflow:hidden;
}

#live .live-card-macau-6d .macau6d-result-row{
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  align-items:center;
  column-gap:9px;
  row-gap:7px;
  padding:11px 12px;
}

#live .live-card-macau-6d .macau6d-row-heading{
  display:grid;
  gap:3px;
  align-self:center;
}

#live .live-card-macau-6d .macau6d-row-heading strong{
  color:#f5e8bd;
  font-size:10px;
  line-height:1.1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.045em;
}

#live .live-card-macau-6d .macau6d-row-heading small{
  color:rgba(240,236,217,.68);
  font-size:9px;
  line-height:1.25;
}

#live .live-card-macau-6d .macau6d-row-digits{
  min-width:0;
  gap:5px;
}

#live .live-card-macau-6d .macau6d-row-digits .digit{
  min-width:0;
  max-width:38px;
  font-size:18px !important;
}

#live .live-card-macau-6d .macau6d-row-reference{
  grid-column:2;
  color:rgba(240,236,217,.62);
  font-size:9px;
  line-height:1.2;
}

#live .live-card-macau-6d .macau6d-row-reference strong{
  color:#f5e8bd;
  font-size:10px;
  font-weight:900;
  font-variant-numeric:tabular-nums;
}

#live .live-card-macau-6d .macau6d-row-divider{
  height:1px;
  margin:0 12px;
  background:rgba(233,226,201,.11);
}

#live .live-card-macau-6d .macau6d-row-empty{
  min-height:38px;
  display:flex;
  align-items:center;
  color:rgba(240,236,217,.58);
  font-size:10px;
  font-weight:700;
}

@media(max-width:620px){
  #live .live-card-macau-6d .macau6d-result-row{
    grid-template-columns:76px minmax(0,1fr);
    padding:10px;
    column-gap:7px;
  }

  #live .live-card-macau-6d .macau6d-row-digits .digit{
    max-width:34px;
    font-size:16px !important;
  }
}

@media(max-width:380px){
  #live .live-card-macau-6d .macau6d-result-row{
    grid-template-columns:1fr;
  }

  #live .live-card-macau-6d .macau6d-row-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
  }

  #live .live-card-macau-6d .macau6d-row-reference{
    grid-column:1;
  }
}