/* Centro de operaciones: contenido compacto, controles táctiles de al menos 44 px. */
.home-balance { display: grid; grid-template-columns: minmax(0,1fr); gap: 10px; margin-block: 16px; }
.home-balance .metric-card.balance { display: grid; grid-template-columns: minmax(0,1fr); min-height: 0; padding: 20px; border: 1px solid #f2d184; background: radial-gradient(ellipse at 100% 0,#d9b45e30,transparent 70%),linear-gradient(125deg,#173c29,#10281d); box-shadow: 0 8px 24px #0004,inset 0 1px #ffdfa533; }
.home-balance .metric-card.balance > strong { grid-column: 1; grid-row: auto; margin: 5px 0; font-size: clamp(2rem,7vw,3rem); letter-spacing: -.02em; white-space: nowrap; color: #fff2c9; }
.home-balance .metric-card.balance > small { grid-column: 1; grid-row: auto; }
.home-balance .metric-card.balance .metric-label { color: #efd18a; }
.home-wallet-actions { display: flex; gap: 8px; }
.home-wallet-actions .button { flex: 1; min-height: 44px; padding: 11px 9px; font-size: .8rem; }
.home-modalities { margin-top: 18px; }
.home-modality { gap: 9px; padding: 16px; position: relative; overflow: hidden; background-position: center; background-size: cover; }
.modality-tiempos { background-image: linear-gradient(120deg,#41141cf2,#35151dce),url('/branding/el-chance-costa-rica-v2.png'); }
.modality-chance, .chance-feature { background-image: linear-gradient(110deg,#701821ee,#32110cce),url('/branding/el-chance-costa-rica-v2.png'); background-size: cover; background-position: right center; }
.modality-raspas { background-image: radial-gradient(ellipse at 100% 0,#84632970,transparent),linear-gradient(120deg,#253326,#172219); }
.modality-ron { background: radial-gradient(ellipse at 100% 0,#c34d6260,transparent),linear-gradient(120deg,#402039,#1d1022); }
.modality-flags { display: flex; align-items: center; gap: 7px; min-height: 36px; }
.modality-flags .country-flag { position: relative; inset: auto; width: 30px; height: 21px; border-color: #f3d37d80; }
.modality-symbols { display: flex; gap: 5px; color: #ffdc80; }
.modality-symbols svg { width: 34px; height: 36px; fill: none; stroke: currentColor; stroke-width: 3; }
.modality-card-suits { font-size: 1.65rem; line-height: 36px; color: #fff1d6; letter-spacing: .08em; white-space: nowrap; }
.modality-card-suits i { color: #ff91a2; font-style: normal; }
.home-modality .modality-multiplier { color: #3d1b08; background: linear-gradient(125deg,#fff0b8,#dab463); border-radius: 7px; padding: 3px 5px; display: inline-block; font-size: .7rem; vertical-align: middle; white-space: nowrap; }
.chance-feature { padding: 16px 18px; margin-block: 16px; border-color: #edce77; }
.chance-feature .section-title { margin: 0; }
.chance-feature h2 { font-size: 1.3rem; margin: 0; }
.chance-feature p { font-size: .8rem; margin: 5px 0 10px; }
.chance-feature .button { padding: 11px 14px; min-height: 44px; font-size: .85rem; }
.home-upcoming, .home-latest { margin-top: 20px; }
.home-upcoming .section-title, .home-latest .section-title { margin-bottom: 10px; }
.home-upcoming h2, .home-latest h2 { font-size: 1.15rem; }
.home-draw-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.home-draw-compact { display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 12px; border-radius: 16px; }
.home-draw-compact[hidden] { display: none !important; }
.home-draw-compact .country-flag { width: 30px; height: 21px; }
.home-draw-compact h3 { font-size: .8rem; margin: 0 0 3px; line-height: 1.3; }
.home-draw-info { min-width: 0; }
.home-draw-info time, .home-draw-info > small { display: block; font-size: .65rem; line-height: 1.5; color: #e7cbb9; }
.home-draw-info [data-countdown] { color: #ffe5a4; font-variant-numeric: tabular-nums; }
.home-draw-play { display: grid; justify-items: end; gap: 5px; }
.home-draw-play .home-draw-payout { font-size: .75rem; padding: 3px 6px; border-radius: 6px; }
.home-draw-play .button { min-height: 44px; padding: 8px 10px; font-size: .7rem; }
.home-draw-play .home-draw-payout small { font-size: .55rem; }
.home-latest .card-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.home-result { padding: 12px; gap: 9px; border-radius: 16px; }
.home-result strong { font-size: .78rem; }
.home-result time { font-size: .65rem; }
.home-result-number { width: 36px; height: 36px; flex-basis: 36px; font-size: 1.2rem; }
.home-account-link { padding: 18px; gap: 12px; margin-block: 12px; }
.wallet-prizes { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 18px; margin-block: 14px; background: linear-gradient(120deg,#59321c,#331a16); border-color: #dcb869; }
.wallet-prizes > div { flex: 1; min-width: 0; }
.wallet-prizes > div > strong { display: block; color: #ffe2a4; font-size: clamp(1.5rem,5vw,2rem); overflow-wrap: anywhere; }
.wallet-prizes small { display: block; color: #eddac1; font-size: .75rem; }
.wallet-prizes > p { flex-basis: 100%; margin: 0; font-size: .72rem; color: #d9c3b6; }
.wallet-withdrawal { border-color: #d9b45e; background: linear-gradient(140deg,#421a21,#261014); }
.wallet-withdrawal .payment-options label > span { border-color: #bb9757; background: #321a19; }
.wallet-withdrawal .payment-options input:checked + span { background: #674124; border-color: #f3d486; color: #fff0c1; }
.wallet-withdrawal .locked-bank { padding: 10px; border: 1px solid #b58b58; border-radius: 10px; }
.play-wizard .page-heading { margin: 8px 0 16px; }
.play-wizard .page-heading h1 { font-size: clamp(1.5rem,4vw,2rem); margin: 4px 0; }
.play-wizard .page-heading p { font-size: .8rem; margin: 0; }
.play-wizard .step-card { padding: clamp(14px,3vw,24px); }
.play-wizard .step-title { gap: 10px; margin-bottom: 12px; }
.play-wizard .step-title h2 { font-size: 1.1rem; }
.play-wizard .step-title p, .draw-list-help { font-size: .75rem; }
.play-wizard .draw-grid { gap: 8px; }
.play-wizard .draw-option { min-height: 70px; padding: 10px; gap: 10px; border-radius: 13px; }
.play-wizard .draw-name { font-size: .82rem; line-height: 1.3; }
.play-wizard .draw-option small, .play-wizard .draw-close { font-size: .68rem; margin-top: 3px; }
.play-wizard .draw-toggle { min-width: 64px; min-height: 44px; font-size: .75rem; }
.play-wizard .play-progress { margin-bottom: 12px; }
@media(max-width:650px) {
  .home-draw-grid, .home-latest .card-list { grid-template-columns: minmax(0,1fr); }
  .home-modalities-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .home-modality { padding: 13px 10px; }
  .home-modality strong { font-size: .85rem; }
  .modality-action { min-height: 44px; padding-top: 6px; }
}
@media(max-width:360px) { .modality-card-suits { font-size: 1.3rem; } .home-section-note { display: none; } }