/* ===== Tefooz GAME-SCOPED styles (won't touch index) ===== */
html,body{background:#0b1220;color:#e5e7eb;margin:0}
#tg{font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,Tahoma,Arial,sans-serif}

/* Topbar */
#tg .tg-topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 16px;background:#0f172a;border-bottom:1px solid rgba(255,255,255,.08)}
#tg .tg-brand{display:flex;align-items:center;gap:10px}
/* Bigger in game as requested */
#tg .tg-brand img{height:clamp(56px,5vw,96px);max-width:320px;object-fit:contain}

/* Layout */
#tg #tg-screens{max-width:1200px;margin:0 auto;padding:20px}
#tg .tg-foot{padding:14px;text-align:center;color:#9ca3af;font-size:clamp(14px,1.8vw,18px)}
#tg .tg-foot a{color:#93c5fd;text-decoration:none} 
#tg .tg-foot a:hover{text-decoration:underline}

/* Setup card */
#tg .tg-setup{max-width:min(920px,94vw);margin:6vh auto;background:#121a2b;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:min(5vw,28px);box-shadow:0 10px 30px rgba(0,0,0,.28);font-size:clamp(18px,3.2vw,30px)}
#tg .tg-title{margin:0 0 12px;font-size:clamp(34px,5vw,56px);font-weight:800}
#tg .tg-form{display:grid;grid-template-columns:1fr;gap:12px}
#tg .tg-form label{display:flex;align-items:center;gap:.6em;flex-wrap:wrap}
#tg .tg-form select,
#tg .tg-form input[type="number"],
#tg .tg-form input[type="text"]{font-size:1em;padding:.45em .7em;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#0c1220;color:#e5e7eb;min-width:8ch}
#tg .tg-names{display:grid;grid-template-columns:1fr;gap:8px;width:100%}
#tg .tg-team-input{width:100%}

/* Buttons */
#tg .tg-btn{background:#1f2937;color:#fff;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:.55em 1em;font-size:clamp(16px,2.4vw,24px);cursor:pointer}
#tg .tg-btn.primary{background:#2563eb;border-color:#60a5fa}
#tg .tg-btn.disabled, #tg .tg-btn:disabled{opacity:.6;pointer-events:none}

/* Toggle / checkbox chip */
#tg .tg-check{display:inline-flex;align-items:center;justify-content:center;padding:.2em .6em;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#0e1628}

/* Fancy (?) */
#tg .tg-info{display:inline-flex;align-items:center;justify-content:center;width:1.2em;height:1.2em;border-radius:999px;padding:0;line-height:1;font-weight:900;color:#fff;background:linear-gradient(180deg,#3b82f6,#1d4ed8);border:1px solid #93c5fd;box-shadow:0 2px 6px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.3);cursor:pointer}
#tg .tg-help{position:fixed;display:none;max-width:min(520px,90vw);background:#111827;color:#fff;padding:10px 14px;border-radius:12px;font-size:clamp(14px,1.8vw,20px);box-shadow:0 6px 20px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.12);z-index:9999}

/* Categories (initial pick) */
#tg .tg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-top:14px}
#tg .tg-card{position:relative;background:linear-gradient(180deg,#0f1627,#0c1220);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:12px;cursor:pointer;transition:transform .12s ease, box-shadow .12s ease}
#tg .tg-card:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(0,0,0,.2)}
#tg .tg-card.selected{outline:2px solid #60a5fa}
#tg .tg-thumb{width:100%;height:160px;border-radius:12px;background:#0b1220 center/cover no-repeat;margin-bottom:8px}
#tg .tg-card-title{font-weight:700;text-align:center}
#tg .tg-badge{position:absolute;top:8px;left:8px;background:#111827;color:#fff;padding:4px 10px;border-radius:999px;font-size:.9rem;box-shadow:0 2px 4px rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.15);pointer-events:none}

/* Per-turn picker overlay */
#tg .tg-ol{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;z-index:9998}
#tg .tg-ol-card{max-width:min(980px,94vw);width:94vw;background:#121a2b;border:1px solid rgba(255,255,255,.1);border-radius:18px;box-shadow:0 10px 30px rgba(0,0,0,.32);padding:min(5vw,24px)}
#tg .tg-ol h3{margin:0 0 10px;font-size:clamp(24px,4vw,40px)}
#tg .tg-ol .tg-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
#tg .tg-diffs{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
#tg .tg-chip{border:1px solid rgba(255,255,255,.15);padding:.4em .8em;border-radius:999px;background:#0c1220;cursor:pointer;font-size:clamp(14px,2.6vw,22px)}
#tg .tg-chip.sel{outline:2px solid #60a5fa}

/* Question screen */
#tg .tg-qwrap{max-width:min(1100px,95vw);margin:4vh auto;background:#121a2b;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:min(5vw,28px)}
#tg .tg-qmeta{color:#9ca3af;font-size:clamp(16px,2.6vw,24px)}
#tg .tg-qtimer{color:#93c5fd;font-weight:700;margin-top:6px}
#tg .tg-qtext{font-size:clamp(26px,6.8vw,110px);line-height:1.5;margin:12px 0}
#tg .tg-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:12px}
#tg .tg-choice{font-size:clamp(20px,4.8vw,46px);padding:clamp(12px,3.2vw,24px) clamp(18px,4vw,34px);border-radius:18px;background:#1f2937;color:#fff;border:1px solid rgba(255,255,255,.15);cursor:pointer}
#tg .tg-choice.selected{outline:2px solid #60a5fa;box-shadow:0 0 0 3px rgba(96,165,250,.35) inset}

#tg .tg-ans{display:flex;gap:10px;margin-top:12px}
#tg #tg-answer{flex:1;font-size:clamp(20px,3.8vw,44px);padding:.5em .7em;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:#0c1220;color:#e5e7eb}

/* Result */
#tg .tg-res{max-width:min(900px,94vw);margin:6vh auto;background:#121a2b;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:min(5vw,28px);text-align:center}
#tg .tg-res .good{color:#86efac;font-size:clamp(24px,4.6vw,48px);font-weight:800}
#tg .tg-res .bad{color:#fca5a5;font-size:clamp(24px,4.6vw,48px);font-weight:800}
#tg #tg-correct{margin-top:10px;font-size:clamp(16px,3vw,24px)}
#tg .tg-override{margin-top:14px}


/* --- Tefooz small adjustments v12 --- */
.tg-current-team{
  text-align:center;
  font-weight:800;
  font-size: clamp(22px, 4.5vw, 48px);
  margin: 6px 0 12px;
}
.tg-winner-overlay{
  position: fixed; inset: 0;
  background: rgba(0,0,0,.6);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none; transition: opacity .3s ease;
  z-index: 9999;
}
.tg-winner-overlay.show{ opacity:1; pointer-events: all; }
.tg-winner-card{
  background: #fff; color:#111;
  padding: 24px 28px; border-radius: 20px;
  text-align:center; max-width: 90vw; box-shadow: 0 10px 40px rgba(0,0,0,.25);
}
.tg-crown{ font-size: 48px; }
.tg-winner-title{ font-size: 22px; margin-top: 8px; }
.tg-winner-name{ font-size: clamp(28px, 6vw, 56px); font-weight: 800; margin: 10px 0 16px; }


#tg #tg-cats .tg-grid{max-height:64vh;overflow:auto;-webkit-overflow-scrolling:touch}

#tg .tg-ol{overflow:auto;-webkit-overflow-scrolling:touch}

#tg .tg-ol-card{max-height:88vh;overflow:auto}