:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--navy-950:#0a1f40;--navy-900:#0f2851;--navy-800:#1e3a8a;--cyan-400:#22d3ee;--cyan-500:#06b6d4;--cyan-600:#0891b2;--gold-400:#fbbf24;--gold-500:#eab308;--success:#16a34a;--warning:#f59e0b;--danger:#dc2626;--danger-400:#f87171;--color-bg:#060d1c;--color-surface:#0b1c38;--color-surface-alt:#10274a;--color-border:#94c5ff29;--color-border-strong:#94c5ff4d;--color-text:#f2f5fa;--color-text-muted:#93a8c9;--color-text-faint:#5f7699;--font-display:"Cormorant Garamond", Georgia, serif;--font-body:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--text-xs:clamp(.75rem, .5vw + .5rem, .8125rem);--text-sm:clamp(.8125rem, .5vw + .6875rem, .9375rem);--text-base:clamp(.9375rem, .6vw + .75rem, 1.0625rem);--text-lg:clamp(1.0625rem, 1vw + .75rem, 1.1875rem);--text-xl:clamp(1.1875rem, 1.5vw + .75rem, 1.4375rem);--text-2xl:clamp(1.375rem, 2vw + .75rem, 1.75rem);--text-hero:clamp(1.625rem, 3.5vw + .9rem, 2.375rem);--space-2xs:.25rem;--space-xs:.5rem;--space-sm:.75rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2.5rem;--radius-sm:10px;--radius-md:14px;--radius-lg:20px;--radius-pill:999px;font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;font-size:16px;line-height:1.5}*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--color-bg);color:var(--color-text);min-height:100dvh;overflow-x:hidden}#root{min-height:100dvh}h1,h2,h3{font-family:var(--font-display);color:var(--color-text);margin:0;font-weight:600}p{margin:0}input,select,textarea,button{font:inherit;font-size:max(16px, var(--text-sm));color:inherit}button,a,[role=button]{touch-action:manipulation;-webkit-tap-highlight-color:#22d3ee2e}:focus-visible{outline:2px solid var(--cyan-400);outline-offset:2px;border-radius:var(--radius-sm)}::selection{background:#22d3ee4d}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}.app-shell{flex-direction:column;min-height:100dvh;display:flex}.app-header{z-index:10;gap:var(--space-xs);padding:max(var(--space-md), env(safe-area-inset-top)) var(--space-md) var(--space-sm);background:linear-gradient(180deg, var(--navy-950) 0%, var(--color-surface) 100%);border-bottom:1px solid var(--color-border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);flex-direction:column;display:flex;position:sticky;top:0}.app-header__brand{align-items:baseline;gap:var(--space-sm);flex-wrap:wrap;display:flex}.app-header__top{justify-content:space-between;align-items:center;gap:var(--space-sm);flex-wrap:wrap;display:flex}.app-header__auth{align-items:center;gap:var(--space-xs);min-width:0;display:flex}.app-header__email{max-width:220px;color:var(--color-text-muted);font-size:var(--text-xs);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.app-header__auth-button{min-height:36px;padding:var(--space-xs) var(--space-sm);border:1px solid var(--gold-500);border-radius:var(--radius-sm);color:var(--gold-400);cursor:pointer;background:0 0;font-weight:700}.app-header__auth-button:hover{background:#f59e0b1a}.app-header__mark{font-family:var(--font-body);font-weight:700;font-size:var(--text-xs);letter-spacing:.32em;color:var(--gold-500)}.app-header__title{font-size:var(--text-hero);font-style:italic;line-height:1.1}.app-header__notice{align-items:flex-start;gap:var(--space-2xs);max-width:60ch;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);color:#fcd9a3;font-size:var(--text-xs);background:#f59e0b1a;border:1px solid #f59e0b52;line-height:1.45;display:inline-flex}.app-header__notice strong{color:var(--gold-400)}.app-main{width:100%;max-width:640px;padding:var(--space-md) var(--space-md) calc(var(--space-xl) + env(safe-area-inset-bottom));gap:var(--space-md);flex-direction:column;flex:1;margin:0 auto;display:flex}@media (width>=768px){.app-main{max-width:720px;padding-top:var(--space-lg);gap:var(--space-lg)}}.mode-switcher{gap:var(--space-xs);padding:var(--space-2xs);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}@media (width>=640px){.mode-switcher{grid-template-columns:repeat(4,minmax(0,1fr))}}.mode-switcher__tab{min-width:0;min-height:56px;padding:var(--space-xs) var(--space-2xs);border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;text-align:center;background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;gap:2px;transition:background-color .2s,color .2s;display:flex}.mode-switcher__tab.is-active{background:linear-gradient(135deg, var(--cyan-600), var(--cyan-400));color:var(--navy-950)}.mode-switcher__tab-label{font-weight:600;font-size:var(--text-base)}.mode-switcher__tab-hint{font-size:var(--text-xs);opacity:.85}.mode-view{gap:var(--space-md);flex-direction:column;min-width:0;display:flex}.mode-view__controls{gap:var(--space-md);padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);flex-direction:column;display:flex}@media (width>=640px){.mode-view__controls{padding:var(--space-lg)}}.field{gap:var(--space-2xs);flex-direction:column;min-width:0;display:flex}.field__row{justify-content:space-between;align-items:center;gap:var(--space-xs);display:flex}.field__label{font-size:var(--text-xs);letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-muted);font-weight:600}.field select{width:100%;min-height:48px;padding:0 var(--space-sm);background:var(--color-surface-alt);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);color:var(--color-text)}.field select:disabled{opacity:.55;cursor:not-allowed}.field__refresh{border-radius:var(--radius-sm);border:1px solid var(--color-border-strong);background:var(--color-surface-alt);min-width:44px;min-height:44px;color:var(--cyan-400);font-size:var(--text-lg);cursor:pointer;justify-content:center;align-items:center;transition:border-color .2s;display:inline-flex}.field__refresh:hover:not(:disabled){border-color:var(--cyan-400)}.field__refresh:disabled{opacity:.5;cursor:not-allowed}.field__hint{font-size:var(--text-xs);color:#9fd8e8;border-left:2px solid var(--cyan-400);padding:var(--space-xs) var(--space-sm);border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:#22d3ee14}.field__hint--success{color:#86efac;border-left-color:var(--success);background:#16a34a1a}.field__error{font-size:var(--text-xs);color:var(--danger-400)}.lang-pair{align-items:flex-end;gap:var(--space-sm);display:flex}.lang-pair .field{flex:1;min-width:0}.lang-pair__sep{min-width:32px;min-height:48px;color:var(--color-text-faint);font-size:var(--text-lg);justify-content:center;align-items:center;display:inline-flex}.primary-btn{min-height:52px;padding:0 var(--space-lg);border-radius:var(--radius-md);background:linear-gradient(135deg, var(--cyan-500), var(--cyan-400));color:var(--navy-950);font-weight:700;font-size:var(--text-base);cursor:pointer;border:none;transition:transform .15s,opacity .15s}.primary-btn:hover:not(:disabled){transform:translateY(-1px)}.primary-btn:active:not(:disabled){transform:translateY(0)}.primary-btn:disabled{opacity:.6;cursor:not-allowed}.primary-btn--stop{background:linear-gradient(135deg, #ef4444, var(--danger-400));color:#2a0a0a}.secondary-btn{min-height:44px;padding:0 var(--space-md);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);color:var(--cyan-400);font-weight:600;font-size:var(--text-sm);cursor:pointer;background:0 0;align-self:flex-start;transition:border-color .2s,background-color .2s}.secondary-btn:hover{border-color:var(--cyan-400);background:#22d3ee14}.turn-controls{gap:var(--space-sm);grid-template-columns:1fr 1fr;display:grid}.turn-btn{justify-content:center;align-items:center;gap:var(--space-2xs);min-height:96px;padding:var(--space-md) var(--space-xs);background:var(--color-surface-alt);border:1.5px solid var(--color-border-strong);border-radius:var(--radius-lg);color:var(--color-text);text-align:center;cursor:pointer;flex-direction:column;transition:background-color .2s,border-color .2s,transform .15s;display:flex;position:relative}.turn-btn:hover:not(:disabled){border-color:var(--cyan-400)}.turn-btn:active:not(:disabled){transform:scale(.98)}.turn-btn:disabled{opacity:.5;cursor:not-allowed}.turn-btn__flag{font-size:var(--text-2xl);line-height:1}.turn-btn__label{font-weight:600;font-size:var(--text-sm)}.turn-btn.is-active{background:linear-gradient(160deg, var(--cyan-600), var(--navy-800));border-color:var(--cyan-400);animation:2s ease-out infinite turn-pulse;box-shadow:0 0 #22d3ee80}.turn-btn__pulse{top:var(--space-sm);right:var(--space-sm);background:var(--gold-400);border-radius:50%;width:10px;height:10px;animation:1.4s ease-out infinite dot-pulse;position:absolute;box-shadow:0 0 #fbbf2499}@keyframes turn-pulse{0%{box-shadow:0 0 #22d3ee59}70%{box-shadow:0 0 0 10px #22d3ee00}to{box-shadow:0 0 #22d3ee00}}.turn-hint{font-size:var(--text-sm);color:var(--color-text-muted);text-align:center;padding:var(--space-xs) var(--space-sm);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-pill)}.turn-hint strong{color:var(--gold-400)}.status-bar{gap:var(--space-2xs);padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm);flex-direction:column;transition:background-color .2s,border-color .2s;display:flex}.status-bar--reconnecting{background:#f59e0b1a;border-color:#f59e0b66}.status-bar__reassure{color:#fcd9a3;font-size:var(--text-xs)}.status-bar__row{align-items:center;gap:var(--space-xs);display:flex}.status-dot{background:var(--color-text-faint);border-radius:50%;flex-shrink:0;width:10px;height:10px}.status-dot--neutral{background:var(--color-text-faint)}.status-dot--progress{background:var(--cyan-400);animation:1.2s ease-out infinite dot-pulse}.status-dot--live{background:var(--success);--pulse-color:22, 163, 74;animation:1.4s ease-out infinite dot-pulse}.status-dot--warn{background:var(--warning);--pulse-color:245, 158, 11;animation:1s ease-out infinite dot-pulse}.status-dot--error{background:var(--danger)}@keyframes dot-pulse{0%{box-shadow:0 0 0 0 rgba(var(--pulse-color,34, 211, 238), .55)}70%{box-shadow:0 0 0 8px rgba(var(--pulse-color,34, 211, 238), 0)}to{box-shadow:0 0 0 0 rgba(var(--pulse-color,34, 211, 238), 0)}}.status-bar__label{font-weight:600}.status-bar__hint{color:var(--gold-400);font-size:var(--text-xs)}.status-bar__error{color:var(--danger-400);font-size:var(--text-xs);font-weight:600}.transcript-panel{gap:var(--space-sm);overscroll-behavior:contain;-webkit-overflow-scrolling:touch;min-height:180px;max-height:min(52vh,480px);padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);scroll-behavior:smooth;flex-direction:column;display:flex;overflow-y:auto}.transcript-panel__empty{color:var(--color-text-faint);font-size:var(--text-sm);text-align:center;max-width:32ch;margin:auto}.transcript-line{align-items:baseline;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);flex-wrap:wrap;animation:.25s ease-out line-enter;display:flex}@keyframes line-enter{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.transcript-line__badge{font-size:var(--text-xs);letter-spacing:.04em;text-transform:uppercase;border-radius:var(--radius-pill);flex-shrink:0;padding:2px 8px;font-weight:700}.transcript-line__text{min-width:0;font-size:var(--text-base);overflow-wrap:break-word;flex:200px;line-height:1.5}.transcript-line__time{font-size:var(--text-xs);color:var(--color-text-faint);font-variant-numeric:tabular-nums;flex-shrink:0}.transcript-line--input{background:#94c5ff0d}.transcript-line--input .transcript-line__badge{color:var(--color-text-muted);background:#94c5ff24}.transcript-line--input .transcript-line__text{color:var(--color-text-muted)}.transcript-line--output{background:#fbbf240f}.transcript-line--output .transcript-line__badge{color:var(--gold-400);background:#fbbf2429}.transcript-line--output .transcript-line__text{color:var(--color-text);font-weight:500}.transcript-line--dir-incoming .transcript-line__badge{color:var(--cyan-400);background:#22d3ee29}.transcript-line--dir-outgoing .transcript-line__badge{color:var(--color-text-muted);background:#94c5ff24}.export-bar{justify-content:space-between;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);flex-wrap:wrap;transition:opacity .2s;display:flex}.export-bar--empty{opacity:.6}.export-bar__actions{gap:var(--space-xs);flex-wrap:wrap;flex:auto;min-width:0;display:flex}.export-btn{min-height:44px;padding:0 var(--space-sm);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface-alt);color:var(--cyan-400);font-size:var(--text-xs);white-space:nowrap;cursor:pointer;font-weight:600;transition:border-color .2s,background-color .2s,opacity .2s}.export-btn:hover:not(:disabled){border-color:var(--cyan-400);background:#22d3ee1a}.export-btn:disabled{opacity:.4;cursor:not-allowed;color:var(--color-text-faint)}.export-bar__clear{min-height:44px;padding:0 var(--space-sm);border-radius:var(--radius-sm);color:var(--danger-400);font-size:var(--text-xs);white-space:nowrap;cursor:pointer;background:0 0;border:1px solid #0000;flex-shrink:0;font-weight:600;transition:background-color .2s,opacity .2s}.export-bar__clear:hover:not(:disabled){background:#dc26261a}.export-bar__clear:disabled{opacity:.35;cursor:not-allowed}@media (width<=480px){.export-bar{flex-direction:column;align-items:stretch}.export-bar__actions{flex-direction:column}.export-btn,.export-bar__clear{width:100%}}.file-input{width:100%;min-height:44px;color:var(--color-text-muted);display:block}.file-input::file-selector-button{min-height:40px;margin-right:var(--space-sm);padding:0 var(--space-md);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface-alt);color:var(--cyan-400);font-weight:600;font-size:var(--text-sm);cursor:pointer;transition:border-color .2s,background-color .2s}.file-input::file-selector-button:hover{border-color:var(--cyan-400);background:#22d3ee1a}.file-input:disabled{opacity:.55}.file-input:disabled::file-selector-button{cursor:not-allowed}.video-subtitle__player-wrap{gap:var(--space-xs);flex-direction:column;display:flex}.video-subtitle__player{aspect-ratio:16/9;border-radius:var(--radius-md);border:1px solid var(--color-border);background:#000;width:100%}.video-progress{align-items:center;gap:var(--space-sm);display:flex}.video-progress__track{border-radius:var(--radius-pill);background:var(--color-surface-alt);flex:1;min-width:0;height:6px;overflow:hidden}.video-progress__fill{border-radius:var(--radius-pill);background:linear-gradient(90deg, var(--cyan-600), var(--cyan-400));height:100%;transition:width .2s linear}.video-progress__label{font-size:var(--text-xs);color:var(--color-text-muted);font-variant-numeric:tabular-nums;flex-shrink:0}.video-subtitle__actions{gap:var(--space-sm);flex-wrap:wrap;display:flex}.video-subtitle__actions .primary-btn{flex:200px}.video-subtitle__actions .secondary-btn{flex:none}.echo-warning{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);color:#fde7bd;font-size:var(--text-sm);background:#f59e0b24;border:1.5px solid #f59e0b73;flex-direction:column;gap:2px;line-height:1.5;display:flex}.echo-warning strong{color:var(--gold-400)}.dual-toolbar{gap:var(--space-sm);flex-wrap:wrap;display:flex}.dual-toolbar .primary-btn,.dual-toolbar .secondary-btn{flex:200px}.dual-panels{gap:var(--space-md);grid-template-columns:1fr;display:grid}@media (width>=720px){.dual-panels{grid-template-columns:1fr 1fr;align-items:start}}.dual-panel{gap:var(--space-sm);min-width:0;padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);flex-direction:column;display:flex}@media (width>=640px){.dual-panel{padding:var(--space-lg)}}.dual-panel__title{font-size:var(--text-xl);font-style:italic}.usage-panel{gap:var(--space-xs);padding:var(--space-sm) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm);flex-direction:column;display:flex}.usage-panel__row{justify-content:space-between;align-items:baseline;gap:var(--space-sm);flex-wrap:wrap;display:flex}.usage-panel__plan{color:var(--gold-400);font-weight:700}.usage-panel__figures{font-variant-numeric:tabular-nums;color:var(--color-text-muted)}.usage-panel__track{border-radius:var(--radius-pill);background:var(--color-surface-alt);height:6px;overflow:hidden}.usage-panel__fill{border-radius:var(--radius-pill);background:linear-gradient(90deg, var(--cyan-600), var(--cyan-400));height:100%;transition:width .3s}.usage-panel__fill--full{background:linear-gradient(90deg, var(--danger), var(--danger-400))}.usage-panel__row--meta{font-size:var(--text-xs);color:var(--color-text-faint)}.usage-panel__upsell{color:var(--cyan-400);align-items:center;min-height:24px;font-weight:600;text-decoration:none;display:inline-flex}.usage-panel__upsell:hover{text-decoration:underline}.quota-notice{gap:var(--space-sm);padding:var(--space-md);border-radius:var(--radius-md);background:#dc26261f;border:1.5px solid #dc262666;flex-direction:column;display:flex}.quota-notice__text{font-size:var(--text-sm);color:#fecaca;line-height:1.5}.quota-notice__text strong{color:#fca5a5}.quota-notice__actions{gap:var(--space-sm);flex-wrap:wrap;display:flex}.quota-notice__actions .primary-btn,.quota-notice__actions .secondary-btn{text-align:center;flex:160px;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}