/* Theme variables */
:root{--green:#16a34a;--gray-50:#f8fafc;--gray-100:#eef2f7;--gray-700:#334155}

/* Global base */
*,*::before,*::after{box-sizing:border-box}
body{font-family:system-ui,Segoe UI,Arial,sans-serif;margin:24px;color:#111;background:linear-gradient(180deg,var(--gray-50),#fff 60%,var(--gray-100))}
h1{margin-top:0;margin-bottom:8px;letter-spacing:-.015em}
a{color:var(--green);text-decoration:none}
a:hover{text-decoration:underline}

/* Forms */
label{display:block;margin:.5rem 0;color:#111}
input[type=text], select, textarea{width:100%;max-width:100%;padding:10px 12px;border:1px solid #d1d5db;border-radius:8px;background:#fff;box-shadow:inset 0 1px 0 rgba(0,0,0,.02)}
input[type=text]:focus, select:focus, textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(22,163,74,.18)}

/* Buttons */
button{padding:10px 14px;border:0;border-radius:10px;background:var(--green);color:#fff;cursor:pointer;font-weight:600;box-shadow:0 6px 16px rgba(22,163,74,.25);transition:transform .12s ease, box-shadow .12s ease, background .12s ease}
button:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(22,163,74,.35)}
button:active{transform:translateY(0)}
button.secondary{background:#475569;box-shadow:0 6px 16px rgba(71,85,105,.25)}

/* Layout helpers */
.flex{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.flex .col{flex:1 1 260px;min-width:220px}
.flex .col input[type=text],
.flex .col textarea{max-width:100%}

/* Choice group styling on Questions page */
.choices{background:#ffffff;border:1px solid #e5e7eb;border-radius:12px;padding:12px}
.choices .col label{margin:.5rem 0}
.page{max-width:1100px;margin:0 auto}
.table-scroll{overflow:auto;border-radius:12px}

/* Cards */
.card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:16px;margin:8px 0;box-shadow:0 8px 24px rgba(2,6,23,.04)}
.controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.controls form{display:flex;gap:8px;align-items:center}
.controls select{min-width:220px;width:auto}
.sticky-top{position:sticky;top:8px;z-index:20}

/* Tables */
table{border-collapse:separate;border-spacing:0;margin-top:16px;width:100%;background:#fff;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px rgba(2,6,23,.05)}
th,td{border-bottom:1px solid #eee;padding:10px 12px;text-align:left}
th{background:#f8fafc;font-weight:700;color:#0f172a}
tr:last-child td{border-bottom:0}
tbody tr:hover{background:#f9fafb}

/* Scoreboard ranks */
tr.rank-1 td{background:linear-gradient(90deg,#fff7ed,#ffffff);font-weight:700}
tr.rank-2 td{background:linear-gradient(90deg,#f1f5f9,#ffffff)}
tr.rank-3 td{background:linear-gradient(90deg,#f8fafc,#ffffff)}

/* Badges */
.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:.8rem;background:#ecfeff;color:#0e7490;border:1px solid #cffafe}

/* Back link as subtle button */
.back{display:inline-block;margin-bottom:8px;padding:8px 10px;border-radius:8px;border:1px solid #e5e7eb;background:#fff;color:inherit;text-decoration:none;box-shadow:0 2px 6px rgba(2,6,23,.05)}
.back:hover{text-decoration:none;box-shadow:0 4px 12px rgba(2,6,23,.08)}

/* Utilities */
.timer{font-size:2rem;font-weight:700}