/* =========================
   基礎設定
========================= */
* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
    color: #1f2937;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang TC",
        "Noto Sans TC", "Microsoft JhengHei", sans-serif;
    line-height: 1.65;
}

a {
    text-decoration: none;
    color: inherit;
}

.container {
    max-width: 1120px;
    margin: 0 auto;
    padding: 24px 16px 56px;
}

/* =========================
   標題
========================= */
h1,
h2,
h3 {
    margin-top: 0;
    color: #111827;
}

h1 {
    font-size: 2rem;
    line-height: 1.25;
    margin-bottom: 10px;
    letter-spacing: 0.2px;
}

h2 {
    font-size: 1.38rem;
    margin: 34px 0 16px;
    letter-spacing: 0.2px;
}

.center {
    text-align: center;
}

.notice-text {
    color: #4b5563;
    font-size: 0.96rem;
    margin: 8px 0;
}

/* =========================
   色條標題
========================= */
.title-with-bar {
    display: flex;
    align-items: center;
    gap: 10px;
}

.title-bar {
    display: inline-block;
    width: 7px;
    height: 20px;
    border-radius: 999px;
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.bar-power {
    background: linear-gradient(180deg, #ef5350, #d32f2f);
}

.bar-super {
    background: linear-gradient(180deg, #ffd54f, #f9a825);
}

.bar-539 {
    background: linear-gradient(180deg, #66bb6a, #2e7d32);
}

.bar-hot {
    background: linear-gradient(180deg, #ffb74d, #f57c00);
}

.bar-cold {
    background: linear-gradient(180deg, #90a4ae, #546e7a);
}

/* =========================
   卡片
========================= */
.result-card {
    background: rgba(255, 255, 255, 0.96);
    border-radius: 20px;
    padding: 20px;
    margin-bottom: 22px;
    border: 1px solid #dbe3ee;
    box-shadow:
        0 14px 36px rgba(15, 23, 42, 0.08),
        0 2px 6px rgba(15, 23, 42, 0.04);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    backdrop-filter: blur(2px);
}

.result-card:hover {
    transform: translateY(-4px);
    box-shadow:
        0 20px 42px rgba(15, 23, 42, 0.12),
        0 4px 10px rgba(15, 23, 42, 0.06);
    border-color: #cfd9e6;
}

.result-title {
    font-size: 1.05rem;
    font-weight: 800;
    margin-bottom: 12px;
    color: #0f172a;
    letter-spacing: 0.2px;
}

.result-row {
    margin: 8px 0;
}

/* Hero 卡片 */
.hero-card {
    text-align: center;
    padding: 30px 24px;
    background: linear-gradient(135deg, #ffffff 0%, #f8fbff 58%, #eef6ff 100%);
    border: 1px solid #dfe9f7;
    box-shadow:
        0 18px 40px rgba(30, 64, 175, 0.08),
        0 4px 12px rgba(15, 23, 42, 0.05);
}

.hero-card h1 {
    margin-bottom: 10px;
}

.hero-card .notice-text {
    font-size: 1rem;
}

/* 推薦卡主角感更明顯 */
.highlight-card {
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
    border: 1px solid #d8e7ff;
    box-shadow:
        0 16px 38px rgba(30, 136, 229, 0.09),
        0 3px 8px rgba(15, 23, 42, 0.04);
}

.highlight-card:hover {
    box-shadow:
        0 22px 46px rgba(30, 136, 229, 0.13),
        0 5px 12px rgba(15, 23, 42, 0.05);
    border-color: #bfd8ff;
}

/* =========================
   版面排列
========================= */
.lottery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    align-items: stretch;
}

.section-spacing {
    margin-top: 14px;
}

.info-list {
    line-height: 1.9;
}

/* =========================
   導覽列
========================= */
.link-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0 18px;
}

.link-row a {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    background: #f8fafc;
    border-radius: 999px;
    font-size: 0.92rem;
    color: #374151;
    border: 1px solid #e5e7eb;
    transition: all 0.15s ease;
}

.link-row a:hover {
    background: #eef2f7;
    border-color: #d7dde6;
}

/* =========================
   按鈕
========================= */
button {
    padding: 11px 15px;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    background: linear-gradient(135deg, #ef5350, #d32f2f);
    color: #fff;
    font-weight: 800;
    font-size: 0.95rem;
    margin: 4px 4px 0 0;
    transition: transform 0.16s ease, opacity 0.16s ease, box-shadow 0.16s ease;
    box-shadow: 0 6px 14px rgba(211, 47, 47, 0.24);
    letter-spacing: 0.2px;
}

button:hover {
    opacity: 0.97;
    transform: translateY(-1px);
    box-shadow: 0 10px 18px rgba(211, 47, 47, 0.28);
}

.btn-main {
    font-size: 1.02rem;
    padding: 13px 24px;
}

/* Hero 用藍按鈕 */
.btn-hero {
    background: linear-gradient(135deg, #42a5f5, #1565c0);
    color: #fff;
    box-shadow: 0 6px 14px rgba(21, 101, 192, 0.26);
}

.btn-hero:hover {
    box-shadow: 0 10px 18px rgba(21, 101, 192, 0.32);
}

/* 大樂透 */
.btn-super {
    background: linear-gradient(135deg, #ffd54f, #f9a825);
    color: #2b2b2b;
    box-shadow: 0 6px 14px rgba(249, 168, 37, 0.24);
}

.btn-super:hover {
    box-shadow: 0 10px 18px rgba(249, 168, 37, 0.3);
}

/* 今彩539 */
.btn-539 {
    background: linear-gradient(135deg, #66bb6a, #2e7d32);
    color: #fff;
    box-shadow: 0 6px 14px rgba(46, 125, 50, 0.24);
}

.btn-539:hover {
    box-shadow: 0 10px 18px rgba(46, 125, 50, 0.3);
}

.cta-main {
    margin: 20px 0 12px;
}

.cta-sub {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

/* =========================
   廣告版位（預設隱藏，啟用時保留穩定高度）
========================= */
.ad-slot[hidden] {
    display: none !important;
}

.ad-slot {
    width: 100%;
    max-width: 100%;
    margin: 24px auto;
    overflow: hidden;
}

.ad-slot.is-reserved:not([hidden]) {
    display: block;
    min-height: 250px;
}

@media (min-width: 768px) {
    .ad-slot.is-reserved:not([hidden]) {
        min-height: 90px;
    }
}

/* =========================
   彩球
========================= */
.ball-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0 10px;
}

.ball {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 38px;
    height: 38px;
    min-width: 38px;
    min-height: 38px;
    border-radius: 50%;
    color: #fff;
    font-weight: 800;
    font-size: 15px;
    background: #e53935; /* 保底 */
    border: 1px solid rgba(255,255,255,0.35);
    box-shadow:
        inset 0 -3px 0 rgba(0, 0, 0, 0.12),
        0 4px 10px rgba(0, 0, 0, 0.12);
}

/* 威力彩 */
.ball-red {
    background: radial-gradient(circle at 30% 30%, #ff8a80, #e53935 68%);
    color: #fff;
}

/* 威力彩第二區、熱門用橘 */
.ball-orange {
    background: radial-gradient(circle at 30% 30%, #ffcc80, #fb8c00 70%);
    color: #fff;
}

/* 藍色球 */
.ball-blue {
    background: radial-gradient(circle at 30% 30%, #90caf9, #1e88e5 70%);
    color: #fff;
}

/* 冷門、輔助 */
.ball-gray {
    background: radial-gradient(circle at 30% 30%, #b0bec5, #607d8b 70%);
    color: #fff;
}

/* 大樂透 */
.ball-yellow {
    background: radial-gradient(circle at 30% 30%, #fff59d, #fbc02d 72%);
    color: #2b2b2b;
}

/* 今彩539 */
.ball-green {
    background: radial-gradient(circle at 30% 30%, #a5d6a7, #43a047 72%);
    color: #fff;
}

/* =========================
   表單
========================= */
input[type="text"],
input[type="number"] {
    width: 100%;
    max-width: 220px;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    font-size: 0.95rem;
    background: #fff;
    margin: 6px 0 10px;
}

/* =========================
   標籤 Badge
========================= */
.badge {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 800;
    margin-bottom: 8px;
    letter-spacing: 0.2px;
}

.badge-power {
    background: #fdecea;
    color: #b71c1c;
}

.badge-super {
    background: #fff8db;
    color: #7a5a00;
}

.badge-539 {
    background: #e8f5e9;
    color: #1b5e20;
}

.badge-hot {
    background: #fff3e0;
    color: #c66900;
}

.badge-cold {
    background: #eceff1;
    color: #455a64;
}

/* =========================
   小區塊分隔感
========================= */
.center .result-title {
    margin-bottom: 8px;
}

#last-updated {
    font-weight: 700;
    color: #1f2937;
}

#powerlotto-recommend,
#superlotto-recommend,
#daily539-recommend,
#powerlotto-latest,
#superlotto-latest,
#daily539-latest {
    min-height: 72px;
}

/* =========================
   響應式
========================= */
@media (max-width: 900px) {
    .lottery {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .cta-sub {
        flex-direction: column;
        align-items: center;
    }

    button {
        width: 100%;
        max-width: 320px;
    }

    .link-row {
        gap: 6px;
    }

    .link-row a {
        font-size: 0.88rem;
    }

    .container {
        padding: 16px 12px 40px;
    }

    h1 {
        font-size: 1.75rem;
    }

    h2 {
        font-size: 1.25rem;
    }

    .result-card {
        padding: 18px 16px;
    }

    .ball {
        width: 36px;
        height: 36px;
        min-width: 36px;
        min-height: 36px;
        font-size: 14px;
    }
}
/* ===== Hero 區升級 ===== */
.hero-card {
    text-align: center;
    padding: 36px 28px;
    background: linear-gradient(135deg, #ffffff 0%, #f8fbff 58%, #eef6ff 100%);
    border: 1px solid #dfe9f7;
    box-shadow:
        0 20px 44px rgba(30, 64, 175, 0.08),
        0 6px 16px rgba(15, 23, 42, 0.05);
}

.hero-card h1 {
    margin-bottom: 12px;
    font-size: 2.1rem;
    letter-spacing: 0.3px;
}

.hero-card .notice-text {
    font-size: 1rem;
    margin-bottom: 14px;
}

.hero-tags {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0 18px;
}

.hero-tags .badge {
    margin-bottom: 0;
}

.cta-main {
    margin: 20px 0 12px;
}

.cta-sub {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}

@media (max-width: 900px) {
    .hero-card {
        padding: 28px 18px;
    }

    .hero-card h1 {
        font-size: 1.8rem;
    }

    .hero-tags {
        gap: 6px;
    }
}
/* ===== 更新時間資訊條 ===== */
.update-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 16px;
    margin: 6px 0 22px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    box-shadow:
        0 8px 20px rgba(15, 23, 42, 0.05),
        0 2px 6px rgba(15, 23, 42, 0.03);
    color: #334155;
    font-size: 0.95rem;
    font-weight: 600;
}

.update-label {
    color: #64748b;
    font-weight: 700;
}

#last-updated {
    color: #0f172a;
    font-weight: 800;
}

@media (max-width: 900px) {
    .update-bar {
        flex-direction: column;
        gap: 4px;
        text-align: center;
    }
}
/* ===== 首頁節奏優化 ===== */

/* Hero 與下方距離 */
.hero-card {
    margin-bottom: 18px;
}

/* 更新條與上下距離 */
.update-bar {
    margin: 10px auto 20px;
    max-width: 720px;
}

/* Hero下方廣告（縮窄＋置中） */
.ad-hero {
    max-width: 720px;
    margin: 0 auto 26px;
}

/* 第一個區塊（推薦）上方間距 */
#recommend-section {
    margin-top: 10px;
}

/* 所有區塊標題統一節奏 */
h2 {
    margin-top: 36px;
    margin-bottom: 14px;
}
.btn-hero-main {
    background: linear-gradient(135deg, #1e88e5 0%, #1565c0 100%);
    color: #fff;
    font-size: 1.05rem;
    padding: 14px 24px;
    border-radius: 14px;
    box-shadow: 0 6px 16px rgba(30, 136, 229, 0.3);
}
/* ===== 推薦結果高信任版本 ===== */
.recommend-card {
    border: 1px solid #d8e3f0;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

.recommend-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.recommend-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    background: #eef4ff;
    color: #315a9b;
    font-size: 0.8rem;
    font-weight: 700;
    white-space: nowrap;
}

.recommend-note {
    margin-top: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    background: #f8fafc;
    border: 1px solid #e5ebf3;
    color: #475569;
    font-size: 0.92rem;
    line-height: 1.6;
}

.recommend-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.recommend-meta span {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
    font-size: 0.8rem;
    font-weight: 700;
}

@media (max-width: 900px) {
    .recommend-top {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* ===== Hero 主按鈕統一藍色 ===== */
.btn-hero-main {
    background: linear-gradient(135deg, #42a5f5, #1565c0);
    color: #fff;
    font-size: 1.02rem;
    padding: 14px 24px;
    border-radius: 14px;
    border: none;
    font-weight: 800;
    box-shadow: 0 6px 16px rgba(21, 101, 192, 0.28);
    cursor: pointer;
}

.btn-hero-main:hover {
    box-shadow: 0 10px 18px rgba(21, 101, 192, 0.34);
    transform: translateY(-1px);
}

.hero-tags a {
    text-decoration: none;
}

.hero-tags .badge {
    cursor: pointer;
    transition: transform 0.15s ease, opacity 0.15s ease;
}

.hero-tags .badge:hover {
    transform: translateY(-1px);
    opacity: 0.95;
}

.winner-row {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}

.winner-prize {
    min-width: 80px;
}

.winner-count {
    color: #333;
}

.winner-money {
    color: #d35400;
    font-weight: 500;
}

.winner-money.muted {
    color: #888;
    font-size: 0.9rem;
}

/* ===== 首頁主推對照 ===== */

.comparison-card {
    margin-top: 14px;
    padding: 24px;
}

.check-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    margin-top: 8px;
    align-items: stretch;
}

.check-card {
    display: flex;
    flex-direction: column;
    min-height: 520px;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0 12px;
}

.check-title {
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 18px;
}

.check-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    font-weight: 700;
}

.check-main-area {
    min-height: 290px;
}

.check-label {
    margin-top: 14px;
    margin-bottom: 8px;
    font-weight: 800;
}

.check-numbers {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 34px;
}

.check-numbers span {
    display: inline-block;
    min-width: 28px;
    text-align: center;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: 0.5px;
}

.check-second-prediction span {
    font-size: 20px;
    font-weight: 800;
}

.check-numbers.draw span,
.check-numbers.special span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #f3c245;
    color: #222;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0;
}

.check-result {
    margin-top: auto;
    padding-top: 18px;
    min-height: 120px;
}

.check-hit {
    font-size: 17px;
    font-weight: 800;
}

.check-hit strong {
    color: #c40020;
    font-size: 24px;
    margin: 0 2px;
}

.check-match {
    margin-top: 10px;
    line-height: 1.7;
    font-weight: 700;
}

.check-match.muted {
    color: #888;
}

.check-empty {
    padding: 14px;
    border-radius: 12px;
    background: #f7f7f7;
    color: #666;
    font-weight: 700;
}

.check-action {
    margin-top: 36px;
    text-align: center;
}

.update-note {
    margin: 6px 0 18px;
    font-size: 0.9rem;
    color: #666;
    line-height: 1.5;
}

@media (max-width: 768px) {
    .check-grid {
        grid-template-columns: 1fr;
    }

    .check-card {
        min-height: auto;
        padding: 14px 0;
        border-bottom: 1px solid #eee;
    }

    .check-card:last-child {
        border-bottom: none;
    }

    .check-main-area {
        min-height: auto;
    }

    .check-result {
        margin-top: 18px;
        min-height: auto;
    }
}

/* ===== 手機與內容頁版面優化 v1 ===== */

/* 智慧選號：桌面三欄，手機沿用共用的一欄規則 */
.smart-pick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* 完整統計頁 */
.stats-hero-card {
    margin-bottom: 24px;
}

.stats-hero-card h1 {
    margin: 4px 0 8px;
}

.stats-hero-card .link-row {
    margin-bottom: 0;
}

.stats-table-card {
    padding: 0;
    overflow: hidden;
}

.stats-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.stats-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}

.stats-table th,
.stats-table td {
    padding: 13px 18px;
    text-align: left;
    border-bottom: 1px solid #e5e7eb;
}

.stats-table th {
    background: #f1f5f9;
    color: #334155;
    font-size: 0.92rem;
    font-weight: 800;
}

.stats-table td:first-child {
    width: 38%;
    color: #0f172a;
    font-weight: 800;
}

.stats-table tbody tr:nth-child(even) {
    background: #f8fafc;
}

.stats-table tbody tr:last-child td {
    border-bottom: none;
}

/* 推薦分析文章 */
.article-container {
    max-width: 920px;
}

.article-content {
    margin-top: 12px;
    padding: 36px 40px;
}

.article-content h1 {
    margin: 6px 0 18px;
    font-size: clamp(1.75rem, 4vw, 2.3rem);
}

.article-content h2 {
    margin: 30px 0 12px;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
}

.article-content p,
.article-content li {
    font-size: 1.02rem;
    line-height: 1.85;
}

.article-content a {
    color: #1565c0;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.article-content ul {
    padding-left: 1.4rem;
}

.article-content hr {
    margin: 28px 0 20px;
    border: 0;
    border-top: 1px solid #dbe3ee;
}

@media (max-width: 900px) {
    .smart-pick-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

@media (max-width: 600px) {
    .stats-table th,
    .stats-table td {
        padding: 11px 13px;
    }

    .article-content {
        padding: 24px 18px;
    }

    .article-content p,
    .article-content li {
        font-size: 1rem;
        line-height: 1.78;
    }
}

/* ===== LOTTO_OBSERVER_TRUST_AND_SEO_CONTENT_V1_START ===== */

/* 共用內容頁頂部導覽 */
.content-site-header {
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid #dbe3ee;
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
}

.content-header-inner {
    width: min(1120px, calc(100% - 32px));
    margin: 0 auto;
    min-height: 74px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.content-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #0f172a;
    flex-shrink: 0;
}

.content-brand img {
    display: block;
}

.content-brand span {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.content-brand strong {
    font-size: 1rem;
    letter-spacing: 0.2px;
}

.content-brand small {
    margin-top: 3px;
    color: #64748b;
    font-size: 0.76rem;
}

.content-main-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.content-main-nav a {
    padding: 8px 10px;
    border-radius: 9px;
    color: #334155;
    font-size: 0.9rem;
    font-weight: 700;
}

.content-main-nav a:hover,
.content-main-nav a:focus-visible {
    color: #0f4c81;
    background: #eef6ff;
}

/* 文章與信任頁共用骨架 */
.content-shell {
    width: min(960px, calc(100% - 32px));
    margin: 0 auto;
    padding: 20px 0 64px;
}

.content-breadcrumb {
    margin: 0 0 14px;
    color: #64748b;
    font-size: 0.86rem;
}

.content-breadcrumb ol {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.content-breadcrumb li + li::before {
    content: "/";
    margin-right: 7px;
    color: #94a3b8;
}

.content-breadcrumb a:hover {
    color: #1565c0;
    text-decoration: underline;
}

.content-prose {
    padding: 44px 52px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid #dbe3ee;
    border-radius: 24px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);
}

.content-hero {
    margin-bottom: 34px;
    padding-bottom: 30px;
    border-bottom: 1px solid #e2e8f0;
}

.content-eyebrow,
.content-card-tag {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 5px 10px;
    border-radius: 999px;
    background: #eaf3ff;
    color: #0f5f9c;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.05em;
}

.content-hero h1 {
    max-width: 800px;
    margin: 14px 0 14px;
    font-size: clamp(2rem, 5vw, 2.75rem);
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.content-lead {
    margin: 0;
    color: #475569;
    font-size: 1.13rem;
    line-height: 1.85;
}

.content-prose section {
    scroll-margin-top: 20px;
    margin-top: 36px;
}

.content-prose section:first-of-type {
    margin-top: 0;
}

.content-prose h2 {
    margin: 0 0 13px;
    color: #172033;
    font-size: 1.55rem;
    line-height: 1.35;
}

.content-prose h3 {
    margin: 0 0 8px;
    font-size: 1.08rem;
}

.content-prose p,
.content-prose li {
    color: #334155;
    font-size: 1.02rem;
    line-height: 1.88;
}

.content-prose p {
    margin: 0 0 14px;
}

.content-prose ul,
.content-prose ol {
    margin: 12px 0 0;
    padding-left: 1.45rem;
}

.content-prose li + li {
    margin-top: 8px;
}

.content-prose a {
    color: #0f63a5;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.content-prose a:hover {
    color: #0b4675;
}

.content-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.content-feature-card,
.example-card,
.contact-card {
    padding: 20px;
    border: 1px solid #dbe5f0;
    border-radius: 16px;
    background: #f8fbff;
}

.content-feature-card p,
.example-card p {
    margin-bottom: 0;
    font-size: 0.96rem;
}

.content-check-list li::marker {
    color: #16865a;
}

.content-step-list li {
    padding-left: 5px;
}

.content-step-list li::marker {
    color: #0f63a5;
    font-weight: 800;
}

.content-callout {
    margin-top: 36px;
    padding: 20px 22px;
    border: 1px solid #b9d8f4;
    border-left: 5px solid #2680c2;
    border-radius: 14px;
    background: #f1f8ff;
}

.content-callout h2,
.content-callout strong {
    display: block;
    margin: 0 0 7px;
    color: #123f63;
    font-size: 1.06rem;
}

.content-callout p:last-child {
    margin-bottom: 0;
}

.content-callout-caution {
    border-color: #f2cf8a;
    border-left-color: #d88910;
    background: #fff9eb;
}

.content-callout-caution h2,
.content-callout-caution strong {
    color: #784a05;
}

.content-table-wrap {
    width: 100%;
    margin: 18px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
}

.content-table {
    width: 100%;
    min-width: 600px;
    border-collapse: collapse;
    background: #fff;
}

.content-table th,
.content-table td {
    padding: 13px 15px;
    border-bottom: 1px solid #e5eaf1;
    text-align: left;
    vertical-align: top;
}

.content-table th {
    background: #f1f5f9;
    color: #26364a;
    font-size: 0.92rem;
    font-weight: 800;
}

.content-table td {
    color: #334155;
}

.content-table tbody tr:last-child th,
.content-table tbody tr:last-child td {
    border-bottom: none;
}

.compact-table {
    min-width: 480px;
}

.article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-top: 18px;
    color: #64748b;
    font-size: 0.86rem;
}

.article-meta a {
    font-size: inherit;
}

.article-toc {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: -8px 0 36px;
    padding: 14px 16px;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    background: #f8fafc;
}

.article-toc strong {
    margin-right: 4px;
    color: #1e293b;
    font-size: 0.9rem;
}

.article-toc a {
    padding: 5px 9px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid #dde5ef;
    font-size: 0.84rem;
    font-weight: 700;
    text-decoration: none;
}

.formula-card {
    margin: 18px 0;
    padding: 22px;
    border: 1px solid #c5d9ee;
    border-radius: 14px;
    background: linear-gradient(135deg, #f5faff, #edf6ff);
    color: #143b5d;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: clamp(1.05rem, 3vw, 1.3rem);
    font-weight: 800;
    text-align: center;
}

.article-footer {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 42px;
    padding-top: 26px;
    border-top: 1px solid #e2e8f0;
}

.article-footer > div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
}

.article-footer strong {
    color: #1e293b;
}

.article-footer a {
    font-size: 0.94rem;
}

.contact-card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 14px 0;
}

.contact-card span {
    color: #64748b;
    font-size: 0.82rem;
    font-weight: 700;
}

.contact-card a {
    width: fit-content;
    font-size: 1.12rem;
    font-weight: 800;
}

/* 首頁內容入口 */
.content-hub {
    margin: 26px 0 30px;
    padding: 28px;
    border: 1px solid #dbe5f0;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}

.content-hub h2 {
    margin: 8px 0 0;
}

.content-hub-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
}

.content-hub-about {
    flex-shrink: 0;
    padding: 8px 12px;
    border-radius: 10px;
    color: #0f5f9c;
    background: #eaf3ff;
    font-size: 0.88rem;
    font-weight: 800;
}

.content-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 20px;
}

.content-link-card {
    min-width: 0;
    padding: 18px;
    border: 1px solid #dbe3ee;
    border-radius: 15px;
    background: #fff;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.content-link-card:hover {
    transform: translateY(-2px);
    border-color: #bfd6ec;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.07);
}

.content-link-card h3 {
    margin: 7px 0 7px;
    font-size: 1rem;
    line-height: 1.45;
}

.content-link-card h3 a::after {
    content: " →";
    color: #2676b3;
}

.content-link-card p {
    margin: 0;
    color: #64748b;
    font-size: 0.88rem;
    line-height: 1.65;
}

.content-hub-secondary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.content-hub-secondary a {
    padding: 7px 10px;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    color: #475569;
    background: #f8fafc;
    font-size: 0.84rem;
    font-weight: 700;
}

/* 全站信任頁尾 */
.site-footer {
    margin-top: 12px;
    padding: 42px 16px 20px;
    background: #111c2d;
    color: #cbd5e1;
}

.site-footer-inner,
.site-footer-bottom {
    width: min(1120px, 100%);
    margin: 0 auto;
}

.site-footer-inner {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
    gap: 48px;
}

.site-footer-summary strong {
    display: block;
    color: #fff;
    font-size: 1.08rem;
}

.site-footer-summary p {
    max-width: 570px;
    margin: 10px 0 0;
    color: #aebdd0;
    font-size: 0.9rem;
    line-height: 1.75;
}

.site-footer-links {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.site-footer-links > div {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.site-footer-links strong {
    margin-bottom: 4px;
    color: #fff;
    font-size: 0.86rem;
}

.site-footer-links a {
    color: #b8c6d8;
    font-size: 0.84rem;
}

.site-footer-links a:hover,
.site-footer-links a:focus-visible {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.site-footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 32px;
    padding-top: 16px;
    border-top: 1px solid #2b3a4f;
    color: #8fa0b5;
    font-size: 0.78rem;
}

@media (max-width: 820px) {
    .content-header-inner {
        align-items: flex-start;
        flex-direction: column;
        padding: 14px 0;
        gap: 10px;
    }

    .content-main-nav {
        justify-content: flex-start;
        width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 2px;
    }

    .content-main-nav a {
        white-space: nowrap;
    }

    .content-feature-grid,
    .content-card-grid {
        grid-template-columns: 1fr 1fr;
    }

    .site-footer-inner {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

@media (max-width: 600px) {
    .content-shell {
        width: min(100% - 24px, 960px);
        padding-top: 14px;
    }

    .content-prose {
        padding: 28px 18px;
        border-radius: 18px;
    }

    .content-hero {
        margin-bottom: 26px;
        padding-bottom: 24px;
    }

    .content-hero h1 {
        font-size: 1.85rem;
    }

    .content-lead,
    .content-prose p,
    .content-prose li {
        font-size: 1rem;
        line-height: 1.8;
    }

    .content-feature-grid,
    .content-card-grid,
    .article-footer {
        grid-template-columns: 1fr;
    }

    .content-table th,
    .content-table td {
        padding: 11px 12px;
    }

    .article-toc {
        align-items: flex-start;
        flex-direction: column;
    }

    .article-toc a {
        width: 100%;
    }

    .content-hub {
        padding: 22px 16px;
    }

    .content-hub-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .site-footer-links {
        grid-template-columns: 1fr 1fr;
    }

    .site-footer-bottom {
        flex-direction: column;
    }
}

/* ===== LOTTO_OBSERVER_TRUST_AND_SEO_CONTENT_V1_END ===== */

/* ===== LOTTO_OBSERVER_LOTTERY_MAIN_PAGE_JOURNEY_V1_START ===== */
.game-v3-page {
    --game-accent: #2563eb;
    --game-accent-dark: #1d4ed8;
    --game-accent-soft: #eff6ff;
    --game-accent-border: #bfdbfe;
    background:
        radial-gradient(circle at 8% 0%, color-mix(in srgb, var(--game-accent) 10%, transparent), transparent 28%),
        linear-gradient(180deg, #f8fafc 0%, #eef3f8 100%);
    color: #1e293b;
}

.game-v3-power {
    --game-accent: #d93f4d;
    --game-accent-dark: #b42331;
    --game-accent-soft: #fff1f2;
    --game-accent-border: #fecdd3;
}

.game-v3-super {
    --game-accent: #d18a00;
    --game-accent-dark: #9a6400;
    --game-accent-soft: #fff8e7;
    --game-accent-border: #f5d58b;
}

.game-v3-daily {
    --game-accent: #27864b;
    --game-accent-dark: #176c39;
    --game-accent-soft: #effbf3;
    --game-accent-border: #bde7ca;
}

.game-v3-container {
    max-width: 1120px;
    padding-top: 14px;
}

.game-v3-header {
    position: sticky;
    top: 8px;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 16px;
    padding: 12px 15px;
    border: 1px solid rgba(203, 213, 225, 0.92);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.075);
    backdrop-filter: blur(14px);
}

.game-v3-brand {
    display: flex;
    min-width: 0;
    flex: 0 1 auto;
    flex-direction: column;
    color: #0f172a;
    line-height: 1.2;
}

.game-v3-brand strong {
    overflow: hidden;
    font-size: 0.98rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.game-v3-brand span {
    margin-top: 3px;
    color: var(--game-accent-dark);
    font-size: 0.72rem;
    font-weight: 800;
}

.game-v3-nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
}

.game-v3-nav a {
    padding: 7px 9px;
    border-radius: 9px;
    color: #475569;
    font-size: 0.82rem;
    font-weight: 800;
    white-space: nowrap;
}

.game-v3-nav a:hover,
.game-v3-nav a:focus-visible {
    background: var(--game-accent-soft);
    color: var(--game-accent-dark);
}

.game-v3-hero {
    position: relative;
    overflow: hidden;
    padding: 48px 44px;
    border: 1px solid var(--game-accent-border);
    border-radius: 25px;
    background:
        radial-gradient(circle at 87% 20%, color-mix(in srgb, var(--game-accent) 18%, transparent), transparent 27%),
        linear-gradient(135deg, #fff 0%, var(--game-accent-soft) 100%);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.085);
}

.game-v3-hero::after {
    position: absolute;
    right: -54px;
    bottom: -96px;
    width: 260px;
    height: 260px;
    border: 38px solid rgba(255, 255, 255, 0.54);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.game-v3-eyebrow,
.game-v3-kicker,
.game-v3-card-label,
.game-v3-feature-name,
.game-v3-tool-label {
    color: var(--game-accent-dark);
    font-size: 0.75rem;
    font-weight: 900;
    letter-spacing: 0.06em;
}

.game-v3-eyebrow {
    display: inline-flex;
    padding: 4px 10px;
    border: 1px solid var(--game-accent-border);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
}

.game-v3-hero h1 {
    position: relative;
    z-index: 1;
    max-width: 760px;
    margin: 15px 0 12px;
    color: #0f172a;
    font-size: clamp(2rem, 4.7vw, 3.35rem);
    line-height: 1.14;
    letter-spacing: -0.035em;
}

.game-v3-hero > p {
    position: relative;
    z-index: 1;
    max-width: 730px;
    margin: 0;
    color: #475569;
    font-size: 1.02rem;
    line-height: 1.75;
}

.game-v3-hero-actions,
.game-v3-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.game-v3-hero-actions {
    position: relative;
    z-index: 1;
    margin-top: 24px;
}

.game-v3-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 9px 16px;
    border-radius: 11px;
    font-size: 0.88rem;
    font-weight: 850;
    text-align: center;
    transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.game-v3-action:hover,
.game-v3-action:focus-visible {
    transform: translateY(-1px);
}

.game-v3-action-primary {
    background: linear-gradient(135deg, var(--game-accent), var(--game-accent-dark));
    color: #fff;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--game-accent) 26%, transparent);
}

.game-v3-action-secondary {
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #334155;
}

.game-v3-section {
    margin-top: 60px;
    scroll-margin-top: 95px;
}

.game-v3-section-heading {
    margin-bottom: 18px;
}

.game-v3-section-heading-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.game-v3-section-heading h2 {
    margin: 8px 0 5px;
    color: #0f172a;
    font-size: clamp(1.55rem, 3vw, 2.15rem);
    line-height: 1.22;
    letter-spacing: -0.025em;
}

.game-v3-section-heading p {
    max-width: 780px;
    margin: 0;
    color: #64748b;
    line-height: 1.65;
}

.game-v3-update-chip {
    display: flex;
    min-width: 170px;
    flex-direction: column;
    padding: 9px 12px;
    border: 1px solid #dbe4ef;
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.9);
}

.game-v3-update-chip span {
    color: #94a3b8;
    font-size: 0.7rem;
    font-weight: 800;
}

.game-v3-update-chip strong {
    margin-top: 2px;
    color: #334155;
    font-size: 0.85rem;
}

.game-v3-page .result-card {
    border-color: #dce5ef;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 11px 28px rgba(15, 23, 42, 0.055);
}

.game-v3-focus-card {
    padding: 25px;
    border-top: 4px solid var(--game-accent) !important;
}

.game-v3-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 17px;
}

.game-v3-card-top h3 {
    margin: 3px 0 0;
    color: #0f172a;
    font-size: 1.15rem;
}

.game-v3-status {
    flex: 0 0 auto;
    padding: 4px 8px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 850;
}

.game-v3-status-primary {
    border: 1px solid var(--game-accent-border);
    background: var(--game-accent-soft);
    color: var(--game-accent-dark);
}

.game-v3-output {
    min-width: 0;
    color: #334155;
}

.game-v3-draw-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-bottom: 17px;
}

.game-v3-draw-meta span {
    display: flex;
    flex-direction: column;
    padding: 9px 11px;
    border-radius: 10px;
    background: #f8fafc;
    color: #334155;
    font-size: 0.85rem;
}

.game-v3-draw-meta b {
    margin-bottom: 2px;
    color: #94a3b8;
    font-size: 0.68rem;
}

.game-v3-page .ball-row {
    justify-content: flex-start;
}

.game-v3-prize-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 19px;
}

.game-v3-prize-summary > div,
.game-v3-prize-pending {
    padding: 11px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 11px;
    background: #f8fafc;
}

.game-v3-prize-summary span,
.game-v3-prize-summary strong {
    display: block;
}

.game-v3-prize-summary span {
    color: #64748b;
    font-size: 0.74rem;
}

.game-v3-prize-summary strong {
    margin-top: 3px;
    color: #0f172a;
    font-size: 0.93rem;
}

.game-v3-card-actions {
    margin-top: 20px;
}

.game-v3-primary-grid,
.game-v3-feature-grid,
.game-v3-tool-grid,
.game-v3-link-grid {
    display: grid;
    gap: 16px;
}

.game-v3-primary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.game-v3-primary-card {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    padding: 22px;
}

.game-v3-card-note {
    margin: 17px 0 0;
    color: #64748b;
    font-size: 0.82rem;
    line-height: 1.65;
}

.game-v3-text-link {
    width: fit-content;
    margin-top: auto;
    padding-top: 18px;
    color: var(--game-accent-dark);
    font-size: 0.84rem;
    font-weight: 850;
}

.game-v3-feature-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.game-v3-feature-card,
.game-v3-tool-card {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    padding: 21px;
}

.game-v3-feature-card {
    position: relative;
    overflow: hidden;
    border-top: 4px solid var(--game-accent) !important;
}

.game-v3-feature-dual {
    border-top-color: #4f46e5 !important;
}

.game-v3-feature-name,
.game-v3-tool-label {
    width: fit-content;
    padding: 4px 8px;
    border-radius: 999px;
    background: var(--game-accent-soft);
}

.game-v3-feature-dual .game-v3-feature-name {
    background: #eef2ff;
    color: #4338ca;
}

.game-v3-feature-card h3,
.game-v3-tool-card h3 {
    margin: 12px 0 7px;
    color: #0f172a;
    font-size: 1.03rem;
    line-height: 1.48;
}

.game-v3-feature-meta {
    margin: 0 0 14px;
    color: #64748b;
    font-size: 0.74rem;
    font-weight: 800;
}

.game-v3-choice-output {
    min-height: 72px;
    margin-top: 3px;
    padding: 13px;
    border: 1px dashed #cbd5e1;
    border-radius: 11px;
    background: #f8fafc;
    color: #64748b;
    font-size: 0.84rem;
}

.game-v3-page button.game-v3-generate {
    width: 100%;
    margin-top: auto;
    padding-top: 11px;
    padding-bottom: 11px;
    border-radius: 11px;
}

.game-v3-feature-card .game-v3-generate {
    margin-top: 18px;
}

.game-v3-tool-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.game-v3-tool-card > p {
    margin: 0 0 15px;
    color: #64748b;
    font-size: 0.84rem;
    line-height: 1.6;
}

.game-v3-tool-card .game-v3-action {
    width: fit-content;
    margin-top: auto;
}

.game-v3-smart-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 4px 0 14px;
}

.game-v3-smart-grid label {
    display: flex;
    flex-direction: column;
    gap: 5px;
    color: #475569;
    font-size: 0.76rem;
    font-weight: 800;
}

.game-v3-smart-grid input {
    width: 100%;
    min-height: 42px;
    padding: 7px 9px;
    border: 1px solid #cbd5e1;
    border-radius: 9px;
    background: #fff;
}

.game-v3-smart-result {
    margin-top: 14px;
}

.game-v3-link-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.game-v3-link-grid a {
    display: flex;
    min-height: 132px;
    flex-direction: column;
    padding: 17px;
    border: 1px solid #dce5ef;
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
}

.game-v3-link-grid a:hover,
.game-v3-link-grid a:focus-visible {
    border-color: var(--game-accent-border);
    transform: translateY(-1px);
}

.game-v3-link-grid strong {
    color: #0f172a;
    font-size: 0.93rem;
}

.game-v3-link-grid strong::after {
    color: var(--game-accent);
    content: " →";
}

.game-v3-link-grid span {
    margin-top: 7px;
    color: #64748b;
    font-size: 0.78rem;
    line-height: 1.5;
}

.game-v3-rules-card {
    padding: 22px;
}

.game-v3-rules-card h3 {
    margin: 0 0 5px;
    color: #0f172a;
}

.game-v3-rules-card p {
    margin: 0;
    color: #64748b;
}

.game-v3-rule-detail {
    margin-top: 18px;
    padding: 15px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #f8fafc;
    color: #475569;
    line-height: 1.75;
}

.game-v3-responsible {
    margin: 56px 0 24px;
    padding: 24px;
    border: 1px solid #d8e4f0;
    border-radius: 18px;
    background: linear-gradient(135deg, #fff, #f7fbff);
}

.game-v3-responsible strong {
    color: #0f172a;
}

.game-v3-responsible p {
    margin: 7px 0 14px;
    color: #64748b;
    font-size: 0.86rem;
}

.game-v3-responsible > div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.game-v3-responsible a {
    padding: 6px 9px;
    border: 1px solid #dbe3ee;
    border-radius: 8px;
    background: #fff;
    color: #334155;
    font-size: 0.78rem;
    font-weight: 800;
}

.game-v3-page .site-footer {
    margin-top: 0;
}

@media (max-width: 960px) {
    .game-v3-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 9px;
    }

    .game-v3-nav {
        justify-content: flex-start;
        width: 100%;
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .game-v3-feature-grid,
    .game-v3-link-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .game-v3-container {
        padding: 9px 12px 42px;
    }

    .game-v3-header {
        top: 5px;
        margin-bottom: 11px;
        padding: 10px 11px;
        border-radius: 13px;
    }

    .game-v3-brand strong {
        max-width: 82vw;
        font-size: 0.88rem;
    }

    .game-v3-brand span {
        display: none;
    }

    .game-v3-nav {
        gap: 1px;
    }

    .game-v3-nav a {
        padding: 6px 7px;
        font-size: 0.75rem;
    }

    .game-v3-hero {
        padding: 34px 19px 30px;
        border-radius: 20px;
    }

    .game-v3-hero h1 {
        font-size: 2rem;
    }

    .game-v3-hero > p {
        font-size: 0.94rem;
    }

    .game-v3-hero-actions,
    .game-v3-card-actions {
        flex-direction: column;
    }

    .game-v3-action,
    .game-v3-card-actions button {
        width: 100%;
    }

    .game-v3-section {
        margin-top: 47px;
        scroll-margin-top: 116px;
    }

    .game-v3-section-heading-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .game-v3-section-heading h2 {
        font-size: 1.55rem;
    }

    .game-v3-update-chip {
        width: 100%;
    }

    .game-v3-primary-grid,
    .game-v3-feature-grid,
    .game-v3-tool-grid,
    .game-v3-link-grid {
        grid-template-columns: 1fr;
    }

    .game-v3-focus-card,
    .game-v3-primary-card,
    .game-v3-feature-card,
    .game-v3-tool-card,
    .game-v3-rules-card {
        padding: 18px;
    }

    .game-v3-card-top {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .game-v3-draw-meta,
    .game-v3-prize-summary {
        grid-template-columns: 1fr;
    }

    .game-v3-page .ball-row {
        gap: 5px;
    }

    .game-v3-page .ball {
        width: 35px;
        height: 35px;
        font-size: 0.84rem;
    }

    .game-v3-link-grid a {
        min-height: 0;
    }

    .game-v3-responsible {
        margin-top: 46px;
        padding: 20px 17px;
    }
}

@media (max-width: 390px) {
    .game-v3-smart-grid {
        grid-template-columns: 1fr;
    }

    .game-v3-page .ball {
        width: 32px;
        height: 32px;
        font-size: 0.78rem;
    }
}
/* ===== LOTTO_OBSERVER_LOTTERY_MAIN_PAGE_JOURNEY_V1_END ===== */


/* ===== LOTTO_OBSERVER_RECOMMENDATION_GUIDE_GAME_V3_START ===== */
.game-v3-guide-callout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 18px;
    padding: 20px 22px;
    border: 1px solid var(--game-accent-border);
    border-radius: 17px;
    background: color-mix(in srgb, var(--game-accent-soft) 74%, white);
}

.game-v3-guide-callout h3 {
    margin: 5px 0 4px;
    color: #0f172a;
    font-size: 1.02rem;
}

.game-v3-guide-callout p {
    margin: 0;
    color: #64748b;
    font-size: 0.84rem;
    line-height: 1.6;
}

.game-v3-guide-callout .game-v3-action {
    flex: 0 0 auto;
    margin: 0;
}

@media (max-width: 720px) {
    .game-v3-guide-callout {
        align-items: stretch;
        flex-direction: column;
        gap: 15px;
    }

    .game-v3-guide-callout .game-v3-action {
        width: 100%;
    }
}
/* ===== LOTTO_OBSERVER_RECOMMENDATION_GUIDE_GAME_V3_END ===== */

/* ===== LOTTO_OBSERVER_HOME_V13_FINAL_START ===== */
.home-final-page {
    --home-ink: #101214;
    --home-navy: #26384c;
    --home-muted: #6f8193;
    --home-soft-blue: #eef8ff;
    --home-line: #d5ebf8;
    --home-red: #dc3c32;
    --home-yellow: #f5c94e;
    --home-green: #4caf73;
    --home-orange: #f29a38;
    background: #fff;
    color: var(--home-ink);
}

.home-final-page .container {
    max-width: none;
}

.home-final-shell {
    width: min(100%, 980px);
    margin: 0 auto;
    background: #fff;
}

.home-final-header {
    padding: 26px 28px 20px;
    border-bottom: 1px solid #edf0f3;
}

.home-final-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #0b0d0f;
}

.home-final-brand strong {
    font-size: clamp(1.55rem, 3vw, 2rem);
    line-height: 1;
    letter-spacing: -0.02em;
}

.home-final-brand-dots {
    display: flex;
    gap: 7px;
}

.home-final-brand-dots i,
.menu-dot {
    display: inline-block;
    border-radius: 50%;
}

.home-final-brand-dots i {
    width: 17px;
    height: 17px;
}

.home-final-brand-dots .red,
.menu-dot.red { background: var(--home-red); }
.home-final-brand-dots .yellow,
.menu-dot.yellow { background: var(--home-yellow); }
.home-final-brand-dots .green,
.menu-dot.green { background: var(--home-green); }

.home-final-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 30px;
    margin-top: 24px;
}

.home-final-nav a {
    color: var(--home-navy);
    font-size: 1rem;
    font-weight: 800;
}

.home-final-main {
    padding: 0 28px 34px;
}

.home-final-hero {
    position: relative;
    margin-top: 26px;
    padding: 34px 30px 30px;
    border-radius: 26px;
    background: linear-gradient(120deg, #edf9ff 0%, #fffef4 55%, #fff3d9 100%);
}

.home-final-hero h1 {
    margin: 0;
    color: #0b0d0f;
    font-size: clamp(2rem, 5vw, 3rem);
    line-height: 1.32;
    letter-spacing: -0.035em;
}

.home-final-hero > p {
    max-width: 720px;
    margin: 18px 0 0;
    color: var(--home-muted);
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.75;
}

.home-final-hero-links {
    display: flex;
    flex-wrap: wrap;
    gap: 34px 50px;
    margin-top: 24px;
    align-items: flex-start;
}

.home-final-menu {
    position: relative;
}

.home-final-menu summary {
    width: max-content;
    list-style: none;
    cursor: pointer;
    padding-bottom: 2px;
    border-bottom: 1px solid #111;
    color: #111;
    font-weight: 850;
}

.home-final-menu summary::-webkit-details-marker {
    display: none;
}

.home-final-menu summary > span {
    display: block;
    height: 11px;
    margin-top: 1px;
    text-align: center;
    font-size: 18px;
    line-height: 8px;
}

.home-final-dropdown {
    position: absolute;
    top: 43px;
    left: -14px;
    z-index: 80;
    min-width: 218px;
    padding: 8px 9px;
    border: 1px solid #e6eaee;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(20, 38, 56, 0.18);
}

.home-final-menu-pick .home-final-dropdown {
    right: 0;
    left: auto;
    min-width: 230px;
    max-width: calc(100vw - 40px);
}

.home-final-dropdown a {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 8px;
    border-radius: 9px;
    color: var(--home-navy);
    font-size: 0.92rem;
    font-weight: 750;
}

.home-final-dropdown a:hover {
    background: #f5f7fa;
}

.menu-dot {
    width: 13px;
    height: 13px;
    flex: 0 0 13px;
}

.menu-symbol {
    width: 22px;
    flex: 0 0 22px;
    text-align: center;
    font-size: 20px;
    line-height: 1;
}

.menu-symbol.coral { color: #ff6557; }
.menu-symbol.gold { color: #f5b62d; }

.home-final-section {
    margin-top: 42px;
    scroll-margin-top: 24px;
}

.home-final-heading {
    margin-bottom: 16px;
}

.icon-heading {
    display: flex;
    align-items: center;
    gap: 14px;
}

.heading-icon {
    display: grid;
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    place-items: center;
    border-radius: 50%;
    color: #26384c;
    font-size: 23px;
    background: #fff0c8;
}

.heading-icon.pin { background: #fde8e8; }
.heading-icon.compare { background: #e5f5ec; }
.heading-icon.sparkle { background: #dff1ff; }

.home-final-heading h2,
.home-final-advanced-title h2 {
    margin: 0;
    color: #0a0c0e;
    font-size: clamp(1.65rem, 4vw, 2.2rem);
    line-height: 1.2;
    letter-spacing: -0.025em;
}

.home-final-heading p,
.home-final-subcopy {
    margin: 6px 0 0;
    color: var(--home-muted);
    font-weight: 700;
    line-height: 1.55;
}

.home-final-section-link {
    display: inline-block;
    margin: 0 0 18px;
    color: var(--home-navy);
    font-weight: 800;
}

.home-final-game-buttons {
    display: grid;
    gap: 12px;
}

.home-final-game-buttons a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 64px;
    padding: 16px 20px;
    border-radius: 18px;
    font-size: 1.1rem;
    font-weight: 850;
}

.home-final-game-buttons .power { background: #e52f2f; color: #fff; }
.home-final-game-buttons .super { background: #f3ce5e; color: #252525; }
.home-final-game-buttons .daily { background: #58ab77; color: #fff; }

.home-final-loading {
    padding: 24px;
    border-radius: 18px;
    background: var(--home-soft-blue);
    color: var(--home-muted);
    text-align: center;
    font-weight: 700;
}

.home-final-data-stack {
    display: grid;
    gap: 14px;
}

.home-final-data-card {
    padding: 22px;
    border: 1px solid #cde7f7;
    border-radius: 24px;
    background: var(--home-soft-blue);
}

.home-final-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.home-final-card-top h3 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    font-size: 1.3rem;
}

.home-final-card-top h3 i {
    width: 14px;
    height: 14px;
    border-radius: 50%;
}

.tone-power .home-final-card-top h3 i { background: var(--home-red); }
.tone-super .home-final-card-top h3 i { background: var(--home-yellow); }
.tone-daily .home-final-card-top h3 i { background: var(--home-green); }

.home-final-card-top > span {
    padding: 6px 11px;
    border-radius: 999px;
    background: #e5f3ff;
    color: var(--home-navy);
    font-size: 0.82rem;
    font-weight: 800;
}

.home-final-period {
    display: block;
    margin-top: 20px;
    color: #111;
    font-size: 1.05rem;
}

.home-final-date {
    margin: 8px 0 18px;
    color: var(--home-muted);
    font-weight: 700;
}

.home-final-data-card .ball-row {
    gap: 8px;
}

.home-final-data-card .ball {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    border: 0;
    box-shadow: none;
    font-size: 1rem;
}

.home-final-page .ball-red {
    background: var(--home-red);
    color: #fff;
}

.home-final-page .ball-yellow {
    background: var(--home-yellow);
    color: #282313;
}

.home-final-page .ball-green {
    background: var(--home-green);
    color: #fff;
}

.home-final-page .ball-orange {
    background: var(--home-orange);
    color: #fff;
}

.home-final-special {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
    color: var(--home-navy);
    font-weight: 800;
}

.home-final-special .ball-row {
    margin: 0;
}

.home-final-prize {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px 14px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid #cfe4f2;
    color: var(--home-navy);
}

.home-final-prize strong {
    text-align: right;
    color: #111;
}

.home-final-card-button {
    display: inline-flex;
    margin-top: 20px;
    padding: 11px 17px;
    border: 1px solid #c8ddeb;
    border-radius: 14px;
    background: #fff;
    color: var(--home-navy);
    font-weight: 850;
}

.home-final-primary .home-final-card-button {
    margin-top: 18px;
}

.home-final-compare-label {
    margin: 20px 0 8px;
    color: var(--home-navy);
    font-weight: 850;
}

.home-final-hit {
    margin-top: 18px;
    color: #111;
    font-weight: 800;
}

.home-final-hit strong {
    font-size: 1.2rem;
}

.home-final-empty {
    margin: 20px 0 0;
    color: var(--home-muted);
    font-weight: 700;
}

.home-final-subtitle {
    margin: 22px 0 4px;
    font-size: 1.45rem;
}

.home-final-tool-list {
    display: grid;
    margin-top: 16px;
}

.home-final-tool-row {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) 26px;
    gap: 13px;
    align-items: center;
    padding: 17px 0;
    border-bottom: 1px solid var(--home-line);
    color: var(--home-navy);
}

.home-final-tool-row .tool-icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 50%;
    font-size: 19px;
    font-weight: 900;
}

.tool-icon.quick { background: #fff0bd; }
.tool-icon.hot { background: #ffe2e2; }
.tool-icon.cold { background: #dff1ff; }
.tool-icon.smart { background: #e0f4e7; }

.home-final-tool-row strong,
.home-final-tool-row small {
    display: block;
}

.home-final-tool-row strong {
    color: #111;
    font-size: 1.02rem;
}

.home-final-tool-row small {
    margin-top: 3px;
    color: var(--home-muted);
    font-size: 0.9rem;
    font-weight: 700;
}

.home-final-tool-row b {
    font-size: 1.45rem;
}

.home-final-advanced-title {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.home-final-advanced-title > span {
    padding: 8px 14px;
    border-radius: 999px;
    background: #ffdede;
    color: var(--home-navy);
    font-size: 0.92rem;
    font-weight: 850;
}

.home-final-feature-card {
    margin-top: 14px;
    padding: 20px 18px;
    border: 1px solid #cde7f7;
    border-radius: 22px;
    background: var(--home-soft-blue);
}

.home-final-feature-main {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.feature-icon {
    display: grid;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 50%;
}

.feature-icon svg {
    width: 30px;
    height: 30px;
    fill: currentColor;
    stroke: currentColor;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.feature-icon.history { background: #dcefff; color: #2b82d9; }
.feature-icon.platform { background: #dff3df; color: #2fa74f; }
.feature-icon.dual { background: #fff0c9; color: #ed8d1a; }

.home-final-feature-main h3 {
    margin: 0 0 7px;
    color: #111;
    font-size: 1.25rem;
}

.home-final-feature-main p {
    margin: 0;
    color: var(--home-muted);
    font-weight: 700;
    line-height: 1.65;
}

.home-final-generate-menu {
    position: relative;
    margin-top: 16px;
}

.home-final-generate-menu summary {
    list-style: none;
    cursor: pointer;
    padding: 13px 16px;
    border: 1px solid #ffbf8d;
    border-radius: 15px;
    background: linear-gradient(115deg, #ffe6a6 0%, #ffc778 40%, #ff9a70 70%, #ff776a 100%);
    color: var(--home-navy);
    text-align: center;
    font-weight: 850;
}

.home-final-generate-menu summary::-webkit-details-marker {
    display: none;
}

.home-final-generate-menu > div {
    display: flex;
    gap: 8px;
    margin-top: 9px;
}

.home-final-generate-menu a {
    flex: 1;
    padding: 8px 9px;
    border: 1px solid #d9e2ea;
    border-radius: 10px;
    background: #fff;
    color: var(--home-navy);
    text-align: center;
    font-size: 0.82rem;
    font-weight: 800;
}

.home-final-trust-links {
    display: grid;
    gap: 15px;
    margin-top: 30px;
    padding: 22px 0;
    border-top: 1px solid var(--home-line);
    border-bottom: 1px solid var(--home-line);
}

.home-final-trust-links a {
    color: var(--home-navy);
    font-size: 1rem;
    font-weight: 800;
}

.home-final-page .site-footer {
    width: 100%;
    margin: 0;
    padding: 18px 22px 16px;
    background: #112f53;
}

.home-final-page .site-footer-inner {
    display: block;
    width: min(100%, 980px);
}

.home-final-page .site-footer-summary {
    display: none;
}

.home-final-page .site-footer-links {
    display: block;
}

.home-final-page .site-footer-links > div {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,0.12);
}

.home-final-page .site-footer-links strong {
    min-width: 78px;
    margin: 0;
    color: #f4f7fb;
    font-size: 0.92rem;
}

.home-final-page .site-footer-links a {
    color: #c8d6e6;
    font-size: 0.84rem;
}

.home-final-page .site-footer-links a + a::before {
    content: "|";
    margin-right: 10px;
    color: #7f94aa;
}

.home-final-page .site-footer-bottom {
    display: block;
    width: min(100%, 980px);
    margin-top: 0;
    padding-top: 13px;
    border: 0;
    color: #b9c9da;
    font-size: 0.74rem;
    line-height: 1.6;
    text-align: center;
}

#power-latest,
#super-latest,
#daily-latest,
#general-tools,
#advanced-tools,
#latest-section,
#recommend-section,
#comparison-section {
    scroll-margin-top: 24px;
}

@media (min-width: 760px) {
    .home-final-data-stack {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .home-final-compare-stack {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .home-final-game-buttons {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .home-final-header {
        padding: 24px 20px 18px;
    }

    .home-final-main {
        padding: 0 20px 28px;
    }

    .home-final-brand strong {
        font-size: 1.65rem;
    }

    .home-final-nav {
        gap: 17px 27px;
    }

    .home-final-nav a {
        font-size: 0.98rem;
    }

    .home-final-hero {
        padding: 28px 24px 26px;
        border-radius: 24px;
    }

    .home-final-hero h1 {
        font-size: 2rem;
    }

    .home-final-hero > p {
        font-size: 1rem;
    }

    .home-final-menu-pick .home-final-dropdown {
        right: 0;
        left: auto;
        max-width: calc(100vw - 34px);
    }

    .home-final-data-card {
        padding: 20px;
    }

    .home-final-data-card .ball {
        width: 42px;
        height: 42px;
        min-width: 42px;
        min-height: 42px;
    }

    .home-final-feature-main {
        grid-template-columns: 54px minmax(0, 1fr);
        gap: 12px;
    }

    .home-final-page .site-footer {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 390px) {
    .home-final-main,
    .home-final-header {
        padding-left: 16px;
        padding-right: 16px;
    }

    .home-final-nav {
        gap: 15px 23px;
    }

    .home-final-dropdown {
        max-width: calc(100vw - 28px);
    }

    .home-final-menu-pick .home-final-dropdown {
        right: -2px;
    }

    .home-final-data-card .ball {
        width: 39px;
        height: 39px;
        min-width: 39px;
        min-height: 39px;
        font-size: 0.92rem;
    }

    .home-final-page .site-footer-links > div {
        gap: 10px;
    }

    .home-final-page .site-footer-links strong {
        min-width: 74px;
    }

    .home-final-page .site-footer-links a {
        font-size: 0.78rem;
    }
}
/* ===== LOTTO_OBSERVER_HOME_V13_FINAL_END ===== */


/* ===== LOTTO_OBSERVER_HOME_V13_DESKTOP_REFINEMENT_START ===== */
.home-final-menu summary {
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.home-final-menu-label {
    display: inline-block;
    padding-bottom: 2px;
    border-bottom: 1px solid #111;
}

.home-final-menu-chevron {
    display: block;
    height: 11px;
    margin-top: 2px;
    text-align: center;
    font-size: 18px;
    line-height: 8px;
}

@media (min-width: 760px) {
    .home-final-shell {
        width: min(calc(100% - 32px), 1180px);
    }

    .home-final-header,
    .home-final-main {
        padding-left: 24px;
        padding-right: 24px;
    }

    .home-final-data-stack,
    .home-final-compare-stack {
        gap: 14px;
    }

    .home-final-data-card {
        padding: 18px;
    }

    .home-final-data-card .ball-row {
        flex-wrap: nowrap;
        gap: 7px;
    }

    .home-final-data-card .ball {
        width: 38px;
        height: 38px;
        min-width: 38px;
        min-height: 38px;
        font-size: 0.92rem;
    }

    .home-final-special .ball-row {
        flex-wrap: nowrap;
    }

    .home-final-page .site-footer-inner,
    .home-final-page .site-footer-bottom {
        width: min(calc(100% - 32px), 1180px);
    }

    .home-final-page .site-footer-links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 30px;
        row-gap: 0;
    }

    .home-final-page .site-footer-links > div {
        min-width: 0;
        padding: 9px 0;
    }

    .home-final-page .site-footer-bottom {
        padding-top: 10px;
    }
}

@media (min-width: 1240px) {
    .home-final-page .site-footer-links {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        column-gap: 22px;
    }

    .home-final-page .site-footer-links > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
        border-bottom: 0;
    }

    .home-final-page .site-footer-links strong {
        min-width: 0;
    }

    .home-final-page .site-footer-links a + a::before {
        content: none;
    }
}

@media (max-width: 759px) {
    .home-final-data-card .ball-row {
        flex-wrap: wrap;
    }

    .home-final-page .site-footer-links {
        display: block;
    }
}
/* ===== LOTTO_OBSERVER_HOME_V13_DESKTOP_REFINEMENT_END ===== */


/* ===== LOTTO_OBSERVER_HOME_V13_FOOTER_SINGLE_ROW_START ===== */

/* Desktop/tablet footer:
   all three groups on one row, copyright alone on next row */
@media (min-width: 760px) {
    .home-final-page .site-footer-links {
        display: flex !important;
        align-items: center;
        justify-content: center;
        gap: 34px;
        flex-wrap: nowrap;
    }

    .home-final-page .site-footer-links > div {
        display: flex !important;
        align-items: center;
        gap: 10px;
        flex-direction: row !important;
        flex-wrap: nowrap;
        padding: 8px 0;
        border-bottom: 0 !important;
        white-space: nowrap;
    }

    .home-final-page .site-footer-links strong {
        min-width: 0 !important;
        margin: 0;
        white-space: nowrap;
    }

    .home-final-page .site-footer-links a {
        white-space: nowrap;
    }

    .home-final-page .site-footer-bottom {
        display: block;
        margin-top: 6px;
        padding-top: 10px;
        border-top: 1px solid rgba(255,255,255,0.12);
        text-align: center;
    }
}

/* If the viewport is narrower, allow the footer groups to wrap safely */
@media (min-width: 760px) and (max-width: 980px) {
    .home-final-page .site-footer-links {
        gap: 18px;
        flex-wrap: wrap;
    }
}

/* ===== LOTTO_OBSERVER_HOME_V13_FOOTER_SINGLE_ROW_END ===== */


/* ===== LOTTO_OBSERVER_HOME_V13_DETAIL_REFINEMENT_START ===== */

/* Hero text links: give the underline breathing room below the glyphs. */
.home-final-menu-label {
    padding-bottom: 5px !important;
    line-height: 1.15;
}

/* Desktop: shift both dropdown panels slightly to the right.
   Mobile keeps the previously approved safe-edge positioning. */
@media (min-width: 760px) {
    .home-final-menu:first-child .home-final-dropdown,
    .home-final-menu-pick .home-final-dropdown {
        left: 0 !important;
        right: auto !important;
    }
}

/* Footer: restore separators between the individual text links,
   while keeping the three groups on a single desktop row. */
@media (min-width: 760px) {
    .home-final-page .site-footer-links a + a::before {
        content: "|" !important;
        display: inline-block;
        margin: 0 9px 0 2px;
        color: #7f94aa;
    }
}

/* ===== LOTTO_OBSERVER_HOME_V13_DETAIL_REFINEMENT_END ===== */


/* ===== LOTTO_OBSERVER_HOME_V13_HERO_UNDERLINE_FIX_START ===== */

/* Use a true text underline instead of a bottom border, so the line
   never cuts into Chinese glyphs even when font metrics differ. */
.home-final-menu-label {
    display: inline-block !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
    text-decoration-line: underline !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 5px !important;
    text-decoration-skip-ink: auto !important;
}

.home-final-menu summary {
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Keep the chevron visually separate from the underline. */
.home-final-menu-chevron {
    margin-top: 7px !important;
}

/* ===== LOTTO_OBSERVER_HOME_V13_HERO_UNDERLINE_FIX_END ===== */
\n\n/* ===== LOTTO_OBSERVER_SHARED_LOTTERY_CHROME_V1_START =====
   Shared header/footer contract for PowerLotto, SuperLotto and Daily539.
   Game-page layout/tool rules remain page-specific by design. */
.lotto-main-header-shell {
    width: min(1180px, calc(100% - 40px)) !important;
    margin: 0 auto !important;
}
.lotto-main-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 68px !important;
    gap: 24px !important;
    background: #fff !important;
}
.lotto-main-brand {
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
    flex-shrink: 0 !important;
    color: #111827 !important;
    text-decoration: none !important;
}
.lotto-main-dots { display: inline-flex !important; gap: 5px !important; flex-shrink: 0 !important; }
.lotto-main-dot { width: 10px !important; height: 10px !important; border-radius: 50% !important; }
.lotto-main-dot.red { background: #dc3c32 !important; }
.lotto-main-dot.yellow { background: #f4b62b !important; }
.lotto-main-dot.green { background: #49a94d !important; }
.lotto-main-brand-copy { display: flex !important; flex-direction: column !important; line-height: 1.15 !important; }
.lotto-main-brand-copy strong { font-size: 1.08rem !important; font-weight: 900 !important; white-space: nowrap !important; }
.lotto-main-brand-copy small { margin-top: 3px !important; color: #64748b !important; font-size: .72rem !important; font-weight: 700 !important; white-space: nowrap !important; }
.lotto-main-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 27px !important;
    min-width: 0 !important;
    font-size: .9rem !important;
    font-weight: 800 !important;
}
.lotto-main-nav a { text-decoration: none !important; white-space: nowrap !important; }
.lotto-theme-power .lotto-main-nav a:hover { color: #d3183e !important; }
.lotto-theme-super .lotto-main-nav a:hover { color: #c98a00 !important; }
.lotto-theme-daily .lotto-main-nav a:hover { color: #21834f !important; }

.lotto-main-footer { margin-top: 16px !important; padding: 22px 0 12px !important; background: #0d1b2d !important; color: #c6d1df !important; }
.lotto-main-footer-inner, .lotto-main-footer-bottom { width: min(1180px, calc(100% - 48px)) !important; margin-left: auto !important; margin-right: auto !important; }
.lotto-main-footer-inner { display: grid !important; grid-template-columns: minmax(360px,1.15fr) minmax(560px,.95fr) !important; column-gap: 64px !important; align-items: start !important; }
.lotto-main-footer-summary strong { display: block !important; color: #fff !important; font-size: .95rem !important; font-weight: 900 !important; }
.lotto-main-footer-summary p { max-width: 560px !important; margin: 6px 0 0 !important; color: #aebccd !important; font-size: .78rem !important; line-height: 1.65 !important; }
.lotto-main-footer-links { display: grid !important; grid-template-columns: repeat(3,max-content) !important; justify-content: space-between !important; gap: 24px !important; }
.lotto-main-footer-links strong { display: block !important; margin-bottom: 5px !important; color: #fff !important; font-size: .76rem !important; font-weight: 900 !important; }
.lotto-main-footer-links span { display: flex !important; flex-wrap: nowrap !important; white-space: nowrap !important; }
.lotto-main-footer-links a { color: #bdc9d8 !important; font-size: .72rem !important; text-decoration: none !important; white-space: nowrap !important; }
.lotto-main-footer-links a + a::before { content: "|" !important; display: inline-block !important; margin: 0 7px !important; color: #61738a !important; }
.lotto-main-footer-bottom { display: flex !important; justify-content: space-between !important; gap: 12px !important; margin-top: 14px !important; padding-top: 10px !important; border-top: 1px solid #26384d !important; color: #8ea0b5 !important; font-size: .67rem !important; }

@media (max-width: 980px) {
    .lotto-main-nav { gap: 15px !important; font-size: .82rem !important; }
}
@media (max-width: 720px) {
    .lotto-main-header-shell { width: min(calc(100% - 24px),1180px) !important; }
    .lotto-main-header { min-height: auto !important; padding: 12px 0 !important; align-items: flex-start !important; }
    .lotto-main-brand-copy small { display: none !important; }
    .lotto-main-nav { gap: 10px !important; flex-wrap: wrap !important; justify-content: flex-end !important; font-size: .72rem !important; }
}
@media (max-width: 480px) {
    .lotto-main-header { flex-direction: column !important; gap: 10px !important; }
    .lotto-main-nav { width: 100% !important; justify-content: flex-start !important; }
}
@media (max-width: 1050px) {
    .lotto-main-footer-inner { grid-template-columns: 1fr !important; row-gap: 18px !important; }
    .lotto-main-footer-links { justify-content: start !important; gap: 38px !important; }
}
@media (max-width: 620px) {
    .lotto-main-footer { padding: 22px 0 14px !important; }
    .lotto-main-footer-inner, .lotto-main-footer-bottom { width: calc(100% - 36px) !important; }
    .lotto-main-footer-summary p { max-width: none !important; font-size: .76rem !important; }
    .lotto-main-footer-links { grid-template-columns: 1fr !important; justify-content: stretch !important; gap: 16px !important; }
    .lotto-main-footer-links span { flex-wrap: nowrap !important; }
    .lotto-main-footer-bottom { flex-direction: column !important; gap: 5px !important; }
}
/* ===== LOTTO_OBSERVER_SHARED_LOTTERY_CHROME_V1_END ===== */

/* ===== LOTTO_OBSERVER_FOOTER_UNIFIED_V3_START =====
   Homepage + three lottery main pages footer refinement.
   Keep mobile navigation groups on one row and restore homepage summary.
*/
.home-final-page .site-footer-summary {
    display: block !important;
    width: min(100%, 980px) !important;
    margin: 0 auto 10px !important;
}

.home-final-page .site-footer-summary strong {
    display: block !important;
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 0.95rem !important;
    font-weight: 900 !important;
}

.home-final-page .site-footer-summary p {
    max-width: none !important;
    margin: 6px 0 0 !important;
    color: #aebdd0 !important;
    font-size: 0.76rem !important;
    line-height: 1.65 !important;
    text-align: left !important;
}

@media (max-width: 759px) {
    .home-final-page .site-footer-links > div {
        display: flex !important;
        align-items: center !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 0 !important;
        white-space: nowrap !important;
    }

    .home-final-page .site-footer-links strong {
        min-width: 68px !important;
        flex: 0 0 68px !important;
        margin: 0 8px 0 0 !important;
        font-size: 0.82rem !important;
        white-space: nowrap !important;
    }

    .home-final-page .site-footer-links a {
        flex: 0 0 auto !important;
        font-size: 0.74rem !important;
        white-space: nowrap !important;
    }

    .home-final-page .site-footer-links a + a::before {
        content: "|" !important;
        display: inline-block !important;
        margin: 0 5px !important;
        color: #7f94aa !important;
    }

    /* Visual order: responsible play | terms | privacy. */
    .home-final-page .site-footer-links > div:nth-child(2) > strong { order: 0; }
    .home-final-page .site-footer-links > div:nth-child(2) > a[href="/tw/responsible-play"] { order: 1; }
    .home-final-page .site-footer-links > div:nth-child(2) > a[href="/tw/terms"] { order: 2; }
    .home-final-page .site-footer-links > div:nth-child(2) > a[href="/tw/privacy"] { order: 3; }

    .home-final-page .site-footer-bottom {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 0 8px !important;
    }

    .home-final-page .site-footer-bottom span {
        white-space: nowrap !important;
    }
}

@media (max-width: 620px) {
    .lotto-main-footer .lotto-main-footer-links {
        grid-template-columns: 1fr !important;
        justify-content: stretch !important;
        gap: 12px !important;
    }

    .lotto-main-footer .lotto-main-footer-links > div {
        display: flex !important;
        align-items: center !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 0 !important;
        white-space: nowrap !important;
    }

    .lotto-main-footer .lotto-main-footer-links > div > strong {
        display: block !important;
        min-width: 68px !important;
        flex: 0 0 68px !important;
        margin: 0 8px 0 0 !important;
        font-size: 0.76rem !important;
        white-space: nowrap !important;
    }

    .lotto-main-footer .lotto-main-footer-links > div > span {
        display: flex !important;
        align-items: center !important;
        flex: 0 0 auto !important;
        flex-wrap: nowrap !important;
        min-width: 0 !important;
        white-space: nowrap !important;
    }

    .lotto-main-footer .lotto-main-footer-links a {
        flex: 0 0 auto !important;
        font-size: 0.70rem !important;
        white-space: nowrap !important;
    }

    .lotto-main-footer .lotto-main-footer-links a + a::before {
        content: "|" !important;
        display: inline-block !important;
        margin: 0 5px !important;
    }

    /* Visual order: responsible play | terms | privacy. */
    .lotto-main-footer .lotto-main-footer-links > div:nth-child(2) > span > a[href="/tw/responsible-play"] { order: 1; }
    .lotto-main-footer .lotto-main-footer-links > div:nth-child(2) > span > a[href="/tw/terms"] { order: 2; }
    .lotto-main-footer .lotto-main-footer-links > div:nth-child(2) > span > a[href="/tw/privacy"] { order: 3; }

    .lotto-main-footer .lotto-main-footer-bottom {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        gap: 0 8px !important;
    }

    .lotto-main-footer .lotto-main-footer-bottom span {
        white-space: nowrap !important;
    }
}

@media (max-width: 390px) {
    .home-final-page .site-footer {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .home-final-page .site-footer-links strong,
    .lotto-main-footer .lotto-main-footer-links > div > strong {
        min-width: 64px !important;
        flex-basis: 64px !important;
        margin-right: 6px !important;
    }

    .home-final-page .site-footer-links a { font-size: 0.70rem !important; }
    .lotto-main-footer .lotto-main-footer-links a { font-size: 0.67rem !important; }

    .home-final-page .site-footer-links a + a::before,
    .lotto-main-footer .lotto-main-footer-links a + a::before {
        margin-left: 4px !important;
        margin-right: 4px !important;
    }

    .lotto-main-footer .lotto-main-footer-inner,
    .lotto-main-footer .lotto-main-footer-bottom {
        width: calc(100% - 28px) !important;
    }
}
/* ===== LOTTO_OBSERVER_FOOTER_UNIFIED_V3_END ===== */


/* ===== LOTTO_OBSERVER_FOOTER_FINAL_V4_START ===== */
@media (max-width: 620px) {
    .lotto-main-footer .lotto-main-footer-bottom {
        justify-content: center !important;
        align-items: center !important;
        gap: 0 8px !important;
    }
}
/* ===== LOTTO_OBSERVER_FOOTER_FINAL_V4_END ===== */

/* ===== LOTTO_OBSERVER_HOME_DESKTOP_FOOTER_V5_START ===== */
/* Desktop homepage footer: match the approved lottery main-page layout. */
@media (min-width: 760px) {
    .home-final-page .site-footer {
        padding: 22px 0 12px !important;
    }

    .home-final-page .site-footer-inner,
    .home-final-page .site-footer-bottom {
        width: min(1180px, calc(100% - 48px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .home-final-page .site-footer-inner {
        display: grid !important;
        grid-template-columns: minmax(360px, 1.15fr) minmax(560px, .95fr) !important;
        column-gap: 64px !important;
        align-items: start !important;
    }

    .home-final-page .site-footer-summary {
        display: block !important;
        width: auto !important;
        margin: 0 !important;
    }

    .home-final-page .site-footer-summary strong {
        display: block !important;
        color: #fff !important;
        font-size: .95rem !important;
        font-weight: 900 !important;
    }

    .home-final-page .site-footer-summary p {
        max-width: 560px !important;
        margin: 6px 0 0 !important;
        color: #aebccd !important;
        font-size: .78rem !important;
        line-height: 1.65 !important;
    }

    .home-final-page .site-footer-links {
        display: grid !important;
        grid-template-columns: repeat(3, max-content) !important;
        justify-content: space-between !important;
        gap: 24px !important;
        flex-wrap: nowrap !important;
    }

    .home-final-page .site-footer-links > div {
        display: block !important;
        padding: 0 !important;
        border-bottom: 0 !important;
        white-space: nowrap !important;
    }

    .home-final-page .site-footer-links strong {
        display: block !important;
        margin: 0 0 5px !important;
        color: #fff !important;
        font-size: .76rem !important;
        font-weight: 900 !important;
    }

    .home-final-page .site-footer-links a {
        font-size: .72rem !important;
        white-space: nowrap !important;
    }

    .home-final-page .site-footer-links a + a::before {
        margin: 0 7px !important;
    }

    .home-final-page .site-footer-bottom {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 12px !important;
        margin-top: 14px !important;
        padding-top: 10px !important;
        border-top: 1px solid #26384d !important;
        text-align: left !important;
        font-size: .67rem !important;
    }
}

/* Same intermediate-width behavior as the lottery main pages. */
@media (min-width: 760px) and (max-width: 1050px) {
    .home-final-page .site-footer-inner {
        grid-template-columns: 1fr !important;
        row-gap: 18px !important;
    }

    .home-final-page .site-footer-links {
        justify-content: start !important;
        gap: 38px !important;
    }
}
/* ===== LOTTO_OBSERVER_HOME_DESKTOP_FOOTER_V5_END ===== */
