body.control,body.landing{background:radial-gradient(1200px 600px at 10% -10%, #8b7bff1f, transparent 60%), radial-gradient(900px 500px at 110% 10%, #4fc3f71a, transparent 60%), var(--bg);min-height:100vh}.app{max-width:1600px;margin:0 auto;padding:16px clamp(16px,3vw,32px) 48px}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:8px 0 20px;display:flex}.topbar__brand{flex-wrap:wrap;align-items:center;gap:12px;font-size:1.25rem;display:flex}.topbar__brand strong{background:var(--rainbow);color:#0000;-webkit-background-clip:text;background-clip:text;font-weight:900}.topbar__status{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.pill{border:1px solid var(--border);color:var(--text-muted);border-radius:999px;align-items:center;gap:6px;padding:4px 12px;font-size:.8125rem;display:inline-flex}.pill:empty{display:none}.pill:before{content:"";background:var(--text-muted);border-radius:50%;width:8px;height:8px}.pill[data-state=ok]:before{background:var(--ok)}.pill[data-state=warn]:before{background:var(--warn)}.pill[data-state=bad]:before{background:var(--danger)}.layout{grid-template-columns:minmax(0,1fr) 360px;align-items:start;gap:20px;display:grid}.layout__main,.layout__side{flex-direction:column;gap:20px;min-width:0;display:flex}@media not (min-width:1100px){.layout{grid-template-columns:minmax(0,1fr)}}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px}.card h2{font-size:1rem}.card__header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:.5em;display:flex}.card__header h2{margin:0}label{margin:12px 0 6px;font-size:.875rem;font-weight:600;display:block}input:not([type=checkbox]){border:1px solid var(--border);background:var(--bg);width:100%;color:var(--text);font:inherit;border-radius:8px;padding:.6em .8em}.checkbox{cursor:pointer;align-items:center;gap:10px;font-weight:400;display:flex}.checkbox input{width:18px;height:18px;accent-color:var(--accent)}.clue-form__row{gap:8px;display:flex}input.mono{font-size:.8125rem}.actions{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.hint{color:var(--text-muted);margin-top:6px;font-size:.8125rem;display:block}.hint--error{color:var(--danger)}.setup{max-width:480px;margin:10vh auto 0}.setup .button{width:100%;margin-top:20px}.round h2{font-size:1.25rem}.swatches{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:8px 0 12px;display:grid}.swatch-option{border:2px solid var(--border);background:var(--bg);color:var(--text);font:inherit;cursor:pointer;border-radius:12px;flex-direction:column;gap:8px;padding:8px;transition:border-color .12s,transform .12s;display:flex}.swatch-option:hover{border-color:var(--text-muted);transform:translateY(-2px)}.swatch-option--selected{border-color:var(--accent-strong);box-shadow:0 0 0 3px #8b7bff59}.swatch-option__colour{aspect-ratio:4/3;border-radius:8px;display:block}.swatch-option__label{font-size:.875rem;font-weight:700}.target-preview{color:var(--text-muted);align-items:center;gap:10px;display:flex}.board-card{overflow-x:auto}.board-card .board{min-width:720px;font-size:clamp(11px,1.1vw,16px)}.live-info{color:var(--text-muted);margin-bottom:12px;font-weight:600}.leaderboard{counter-reset:rank;margin:0 0 16px;padding:0;list-style:none}.leaderboard li{border-bottom:1px solid var(--border);counter-increment:rank;justify-content:space-between;gap:8px;padding:6px 0;display:flex}.leaderboard li:not(.empty):before{content:counter(rank);width:1.5em;color:var(--text-muted)}.leaderboard li span:first-of-type{text-overflow:ellipsis;flex:1;overflow:hidden}.leaderboard .score{font-variant-numeric:tabular-nums;font-weight:700}.layout__side .card>input{margin-bottom:12px}.toasts{z-index:100;flex-direction:column;gap:8px;max-width:min(420px,100vw - 32px);display:flex;position:fixed;bottom:16px;right:16px}.toast{background:var(--surface-raised);border:1px solid var(--border);border-radius:10px;padding:12px 16px;transition:opacity .3s;animation:.2s ease-out toast-in;box-shadow:0 8px 24px #0006}.toast--error{border-color:var(--danger)}.toast--leaving{opacity:0}@keyframes toast-in{0%{opacity:0;transform:translateY(10px)}}.auth{max-width:420px;margin:0 auto;padding:10vh 16px 48px}.auth__brand{text-align:center;background:var(--rainbow);color:#0000;-webkit-background-clip:text;background-clip:text;margin-bottom:20px;font-size:2rem;font-weight:900;text-decoration:none;display:block}.auth__card h1{font-size:1.5rem}.auth__card .button[type=submit]{width:100%;margin-top:20px}.auth__switch{text-align:center;margin:16px 0 0}.auth__switch a,.topbar__brand a{color:var(--accent-strong);text-decoration:none}.field+.field{margin-top:4px}.form-error{border:1px solid var(--danger);color:var(--danger);background:#ff6b6b14;border-radius:8px;margin:16px 0 0;padding:10px 12px}.lobby{flex-direction:column;gap:20px;max-width:640px;margin:0 auto;display:flex}.room-list{margin:0;padding:0;list-style:none}.room-list li{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;display:flex}.room-list li:last-child{border-bottom:0}.room-list__actions{gap:8px;display:flex}.landing__main{text-align:center;max-width:720px;margin:0 auto;padding:14vh 24px 48px}.landing__title{letter-spacing:-.02em;background:var(--rainbow);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(3rem,9vw,5.5rem);font-weight:900}.landing__title span{color:var(--text-muted);-webkit-text-fill-color:var(--text-muted)}.landing__lead{color:var(--text-muted);margin-bottom:2em;font-size:1.2rem}.landing__lead kbd{border:1px solid var(--border);color:var(--text);border-radius:4px;padding:.1em .4em}.landing__steps{text-align:left;max-width:520px;color:var(--text-muted);margin:3em auto 0;padding-left:1.2em;line-height:1.8}.landing__actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}
