/* Lucky for Life — lfl-styles.css */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');

:root{
  --bg:#0d0f14;
  --surface:#161a23;
  --surface2:#1e2330;
  --surface3:#252b3b;
  --gold:#f5c842;
  --gold2:#e6a817;
  --gold-dim:rgba(245,200,66,.15);
  --red:#ff4f4f;
  --green:#4ade80;
  --blue:#60a5fa;
  --text:#e8eaf0;
  --muted:#7a8099;
  --border:#252b3b;
  --radius:12px;
  --luckball:#4ade80;
  --luckball-dim:rgba(74,222,128,.15);
}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;min-height:100vh;}

/* AD SLOTS */
.ad-banner-top{width:100%;background:#111520;border-bottom:1px solid #1e2330;display:flex;align-items:center;justify-content:center;padding:8px;min-height:60px;}
.ad-label{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:2px;text-align:center;}
.ad-inline{text-align:center;padding:16px 0;background:var(--bg);}
.ad-sidebar{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px;text-align:center;min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;}

/* BACK LINK */
.lfl-back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);text-decoration:none;font-family:'DM Sans',sans-serif;font-size:13px;padding:10px 20px;transition:color .2s;}
.lfl-back:hover{color:var(--gold);}

header{background:linear-gradient(135deg,#0d0f14 0%,#161a23 100%);border-bottom:1px solid var(--border);}
.header-inner{max-width:1100px;margin:0 auto;padding:20px 24px 24px;}
.game-title-row{display:flex;align-items:center;gap:14px;}
.game-badge{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#0d0f14;font-weight:800;font-size:11px;padding:4px 10px;border-radius:6px;letter-spacing:.06em;text-transform:uppercase;}
.game-title{font-size:clamp(22px,4vw,34px);font-weight:700;color:var(--gold);}
.game-meta{font-size:13px;color:var(--muted);margin-top:6px;}

.layout{max-width:1100px;margin:0 auto;padding:28px 20px;display:grid;grid-template-columns:1fr 300px;gap:24px;}
@media(max-width:860px){.layout{grid-template-columns:1fr;}}

/* TABS */
.tabs{display:flex;gap:4px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:4px;margin-bottom:22px;width:fit-content;}
.tab-btn{background:none;border:none;color:var(--muted);font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;padding:8px 18px;border-radius:7px;cursor:pointer;transition:background .2s,color .2s;}
.tab-btn.active{background:var(--gold);color:#0d0f14;}
.tab-btn:hover:not(.active){color:var(--text);background:var(--surface2);}
.tab-panel{display:none;}
.tab-panel.active{display:block;}

/* PLAY TAB */
.play-area{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;}
.play-area h2{font-size:16px;font-weight:600;margin-bottom:18px;color:var(--text);}
.pick-section{margin-bottom:20px;}
.pick-label{font-size:12px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;}

.number-grid{display:flex;flex-wrap:wrap;gap:8px;}
.num-btn{width:40px;height:40px;border-radius:50%;border:2px solid var(--border);background:var(--surface2);color:var(--text);font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;}
.num-btn:hover:not(:disabled){border-color:var(--gold);color:var(--gold);}
.num-btn.selected{background:var(--gold);border-color:var(--gold);color:#0d0f14;}
.num-btn.cashball-btn.selected{background:var(--luckball);border-color:var(--luckball);color:#fff;}
.num-btn.cashball-btn:hover:not(:disabled){border-color:var(--luckball);color:var(--luckball);}
.num-btn:disabled{opacity:.5;cursor:default;}

.selected-display{background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:16px;margin:16px 0;display:flex;flex-direction:column;gap:10px;}
.selected-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.selected-row label{font-size:12px;color:var(--muted);font-weight:600;min-width:80px;}
.lotto-ball{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--gold2));color:#0d0f14;font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(245,200,66,.3);}
.lotto-ball.cash{background:linear-gradient(135deg,var(--luckball),#c040e0);color:#fff;box-shadow:0 2px 8px rgba(224,90,245,.3);}
.ball-placeholder{width:42px;height:42px;border-radius:50%;border:2px dashed var(--border);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:18px;}

.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}
.btn-primary{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#0d0f14;border:none;font-family:'DM Sans',sans-serif;font-weight:700;font-size:14px;padding:12px 24px;border-radius:9px;cursor:pointer;transition:opacity .2s;}
.btn-primary:hover{opacity:.88;}
.btn-secondary{background:var(--surface2);color:var(--text);border:1px solid var(--border);font-family:'DM Sans',sans-serif;font-weight:600;font-size:14px;padding:12px 20px;border-radius:9px;cursor:pointer;transition:background .2s;}
.btn-secondary:hover{background:var(--surface3);}

/* RESULT */
.result-box{margin-top:20px;background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:20px;display:none;}
.result-box.show{display:block;}
.winning-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0;}
.result-title{font-size:13px;color:var(--muted);margin-bottom:6px;}
.prize-display{margin-top:14px;padding:14px;background:var(--bg);border-radius:8px;border-left:3px solid var(--gold);font-size:18px;font-weight:700;color:var(--gold);}
.prize-display.jackpot{border-color:var(--green);color:var(--green);}
.match-info{font-size:13px;color:var(--muted);margin-top:6px;}

/* FREQUENCY TAB */
.freq-table{width:100%;border-collapse:collapse;font-size:14px;}
.freq-table th{text-align:left;padding:10px 14px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--border);}
.freq-table td{padding:10px 14px;border-bottom:1px solid var(--border);}
.freq-table tr:hover td{background:var(--surface2);}
.freq-bar{height:8px;border-radius:4px;background:linear-gradient(90deg,var(--gold),var(--gold2));min-width:4px;}
.hot-badge{font-size:10px;padding:2px 7px;border-radius:10px;font-weight:700;background:rgba(255,79,79,.15);color:var(--red);margin-left:6px;}
.cold-badge{font-size:10px;padding:2px 7px;border-radius:10px;font-weight:700;background:rgba(96,165,250,.15);color:var(--blue);margin-left:6px;}

/* HISTORY TAB */
.history-list{display:flex;flex-direction:column;gap:10px;}
.history-item{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;}
.history-date{font-size:12px;color:var(--muted);min-width:80px;}
.history-balls{display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.h-ball{width:34px;height:34px;border-radius:50%;background:var(--gold-dim);border:1px solid var(--gold);color:var(--gold);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.h-ball.cash{background:var(--luckball-dim);border-color:var(--luckball);color:var(--luckball);}
.h-jackpot{font-size:13px;color:var(--green);font-weight:600;}

/* STATS TAB */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;}
.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;}
.stat-val{font-size:28px;font-weight:700;color:var(--gold);}
.stat-label{font-size:12px;color:var(--muted);margin-top:4px;}

/* SIDEBAR */
.sidebar{display:flex;flex-direction:column;gap:18px;}
.info-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;}
.info-card h3{font-size:14px;font-weight:600;color:var(--gold);margin-bottom:12px;}
.info-row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--border);font-size:13px;}
.info-row:last-child{border:none;}
.info-row-label{color:var(--muted);}
.prize-tier{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--border);font-size:13px;}
.prize-tier:last-child{border:none;}
.prize-tier-label{color:var(--muted);}
.prize-tier-val{color:var(--text);font-weight:600;}
.prize-tier-val.top{color:var(--gold);}

footer{background:var(--surface);border-top:1px solid var(--border);padding:24px;text-align:center;font-size:12px;color:var(--muted);}
footer a{color:var(--gold);text-decoration:none;}
.footer-ad{max-width:1100px;margin:0 auto 16px;min-height:90px;background:var(--bg);border:1px solid var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;}