/* LotofácilMax | Conferidor de Apostas */
.cf-page { padding: 38px 0 88px; }
.cf-page [hidden] { display: none !important; }
.cf-page button, .cf-page input, .cf-page select { font-family: inherit; }
.cf-page button:focus-visible, .cf-page input:focus-visible, .cf-page select:focus-visible, .cf-table-scroll:focus-visible { outline: 3px solid #e5aa36; outline-offset: 3px; }
.cf-hero { display: flex; align-items: center; justify-content: space-between; gap: 30px; background: linear-gradient(115deg, #45103d 0%, #8d176c 55%, #be328f 100%); border-radius: 28px; padding: 40px 46px; color: #fff; margin-bottom: 24px; overflow: hidden; position: relative; box-shadow: 0 24px 52px rgba(92, 18, 70, .16); }
.cf-hero::after { content: ''; position: absolute; width: 360px; height: 360px; background: radial-gradient(circle, rgba(255, 193, 60, .32), transparent 69%); border-radius: 50%; right: -80px; top: -180px; pointer-events: none; }
.cf-hero > div { position: relative; z-index: 1; }
.cf-hero .section-kicker { display: inline-block; color: #ffe6a1; letter-spacing: .12em; font-size: .73rem; text-transform: uppercase; font-weight: 800; margin-bottom: 16px; }
.cf-hero h1 { font-size: clamp(1.85rem, 4vw, 3.25rem); letter-spacing: -.045em; line-height: 1.1; margin: 0 0 14px; color: #fff; }
.cf-hero h1 span { color: #ffcf58; }
.cf-hero p { max-width: 690px; font-size: .95rem; line-height: 1.8; opacity: .94; }
.cf-hero-benefits { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 23px; }
.cf-hero-benefits span { background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.22); border-radius: 999px; padding: 8px 12px; font-weight: 700; font-size: .72rem; }
.cf-hero-mark { border: 1px solid rgba(255,255,255,.33); width: 160px; min-width: 160px; height: 160px; background: rgba(255,255,255,.12); box-shadow: inset 0 1px 1px rgba(255,255,255,.12); border-radius: 26px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.cf-hero-mark > span { letter-spacing: .12em; font-size: .7rem; font-weight: 800; }
.cf-hero-mark strong { font-size: 4rem; line-height: 1.25; color: #ffcc50; }
.cf-hero-mark small { font-size: .7rem; opacity: .9; text-align: center; }
.cf-panel { background: #fff; padding: 28px; border: 1px solid rgba(166,29,125,.11); box-shadow: 0 14px 40px rgba(103,33,86,.055); border-radius: 24px; margin-top: 22px; }
.cf-section-title { display: flex; justify-content: space-between; align-items: center; gap: 22px; margin-bottom: 24px; }
.cf-section-title h2 { font-size: clamp(1.3rem, 2.7vw, 1.75rem); margin: 5px 0 6px; letter-spacing: -.025em; }
.cf-section-title p { font-size: .85rem; color: #78617a; line-height: 1.75; }
.cf-eyebrow { text-transform: uppercase; color: #a21c7b; font-size: .7rem; letter-spacing: .13em; font-weight: 800; }
.cf-button { border: 1px solid transparent; display: inline-flex; align-items: center; justify-content: center; gap: 7px; font-weight: 800; font-size: .8rem; line-height: 1.2; border-radius: 11px; padding: 13px 17px; white-space: nowrap; cursor: pointer; transition: transform .15s, box-shadow .15s; }
.cf-button:not(:disabled):hover { transform: translateY(-1px); }
.cf-button:disabled { cursor: not-allowed; opacity: .54; }
.cf-button--primary { background: linear-gradient(135deg, #a61d7d, #c92a94); color: white; box-shadow: 0 7px 20px rgba(166,29,125,.18); }
.cf-button--outline { color: #8b226f; background: #fff; border-color: #e8c7dd; }
.cf-alert { border: 1px solid #f1c69a; background: #fff7e9; color: #7f4a15; padding: 15px 18px; border-radius: 14px; font-size: .82rem; line-height: 1.65; margin-bottom: 18px; font-weight: 600; }
.cf-game-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 18px; background: #fff4fa; border: 1px solid #f4dded; color: #8c2872; padding: 14px 18px; border-radius: 14px; font-size: .83rem; margin-bottom: 18px; }
.cf-game-summary strong { font-weight: 800; }
.cf-game-summary span { color: #755b73; }
.cf-games { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
.cf-game-card { min-width: 0; border: 1px solid #eddfeb; border-radius: 18px; padding: 21px; background: linear-gradient(180deg,#fff 0%, #fffcfe 100%); }
.cf-game-head { display: flex; align-items: start; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.cf-game-ident { display: flex; align-items: center; gap: 11px; flex: 1; min-width: 150px; }
.cf-game-index { display: grid; place-items: center; min-width: 38px; height: 38px; border-radius: 11px; background: #f9e7f3; color: #a21c7b; font-weight: 800; font-size: .82rem; }
.cf-game-name { flex: 1; display: grid; gap: 3px; color: #836c84; font-size: .63rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.cf-game-name input { width: 100%; min-width: 0; border: 0; border-bottom: 1px solid transparent; background: transparent; color: #381d35; font-size: 1rem; font-weight: 800; outline-offset: 1px; padding: 2px 0 4px; }
.cf-game-name input:focus { border-color: #c22d90; }
.cf-game-tools { display: flex; gap: 4px; flex-wrap: wrap; }
.cf-game-tools button { border: 0; background: transparent; cursor: pointer; font-size: .7rem; color: #9b2875; font-weight: 700; padding: 7px 5px; border-radius: 7px; }
.cf-game-tools button:hover { background: #f9e8f4; }
.cf-game-tools button.cf-game-danger { color: #a24855; }
.cf-game-meta { display: flex; justify-content: space-between; align-items: center; gap: 8px 12px; flex-wrap: wrap; margin: 19px 0 13px; }
.cf-count { background: #fff2e1; color: #945e24; border-radius: 999px; padding: 7px 11px; font-weight: 800; font-size: .72rem; }
.cf-count--ready { background: #e0f5e8; color: #17653a; }
.cf-game-state { font-size: .69rem; color: #87768a; }
.cf-numbers { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; }
.cf-number { width: 100%; aspect-ratio: 1.44; min-height: 41px; border-radius: 10px; font-size: .88rem; font-weight: 800; color: #7f617b; border: 1px solid #eadde7; background: #fff; cursor: pointer; transition: transform .13s, background .13s, color .13s; }
.cf-number:not(:disabled):hover { transform: scale(1.035); border-color: #bb6a9d; }
.cf-number--selected { color: white; background: #ac217f; border-color: #a21c7b; box-shadow: 0 5px 13px rgba(166,29,125,.13); }
.cf-number--draw { color: #785b12; background: #fff4cc; border-color: #eace7a; }
.cf-number--hit { color: #fff; background: #209561; border-color: #209561; box-shadow: 0 5px 12px rgba(32,149,97,.15); }
.cf-number--miss { color: #fff; background: #bf3b88; border-color: #bf3b88; }
.cf-game-bottom { margin-top: 16px; display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: 11px; }
.cf-copies { display: grid; gap: 6px; font-size: .71rem; font-weight: 800; color: #73536c; }
.cf-copies input { border-radius: 9px; border: 1px solid #e5cfdf; padding: 10px; width: 90px; color: #4a2a46; font-size: .84rem; }
.cf-import { flex: 1; display: flex; align-items: stretch; min-width: 210px; max-width: 350px; }
.cf-import input { min-width: 0; width: 100%; border: 1px solid #e5cfdf; border-radius: 9px 0 0 9px; padding: 9px 10px; font-size: .72rem; }
.cf-import button { border: 0; border-radius: 0 9px 9px 0; background: #f3e3ee; color: #8c236c; font-size: .75rem; font-weight: 800; padding: 9px 12px; cursor: pointer; }
.cf-storage-note { color: #796279; font-size: .72rem; margin-top: 19px; line-height: 1.6; }
.cf-storage-note span { color: #ad3886; margin-right: 4px; }
.cf-base-status { background: #fff5e8; color: #885c27; padding: 10px 13px; border-radius: 10px; font-size: .71rem; font-weight: 800; text-align: center; }
.cf-query { display: flex; align-items: end; gap: 13px; flex-wrap: wrap; }
.cf-field { display: grid; gap: 8px; flex: 1; min-width: 168px; color: #684d65; font-size: .76rem; font-weight: 700; }
.cf-field > span, .cf-field > label { font-size: .75rem; }
.cf-field select, .cf-field input { width: 100%; min-height: 45px; border: 1px solid #e1cddd; background: #fff; color: #422c41; padding: 11px 13px; border-radius: 10px; font-size: .81rem; }
.cf-stepper { display: flex; align-items: stretch; }
.cf-stepper input { border-radius: 0; text-align: center; width: 100%; min-width: 70px; }
.cf-stepper button { border: 1px solid #e1cddd; background: #fff4fa; color: #a41d7d; padding: 0 13px; font-size: 1.15rem; font-weight: 800; cursor: pointer; }
.cf-stepper button:first-child { border-radius: 10px 0 0 10px; }
.cf-stepper button:last-child { border-radius: 0 10px 10px 0; }
.cf-stepper button:disabled { opacity: .4; cursor: not-allowed; }
.cf-search { min-height: 45px; }
.cf-query-tip { margin-top: 15px; font-size: .77rem; color: #7e6a7e; line-height: 1.7; }
.cf-results-head { margin-bottom: 20px; }
.cf-metrics { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; margin-bottom: 20px; }
.cf-metric { background: #fff6fb; border: 1px solid #f3e2ee; border-radius: 13px; padding: 19px 17px; }
.cf-metric span { display: block; font-size: .71rem; color: #826b81; line-height: 1.5; margin-bottom: 8px; }
.cf-metric strong { font-size: clamp(1.2rem,2.5vw,1.7rem); font-weight: 800; color: #92216f; }
.cf-highlight { border: 1px solid #eedce9; border-radius: 17px; padding: 20px; background: linear-gradient(110deg,#fff 0%,#fff8fc 100%); }
.cf-highlight-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.cf-highlight-head span { color: #826d80; font-size: .69rem; font-weight: 700; }
.cf-highlight-head h3 { font-size: 1.25rem; margin-top: 3px; }
.cf-highlight-head > strong { font-size: .75rem; font-weight: 700; color: #836e7e; }
.cf-drawn-numbers { display: flex; flex-wrap: wrap; gap: 7px; }
.cf-drawn-numbers span { width: 43px; height: 43px; border-radius: 50%; background: #a71b7d; color: white; display: grid; place-items: center; font-weight: 800; font-size: .87rem; }
.cf-highlight p { font-size: .71rem; color: #8b7288; margin-top: 15px; line-height: 1.7; }
.cf-legend { display: flex; flex-wrap: wrap; gap: 11px 22px; margin: 17px 0 26px; font-size: .73rem; color: #6f576a; }
.cf-legend span { display: inline-flex; align-items: center; gap: 7px; }
.cf-legend-dot { width: 12px; height: 12px; border-radius: 4px; display: inline-block; }
.cf-legend-dot--hit { background: #209561; }.cf-legend-dot--miss { background: #bf3b88; }.cf-legend-dot--draw { background: #ffe19b; border: 1px solid #cfae58; }
.cf-table-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 13px; }
.cf-table-header h3 { font-size: 1.02rem; }
.cf-table-header span { font-size: .7rem; color: #8a7386; }
.cf-table-scroll { width: 100%; overflow: auto; max-height: 700px; border: 1px solid #e9dce5; border-radius: 14px; }
.cf-table { min-width: 750px; width: 100%; border-collapse: separate; border-spacing: 0; font-size: .73rem; text-align: left; }
.cf-table thead { position: sticky; top: 0; z-index: 3; }
.cf-table th { background: #652052; color: #fff; font-weight: 800; padding: 15px; white-space: nowrap; vertical-align: middle; }
.cf-table th small { color: #ffdbec; display: block; font-weight: 500; padding-top: 4px; }
.cf-table tbody td { background: #fff; border-bottom: 1px solid #f0e5ed; padding: 13px 15px; vertical-align: top; min-width: 152px; }
.cf-table tbody tr:nth-child(even) td { background: #fffafc; }
.cf-table tbody tr.cf-row--highlight td { background: #fff4fb; }
.cf-table tbody tr:hover td { background: #fbebf6; }
.cf-table tbody td:first-child { min-width: 134px; white-space: nowrap; }
.cf-table tbody td:nth-child(2) { min-width: 205px; }
.cf-table tbody td strong { display: block; font-weight: 800; color: #422c41; }
.cf-table tbody td small { display: block; margin-top: 6px; color: #957e91; line-height: 1.5; }
.cf-draw-list, .cf-cell-numbers { display: flex; gap: 3px; flex-wrap: wrap; max-width: 210px; }
.cf-draw-list span { display: grid; place-items: center; height: 24px; min-width: 26px; font-size: .64rem; font-weight: 800; background: #f4e7f0; border-radius: 5px; color: #783e68; }
.cf-cell-score { display: grid; gap: 5px; margin-bottom: 9px; }
.cf-cell-score strong { font-size: .85rem; }
.cf-cell-score span { font-size: .65rem; color: #826c7c; line-height: 1.5; }
.cf-cell-score--award strong { color: #14784c !important; }
.cf-cell-score--award span { color: #168554; font-weight: 800; }
.cf-cell-numbers b { display: grid; place-items: center; min-width: 25px; height: 25px; border-radius: 5px; background: #d9f5e6; color: #116a42; font-size: .65rem; }
.cf-cell-misses { font-size: .62rem; max-width: 200px; }
.cf-not-ready strong { color: #b47e22 !important; }.cf-not-ready small { white-space: normal; }
.cf-total-awards { font-size: 1.1rem; }.cf-total-awards--yes { color: #148152 !important; }
.cf-empty { text-align: center; padding: 35px 15px; border-radius: 14px; border: 1px dashed #dfc6d7; color: #8b7388; font-size: .86rem; }
.cf-legal { margin-top: 20px; padding: 16px 17px; border-left: 3px solid #a51e7a; background: #fcf6fa; color: #806a7c; font-size: .72rem; line-height: 1.8; border-radius: 0 10px 10px 0; }
@media(max-width: 1000px) { .cf-games { grid-template-columns: 1fr; } .cf-game-card { max-width: 730px; width: 100%; } }
@media(max-width: 700px) {
  .cf-page { padding: 20px 0 52px; }
  .cf-hero { padding: 28px 24px; border-radius: 20px; }
  .cf-hero-mark { display: none; }
  .cf-panel { padding: 19px 15px; border-radius: 17px; }
  .cf-section-title { flex-direction: column; align-items: stretch; gap: 12px; }
  .cf-section-title .cf-button { align-self: start; }
  .cf-game-card { padding: 14px; }
  .cf-game-head { flex-direction: column; }
  .cf-game-tools { margin-left: -5px; }
  .cf-number { min-height: 43px; }
  .cf-numbers { gap: 6px; }
  .cf-query { align-items: stretch; }
  .cf-field { flex: 1 1 100%; }
  .cf-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cf-drawn-numbers span { width: 35px; height: 35px; font-size: .75rem; }
  .cf-highlight { padding: 14px; }
}
@media(max-width: 370px) { .cf-number { min-height: 36px; font-size: .76rem; } .cf-game-tools button { font-size: .67rem; } }
@media print {
  .topbar,.footer,.cf-hero-benefits,.cf-game-tools,.cf-game-bottom,.cf-query,.cf-search,.cf-button,.cf-storage-note,.cf-legal { display:none !important; }
  .cf-page,.cf-panel { padding: 10px 0; margin: 0; background: #fff; box-shadow: none; }
  .cf-table-scroll { overflow: visible; max-height: none; }
  .cf-games { grid-template-columns: repeat(2,1fr); }
  .cf-number { min-height: 20px; }
  .cf-table { font-size: 9px; }
}
