*{box-sizing:border-box}body{color:#27231e;background:#f4f1ea;margin:0;font-family:system-ui,-apple-system,sans-serif}main{max-width:760px;margin:0 auto;padding:40px 20px}.card{background:#fff;border-radius:18px;max-width:480px;margin:10vh auto;padding:36px;box-shadow:0 8px 30px #0001}h1{letter-spacing:.04em;margin-top:0}label{margin:20px 0;font-weight:600;display:block}input,select{background:#fff;border:1px solid #ccc;border-radius:8px;width:100%;margin-top:8px;padding:12px;font-size:16px;display:block}button{color:#fff;cursor:pointer;background:#315c4b;border:0;border-radius:8px;padding:11px 16px;font-size:15px}button:disabled{opacity:.4;cursor:not-allowed}.secondary{background:#777}.text-button{color:#315c4b;background:0 0;padding:0}.game-list{gap:12px;margin-top:24px;display:grid}.game-card{text-align:left;justify-content:space-between;align-items:center;width:100%;padding:18px;display:flex}.game-card strong{font-size:18px}.game-card span{opacity:.8;font-size:14px}.error-message{color:#a22}header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px;display:flex}.header-actions{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.panel{background:#fff;border-radius:14px;margin:16px 0;padding:24px;box-shadow:0 4px 20px #0000000d}.panel h2{margin-top:0}.panel ul{padding-left:20px;line-height:2}.actions{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}.modal-backdrop{z-index:100;background:#0008;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.result-dialog,.qr-dialog{background:#fff;border-radius:16px;width:min(440px,100%);padding:30px;position:relative;box-shadow:0 20px 60px #0005}.result-dialog h2,.qr-dialog h2{margin-top:0}.result-dialog p,.qr-dialog p{line-height:1.7}.dialog-close{color:#444;background:0 0;padding:4px 10px;font-size:26px;position:absolute;top:10px;right:12px}.qr-code{background:#fff;justify-content:center;padding:16px;display:flex}.room-url{overflow-wrap:anywhere;color:#666;text-align:center;font-size:13px}@media (max-width:600px){header{flex-direction:column;align-items:flex-start}.header-actions{justify-content:flex-start}.panel{padding:16px}}
