#app{color-scheme:dark;--ink:#111110;--surface:#232321;--paper:#f0e9df;--muted:#aaa49b;--orange:#d1b16b;font:16px/1.5 system-ui,sans-serif}
#app *{box-sizing:border-box}
#app a{color:inherit;text-decoration:none}
#app h1{font-size:clamp(32px,5vw,56px);font-weight:650;line-height:1.08;margin:12px 0 20px}
#app h2{font-size:23px;margin:0 0 12px}
#app p{margin:8px 0 20px}
#app .muted,#app small{color:var(--muted)}
#app .eyebrow{color:var(--orange);font-size:12px;letter-spacing:.18em;font-weight:750}
#app .bar,#app .actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
#app .bar{justify-content:space-between;margin:20px 0}
#app button,#app .button{border:0;border-radius:2px;font:inherit;font-weight:600;color:var(--paper);background:#33332f;min-height:48px;padding:12px 20px;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;gap:8px}
#app .primary{background:var(--orange);color:#fff}
#app button:hover,#app .button:hover{filter:brightness(1.12)}
#app button:disabled{opacity:.5;cursor:default}
#app :focus-visible{outline:2px solid var(--paper);outline-offset:4px}
#app .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
#app .panel{background:#20201ef0;padding:28px}
#app .card{display:block;background:#252522e8;padding:24px;transition:background .2s}
#app .card:hover{background:#33332f}
#app .card .meta{display:flex;justify-content:space-between;color:var(--muted);font-size:14px;margin-bottom:18px}
#app .card h2{margin-bottom:6px;overflow-wrap:anywhere}
#app .description{overflow-wrap:anywhere;white-space:pre-wrap}
#app .card .status{color:var(--orange);margin-top:22px}
#app .empty{padding:60px 28px;background:#20201ee6}
#app form{display:grid;gap:20px}
#app label{display:grid;gap:7px;font-size:14px;color:var(--muted)}
#app input,#app select,#app textarea{background:#343430;border:0;border-radius:2px;color:var(--paper);font:inherit;padding:13px 14px;min-height:48px;width:100%}
#app textarea{resize:vertical;min-height:100px}
#app input[type=checkbox]{width:20px;min-height:20px;accent-color:var(--orange)}
#app .check{display:flex;align-items:center;gap:10px}
#app .split{display:grid;grid-template-columns:1fr 1fr;gap:16px}
#app .notice{padding:16px 20px;background:#3b2d22;margin:16px 0}
#app .error{background:#422820}
#app .roster{list-style:none;padding:0;margin:0}
#app .roster li{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid #ffffff16}
#app .ready{color:#9fcc9a}
#app .qr{padding:16px;background:white;width:212px;height:212px;display:grid;place-items:center}
#app .qr img{width:180px;height:180px}
#app .help{font-size:14px;max-width:660px}
#app details{margin-top:16px}
#app summary{cursor:pointer;min-height:44px}
#app code{word-break:break-all;user-select:all;font-size:12px}
#app dialog{max-width:500px;background:var(--surface);color:var(--paper);border:0;padding:24px}
#app dialog::backdrop{background:#000a}
#app img{max-width:100%}
#app{padding-top:24px;padding-bottom:64px;--paper:var(--text);--orange:#d1b16b}#app .primary{color:#171912}#app [hidden]{display:none!important}.game-room-nav{display:flex;align-items:center;gap:24px;margin:24px auto 0;max-width:1256px;padding:0 28px}.game-room-nav button{margin-left:auto;padding:10px 18px}#app img{height:auto}#app .qr img{height:180px}@media(max-width:700px){#app .grid,#app .split{grid-template-columns:1fr}#app .panel{padding:20px}#app .actions>*{flex:1}#app .qr{margin:auto}}
#app > button + form.panel{margin-top:20px}