:root{--bg: #0b0b0c;--fg: #f5f5f7;--muted: #8a8a90;--accent: #4a8bff;--danger: #e74c3c;--success: #28a745;--card: #1a1a1d;--border: #2a2a2e}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0;background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,sans-serif;font-size:17px;line-height:1.4;-webkit-font-smoothing:antialiased;overscroll-behavior:none}.app{display:flex;flex-direction:column;height:100vh;height:100dvh}.tabs{display:flex;background:var(--card);border-bottom:1px solid var(--border);padding-top:env(safe-area-inset-top)}.tabs button{flex:1;background:none;border:none;color:var(--muted);padding:14px 0;font-size:16px;font-weight:500;cursor:pointer}.tabs button.active{color:var(--fg);border-bottom:2px solid var(--accent)}main{flex:1;overflow:hidden;display:flex;flex-direction:column}.translator{display:flex;flex-direction:column;height:100%}.status-bar{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--card);border-bottom:1px solid var(--border)}.status-dot{width:10px;height:10px;border-radius:50%;background:var(--muted)}.status-dot.status-translating{background:var(--success);animation:pulse 1.5s infinite}.status-dot.status-connecting{background:var(--accent);animation:pulse .8s infinite}.status-dot.status-error{background:var(--danger)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.status-text{font-size:15px;color:var(--muted)}.transcript{flex:1;overflow-y:auto;padding:16px;-webkit-overflow-scrolling:touch}.line{margin-bottom:14px;padding:10px 14px;background:var(--card);border-radius:12px}.line.me{background:#4a8bff26;margin-left:30px}.line.room{margin-right:30px}.line .ts-label{color:var(--muted);font-size:11px;margin-bottom:4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.line .src{color:var(--muted);font-size:14px;margin-bottom:4px}.line .tgt{color:var(--fg);font-size:17px}.hint{text-align:center;color:var(--muted);padding:40px 20px}.error{background:#e74c3c26;color:var(--danger);padding:10px 16px;font-size:14px}.controls{display:flex;gap:10px;padding:16px;padding-bottom:max(16px,env(safe-area-inset-bottom));border-top:1px solid var(--border);background:var(--card)}.controls button{flex:1;padding:16px;border-radius:14px;font-size:17px;font-weight:600;border:none;cursor:pointer}.controls button.primary{background:var(--accent);color:#fff}.controls button.secondary{background:var(--border);color:var(--fg)}.controls button.danger{background:var(--danger);color:#fff}.history,.history-detail{padding:16px;overflow-y:auto;height:100%;-webkit-overflow-scrolling:touch}.history h2,.history-detail h2{margin:8px 0 12px}.history h3,.history-detail h3{margin-top:22px;color:var(--accent);font-size:15px;text-transform:uppercase;letter-spacing:.5px}.history ul,.history-detail ul{list-style:none;padding:0;margin:0 0 12px}.history-detail ul{list-style:disc;padding-left:20px}.history li{padding:14px;background:var(--card);border-radius:12px;margin-bottom:10px;cursor:pointer}.history li .title{font-weight:600}.history li .meta,.history-detail .meta{color:var(--muted);font-size:13px;margin-top:4px}.history-detail em{color:var(--muted);font-size:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-style:normal}.detail-header{display:flex;justify-content:space-between;align-items:center}button.link{background:none;border:none;color:var(--accent);font-size:16px;padding:8px 0;cursor:pointer}button.link.danger{color:var(--danger)}
