*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif;background-color:#f5f5f5;padding:20px;color:#333;line-height:1.6}h1{text-align:center;margin-bottom:20px;color:#222;font-size:1.8rem}h2{color:#222;font-size:1.4rem}p{margin:10px 0}li{list-style-position:inside}#my-id{font-family:monospace;color:#06c;font-weight:700}#stt-status{font-weight:700}.main-area{display:flex;justify-content:center}.control-panel{display:flex;gap:48px;background:#fff;padding:16px;border-radius:6px;border:1px solid #ddd;margin-bottom:12px}.child-panel{display:flex;flex-direction:column;gap:14px}.info-panel{background:#fff;padding:16px;border-radius:6px;margin-bottom:12px;border:1px solid #ddd}.video-panel{display:flex;align-items:center;justify-content:center}input[type=text],select{padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;width:200px}input[type=text]:focus,select:focus{outline:none;border-color:#06c}button{padding:8px 16px;border:1px solid #ddd;border-radius:4px;font-size:14px;cursor:pointer;background:#fff;transition:background-color .2s}button:hover{background-color:#f0f0f0}button:disabled{opacity:.6;cursor:not-allowed}video{width:100%;max-width:200px;height:auto;border:1px solid #ddd;border-radius:4px;background:#000}#button-area,#remote-media-area{margin:20px 0}#stt-results-container{width:800px;background:#fff;padding:16px 0;border-radius:6px;border:1px solid #ddd;margin-left:12px}#stt-results-container h2{margin:0 0 16px 16px}#stt-results{height:500px;padding:16px;overflow-y:scroll}.stt-message{display:flex;flex-direction:column;margin-bottom:16px;padding:12px;border-radius:8px;background:#f8f9fa;transition:all .2s ease}.stt-message-header{display:flex;align-items:center;margin-bottom:8px;font-size:.85rem;color:#6c757d}.stt-timestamp{background:#888;color:#fff;padding:2px 6px;border-radius:4px;font-family:monospace;font-size:.75rem;margin-right:8px}.stt-member{font-weight:600;color:#495057}.stt-text{font-size:.95rem;line-height:1.4;color:#212529;margin:0}.stt-translation-container{display:flex;flex-direction:column;gap:8px}.stt-language-text{display:flex;align-items:center;padding:6px 0}.stt-language-flag{font-size:1.2rem;margin-right:8px;width:24px;text-align:center}.stt-language-content{flex:1;font-size:.95rem;line-height:1.4}@media(max-width:600px){.control-panel>*{display:block;margin:10px 0;width:100%}input[type=text],select{width:100%}}