/*
Theme Name: LearningRO Live
Description: Self-contained live quiz arena for a LearningRO WordPress multisite subsite.
Version: 0.1.0
Author: LearningRO
Text Domain: learningro-live
*/

:root { --lr-indigo:#4f46e5; --lr-purple:#7c3aed; --lr-navy:#172033; --lr-muted:#64748b; --lr-bg:#f7f8ff; --lr-line:#dfe4ff; --lr-card:#fff; }
* { box-sizing:border-box; }
body { margin:0; background:radial-gradient(circle at 0 0,#dbeafe,transparent 28rem),radial-gradient(circle at 100% 15%,#ede9fe,transparent 32rem),var(--lr-bg); color:var(--lr-navy); font-family:Inter,Arial,sans-serif; }
button,input { font:inherit; }
button { cursor:pointer; }
.lr-shell { max-width:1100px; margin:auto; padding:1.5rem; }
.lr-topbar { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem 0 2rem; }
.lr-header-actions { display:flex; align-items:center; gap:.75rem; }.lr-join-corner { padding:.55rem .85rem; }
.lr-logo { width:156px; max-width:42vw; height:auto; }.lr-tag { font-size:.75rem; color:var(--lr-muted); margin:.25rem 0 0; }
.lr-card { border:1px solid var(--lr-line); border-radius:1.25rem; background:rgba(255,255,255,.88); box-shadow:0 16px 40px rgba(30,41,59,.08); padding:clamp(1.25rem,4vw,2.25rem); }
.lr-hero { text-align:center; max-width:720px; margin:4vh auto; }.lr-hero h1 { font-size:clamp(2rem,6vw,4rem); margin:.5rem 0; letter-spacing:-.06em; }.lr-hero p { color:var(--lr-muted); line-height:1.6; }
.lr-library-heading { margin:2vh 0 1.25rem; }.lr-library-heading h1 { font-size:clamp(2rem,5vw,3.2rem); letter-spacing:-.05em; margin:.25rem 0; }.lr-library-heading p { color:var(--lr-muted); margin:.25rem 0; }.lr-quiz-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1rem; }.lr-quiz-card { display:flex; flex-direction:column; min-height:250px; padding:1.25rem; transition:transform .2s,box-shadow .2s; }.lr-quiz-card:hover { transform:translateY(-3px); box-shadow:0 20px 38px rgba(79,70,229,.14); }.lr-quiz-card h2 { margin:1.15rem 0 .4rem; font-size:1.25rem; }.lr-quiz-card p { color:var(--lr-muted); line-height:1.5; font-size:.9rem; margin:0 0 1.25rem; }.lr-quiz-card .lr-primary { margin-top:auto; width:100%; }.lr-category { color:var(--lr-indigo); background:#eef2ff; border-radius:999px; padding:.28rem .55rem; font-size:.7rem; font-weight:800; width:max-content; }.lr-question-total { color:var(--lr-muted); font-size:.72rem; font-weight:700; margin-top:.65rem; }
.lr-actions,.lr-row { display:flex; gap:.75rem; flex-wrap:wrap; }.lr-actions { justify-content:center; margin-top:1.5rem; }
.lr-primary,.lr-secondary { border-radius:.75rem; padding:.75rem 1rem; font-weight:800; border:1px solid transparent; }.lr-primary { color:#fff; background:linear-gradient(135deg,var(--lr-indigo),var(--lr-purple)); box-shadow:0 10px 22px rgba(79,70,229,.25); }.lr-secondary { color:var(--lr-indigo); background:#eef2ff; border-color:#c7d2fe; }
.lr-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:1.25rem; }.lr-label { display:block; margin:1rem 0 .35rem; font-size:.78rem; font-weight:800; color:var(--lr-muted); text-transform:uppercase; letter-spacing:.06em; }.lr-input { width:100%; padding:.8rem .9rem; border:1px solid #cfd6ed; border-radius:.7rem; background:#fff; color:var(--lr-navy); }
.lr-code { font-size:clamp(2rem,7vw,4.2rem); letter-spacing:.08em; font-weight:900; color:var(--lr-indigo); margin:.7rem 0; }.lr-question-count { color:var(--lr-muted); }.lr-hidden { display:none!important; }.lr-status { min-height:1.4rem; margin:.75rem 0; color:var(--lr-muted); font-size:.9rem; }.lr-error { color:#b91c1c; }
.lr-question { font-size:clamp(1.35rem,3vw,2rem); line-height:1.3; font-weight:800; margin:0 0 1.25rem; }.lr-options { display:grid; gap:.75rem; }.lr-option { padding:1rem; border:1px solid #dbe2f0; background:#fff; border-radius:.8rem; text-align:left; color:var(--lr-navy); font-weight:700; }.lr-option:hover { border-color:var(--lr-indigo); background:#f5f3ff; }.lr-option:disabled { cursor:wait; opacity:.65; }
.lr-leaderboard { padding:0; overflow:hidden; }.lr-leaderboard h2 { padding:1.25rem 1.25rem .75rem; font-size:1.1rem; margin:0; }.lr-player { display:flex; justify-content:space-between; gap:.75rem; padding:.85rem 1.25rem; border-top:1px solid #eef0ff; }.lr-rank { color:var(--lr-indigo); font-weight:900; min-width:2rem; }.lr-points { font-weight:900; }.lr-coin { width:1.1rem; vertical-align:-.18rem; margin-right:.18rem; }
@media (max-width:720px) { .lr-grid { grid-template-columns:1fr; }.lr-topbar { padding-bottom:1rem; }.lr-shell { padding:1rem; } }