.timeline{--timeline-gutter: 88px;--timeline-axis: 20px;--timeline-pad: 16px;position:relative;display:grid;grid-template-columns:minmax(0,1fr);flex:1;min-height:280px;padding:var(--timeline-pad);background:var(--surface);border-radius:var(--radius-lg)}.timeline__canvas{position:absolute;inset:var(--timeline-pad);width:calc(100% - 2 * var(--timeline-pad));height:calc(100% - 2 * var(--timeline-pad))}.timeline__labels{grid-area:1 / 1;display:grid;gap:6px;width:var(--timeline-gutter);padding-bottom:var(--timeline-axis);align-items:center;justify-self:start;pointer-events:none}.timeline__label{font-size:12px;font-weight:700;white-space:nowrap}@media(max-width:576px){.timeline{--timeline-gutter: 32px;--timeline-pad: 12px;min-height:240px}.timeline__label-word{display:none}}.meter{display:block;width:110px;height:18px;flex-shrink:0}.controls{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px 24px;padding:12px 16px;background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-heavy)}.controls__now{display:flex;align-items:center;gap:12px;min-width:0}.controls__mic{display:grid;place-items:center;flex-shrink:0;width:48px;height:48px;color:#000;background:var(--accent);border-radius:50%;transition:transform .12s ease,background .12s ease}.controls__mic:hover:not(:disabled){background:var(--accent-hover);transform:scale(1.04)}.controls__mic:active:not(:disabled){transform:scale(.96)}.controls__mic[data-recording=true]{color:#000;background:var(--text)}.controls__caption{display:flex;flex-direction:column;gap:2px;min-width:0}.controls__caption strong{font-size:14px;font-weight:700;white-space:nowrap}.controls__caption span{font-size:12px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.controls__threshold{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:700;color:var(--text-muted)}.controls__threshold output{min-width:32px;font-variant-numeric:tabular-nums;color:var(--text)}.controls__threshold input[type=range]{width:200px;height:4px;margin:0;appearance:none;background:var(--surface-4);border-radius:var(--radius-pill);cursor:pointer}.controls__threshold input[type=range]::-webkit-slider-thumb{appearance:none;width:14px;height:14px;background:var(--text);border-radius:50%;box-shadow:var(--shadow-card)}.controls__threshold input[type=range]::-moz-range-thumb{width:14px;height:14px;border:none;background:var(--text);border-radius:50%}.controls__threshold input[type=range]:hover::-webkit-slider-thumb{background:var(--accent)}.controls__actions{display:flex;justify-content:flex-end;gap:8px}.controls__action{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 16px;font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;white-space:nowrap;color:var(--text);background:transparent;border-radius:var(--radius-pill);box-shadow:inset 0 0 0 1px var(--text-faint);transition:box-shadow .12s ease,transform .12s ease}.controls__action:hover:not(:disabled){box-shadow:inset 0 0 0 1px var(--text);transform:scale(1.04)}@media(max-width:896px){.controls{grid-template-columns:minmax(0,1fr) auto}.controls__threshold{grid-column:1 / -1;grid-row:2}.controls__threshold input[type=range]{flex:1;width:auto}}@media(max-width:576px){.controls{gap:8px 12px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-radius:var(--radius-lg) var(--radius-lg) 0 0}.controls__action{width:40px;padding:0}.controls__action-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}.segments{display:flex;flex-direction:column;flex:1;min-height:0;background:var(--surface);border-radius:var(--radius-lg);overflow:hidden}.segments__header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 8px}.segments__header h2{margin:0;font-size:18px;font-weight:700}.segments__count{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text-muted);background:var(--surface-2);border-radius:var(--radius-pill);padding:4px 10px}.segments__empty{margin:0;padding:8px 16px 24px;color:var(--text-muted);font-size:14px}.segments__list{flex:1;margin:0;padding:0 8px 8px;list-style:none;overflow-y:auto;scroll-behavior:smooth}.segment{display:grid;grid-template-columns:4px minmax(0,1fr) auto;grid-template-areas:"rail speaker duration" "rail range   duration";align-items:center;gap:0 12px;padding:8px;border-radius:var(--radius-sm)}.segment:hover{background:var(--surface-3)}.segment__rail{grid-area:rail;align-self:stretch;background:var(--segment-color);border-radius:var(--radius-pill)}.segment__speaker{grid-area:speaker;font-size:14px;font-weight:700}.segment__range{grid-area:range;font-size:12px;font-variant-numeric:tabular-nums;color:var(--text-muted)}.segment__duration{grid-area:duration;font-size:12px;font-variant-numeric:tabular-nums;color:var(--text-muted)}.speakers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}@media(max-width:768px){.speakers{grid-template-columns:repeat(2,minmax(0,1fr))}}.speaker{position:relative;display:flex;align-items:center;gap:12px;min-width:0;padding:10px 12px;background:var(--surface);border-radius:var(--radius-md);overflow:hidden;transition:background .16s ease,box-shadow .16s ease,opacity .16s ease}.speaker:hover{background:var(--surface-2)}.speaker[data-idle=true]{opacity:.45}.speaker[data-active=true]{background:var(--surface-3);box-shadow:var(--shadow-card),inset 0 0 0 1px var(--tile-color)}.speaker__avatar{position:relative;display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;font-size:16px;font-weight:700;color:var(--tile-color);background:color-mix(in srgb,var(--tile-color) 18%,var(--surface-2));border-radius:50%}.speaker[data-active=true] .speaker__avatar{color:#000;background:var(--tile-color)}.speaker__ring{position:absolute;inset:-4px;border:2px solid var(--tile-color);border-radius:50%;opacity:0;transform:scale(.85)}.speaker[data-active=true] .speaker__ring{animation:speaker-pulse 1.6s ease-out infinite}.speaker__meta{display:flex;flex-direction:column;min-width:0}.speaker__name{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.speaker__time{font-size:12px;font-variant-numeric:tabular-nums;color:var(--text-muted);white-space:nowrap}.speaker__level{position:absolute;inset:auto 0 0;height:3px;background:#ffffff0f}.speaker__level-fill{height:100%;width:var(--tile-level);background:var(--tile-color);transition:width .12s linear}@keyframes speaker-pulse{0%{opacity:.8;transform:scale(1)}70%,to{opacity:0;transform:scale(1.3)}}@media(max-width:425px){.speaker{gap:8px;padding:8px}.speaker__avatar{width:32px;height:32px;font-size:14px}.speaker__name{font-size:13px}}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;padding:12px 16px;background:var(--surface);border-radius:var(--radius-lg)}.topbar__brand{display:flex;align-items:center;gap:12px;min-width:0}.topbar__mark{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;color:#000;background:var(--accent);border-radius:50%}.topbar__brand h1{margin:0;font-size:24px;font-weight:700;line-height:1.1}.topbar__brand p{margin:2px 0 0;font-size:14px;color:var(--text-muted)}.topbar__settings{display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap}.topbar__field{display:flex;flex-direction:column;gap:4px;min-width:0}.topbar__field>span{padding-left:16px;font-size:12px;font-weight:700;color:var(--text-muted)}.topbar__status{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px;font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;white-space:nowrap;color:var(--text-muted);background:var(--surface-2);border-radius:var(--radius-pill)}.topbar__dot{flex-shrink:0;width:8px;height:8px;border-radius:50%;background:var(--text-faint)}.topbar__status[data-status=ready]{color:var(--text)}.topbar__status[data-status=ready] .topbar__dot{background:var(--accent)}.topbar__status[data-status=loading] .topbar__dot{background:var(--warning);animation:status-blink 1s ease-in-out infinite}.topbar__status[data-status=error]{color:var(--negative)}.topbar__status[data-status=error] .topbar__dot{background:var(--negative)}@keyframes status-blink{50%{opacity:.25}}@media(max-width:896px){.topbar__settings{width:100%}}@media(max-width:576px){.topbar{padding:12px}.topbar__brand h1{font-size:18px}.topbar__brand p{font-size:12px}.topbar__mark{width:32px;height:32px}.topbar__settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.topbar__field>span{padding-left:12px}.topbar__field select{width:100%;padding-left:12px;padding-right:28px;background-position:right 10px center;font-size:12px;text-overflow:ellipsis}.topbar__status{grid-column:1 / -1;justify-content:center}}.app{display:flex;flex-direction:column;gap:8px;min-height:100dvh;max-width:1600px;margin:0 auto;padding:8px 8px 0}.app__main{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.app__stage{display:flex;flex-direction:column;gap:8px;min-width:0}.app__side{display:flex;flex-direction:column;min-height:0}.app__side .segments{max-height:420px}.app__footer{position:sticky;bottom:0;z-index:10;margin:0 -8px}.app__error{margin:0;padding:10px 16px;font-size:14px;color:var(--negative);background:var(--surface);border-radius:var(--radius-md);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--negative) 45%,transparent)}@media(min-width:577px){.app{padding-bottom:8px}.app__footer{bottom:8px;margin:0}}@media(min-width:1025px)and (min-height:720px){.app{height:100dvh;min-height:0}.app__main{grid-template-columns:minmax(0,1fr) 360px;grid-template-rows:minmax(0,1fr);flex:1;min-height:0}.app__stage{min-height:0;overflow-y:auto}.app__side .segments{max-height:none}}:root{--bg: #121212;--surface: #181818;--surface-2: #1f1f1f;--surface-3: #252525;--surface-4: #2a2a2a;--text: #ffffff;--text-muted: #b3b3b3;--text-faint: #7c7c7c;--accent: #1ed760;--accent-hover: #3be477;--negative: #f3727f;--warning: #ffa42b;--inset-border: rgb(18, 18, 18) 0 1px 0, rgb(124, 124, 124) 0 0 0 1px inset;--shadow-card: rgba(0, 0, 0, .3) 0 8px 8px;--shadow-heavy: rgba(0, 0, 0, .5) 0 8px 24px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-pill: 9999px;--font: "Helvetica Neue", helvetica, arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:14px;line-height:1.4;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:none;background:none}button:disabled{cursor:not-allowed;opacity:.4}select{font:inherit;font-size:14px;font-weight:700;color:var(--text);background:var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' stroke='%23b3b3b3' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1l4 4 4-4'/%3E%3C/svg%3E") no-repeat right 14px center;border:none;border-radius:var(--radius-pill);box-shadow:var(--inset-border);padding:8px 34px 8px 16px;cursor:pointer;appearance:none;min-width:0;max-width:100%}select:hover:not(:disabled){background-color:var(--surface-3)}select:disabled{cursor:not-allowed;opacity:.5}:focus-visible{outline:2px solid var(--text);outline-offset:2px}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--surface-4);border:3px solid transparent;border-radius:var(--radius-pill);background-clip:content-box}::-webkit-scrollbar-thumb:hover{background:var(--text-faint);background-clip:content-box}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}