:root{font-family:Inter,system-ui,sans-serif;color:#eef2ff;background:#101827}*{box-sizing:border-box}body{margin:0}.attendee,.presenter{max-width:900px;margin:auto;padding:32px 20px;min-height:100vh}.attendee{max-width:520px;display:flex;flex-direction:column;gap:18px}.brand{letter-spacing:.18em;color:#94a3b8}.live{color:#34d399;font-weight:700}h1{font-size:clamp(1.8rem,7vw,3rem);margin:0}form{display:grid;gap:16px;padding:22px;background:#1e293b;border-radius:16px}label{display:grid;gap:7px}input{width:100%;padding:13px;border-radius:8px;border:1px solid #475569;font:inherit}button{background:#38bdf8;border:0;border-radius:8px;padding:13px 18px;font:inherit;font-weight:700;color:#082f49;cursor:pointer}.error{color:#fca5a5}.presenter header,.presenter footer,.status{display:flex;gap:18px;justify-content:space-between;align-items:center;flex-wrap:wrap}.status,.columns{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin:26px 0}.status div,.columns section,.attendee section{background:#1e293b;padding:18px;border-radius:12px}.status b{color:#34d399;display:block}.columns{grid-template-columns:repeat(2,minmax(0,1fr))}.danger{background:#fb7185;color:#4c0519}@media(max-width:560px){.columns{grid-template-columns:1fr}}