/* Global styles + footer + flashing */
:root{--bg-black:#000; --text-light:#f5f5f5; --accent-yellow:#ffd400; --accent-green:#1f9d1f; --accent-blue:#1e6ee6; --accent-grey:#666; --card-bg:#111; --card-border:#333}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg-black);color:var(--text-light)}
.container{max-width:1000px;margin:0 auto;padding:16px}
.header{text-align:center;margin:12px auto 20px}
.header h1{font-size:1.9rem;margin:8px 0 0}
.subtitle{margin-top:6px;color:#bbbbbb;font-size:1.05rem}
.index-footer{text-align:center;margin-top:40px;font-size:1.05rem;color:#bbbbbb}
.logo{display:block;margin:0 auto 8px;height:180px;width:auto}
.rounds{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:10px;padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.4)}
.card-title{font-size:1.25rem;text-align:center;margin:6px 0 10px;font-weight:bold}
.card .q-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.q-number{font-weight:bold;color:var(--accent-yellow);margin-right:8px;font-size:1.2rem}
.q-text{font-size:1.8rem;line-height:1.35}
body.questions .q-text{font-size:2.0rem;font-weight:700}
.answer-text{color:var(--accent-yellow);font-weight:bold;font-size:1.4rem}
.controls,.footer-nav{display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap}
.footer{position:sticky;bottom:0;background:rgba(0,0,0,.85);padding:10px 6px;backdrop-filter:blur(6px)}
button,.btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border:none;border-radius:8px;cursor:pointer;text-decoration:none;color:#111;background:#e0e0e0;font-weight:700;font-size:1rem;white-space:nowrap}
.btn-secondary{background:#cfcfcf;color:#111}
.btn-yellow{background:var(--accent-yellow);color:#111}
.btn-green{background:var(--accent-green);color:#fff}
.btn-blue{background:var(--accent-blue);color:#fff}
.btn-grey{background:var(--accent-grey);color:#fff}
.btn-dark{background:#222;color:#fff;border:1px solid #444}
.btn:focus{outline:2px solid var(--accent-yellow);outline-offset:2px}
.timer-bar{position:sticky;top:0;z-index:50;background:rgba(0,0,0,.95);border-bottom:1px solid var(--card-border);padding:10px 12px}
.timer-wrap{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.timer-display{font-weight:900;font-size:2.2rem;color:var(--accent-yellow);min-width:120px;text-align:center;letter-spacing:1px}
.timer-btn{min-width:110px;text-align:center}
.timer-input{width:120px;padding:8px 10px;border-radius:6px;border:1px solid #555;background:#111;color:#fff}
@keyframes flashOnce{0%,100%{opacity:1}50%{opacity:0}}
.flash-once{animation:flashOnce 1s 1 linear}
@keyframes flashLoop{0%,100%{opacity:1}50%{opacity:0}}
.flash-loop{animation:flashLoop 1s linear infinite;color:#fff;background:#b00020;padding:0 8px;border-radius:6px}
body.answers{background:var(--bg-black);color:var(--text-light)}
.q-body{margin-top:6px}
.hidden{display:none}
@media (max-width:520px){.q-text{font-size:1.3rem}.answer-text{font-size:1.2rem}.timer-display{font-size:1.9rem;min-width:100px}button,.btn{padding:9px 10px;font-size:.95rem}}