*,:after,:before{box-sizing:border-box;margin:0;padding:0}#__next,body,html{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0f0f14;color:#e4e4e7;overflow:hidden}a{color:inherit;text-decoration:none}.app{display:flex;flex-direction:column;height:100vh}.topbar{justify-content:space-between;padding:0 20px;height:56px;background:#18181f;border-bottom:1px solid #27272e;flex-shrink:0}.logo,.topbar{display:flex;align-items:center}.logo{gap:10px;font-size:1.2rem;font-weight:700;letter-spacing:-.5px}.main-content{flex:1 1;overflow:auto}.lobby{max-width:960px;margin:0 auto;padding:40px 20px}.lobby h1{font-size:2rem;margin-bottom:8px}.lobby .subtitle{color:#a1a1aa;margin-bottom:32px}.start-section{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:40px}.url-field{width:400px}.name-input{background:#1e1e28;border:1px solid #3f3f50;border-radius:8px;color:#e4e4e7;padding:10px 16px;font-size:1rem;outline:none;width:240px}.name-input:focus{border-color:#a78bfa}.btn-primary{background:#7c3aed;color:#fff;border:none;border-radius:8px;padding:10px 24px;font-size:1rem;font-weight:600;cursor:pointer;transition:background .15s}.btn-primary:hover{background:#6d28d9}.section-title{font-size:1.1rem;color:#a1a1aa;margin-bottom:16px;text-transform:uppercase;letter-spacing:1px;font-weight:600;font-size:.85rem}.room-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));grid-gap:16px;gap:16px}.room-card{background:#1e1e28;border:1px solid #27272e;border-radius:12px;padding:20px;cursor:pointer;transition:border-color .15s,transform .15s}.room-card:hover{border-color:#7c3aed;transform:translateY(-2px)}.room-card .streamer-name{font-size:1.15rem;font-weight:600;margin-bottom:8px}.room-card .viewer-count{color:#a1a1aa;font-size:.9rem;display:flex;align-items:center;gap:6px}.live-dot{width:8px;height:8px;background:#ef4444;border-radius:50%;display:inline-block;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.empty-state{text-align:center;padding:60px 20px;color:#52525b}.empty-state p{margin-bottom:8px}.fullscreen-iframe{position:fixed;top:0;left:0;width:100vw;height:100vh;border:none;z-index:0}.widget-tab{position:fixed;top:50%;right:0;transform:translateY(-50%);z-index:1000;background:rgba(30,30,40,.55);border:1px solid rgba(63,63,80,.4);border-right:none;border-radius:6px 0 0 6px;width:20px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#71717a;transition:background .15s,color .15s,width .15s;padding:0}.widget-tab:hover{background:rgba(40,40,55,.85);color:#e4e4e7;width:26px}.widget-tab svg{width:12px;height:12px}.widget-tab-dot{position:absolute;top:4px;right:3px;width:6px;height:6px;background:#ef4444;border-radius:50%;animation:pulse 1.5s ease-in-out infinite}.widget-panel{position:fixed;top:60px;right:16px;z-index:1000;width:320px;background:rgba(24,24,31,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid #27272e;border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,.5);overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:#e4e4e7}.widget-drag-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;background:rgba(39,39,46,.6);cursor:-webkit-grab;cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-bottom:1px solid #27272e}.widget-drag-bar:active{cursor:-webkit-grabbing;cursor:grabbing}.widget-drag-dots{color:#52525b;font-size:1.1rem;line-height:1}.widget-title{font-size:.85rem;font-weight:600;flex:1 1}.widget-close{background:none;border:none;color:#71717a;font-size:1rem;cursor:pointer;padding:2px 4px}.widget-close:hover{color:#e4e4e7}.widget-body{padding:14px;display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 160px);overflow-y:auto}.widget-status{justify-content:space-between}.widget-live,.widget-status{display:flex;align-items:center}.widget-live{gap:6px;color:#ef4444;font-weight:700;font-size:.85rem}.widget-offline{color:#71717a;font-size:.85rem;font-weight:600}.widget-viewers{color:#a1a1aa;font-size:.8rem}.widget-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.5px;color:#71717a;font-weight:600;margin-bottom:-4px}.widget-input{background:#1a1a24;border:1px solid #3f3f50;border-radius:8px;color:#e4e4e7;padding:8px 12px;font-size:.82rem;outline:none;width:100%}.widget-input:focus{border-color:#a78bfa}.widget-input:disabled{opacity:.45;cursor:not-allowed}.widget-btn{border:none;border-radius:8px;padding:10px 16px;font-size:.85rem;font-weight:600;cursor:pointer;width:100%;transition:opacity .15s}.widget-btn:hover{opacity:.9}.widget-btn-go{background:#7c3aed;color:#fff}.widget-btn-stop{background:#ef4444;color:#fff}.widget-btn-chat{background:#2563eb;color:#fff}.widget-share-row{display:flex;gap:6px}.widget-share-input{flex:1 1;font-size:.75rem;padding:7px 10px}.widget-copy-btn{background:#7c3aed;color:#fff;border:none;border-radius:8px;padding:7px 14px;font-size:.8rem;font-weight:600;cursor:pointer;white-space:nowrap}.widget-copy-btn:hover{background:#6d28d9}.widget-debug{margin-top:4px}.widget-debug summary{font-size:.75rem;color:#52525b;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.widget-debug summary:hover{color:#71717a}.widget-debug-content{padding:8px 0 0;font-size:.72rem;color:#52525b;display:flex;flex-direction:column;gap:3px}.widget-debug-content code{background:#1a1a24;padding:1px 5px;border-radius:4px;font-size:.7rem}.chat-panel{width:340px;display:flex;flex-direction:column;background:#18181f;flex-shrink:0}.chat-overlay,.chat-panel{border-left:1px solid #27272e}.chat-overlay{position:absolute;right:0;top:0;bottom:0;z-index:20;box-shadow:-4px 0 20px rgba(0,0,0,.5)}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;font-weight:600;border-bottom:1px solid #27272e;flex-shrink:0}.chat-close{background:none;border:none;color:#a1a1aa;font-size:1.4rem;cursor:pointer}.chat-close:hover{color:#fff}.chat-messages{flex:1 1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:6px}.chat-msg{font-size:.9rem;line-height:1.4;word-break:break-word}.chat-nick{font-weight:600;margin-right:6px;color:#a78bfa}.nick-streamer{color:#f59e0b}.chat-text{color:#d4d4d8}.streamer-msg{background:rgba(245,158,11,.08);padding:4px 8px;border-radius:6px}.chat-input-row{display:flex;padding:12px;gap:8px;border-top:1px solid #27272e;flex-shrink:0}.chat-input{flex:1 1;background:#1e1e28;border:1px solid #3f3f50;border-radius:6px;color:#e4e4e7;padding:8px 12px;font-size:.9rem;outline:none}.chat-input:focus{border-color:#a78bfa}.chat-send-btn{background:#7c3aed;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-weight:600;cursor:pointer;font-size:.85rem}.chat-send-btn:hover{background:#6d28d9}.chat-toggle-btn{position:absolute;bottom:20px;right:20px;z-index:20;background:#7c3aed;border:none;border-radius:50%;width:52px;height:52px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.4)}.chat-toggle-btn:hover{background:#6d28d9}.chat-badge{position:absolute;top:-4px;right:-4px;background:#ef4444;color:#fff;border-radius:50%;width:20px;height:20px;font-size:.7rem;display:flex;align-items:center;justify-content:center;font-weight:700}.viewer-layout{height:100%}.video-area,.viewer-layout{display:flex;position:relative}.video-area{flex:1 1;background:#000;align-items:center;justify-content:center}.video-area video{width:100%;height:100%;object-fit:contain}.stream-info{position:absolute;top:12px;left:12px;display:flex;gap:8px;align-items:center;z-index:5}.stream-info .live-tag{background:#ef4444;color:#fff;padding:4px 10px;border-radius:4px;font-size:.75rem;font-weight:700;text-transform:uppercase}.stream-info .streamer-label{background:rgba(0,0,0,.6);padding:4px 12px;border-radius:4px;font-size:.85rem}.ended-state,.waiting-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:16px;color:#71717a}.waiting-state .spinner{width:40px;height:40px;border:3px solid #27272e;border-top-color:#7c3aed;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}@media (max-width:768px){.chat-panel:not(.chat-overlay){display:none}.streamer-layout .game-area,.viewer-layout .video-area{width:100%}}