*{box-sizing:border-box;margin:0;padding:0}body{font-family:monospace,Courier New,Courier;background:#f5f5f5;min-height:100vh;padding:20px;color:#333}.prototype-banner{background:#fc0;color:#333;padding:8px 16px;text-align:center;font-weight:700;font-size:.9rem;border:2px dashed #333;margin-bottom:20px}.container{max-width:700px;margin:0 auto}header{margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #333}header h1{font-size:1.5rem;margin-bottom:4px}.subtitle{font-size:.9rem;color:#666}.card{background:#fff;border:1px solid #ccc;padding:16px;margin-bottom:16px}.card h2{margin-bottom:16px;font-size:1.1rem;border-bottom:1px solid #eee;padding-bottom:8px}.form-group{margin-bottom:16px}.hint{font-size:.85rem;color:#666;margin-bottom:16px}.error-message{color:#c00;font-size:.85rem;margin-top:8px;padding:8px;background:#fee;border:1px solid #ffcccc}.form-group label{display:block;margin-bottom:4px;font-weight:700;font-size:.9rem}.form-group input{width:100%;padding:8px;border:1px solid #999;font-family:monospace;font-size:.9rem}.form-group input:focus{outline:2px solid #333}.btn{width:100%;padding:10px;font-size:.9rem;font-weight:700;border:2px solid #333;cursor:pointer;margin-bottom:8px;font-family:monospace}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-secondary{background:#666;color:#fff;border-color:#444}.btn-secondary:hover:not(:disabled){background:#555}.btn-primary{background:#333;color:#fff}.btn-primary:hover:not(:disabled){background:#555}.btn-danger{background:#c00;color:#fff;border-color:#900}.btn-danger:hover:not(:disabled){background:#900}.status-info{padding:10px;background:#eee;border:1px solid #ccc;font-family:monospace;font-size:.85rem;line-height:1.5}.status-dashboard{margin-bottom:12px}.status-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid #ddd}.status-row:last-child{border-bottom:none}.status-label{font-weight:700;font-size:.85rem}.status-indicator{font-family:monospace;font-size:.8rem;padding:2px 8px;border-radius:2px}.status-indicator.ok{background:#d4edda;color:#155724}.status-indicator.error{background:#f8d7da;color:#721c24}.status-indicator.warning{background:#fff3cd;color:#856404}.status-indicator.loading{background:#e2e3e5;color:#383d41}.meters{display:flex;gap:16px}.meter{flex:1}.meter-label{display:flex;justify-content:space-between;margin-bottom:6px;font-size:.8rem;font-weight:700}.meter-value{font-family:monospace}.meter-bar{height:150px;background:#ddd;border:1px solid #999;position:relative;overflow:hidden}.meter-fill{position:absolute;bottom:0;left:0;right:0;background:#4a4;transition:height .05s}#debugInfo{background:#222;color:#0f0;padding:12px;font-size:.75rem;overflow-x:auto;line-height:1.5;max-height:200px;overflow-y:auto}.qr-container{text-align:center}#qrCanvas{max-width:100%;height:auto;border:4px solid #333}.qr-hint{margin-top:12px;font-size:.9rem;color:#666}.qr-url-row{display:flex;gap:8px;margin-top:12px}.qr-url-input{flex:1;padding:8px;font-family:monospace;font-size:.75rem;border:1px solid #999;background:#f5f5f5}.btn-copy{width:auto;padding:8px 16px;margin-bottom:0;background:#666;color:#fff;border-color:#444}.btn-copy:hover:not(:disabled){background:#555}.btn-copy.copied{background:#4a4;border-color:#3a3}.input-with-button{display:flex;gap:8px}.input-with-button input{flex:1}.input-with-button .btn{width:auto;margin-bottom:0;padding:8px 16px}.room-actions{display:flex;gap:8px;margin-bottom:16px}.room-actions .btn{flex:1;margin-bottom:0}.room-list{border:1px solid #ddd;background:#fafafa;max-height:300px;overflow-y:auto}.room-list-empty{padding:16px;text-align:center;color:#666;font-style:italic}.room-item{display:flex;justify-content:space-between;align-items:center;padding:12px;border-bottom:1px solid #ddd;gap:12px}.room-item:last-child{border-bottom:none}.room-info{flex:1;min-width:0}.room-name{font-weight:700;font-size:.95rem;word-break:break-word}.room-meta{font-size:.8rem;color:#666;margin-top:2px}.room-meta .agent-badge{color:#155724;background:#d4edda;padding:1px 6px;border-radius:2px;margin-left:6px}.room-actions-inline{display:flex;gap:6px;flex-shrink:0}.room-actions-inline .btn{width:auto;padding:6px 12px;margin-bottom:0;font-size:.8rem}.btn-small{padding:6px 12px;font-size:.8rem}.btn-small.btn-danger{background:#dc3545;border-color:#c82333}.btn-small.btn-danger:hover:not(:disabled){background:#c82333}.dashboard-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px;padding-bottom:16px;border-bottom:2px solid #333}.dashboard-header .welcome h2{font-size:1.2rem;margin-bottom:4px}.dashboard-header .welcome p{font-size:.85rem;color:#666}.dashboard-header .btn{width:auto;margin:0}.admin-badge{background:#6c5ce7;color:#fff;padding:2px 8px;border-radius:2px;font-size:.75rem;margin-left:8px}.auth-switch{text-align:center;font-size:.85rem;color:#666;margin-top:16px}.auth-switch a{color:#333;font-weight:700}.room-info-card{border:1px solid #ddd;padding:16px;background:#fafafa}.room-info-card .room-details h3{font-size:1.1rem;margin-bottom:8px}.room-info-card .room-meta,.room-links{margin-bottom:16px}.link-group{margin-bottom:12px}.link-group label{display:block;font-size:.85rem;font-weight:700;margin-bottom:4px}.link-input{width:100%;padding:8px;font-family:monospace;font-size:.75rem;border:1px solid #999;background:#fff}.broadcast-header{display:flex;align-items:center;gap:16px;margin-bottom:20px;padding-bottom:16px;border-bottom:2px solid #333}.broadcast-header .btn{width:auto;margin:0}.broadcast-header h2{flex:1;font-size:1.2rem}.button-group{display:flex;gap:8px}.button-group .btn{flex:1}.loading{text-align:center;padding:40px;color:#666}.download-btn{background:#17a2b8;color:#fff;border-color:#138496}.download-btn:hover:not(:disabled){background:#138496}@media(max-width:600px){body{padding:10px}header h1{font-size:1.2rem}.card{padding:12px}.meters{flex-direction:column}.meter-bar{height:100px}.room-item{flex-direction:column;align-items:flex-start}.room-actions-inline{margin-top:8px;width:100%}.room-actions-inline .btn{flex:1}.dashboard-header{flex-direction:column;gap:12px}.dashboard-header .btn{width:100%}.broadcast-header{flex-direction:column;align-items:flex-start;gap:8px}.broadcast-header .btn{width:100%}.button-group{flex-direction:column}}
