*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden;background:#000;font-family:Segoe UI,system-ui,-apple-system,sans-serif}#loading-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f172a,#1e293b);color:#e2e8f0;text-align:center;transition:opacity .8s ease,visibility .8s ease}#loading-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.loading-content h1{font-size:2.5rem;font-weight:300;letter-spacing:.05em;margin-bottom:.5rem}.loading-content p{font-size:1rem;color:#94a3b8}#instructions{position:fixed;bottom:1.5rem;left:1.5rem;z-index:50;background:#0f172ab3;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:.75rem 1.25rem;border-radius:.75rem;color:#e2e8f0;font-size:.875rem;line-height:1.4;pointer-events:auto;opacity:1;transition:opacity 1s ease}#instructions.hidden{opacity:.24}.settings-panel{display:grid;gap:.55rem;margin-top:.7rem;max-width:32rem}.settings-panel__toggle,.settings-panel__range{display:grid;align-items:center;gap:.5rem;color:#cbd5e1}.settings-panel__toggle{grid-template-columns:auto 1fr;width:fit-content}.settings-panel__range{grid-template-columns:5.5rem minmax(8rem,1fr) 2.6rem}.settings-panel input{accent-color:#60a5fa}.settings-panel__range strong{color:#f8fafc;font-variant-numeric:tabular-nums;text-align:right}.animation-debug{position:fixed;right:12px;bottom:12px;z-index:60;width:min(360px,calc(100vw - 24px));max-height:min(560px,calc(100vh - 24px));overflow:auto;padding:12px;border:1px solid rgba(148,163,184,.35);border-radius:8px;background:#0f172ae6;color:#e2e8f0;font:12px/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;box-shadow:0 14px 40px #0f172a4d;pointer-events:none}.animation-debug__title{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-weight:700;color:#f8fafc}.animation-debug__title span,.animation-debug__section{color:#94a3b8;font-weight:600}.animation-debug__section{margin:10px 0 5px;text-transform:uppercase;font-size:10px;letter-spacing:.08em}.animation-debug__grid{display:grid;grid-template-columns:82px minmax(0,1fr);gap:4px 8px}.animation-debug__grid span{color:#94a3b8}.animation-debug__grid strong{overflow:hidden;color:#f8fafc;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.animation-debug__actions{display:grid;gap:4px}.animation-debug__action{display:grid;grid-template-columns:minmax(54px,1fr) repeat(4,auto);gap:6px;align-items:center;padding:4px 0;border-top:1px solid rgba(148,163,184,.16)}.animation-debug__action strong{overflow:hidden;color:#f8fafc;text-overflow:ellipsis;white-space:nowrap}.animation-debug__action span{color:#cbd5e1}#room-button{position:fixed;top:1rem;right:1rem;z-index:70;font-family:Segoe UI,system-ui,-apple-system,sans-serif}.room-button__toggle{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .85rem;border-radius:.5rem;border:1px solid rgba(148,163,184,.3);background:#0f172abf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#e2e8f0;font-size:.875rem;font-weight:600;cursor:pointer;transition:background .2s ease,border-color .2s ease}.room-button__toggle:hover{background:#0f172ae6;border-color:#94a3b880}.room-button__dot{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:#94a3b8}.room-button__dot--green{background:#4ade80;box-shadow:0 0 6px #4ade8080}.room-button__panel{margin-top:.5rem;padding:.75rem;border-radius:.6rem;border:1px solid rgba(148,163,184,.25);background:#0f172ad9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 14px 40px #0f172a59;min-width:220px}.room-button__row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.room-button__row:last-child{margin-bottom:0}.room-button__row--join{gap:.35rem}.room-button__row--join input{flex:1;padding:.35rem .55rem;border-radius:.35rem;border:1px solid rgba(148,163,184,.25);background:#1e293b99;color:#e2e8f0;font-size:.8rem;outline:none}.room-button__row--join input:focus{border-color:#60a5fa99}.room-button__btn{padding:.35rem .7rem;border-radius:.35rem;border:1px solid rgba(148,163,184,.3);background:#1e293b99;color:#e2e8f0;font-size:.8rem;font-weight:600;cursor:pointer;transition:background .15s ease}.room-button__btn:hover{background:#334155cc}.room-button__btn--primary{background:#60a5fa2e;border-color:#60a5fa66;color:#93c5fd;width:100%;justify-content:center}.room-button__btn--primary:hover{background:#60a5fa4d}.room-button__btn--danger{background:#f871711f;border-color:#f8717159;color:#fca5a5;width:100%}.room-button__btn--danger:hover{background:#f8717140}.room-button__btn--small{padding:.2rem .45rem;font-size:.75rem}.room-button__divider{text-align:center;color:#64748b;font-size:.75rem;margin:.4rem 0}.room-button__label{color:#94a3b8;font-size:.8rem;min-width:3.2rem}.room-button__code{flex:1;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.85rem;color:#93c5fd;font-weight:600;letter-spacing:.05em}.room-button__count{color:#e2e8f0;font-weight:600;font-size:.85rem}
