:root{font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif;color:#172033;background:#eef1f6}*{box-sizing:border-box}html,body,#app{margin:0;min-width:320px;min-height:100%}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}.page-loading{min-height:100vh;display:grid;place-items:center;background:#07172f;color:#fff}.config-page{min-height:100vh;padding:18px}.simple-settings{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;max-width:1500px;margin:0 auto 16px;padding:14px 18px;border-radius:12px;background:#fff;box-shadow:0 5px 22px #14234114}.simple-settings label{display:flex;align-items:center;gap:8px;font-size:14px;white-space:nowrap}.simple-settings input[type=range]{width:110px}.simple-settings input[type=color]{width:38px;height:30px;padding:1px;border:1px solid #ccd3df;border-radius:5px}.simple-settings b{min-width:30px}.upload-label,.minor-button,.save-button{padding:9px 14px;border:1px solid #cbd3df;border-radius:8px;background:#fff;color:#26354f}.upload-label{cursor:pointer}.upload-label input{display:none}.save-button{border-color:#286be6;background:#286be6;color:#fff;font-weight:700}.config-message{color:#286be6}.grid-frame{position:relative;width:min(1500px,calc(100vw - 36px));aspect-ratio:16 / 9;margin:auto;overflow:hidden;border-radius:10px;box-shadow:0 12px 35px #1423412e}.grid-frame>video,.grid-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.grid-background{background-size:cover;background-position:center}.config-qr{position:absolute;z-index:30;aspect-ratio:1;padding:.55%;touch-action:none;cursor:grab;transform:translate(-50%,-50%);border:2px solid #286be6;border-radius:4%;background:#fff;box-shadow:0 4px 18px #00000047}.config-qr.dragging{cursor:grabbing}.config-qr img{display:block;width:100%;height:100%;object-fit:contain}.qr-remove{position:absolute;top:-11px;right:-11px;display:grid;place-items:center;width:24px;height:24px;padding:0;border:2px solid white;border-radius:50%;color:#fff;background:#e33f4b;font-size:18px;font-weight:800;line-height:1;box-shadow:0 2px 7px #00000059}.point-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(48,1fr);grid-template-rows:repeat(27,1fr)}.point-grid:before,.point-grid:after{content:"";position:absolute;z-index:20;pointer-events:none;background:#ff2d2d}.point-grid:before{top:0;bottom:0;left:50%;width:1px;transform:translate(-1px)}.point-grid:after{left:0;right:0;top:50%;height:1px;transform:translateY(-1px)}.point-grid button{position:relative;min-width:0;padding:0;border:1px solid rgba(255,255,255,.18);background:#0714280f}.point-grid button:hover{background:#2e84ff52}.point-grid button i{position:absolute;left:50%;top:50%;display:block;transform:translate(-50%,-50%);background:linear-gradient(135deg,#3887ff,#8255ef);box-shadow:0 2px 7px #0000004d;pointer-events:none}.control-page{min-height:100vh;display:grid;grid-template-rows:1fr 1fr;gap:18px;padding:18px;background:#0b1426}.control-page button{border:0;border-radius:22px;color:#fff;font-size:clamp(24px,8vw,42px);font-weight:800}.restart-button{background:#e64b55}.random-button{background:#2472e8}.join-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:#0b1426}.join-card{width:min(100%,380px);padding:28px;text-align:center;border-radius:20px;background:#fff}.join-card h1{margin:0 0 22px}.simple-picker{display:grid;place-items:center;width:190px;height:190px;margin:0 auto 20px;overflow:hidden;border:2px dashed #9ca9bc;border-radius:50%;background:#f3f5f8;color:#66758d;cursor:pointer}.simple-picker input{display:none}.simple-picker img{width:100%;height:100%;object-fit:cover}.join-card>button{width:100%;padding:14px;border:0;border-radius:10px;background:#2472e8;color:#fff;font-weight:700}.join-card p{min-height:22px;margin:14px 0 0;color:#53627a}.wall-page{position:fixed;inset:0;overflow:hidden;color:#fff}.wall-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.wall-background.image{background-size:cover;background-position:center}.wall-qr{position:absolute;z-index:10;aspect-ratio:1;padding:.55%;transform:translate(-50%,-50%);border-radius:4%;background:#fff0;box-shadow:0 8px 30px #00000061}.wall-qr img{display:block;width:100%;height:100%;object-fit:contain}.logo-stage{position:absolute;inset:0;transform-origin:50% 50%;transition:transform 1.5s cubic-bezier(.2,.8,.2,1)}.logo-stage.finale{transform:translateY(22vh) scale(.62)}.avatar-slot{position:absolute;overflow:hidden;background:#365da9;box-shadow:0 5px 18px #0000004d}.avatar-slot img{display:block;width:100%;height:100%;object-fit:cover}.avatar-slot.animate-entry{animation:fly-in 2s ease-in-out both}@keyframes fly-in{0%{translate:var(--from-x) var(--from-y);scale:10;opacity:.75;filter:blur(2px)}to{translate:0 0;scale:1;opacity:1;filter:none}}.launch-title{position:absolute;top:17vh;left:0;right:0;margin:0;text-align:center;font-size:clamp(36px,4vw,80px);letter-spacing:.1em;text-shadow:0 7px 28px rgba(0,0,0,.65);opacity:0;transform:translateY(-35px) scale(.9);transition:opacity 1s,transform 1s}.launch-title.visible{opacity:1;transform:none}.wall-status{--status-color: #f04452;position:fixed;left:22px;bottom:22px;z-index:20;width:15px;height:15px;border-radius:50%;background:var(--status-color);box-shadow:0 0 10px color-mix(in srgb,var(--status-color) 80%,transparent)}.wall-status.accepting{--status-color: #20d878}.wall-status.connected{animation:status-heartbeat 1.45s ease-in-out infinite}.wall-status.connected:after{content:"";position:absolute;inset:-1px;border:2px solid var(--status-color);border-radius:50%;animation:status-wave 1.45s ease-out infinite}@keyframes status-heartbeat{0%,42%,to{transform:scale(1)}12%{transform:scale(1.35)}24%{transform:scale(.92)}34%{transform:scale(1.18)}}@keyframes status-wave{0%,10%{opacity:.8;transform:scale(.9)}65%,to{opacity:0;transform:scale(2.5)}}@media(max-width:800px){.config-page{padding:8px}.grid-frame{width:calc(100vw - 16px)}.simple-settings{gap:10px}}