/* live-room.css — the two live tutor v1 pages (live-tutor.html, live-join.html). */
:root{
  --lr-ink:#16202b; --lr-muted:#5c6b7a; --lr-line:#dde4ea; --lr-bg:#f6f8fa;
  --lr-card:#ffffff; --lr-accent:#0f6d5c; --lr-accent-soft:#e6f2ef; --lr-warn:#9a3412;
  --lr-here:#15803d; --lr-away:#b45309; --lr-page:1040px;
}
@media (prefers-color-scheme: dark){
  :root{--lr-ink:#e8eef4;--lr-muted:#9fb0c0;--lr-line:#2a3742;--lr-bg:#111820;
    --lr-card:#18212b;--lr-accent:#4fd1b5;--lr-accent-soft:#16302b;--lr-warn:#fca17d;
    --lr-here:#4ade80;--lr-away:#fbbf24}
}
*{box-sizing:border-box}
body{margin:0;background:var(--lr-bg);color:var(--lr-ink);
  font-family:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;line-height:1.55}
h1,h2,h3{font-family:'Outfit',system-ui,sans-serif;line-height:1.25;margin:0 0 .4em}
h1{font-size:1.6rem} h2{font-size:1.15rem} h3{font-size:1rem}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.84em}
main{max-width:var(--lr-page);margin:0 auto;padding:28px 18px 80px}
.lr-card{background:var(--lr-card);border:1px solid var(--lr-line);border-radius:12px;
  padding:18px 20px;margin:0 0 18px}
.lr-muted{color:var(--lr-muted);font-size:.92rem}
.lr-warn{color:var(--lr-warn);font-weight:600}
.lr-note{background:var(--lr-accent-soft);border-left:4px solid var(--lr-accent);
  border-radius:0 8px 8px 0;padding:12px 16px;margin:0 0 18px}
.lr-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:.4em 0}
.lr-btn{background:var(--lr-accent);color:#fff;border:0;border-radius:10px;padding:9px 16px;
  cursor:pointer;font:inherit;font-weight:600}
.lr-btn:disabled{opacity:.5;cursor:default}
.lr-btn-quiet{background:transparent;color:var(--lr-accent);border:1.5px solid var(--lr-line)}
@media (prefers-color-scheme: dark){ .lr-btn{color:#0c1319} .lr-btn-quiet{color:var(--lr-accent)} }
input[type=text],select,textarea{font:inherit;color:inherit;background:var(--lr-card);
  border:1.5px solid var(--lr-line);border-radius:8px;padding:8px 10px;max-width:100%}
textarea{width:100%;display:block;margin-top:4px}
.lr-label{display:block;margin:.6em 0}
.lr-status{font-size:.88rem;color:var(--lr-muted);min-height:1.3em;margin:.3em 0}
.lr-err{color:var(--lr-warn);font-weight:600}
.lr-code{font:700 2rem/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;
  background:var(--lr-accent-soft);border-radius:10px;padding:10px 16px;display:inline-block}
.lr-phases{list-style:none;display:flex;gap:6px;padding:0;margin:.4em 0 .8em;flex-wrap:wrap}
.lr-phase{border:1.5px solid var(--lr-line);border-radius:999px;padding:4px 12px;font-size:.86rem;
  color:var(--lr-muted)}
.lr-phase.is-current{border-color:var(--lr-accent);background:var(--lr-accent-soft);color:var(--lr-ink);
  font-weight:700}
.lr-table-wrap{overflow-x:auto}
.lr-table{border-collapse:collapse;width:100%;font-size:.9rem;margin:.4em 0}
.lr-table th,.lr-table td{border-bottom:1px solid var(--lr-line);padding:6px 10px;text-align:left;
  vertical-align:top}
.lr-board td.lr-cell{min-width:7em;white-space:pre-wrap;word-break:break-word}
.lr-none{color:var(--lr-muted)}
.lr-landed{color:var(--lr-here);font-weight:600}
.lr-dot::before{content:'';display:inline-block;width:.6em;height:.6em;border-radius:50%;
  margin-right:.4em;background:currentColor;vertical-align:middle}
.lr-here{color:var(--lr-here)} .lr-away{color:var(--lr-away)} .lr-never{color:var(--lr-muted)}
.lr-list{list-style:none;padding:0;margin:0}
.lr-list li{border-top:1px solid var(--lr-line);padding:8px 0;display:flex;gap:10px;
  justify-content:space-between;align-items:flex-start}
.lr-list li:first-child{border-top:0}
.lr-prompt{margin:0 0 .3em}
.lr-options{margin:.2em 0 .5em;padding-left:1.4em;list-style:none}
.lr-choices{display:flex;gap:14px;flex-wrap:wrap;margin:.3em 0}
.lr-choice{display:inline-flex;gap:4px;align-items:center;font-weight:600}
.lr-keys{font-size:.88rem;color:var(--lr-muted);padding-left:1.2em}
.lr-grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:820px){ .lr-grid2{grid-template-columns:1fr} }
.lr-locked{opacity:.5;pointer-events:none}
