[x-cloak] { display: none !important; }

.mt-panel { background: #fff; border-radius: 1.5rem; box-shadow: 0 10px 40px rgba(61, 50, 1, .10); border: 1px solid #f0e6c6; }
.mt-panel-body { padding: 1rem .75rem 1.25rem; }

/* Header + date filter */
.mt-head { position: relative; display: flex; flex-direction: column; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.25rem 1rem; background: radial-gradient(circle at 85% -40%, rgba(236, 191, 3, .35), transparent 55%), linear-gradient(135deg, #3d3201 0%, #161200 100%); border-radius: 1.5rem 1.5rem 0 0; z-index: 5; }
.mt-head::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, #8b7002, #ecbf03, #b19002); }
.mt-head-kicker { display: inline-flex; align-items: center; gap: .375rem; color: #ecbf03; font-size: .6875rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.mt-head-title { color: #fff; font-size: 1.5rem; font-weight: 700; text-align: center; line-height: 1.2; margin-top: .25rem; }
.mt-head-date { color: rgba(254, 244, 200, .75); font-size: .875rem; text-align: center; margin-top: .25rem; }
.mt-dates { display: flex; align-items: center; gap: .375rem; }
.mt-date { position: relative; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 3rem; padding: .5rem 0; border-radius: 1rem; background: rgba(255, 255, 255, .08); border: 1px solid rgba(236, 191, 3, .25); color: #fef4c8; transition: all .25s; text-decoration: none; }
.mt-date:hover { background: rgba(236, 191, 3, .2); border-color: #ecbf03; color: #fff; }
.mt-date.active { background: linear-gradient(180deg, #ecbf03, #b19002); border-color: #ecbf03; color: #161200; box-shadow: 0 6px 18px rgba(236, 191, 3, .35); }
.mt-date-month { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; line-height: 1; opacity: .85; }
.mt-date-day { font-size: .9375rem; font-weight: 800; line-height: 1; margin-top: .25rem; }
.mt-date-today { position: absolute; top: -6px; left: 50%; transform: translateX(-50%); background: #16A060; color: #fff; font-size: 8px; font-weight: 700; padding: 1px 5px; border-radius: 9999px; letter-spacing: .05em; text-transform: uppercase; }
.mt-cal { position: relative; flex-shrink: 0; width: 2.75rem; height: 2.75rem; display: flex; align-items: center; justify-content: center; border-radius: 1rem; border: 2px dashed rgba(236, 191, 3, .45); color: #ecbf03; transition: all .25s; cursor: pointer; }
.mt-cal:hover { border-color: #ecbf03; background: rgba(236, 191, 3, .12); }
.mt-cal input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.mt-cal input::-webkit-calendar-picker-indicator { position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; }

/* Summary chips */
.mt-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-bottom: 1.25rem; }
.mt-stat { display: flex; align-items: center; gap: .625rem; background: #fbf6e4; border: 1px solid #f0e6c6; border-radius: 1rem; padding: .625rem .75rem; min-width: 0; }
.mt-stat-icon { width: 2rem; height: 2rem; border-radius: .75rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: linear-gradient(180deg, #ecbf03, #b19002); color: #161200; font-size: .8125rem; }
.mt-stat-icon.green { background: linear-gradient(180deg, #16A060, #065540); color: #fff; }
.mt-stat-label { color: #8b7002; font-size: .625rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.mt-stat-value { color: #161200; font-size: .9375rem; font-weight: 800; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mt-stat-value small { color: #737373; font-weight: 600; font-size: .6875rem; }

/* League groups */
.mt-wrap { display: flex; flex-direction: column; gap: .625rem; }
.mt-league { display: flex; align-items: center; gap: .5rem; padding: .5rem .75rem; background: linear-gradient(90deg, #f5ecdb, #fffdf6); border-radius: .875rem; border-left: 4px solid #b19002; font-size: .8125rem; }
.mt-league-info { display: flex; align-items: center; gap: .625rem; min-width: 0; width: 100%; }
.mt-league-logo { width: 1.75rem; height: 1.75rem; border-radius: 9999px; background: #fff; border: 1px solid #ead9a5; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.mt-league-logo img { width: 1.125rem; height: 1.125rem; object-fit: contain; }
.mt-league-text { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mt-league-country { color: #3d3201; font-weight: 700; }
.mt-league-sep { color: #b19002; margin: 0 .25rem; }
.mt-league-name { color: #8b7002; font-weight: 500; }
.mt-league-count { flex-shrink: 0; background: #3d3201; color: #ecbf03; font-size: .625rem; font-weight: 700; padding: .25rem .5rem; border-radius: 9999px; letter-spacing: .03em; }

/* Match card */
.mt-card { position: relative; display: block; background: #fff; border: 1px solid #D9D9D9; border-radius: 1rem; padding: .375rem; cursor: pointer; transition: border-color .2s, box-shadow .2s; }
.mt-card:hover { border-color: #b19002; box-shadow: 0 6px 18px rgba(177, 144, 2, .15); }
.mt-card.is-top { border-color: #ecbf03; }
.mt-badge-top { position: absolute; top: -9px; left: 14px; display: inline-flex; align-items: center; gap: .25rem; background: linear-gradient(90deg, #b19002, #ecbf03); color: #161200; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 2px 8px; border-radius: 9999px; box-shadow: 0 3px 8px rgba(177, 144, 2, .35); z-index: 1; }
.mt-row { display: grid; align-items: center; gap: .75rem; }

.mt-teams { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .5rem; align-items: center; font-size: .75rem; }
.mt-team { grid-column: span 3 / span 3; display: flex; align-items: center; gap: .375rem; min-width: 0; }
.mt-team-home { justify-content: flex-end; }
.mt-team-info { display: flex; flex-direction: column; min-width: 0; }
.mt-team-home .mt-team-info { align-items: flex-end; }
.mt-team-away .mt-team-info { align-items: flex-start; }
.mt-team-name { color: #1E1E1E; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.mt-team-home .mt-team-name { text-align: right; }
.mt-team-logo { width: 1.5rem; height: 1.5rem; flex-shrink: 0; object-fit: contain; }

.mt-form { display: flex; align-items: center; gap: .25rem; margin-top: .125rem; }
.mt-form-dot { width: .875rem; height: .875rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.mt-form-dot svg { width: .625rem; height: .625rem; }
.mt-form-w { background: #14AE5C; }
.mt-form-d { background: #E5A000; }
.mt-form-l { background: #EC221F; }

.mt-center { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 1px; }
.mt-time { color: #1E1E1E; font-size: .75rem; font-weight: 600; white-space: nowrap; }
.mt-score { color: #1E1E1E; font-size: .8125rem; font-weight: 800; white-space: nowrap; }
.mt-score.is-live { color: #ea0f0f; }
.mt-status { color: #8b7002; font-size: .5625rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.mt-live { display: inline-flex; align-items: center; gap: 3px; color: #ea0f0f; font-size: .5625rem; font-weight: 800; letter-spacing: .08em; }
.mt-live::before { content: ""; width: 6px; height: 6px; border-radius: 9999px; background: #ea0f0f; animation: mt-pulse 1.2s infinite; }
@keyframes mt-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.7); } }

/* Probability % | Ad | Tip + Odds */
.mt-meta { display: flex; justify-content: space-between; align-items: center; gap: .75rem; background: #E6E6E6; padding: .5rem; border-radius: .75rem; }
.mt-prob { display: flex; align-items: center; gap: .375rem; width: 100%; min-width: 0; }
.mt-prob-track { height: .375rem; border-radius: 9999px; background: rgba(30, 30, 30, .15); overflow: hidden; width: 100%; }
.mt-prob-fill { height: 100%; border-radius: 9999px; }
.mt-prob-value { font-weight: 600; font-size: .875rem; white-space: nowrap; }
.mt-bet { display: flex; justify-content: center; align-items: center; width: 100%; min-height: 1.5rem; }
.mt-bet a { display: flex; justify-content: center; align-items: center; }
.mt-bet img { width: 4rem; max-height: 2rem; object-fit: contain; }
.mt-tip { display: flex; align-items: center; justify-content: center; gap: .375rem; width: 100%; color: #fff; font-weight: 600; font-size: .75rem; border-radius: .75rem; padding: .5rem .75rem; white-space: nowrap; }
.mt-tip.is-pending { background: linear-gradient(135deg, #ecbf03, #b19002); color: #161200; }
.mt-tip.is-won { background: #14AE5C; }
.mt-tip.is-lost { background: #9CA3AF; }
.mt-tip i { font-size: .6875rem; }
.mt-tip-odd { background: rgba(0, 0, 0, .18); padding: .0625rem .375rem; border-radius: .375rem; font-weight: 700; font-size: .6875rem; }
.mt-tip.is-pending .mt-tip-odd { background: rgba(255, 255, 255, .45); }

/* Calendar popup */
.mt-calwrap { position: relative; flex-shrink: 0; }
.mt-calpop { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 30; width: 16rem; max-width: 90vw; background: #fff; border-radius: 1rem; box-shadow: 0 20px 40px rgba(22, 18, 0, .25); border: 1px solid #f0e6c6; padding: .75rem; }
.mt-calpop-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; color: #161200; font-size: .875rem; font-weight: 700; }
.mt-calpop-nav button { width: 1.75rem; height: 1.75rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; color: #3d3201; }
.mt-calpop-nav button:hover:not(:disabled) { background: #fbf6e4; color: #b19002; }
.mt-calpop-nav button:disabled { opacity: .3; cursor: not-allowed; }
.mt-calpop-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .25rem; }
.mt-calpop-week { margin-bottom: .25rem; }
.mt-calpop-week span { text-align: center; color: #b5a66a; font-size: 10px; font-weight: 700; }
.mt-calpop-day { width: 2rem; height: 2rem; margin: auto; border-radius: 9999px; display: flex; align-items: center; justify-content: center; font-size: .75rem; color: #161200; transition: background-color .15s; }
.mt-calpop-day:hover:not(:disabled) { background: #fbf6e4; color: #b19002; }
.mt-calpop-day.is-empty { visibility: hidden; }
.mt-calpop-day.is-today { box-shadow: inset 0 0 0 1px #b19002; }
.mt-calpop-day.is-selected { background: linear-gradient(180deg, #ecbf03, #b19002); color: #161200; font-weight: 800; box-shadow: none; }
.mt-calpop-day.is-disabled { color: #e3dcc4; cursor: not-allowed; }
.mt-calpop-quick { display: flex; gap: .375rem; margin-top: .75rem; padding-top: .5rem; border-top: 1px solid #f0e6c6; }
.mt-calpop-quick button { flex: 1; font-size: 11px; font-weight: 600; padding: .375rem 0; border-radius: .5rem; background: #fbf6e4; color: #3d3201; transition: all .15s; }
.mt-calpop-quick button:hover { background: #b19002; color: #fff; }
.mt-calpop-quick button.active { background: #3d3201; color: #ecbf03; }

/* Loading states */
.mt-panel-body { transition: opacity .2s; }
.mt-panel-body.mt-loading { opacity: .45; pointer-events: none; }
.mt-date-spinner { display: none; position: absolute; inset: 0; margin: auto; width: 1rem; height: 1rem; border-radius: 9999px; border: 2px solid currentColor; border-top-color: transparent; animation: mt-spin .7s linear infinite; }
.mt-date.is-loading, .mt-cal.is-loading { pointer-events: none; }
.mt-date.is-loading .mt-date-spinner, .mt-cal.is-loading .mt-date-spinner { display: block; }
.mt-date.is-loading .mt-date-month, .mt-date.is-loading .mt-date-day, .mt-cal.is-loading i { visibility: hidden; }
@keyframes mt-spin { to { transform: rotate(360deg); } }

/* Legend + empty state */
.mt-legend { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .75rem 1rem; margin-top: 1.25rem; padding-top: 1rem; border-top: 1px dashed #ead9a5; color: #737373; font-size: .6875rem; font-weight: 600; }
.mt-legend span { display: inline-flex; align-items: center; gap: .3rem; }
.mt-legend .mt-form-dot { width: .75rem; height: .75rem; }
.mt-empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .5rem; padding: 2.5rem 1rem; background: #fbf6e4; border: 1px dashed #d9c27a; border-radius: 1rem; }
.mt-empty-icon { width: 3rem; height: 3rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; background: linear-gradient(180deg, #ecbf03, #b19002); color: #161200; font-size: 1.25rem; }
.mt-empty-title { color: #3d3201; font-weight: 800; font-size: .9375rem; }
.mt-empty-text { color: #8b7002; font-size: .8125rem; }

@media (min-width: 1024px) {
    .mt-panel-body { padding: 1.5rem 1.75rem 1.75rem; }
    .mt-head { flex-direction: row; padding: 1.5rem 1.75rem; }
    .mt-head-title, .mt-head-date { text-align: left; }
    .mt-head-title { font-size: 1.875rem; }
    .mt-head-date { font-size: 1rem; }
    .mt-dates { gap: .5rem; }
    .mt-date { width: 4rem; padding: .625rem 0; }
    .mt-date-day { font-size: 1.0625rem; }
    .mt-cal { width: 54px; height: 54px; }
    .mt-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
    .mt-league { font-size: .875rem; padding: .5rem .875rem; }
    .mt-card { padding: .5rem; }
    .mt-row { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .5rem; }
    .mt-teams { grid-column: span 4 / span 4; gap: 1rem; font-size: .875rem; }
    .mt-meta { grid-column: span 3 / span 3; padding: .5rem .625rem; }
    .mt-team-logo { width: 2rem; height: 2rem; }
    .mt-form-dot { width: 1rem; height: 1rem; }
}

/* Compact hero */
.ep-hero > div:first-child { min-height: 0 !important; }
.ep-hero > div:first-child > div { padding-top: 1.75rem !important; padding-bottom: 1.75rem !important; }
.ep-hero h1 { font-size: 1.625rem; line-height: 2rem; }
.ep-hero h1 + p { font-size: 1rem; }
@media (min-width: 1024px) {
    .ep-hero > div:first-child > div { padding-top: 2.75rem !important; padding-bottom: 2.75rem !important; }
    .ep-hero h1 { font-size: 2rem; line-height: 2.5rem; }
}

/* Live match state */
.mt-center.is-live { background: #fff1f1; border: 1px solid #ffd2d2; border-radius: .625rem; padding: .25rem .5rem; animation: mt-live-glow 1.6s ease-in-out infinite; }
.mt-center.is-live .mt-score { font-size: .9375rem; }
.mt-live { font-size: .625rem; }
.mt-status.is-off { color: #9CA3AF; }
@keyframes mt-live-glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(234, 15, 15, .25); } 50% { box-shadow: 0 0 0 5px rgba(234, 15, 15, 0); } }

/* Recent winnings */
.mt-win-all { flex-shrink: 0; display: inline-flex; align-items: center; gap: .375rem; color: #ecbf03; font-size: .75rem; font-weight: 700; padding: .5rem .875rem; border: 1px solid rgba(236, 191, 3, .45); border-radius: 9999px; transition: background .2s; }
.mt-win-all:hover { background: rgba(236, 191, 3, .15); }
.mt-win { border-left: 3px solid #14AE5C; }
.mt-win:hover { border-color: #14AE5C; }
.mt-win-meta { grid-template-columns: 1fr auto; }
.mt-win-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mt-win-date { color: #3d3201; font-size: .6875rem; font-weight: 700; }
.mt-win-date i { color: #b19002; margin-right: 2px; }
.mt-win-league { display: flex; align-items: center; gap: .25rem; color: #6b6b6b; font-size: .6875rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mt-win-league img { width: 14px; height: 14px; object-fit: contain; flex-shrink: 0; }
.mt-win .mt-tip { width: auto; flex: 0 0 auto; min-width: 7.5rem; }
.mt-win-info { flex: 1 1 auto; }
.mt-win-date { white-space: nowrap; }

/* Compact panel headers */
.mt-head { padding: .75rem 1rem; gap: .625rem; border-radius: 1.25rem 1.25rem 0 0; }
.mt-head-title { font-size: 1.125rem; margin-top: 0; }
.mt-head-date { font-size: .75rem; margin-top: .125rem; }
.mt-date { width: 2.75rem; padding: .375rem 0; border-radius: .75rem; }
.mt-date-day { font-size: .875rem; margin-top: .125rem; }
.mt-cal { width: 2.25rem; height: 2.25rem; border-radius: .75rem; }
@media (min-width: 1024px) {
    .mt-head { padding: .875rem 1.5rem; }
    .mt-head-title { font-size: 1.375rem; }
    .mt-head-date { font-size: .8125rem; }
    .mt-date { width: 3.25rem; padding: .375rem 0; }
    .mt-date-day { font-size: .9375rem; }
    .mt-cal { width: 42px; height: 42px; }
}

/* Sport switcher */
.sport-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.sport-nav-item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; white-space: nowrap; border-radius: 11px; padding: 9px 5px; background: #fbf1c4; border: 1px solid rgba(177, 144, 2, .28); color: #1e1e1e; text-decoration: none; transition: background-color .2s ease, box-shadow .2s ease; }
.sport-nav-item:hover { background: #ecbf03; color: #1e1e1e; }
.sport-nav-item.is-active { background: #ecbf03; border-color: #b19002; box-shadow: 0 6px 16px -8px rgba(177, 144, 2, .8); }
.sport-nav-icon { width: 15px; height: 15px; flex-shrink: 0; }
.sport-nav-label { font-size: 11px; font-weight: 600; letter-spacing: .15px; }
@media (min-width: 768px) {
    .sport-nav { display: flex; align-items: flex-start; gap: 10px; overflow-x: auto; }
    .sport-nav-item { flex: 1 1 0; min-width: 160px; flex-direction: row; border-radius: 17px; padding: 15px; gap: 8px; }
    .sport-nav-icon { width: 24px; height: 24px; }
    .sport-nav-label { font-size: 17px; letter-spacing: .23px; }
}

/* Date pills rendered as buttons */
button.mt-date { font: inherit; cursor: pointer; appearance: none; -webkit-appearance: none; line-height: inherit; }

/* Tip category pills: one scrollable row */
.tip-pills { position: relative; }
.tip-pills [x-cloak] { display: none !important; }
.tip-pills-row { display: flex; align-items: center; gap: 8px; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none; -ms-overflow-style: none; padding: 2px 0; }
.tip-pills-row::-webkit-scrollbar { display: none; }
.tip-pill { flex-shrink: 0; white-space: nowrap; border-radius: 16px; padding: 10px 16px; font-size: 13px; font-weight: 600; line-height: 1.2; text-decoration: none; background: #f3f1e8; color: #5b5440; transition: background-color .2s ease, color .2s ease; }
.tip-pill:hover { background: #ecdfa6; color: #1e1e1e; }
.tip-pill.is-active { background: #161200; color: #fff; }
.tip-pills-arrow { display: none; position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(177, 144, 2, .35); background: #fff; color: #161200; font-size: 12px; cursor: pointer; box-shadow: 0 2px 8px rgba(0, 0, 0, .12); }
.tip-pills-arrow.is-left { left: -6px; }
.tip-pills-arrow.is-right { right: -6px; }
.tip-pills-arrow:hover { background: #ecbf03; }
@media (min-width: 768px) {
    .tip-pills-arrow { display: inline-flex; align-items: center; justify-content: center; }
}

.tip-pills-wrap { margin-top: 18px; }
.tip-pills-next { padding-top: 18px !important; }
@media (min-width: 768px) { .tip-pills-wrap { margin-top: 22px; } .tip-pills-next { padding-top: 22px !important; } }

/* Load more */
.mt-more { display: flex; justify-content: center; padding: 1.25rem 0 .25rem; }
.mt-more-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-width: 12rem; padding: .7rem 1.5rem; border-radius: 9999px; border: 1px solid #f0e6c6; background: linear-gradient(180deg, #ecbf03, #b19002); color: #161200; font-size: .875rem; font-weight: 700; letter-spacing: .02em; cursor: pointer; box-shadow: 0 6px 18px rgba(177, 144, 2, .25); transition: transform .15s, box-shadow .15s, background .15s, color .15s; }
.mt-more-btn:hover { background: linear-gradient(135deg, #3d3201, #161200); color: #ecbf03; box-shadow: 0 8px 22px rgba(22, 18, 0, .3); transform: translateY(-1px); }
.mt-more-btn:disabled { opacity: .7; cursor: wait; transform: none; }
.mt-more-count { font-weight: 500; opacity: .8; }