*{box-sizing:border-box;margin:0;padding:0}body{font-family:sans-serif;background:#1a1a2e;color:#eee;-webkit-tap-highlight-color:transparent}button,a,input,select,textarea{touch-action:manipulation}.app{max-width:800px;margin:0 auto;padding:16px}header{display:flex;align-items:center;gap:8px;padding:12px 0;border-bottom:1px solid #333;margin-bottom:12px;flex-wrap:wrap}header h1{font-size:1.6rem}.venue-label{font-size:.8rem;color:#888;flex:1}.logout-btn{padding:6px 14px;border-radius:8px;border:1px solid #555;background:transparent;color:#aaa;cursor:pointer}.settings-btn{padding:6px 10px;border-radius:8px;border:1px solid #555;background:transparent;color:#aaa;cursor:pointer;font-size:1rem}.settings-btn:hover{color:#eee;border-color:#888}.launch-btn{padding:7px 14px;border-radius:8px;border:1px solid #0f3460;background:#0f3460;color:#eee;cursor:pointer;font-size:.9rem;white-space:nowrap}.launch-btn:hover:not(:disabled){background:#1a4a80}.launch-btn.connected{background:#0d4a1e;border-color:#0d4a1e;color:#4caf50;cursor:default}.launch-btn:disabled{opacity:.8;cursor:default}.controls{display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #333;margin-bottom:4px;flex-wrap:wrap}.controls button{padding:8px 14px;border-radius:8px;border:none;background:#0f3460;color:#eee;cursor:pointer;font-size:1rem}.controls button:hover:not(:disabled){background:#1a4a80}.controls button:disabled{opacity:.35;cursor:default}.time{font-size:.85rem;color:#888;white-space:nowrap}.seek-slider{flex:1;min-width:80px;accent-color:#0f3460;cursor:pointer}.seek-slider:disabled{opacity:.3;cursor:default}.audio-mode-btn{padding:6px 12px;border-radius:8px;border:none;background:#1a4a2e;color:#7fc97f;cursor:pointer;font-size:.85rem;white-space:nowrap}.audio-mode-btn:hover:not(:disabled){background:#255a3a}.audio-mode-btn:disabled{opacity:.35;cursor:default}.autoplay-label{display:flex;align-items:center;gap:6px;font-size:.85rem;color:#aaa;cursor:pointer;margin-left:auto}.autoplay-label input{cursor:pointer}.pitch-tempo{display:flex;align-items:center;gap:6px;padding:8px 0;border-bottom:1px solid #333;flex-wrap:wrap}.pitch-tempo button{padding:5px 10px;border-radius:6px;border:none;background:#0f3460;color:#eee;cursor:pointer}.pitch-tempo button:hover:not(:disabled){background:#1a4a80}.pitch-tempo button:disabled{opacity:.35;cursor:default}.pt-label{font-size:.82rem;color:#888}.pt-val{font-size:.9rem;min-width:32px;text-align:center;color:#ffc107}.pt-val.neutral{color:#666}.pt-sep{flex:0 0 12px}.now-playing{padding:6px 0 10px;font-size:.9rem;color:#7ec8e3}.now-artist{color:#888}.tabs{display:flex;gap:8px;margin-bottom:16px}.tabs button{padding:8px 20px;border-radius:8px;border:1px solid #333;background:transparent;color:#aaa;cursor:pointer;font-size:.95rem}.tabs button.active{background:#0f3460;border-color:#0f3460;color:#eee}.badge{background:#e53935;color:#fff;border-radius:10px;padding:1px 7px;font-size:.75rem;margin-left:6px}.queue-item{display:flex;align-items:center;gap:12px;background:#16213e;border-radius:8px;padding:10px 14px;margin-bottom:8px}.queue-order{width:24px;text-align:center;color:#666;font-size:.85rem;flex-shrink:0}.queue-info{flex:1;min-width:0}.queue-title{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-artist{display:block;font-size:.85rem;color:#aaa}.queue-actions{display:flex;gap:6px;flex-shrink:0}.icon-btn{width:30px;height:30px;border-radius:6px;border:1px solid #333;background:#1a1a2e;color:#ccc;cursor:pointer;font-size:.75rem;display:flex;align-items:center;justify-content:center}.icon-btn:hover:not(:disabled){background:#0f3460;border-color:#0f3460;color:#fff}.icon-btn:disabled{opacity:.3;cursor:default}.play-now-btn:hover:not(:disabled){background:#0d4a1e!important;border-color:#0d4a1e!important;color:#4caf50!important}.remove-btn:hover:not(:disabled){background:#7c1a1a!important;border-color:#7c1a1a!important;color:#f88!important}.search-wrap{margin-bottom:10px}.search-input{width:100%;padding:10px 14px;border-radius:8px;border:1px solid #333;background:#16213e;color:#eee;font-size:16px;outline:none}.search-input:focus{border-color:#0f3460}.catalog-count{font-size:.8rem;color:#666;margin-bottom:10px}.catalog-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid #222}.catalog-item:hover{background:#16213e;border-radius:8px}.catalog-info{flex:1;min-width:0}.catalog-title{display:block;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.catalog-artist{display:block;font-size:.85rem;color:#aaa}.add-btn{padding:6px 14px;border-radius:6px;border:none;background:#0f3460;color:#eee;cursor:pointer;font-size:.85rem;white-space:nowrap;flex-shrink:0}.add-btn:hover{background:#1a4a80}.beta-badge-inline{background:#e53935;color:#fff;border-radius:4px;padding:1px 6px;font-size:.7rem;margin-left:6px;vertical-align:middle}.empty{color:#666;padding:32px;text-align:center}.guest-link-row{display:flex;align-items:center;gap:8px;background:#16213e;border-radius:8px;padding:10px 14px;margin-bottom:16px;flex-wrap:wrap}.guest-link-label{font-size:.82rem;color:#888;flex-shrink:0}.guest-link-url{flex:1;min-width:0;background:#0d0d1a;border:1px solid #333;border-radius:6px;padding:5px 10px;font-size:.8rem;color:#7ec8e3;word-break:break-all;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.section-header h3{font-size:.95rem;color:#aaa}.clear-btn{padding:5px 12px;border-radius:6px;border:1px solid #555;background:transparent;color:#aaa;cursor:pointer;font-size:.82rem}.clear-btn:hover{background:#3d0d0d;color:#f88;border-color:#f44}.guest-card{display:flex;align-items:center;gap:12px;background:#16213e;border-radius:8px;padding:12px 14px;margin-bottom:8px}.guest-card.pending{border-left:3px solid #ffc107}.guest-card.joined{border-left:3px solid #4caf50}.guest-info{flex:1;min-width:0}.guest-name{font-weight:600}.guest-seat{font-size:.82rem;color:#aaa;margin-top:2px}.guest-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.table-input{width:70px;padding:5px 8px;border-radius:6px;border:1px solid #333;background:#1a1a2e;color:#eee;font-size:16px}.approve-btn{padding:5px 12px;border-radius:6px;border:none;background:#0d4a1e;color:#4caf50;cursor:pointer;font-size:.85rem}.approve-btn:hover{background:#1a6030}.remove-btn2{width:28px;height:28px;border-radius:6px;border:1px solid #333;background:transparent;color:#888;cursor:pointer;font-size:.8rem;display:flex;align-items:center;justify-content:center}.remove-btn2:hover{background:#7c1a1a;border-color:#f44;color:#f88}.sreq-card{display:flex;align-items:flex-start;gap:12px;background:#16213e;border-radius:8px;padding:12px 14px;margin-bottom:8px;flex-wrap:wrap}.sreq-card.queued{opacity:.6}.sreq-card.rejected{opacity:.5}.sreq-info{flex:1;min-width:150px}.sreq-title{font-weight:600}.sreq-artist{font-size:.85rem;color:#aaa;margin-top:2px}.sreq-guest{font-size:.8rem;color:#777;margin-top:4px}.sreq-status-label{display:flex;align-items:center}.s-badge{padding:3px 10px;border-radius:12px;font-size:.75rem;font-weight:600}.s-badge.pending{background:#5a4000;color:#ffc107}.s-badge.queued{background:#0d3d1e;color:#4caf50}.s-badge.rejected{background:#3d0d0d;color:#f44336}.sreq-actions{display:flex;gap:6px;flex-wrap:wrap}.q-btn{padding:5px 10px;border-radius:6px;border:none;background:#0f3460;color:#eee;cursor:pointer;font-size:.82rem}.q-btn:hover{background:#1a4a80}.next-btn{padding:5px 10px;border-radius:6px;border:none;background:#2a5500;color:#afe;cursor:pointer;font-size:.82rem}.next-btn:hover{background:#3a7000}.rej-btn{padding:5px 10px;border-radius:6px;border:none;background:#3d0d0d;color:#f88;cursor:pointer;font-size:.82rem}.rej-btn:hover{background:#7c1a1a}.login-wrap{display:flex;justify-content:center;align-items:center;min-height:100vh}.login-box{background:#16213e;padding:32px;border-radius:12px;display:flex;flex-direction:column;gap:16px;min-width:300px}.login-box h1{text-align:center}.login-box form{display:flex;flex-direction:column;gap:10px}.login-box input{padding:10px;border-radius:8px;border:1px solid #333;background:#1a1a2e;color:#eee;font-size:16px}.login-box button{padding:10px;border-radius:8px;border:none;background:#0f3460;color:#eee;cursor:pointer;font-size:1rem}.error{color:#f88;font-size:.9rem}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100}.modal{background:#16213e;border-radius:12px;padding:0;min-width:340px;max-width:640px;width:90%}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #333}.modal-header h2{font-size:1.1rem}.close-btn{background:transparent;border:none;color:#aaa;font-size:1.2rem;cursor:pointer;padding:4px 8px}.close-btn:hover{color:#eee}.modal-body{padding:20px;display:flex;flex-direction:column;gap:16px}.cmd-block{display:flex;flex-direction:column;gap:6px}.cmd-label{font-size:.8rem;color:#888;font-weight:600;text-transform:uppercase}.cmd-row{display:flex;align-items:stretch;gap:8px}.cmd-code{flex:1;background:#0d0d1a;border:1px solid #333;border-radius:6px;padding:8px 12px;font-size:.82rem;color:#7ec8e3;word-break:break-all;white-space:pre-wrap}.copy-btn{padding:6px 12px;border-radius:6px;border:1px solid #333;background:#1a1a2e;color:#aaa;cursor:pointer;font-size:.82rem;white-space:nowrap;flex-shrink:0}.copy-btn:hover{background:#0f3460;color:#eee;border-color:#0f3460}.cmd-hint{font-size:.82rem;color:#666}.setting-row{display:flex;flex-direction:column;gap:6px}.setting-row label{font-size:.85rem;color:#aaa}.setting-row input{padding:8px 12px;border-radius:8px;border:1px solid #333;background:#0d0d1a;color:#eee;font-size:16px;outline:none}.setting-row input:focus{border-color:#0f3460}.save-btn{padding:10px;border-radius:8px;border:none;background:#0f3460;color:#eee;cursor:pointer;font-size:1rem}.save-btn:hover{background:#1a4a80}@media (max-width: 480px){.app{padding:10px}header{flex-direction:column;align-items:stretch;gap:8px}header h1{width:100%;font-size:1.3rem}.venue-label{flex:none}.launch-btn{font-size:.82rem;padding:6px 10px}.logout-btn{padding:6px 10px}.controls{gap:6px}.controls button{padding:8px 10px;font-size:.95rem}.seek-slider{width:100%;flex:none;order:10}.autoplay-label{width:100%;margin-left:0;order:11;padding-top:4px}.pitch-tempo{gap:4px}.pt-label{font-size:.75rem}.pt-sep{flex:0 0 6px}.tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:6px}.tabs::-webkit-scrollbar{display:none}.tabs button{padding:8px 14px;font-size:.85rem;flex-shrink:0}.icon-btn{width:36px;height:36px}.queue-actions,.guest-card{flex-wrap:wrap}.guest-actions{width:100%;flex-wrap:wrap}.table-input{width:80px}.sreq-actions{width:100%}.sreq-actions button{flex:1;text-align:center}.catalog-item{flex-wrap:wrap}.add-btn{width:100%;text-align:center;margin-top:6px}.modal{width:95%;min-width:auto}.login-box{min-width:auto;width:calc(100vw - 32px);padding:24px 16px}}@media (min-width: 481px) and (max-width: 768px){header{flex-wrap:wrap}.tabs button{font-size:.88rem;padding:8px 14px}}@media (min-width: 1024px){.app{padding:24px}}