:root{font-family:system-ui,Segoe UI,sans-serif;font-size:18px;color:#1d2430;background:#f7f8fb}body{margin:0}#root{max-width:900px;margin:0 auto;padding:1rem}h1{font-size:1.6rem}.question{font-size:1.4rem;line-height:1.4;margin:1rem 0}.options{display:grid;gap:.75rem}.option{font-size:1.25rem;text-align:left;padding:.9rem 1rem;border:2px solid #c9d1e0;border-radius:12px;background:#fff;cursor:pointer}.option:focus-visible,.option.selected{outline:3px solid #3b6fd6}.option .key{display:inline-block;width:2rem;font-weight:700;color:#3b6fd6}.primary{font-size:1.2rem;padding:.8rem 1.4rem;border-radius:12px;border:0;background:#3b6fd6;color:#fff;cursor:pointer}.nav{display:flex;gap:1rem;margin-bottom:1rem}.nav button{font-size:1rem}.nav .active{font-weight:700;text-decoration:underline}.feedback.correct{color:#1d7a3a}.feedback.wrong{color:#a12626}.chat{border:2px solid #c9d1e0;border-radius:12px;padding:1rem;background:#fff}.chat .turn{margin:.4rem 0}.chat .turn.student{text-align:right;color:#3b6fd6}.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.75rem}.tile{border-radius:12px;padding:.8rem;color:#1d2430;border:3px solid transparent}.tile.current{border-color:#3b6fd6}.diagram svg{max-width:100%;height:auto}.flag{margin:.75rem 0;font-size:.9rem}.flag .link{background:none;border:none;color:#555;text-decoration:underline;cursor:pointer;padding:0}.flag.panel{display:grid;gap:.5rem;max-width:28rem;padding:.75rem;border:1px solid #ccc;border-radius:6px}.flag.panel label{display:grid;gap:.25rem}.review .comment{border-top:1px solid #ddd;padding:.5rem 0}.review .snapshot li.correct{font-weight:600}.review .badge{background:#fde;padding:.1rem .4rem;border-radius:4px;font-size:.8rem}.review img{max-width:20rem;display:block}
