@import url('https://fonts.googleapis.com/css2?family=Noto+Nastaliq+Urdu:wght@400;700&display=swap');
:root { --green:#0f7b5f; --bg:#f4f7f5; --card:#fff; --text:#1d2b26; --muted:#6b7c75; --red:#d93025; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; background:var(--bg); color:var(--text); }
html[dir=rtl] body { font-family: "Noto Nastaliq Urdu", serif; line-height: 2.1; }
header { background:var(--green); color:#fff; padding:14px 18px; display:flex; align-items:center; justify-content:space-between; }
header h1 { font-size:20px; margin:0; }
.lang { background:rgba(255,255,255,.18); border:0; color:#fff; padding:6px 14px; border-radius:20px; font-size:15px; cursor:pointer; font-family:inherit; }
main { max-width:480px; margin:0 auto; padding:20px 16px; }
.card { background:var(--card); border-radius:16px; padding:22px; box-shadow:0 2px 10px rgba(0,0,0,.06); margin-bottom:16px; }
label { display:block; font-size:14px; color:var(--muted); margin-bottom:6px; }
input { width:100%; font-size:20px; padding:12px 14px; border:2px solid #d7e2dd; border-radius:12px; margin-bottom:14px; direction:ltr; font-family:system-ui,sans-serif; }
input.upper { text-transform:uppercase; }
input:focus { outline:none; border-color:var(--green); }
.btn { display:block; width:100%; font-size:20px; font-weight:600; padding:16px; border:0; border-radius:14px; background:var(--green); color:#fff; cursor:pointer; font-family:inherit; }
.btn:disabled { opacity:.5; }
.btn.red { background:var(--red); }
.btn.ghost { background:transparent; color:var(--green); font-size:15px; padding:10px; }
.big { width:160px; height:160px; border-radius:50%; margin:18px auto; display:flex; align-items:center; justify-content:center; font-size:56px; padding:0; }
.badge { display:inline-block; padding:4px 14px; border-radius:20px; font-size:14px; font-weight:700; background:#e6ece9; color:var(--muted); }
.badge.live { background:var(--red); color:#fff; animation:pulse 1.6s infinite; }
@keyframes pulse { 50% { opacity:.6; } }
.center { text-align:center; }
.muted { color:var(--muted); font-size:14px; }
.err { color:var(--red); font-size:15px; min-height:1.5em; }
.hidden { display:none !important; }
h2 { margin:6px 0; }
.timer { font-size:36px; font-variant-numeric:tabular-nums; font-weight:700; direction:ltr; font-family:system-ui,sans-serif; }
a { color:var(--green); }
table { width:100%; border-collapse:collapse; font-size:15px; }
td, th { padding:6px; border-bottom:1px solid #e6ece9; text-align:start; }