:root{color:#fff;font-family:Segoe UI,Helvetica Neue,Arial,sans-serif;--qiss-violet: #d31ae0;--qiss-violet-deep: #8c1496;--qiss-violet-dark: #3f0a46}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%}.board-screen{position:relative;display:flex;width:100%;height:100%;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(circle at 20% 20%,#e954f3 0%,var(--qiss-violet) 28%,var(--qiss-violet-deep) 55%,var(--qiss-violet-dark) 100%)}.board-waiting{background:radial-gradient(circle at 30% 30%,#f06af8 0%,var(--qiss-violet) 30%,#9c17a8 58%,var(--qiss-violet-dark) 100%)}.board-live{background:radial-gradient(circle at 30% 20%,#ef67f8 0%,var(--qiss-violet) 28%,var(--qiss-violet-deep) 60%,var(--qiss-violet-dark) 100%)}.board-error{background:radial-gradient(circle at 30% 30%,#e34eef 0%,var(--qiss-violet) 30%,var(--qiss-violet-deep) 62%,var(--qiss-violet-dark) 100%)}.board-card{width:min(92vw,880px);border-radius:24px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(145deg,#ffffff1f,#ffffff0a);box-shadow:0 24px 90px #00000080;padding:clamp(24px,4vw,48px);text-align:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.board-card-large{width:min(92vw,980px)}.board-eyebrow{margin:0;letter-spacing:.12em;font-size:clamp(.8rem,1vw,1rem);text-transform:uppercase;opacity:.9}.board-card h1,.event-panel h1{margin:.5rem 0 1rem;font-size:clamp(2rem,5vw,4.2rem);line-height:1.12}.board-help{margin:0 auto 1.2rem;width:min(82%,680px);color:#ffffffd9;font-size:clamp(1rem,1.3vw,1.45rem)}.pairing-code{margin:.75rem auto .25rem;width:fit-content;border-radius:18px;border:1px solid rgba(255,255,255,.25);background:#ffffff14;padding:.4em .75em;font-size:clamp(3rem,9vw,7.2rem);letter-spacing:.2em;font-weight:700;font-family:Lucida Console,Monaco,monospace}.board-expiry{margin:.5rem 0 0;font-size:clamp(.95rem,1.2vw,1.2rem);opacity:.8}.board-button{border:0;border-radius:10px;padding:12px 18px;background:var(--qiss-violet);color:#fff;font-size:1rem;cursor:pointer}.event-banner{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.board-overlay{position:absolute;inset:0;background:linear-gradient(165deg,#d31ae033,#8c1496b8 52%,#3f0a46f0)}.event-panel{position:relative;z-index:1;text-align:center;padding:clamp(20px,4vw,40px)}.event-status{margin:.2rem 0 0;font-size:clamp(1.2rem,2vw,2rem);opacity:.95}.countdown{margin-top:1.1rem;font-size:clamp(2.2rem,9vw,7.6rem);font-weight:800;letter-spacing:.03em;text-shadow:0 10px 36px rgba(42,5,46,.52)}.board-with-participants{align-items:stretch;gap:clamp(12px,2vw,32px);padding:clamp(10px,2vh,28px) clamp(14px,2vw,36px)}.board-layout-right{flex-direction:row}.board-layout-right .event-panel{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center}.board-layout-right .participants-section{width:min(38vw,520px);max-height:calc(100vh - (2*clamp(10px,2vh,28px)));padding:clamp(8px,1.5vw,20px)}.board-layout-right .participants-title{text-align:left}.board-layout-right .participants-grid{justify-content:flex-start}.board-layout-bottom{flex-direction:column;justify-content:flex-start;padding-top:3vh}.board-layout-bottom .event-panel{flex-shrink:0}.board-layout-bottom .countdown{font-size:clamp(1.8rem,6vw,4.8rem)}.participants-section{position:relative;z-index:1;width:100%;max-height:42vh;overflow-y:auto;padding:clamp(8px,1.5vw,20px) clamp(20px,4vw,60px);scrollbar-width:none}.participants-section::-webkit-scrollbar{display:none}.participants-group{margin-bottom:1rem}.participants-title{margin:0 0 .75rem;font-size:clamp(.85rem,1.3vw,1.2rem);text-transform:uppercase;letter-spacing:.08em;opacity:.85;text-align:center}.participants-grid{display:flex;flex-wrap:wrap;gap:clamp(8px,1vw,16px);justify-content:center}.participant-card{display:flex;flex-direction:column;align-items:center;gap:4px;width:clamp(60px,5.5vw,88px)}.participant-avatar{width:clamp(36px,4vw,60px);height:clamp(36px,4vw,60px);border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.35)}.participant-avatar-placeholder{display:flex;align-items:center;justify-content:center;background:#ffffff1f;font-size:clamp(.65rem,1.1vw,.95rem);font-weight:600}.participant-handle{font-size:clamp(.5rem,.75vw,.75rem);opacity:.8;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.participant-gender-dot{display:inline-block;width:6px;height:6px;border-radius:50%}.participants-density-compact .participants-grid{gap:clamp(6px,.8vw,10px)}.participants-density-compact .participant-card{width:clamp(50px,4.8vw,70px)}.participants-density-compact .participant-avatar{width:clamp(30px,3vw,44px);height:clamp(30px,3vw,44px)}.participants-density-compact .participant-handle{font-size:clamp(.45rem,.65vw,.62rem)}