/* Hallmark · macrostructure: Workbench · theme: custom charcoal and gold · nav: side rail · footer: action dock
 * pre-emit critique: Philosophy 4 Hierarchy 4 Execution 4 Specificity 5 Restraint 5 Variety 4 */
@import url('./tokens.css');
*{box-sizing:border-box}html,body{margin:0;overflow-x:clip}body{background:var(--color-bg);color:var(--color-ink);font:14px/1.6 var(--font-body)}button,input,select,textarea{font:inherit;color:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{border:1px solid var(--color-line);background:var(--color-panel);border-radius:var(--radius-sm);padding:10px 15px;min-height:44px;cursor:pointer;white-space:nowrap;transition:background var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}button:active{transform:translateY(1px)}button:disabled{opacity:.45;cursor:not-allowed}button:hover:not(:disabled){background:var(--color-hover)}:focus-visible{outline:2px solid var(--color-focus);outline-offset:3px}h1,h2,h3,p{margin:0}h1,h2,h3{font-style:normal;overflow-wrap:anywhere}h1{font-size:28px;font-weight:560;letter-spacing:-1px}h2{font-size:20px;font-weight:550}h3{font-size:13px;font-weight:550}p{color:var(--color-muted)}small{font-size:11px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.prototype-bar{height:46px;padding:0 24px;border-bottom:1px solid var(--color-line);display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--color-muted)}.prototype-bar b{font-weight:500;color:var(--color-gold)}.prototype-bar>div{display:flex;gap:8px}.prototype-bar button{border:0;background:none;padding:0 8px;font-size:11px;min-height:36px}.app{display:grid;grid-template-columns:204px minmax(0,1fr);max-width:1440px;margin:auto;min-height:calc(100vh - 46px)}.nav{padding:36px 20px 24px;border-right:1px solid var(--color-line);display:flex;flex-direction:column}.brand{display:flex;gap:12px;align-items:center;padding-left:10px;font-size:14px;font-weight:600;line-height:1.4}.brand-mark{display:grid;place-items:center;width:34px;height:38px;color:var(--color-gold);border:1px solid var(--color-gold-line);border-radius:10px 2px 10px 2px;font:23px var(--font-jp)}.brand-sub{display:block;font-size:12px;font-weight:400;color:var(--color-muted);letter-spacing:2px}.nav-links{margin-top:56px;display:grid;gap:8px}.nav-links button{border:0;background:none;text-align:left;display:flex;gap:12px;color:var(--color-muted);padding:12px}.nav-links button.active{background:var(--color-hover);color:var(--color-ink)}.nav-links small{margin-left:auto;align-self:center}.nav-bottom{margin-top:auto;padding-top:36px;display:flex;align-items:center;gap:10px;font-size:11px}.nav-bottom small{display:block;color:var(--color-muted)}.language{font:24px var(--font-jp);border:1px solid var(--color-line);padding:4px 10px;border-radius:8px}main{padding:32px 40px 24px;min-width:0}.page-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;gap:16px}.eyebrow{color:var(--color-muted);font-size:11px;display:block;margin-bottom:6px;letter-spacing:1px}.header-actions{display:flex;align-items:center;gap:12px}.local-label{color:var(--color-muted);font-size:11px}.local-label:before{content:'●';font-size:7px;margin-right:7px}.live-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(240px, .8fr);gap:32px}.stream-panel{position:relative;border:1px solid var(--color-line);background:var(--color-panel);border-radius:var(--radius-lg);overflow:clip;display:flex;flex-direction:column;height:calc(100vh - 205px);min-height:560px;max-height:850px}.session-head{padding:22px 24px;border-bottom:1px solid var(--color-line);display:flex;gap:12px;justify-content:space-between}.session-head h2{font-size:14px;margin-top:8px}.session-head p{font-size:11px;margin-top:4px}.status{font-size:10px;color:var(--color-muted);letter-spacing:1px}.status.recording{color:var(--color-gold)}.status.recording:before{content:'●';margin-right:6px}.timer{font:11px var(--font-mono);color:var(--color-muted);padding-top:5px;white-space:nowrap}.feed{padding:20px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--color-line) var(--color-panel);flex:1;min-height:0;display:flex;flex-direction:column;gap:14px}.empty-live{margin:auto;text-align:center;padding:36px 0}.empty-live h2{font-size:24px;font-weight:450;line-height:1.7;margin:32px 0 16px}.empty-live p{font-size:12px;line-height:1.9}.listening-art{height:50px;display:flex;justify-content:center;align-items:center;gap:7px}.listening-art i{width:3px;background:var(--color-gold);height:14px;border-radius:4px}.listening-art i:nth-child(2n){height:30px;opacity:.55}.listening-art i:nth-child(3n){height:48px;opacity:.8}.legend{display:flex;justify-content:center;gap:20px;margin-top:40px;font-size:10px;color:var(--color-muted)}.legend span:first-child{color:var(--color-gold)}.stream-foot{border-top:1px solid var(--color-line);padding:16px 20px;background:var(--color-panel)}.pipeline{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--color-muted);margin-bottom:12px}.pipeline>span:first-child{width:5px;height:5px;background:var(--color-muted);border-radius:50%}.record-actions{display:flex;gap:8px}.record-actions button{flex:1}.primary{background:var(--color-gold);border-color:var(--color-gold);color:var(--color-bg);font-weight:600}.primary:hover:not(:disabled){background:var(--color-ink)}.stop{border-color:var(--color-gold-line);color:var(--color-gold)}.context section{padding:20px 0;border-bottom:1px solid var(--color-line)}.context section:first-child{padding-top:4px}.section-line{display:flex;justify-content:space-between}.subtle{font-size:10px;color:var(--color-muted)}.transcript{margin-top:22px}.transcript-time{font:10px var(--font-mono);color:var(--color-dim)}.transcript p{margin:12px 0;font-size:14px;line-height:1.95}.text-button{padding:4px 0;border:0;background:none;color:var(--color-muted);font-size:11px;min-height:36px}.guide>p{font-size:12px;margin-top:12px;line-height:1.9}.mini-sample{border-left:2px solid var(--color-gold-line);padding:12px 16px;margin-top:20px;background:var(--color-gold-bg)}.mini-sample strong{display:block;font:22px var(--font-jp);margin:12px 0}.mini-sample p{font-size:12px;margin-bottom:12px}.gold-text{color:var(--color-gold);font-size:10px}.stat-row{display:flex;justify-content:space-between;margin-top:12px;font-size:11px;color:var(--color-muted)}.stat-row b{color:var(--color-ink);font-weight:400}.demo{font-size:10px;color:var(--color-muted);margin-top:24px}.demo summary{cursor:pointer;min-height:36px}.demo button{font-size:10px;margin:4px 0;width:100%}.card{background:var(--color-card);border:1px solid var(--color-line);border-radius:12px;padding:20px;position:relative;min-width:0;animation:arrive var(--dur-medium) var(--ease-out)}.card.gold{background:var(--color-gold-bg);border-color:var(--color-gold-line)}.card-top,.card-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:10px;color:var(--color-muted)}.card.gold .tag{color:var(--color-gold)}.card-title{font:26px/1.4 var(--font-jp);margin:15px 0 5px;overflow-wrap:anywhere}.reading{font-size:10px;color:var(--color-muted);margin-bottom:6px}.meaning{font-size:13px;color:var(--color-ink)}.quote{border-left:1px solid var(--color-line);padding-left:12px;margin-top:16px;font-size:12px;line-height:1.8;color:var(--color-muted)}.card-bottom{margin-top:18px}.card-bottom button{min-height:34px;padding:3px 8px;font-size:11px;background:none}.freq{display:inline-flex;align-items:center;gap:3px}.freq i{height:8px;width:3px;background:var(--color-dim);border-radius:1px}.freq.high i{background:var(--color-ink)}.freq span{margin-left:4px}.card.selected{outline:2px solid var(--color-gold)}.card-select{width:20px;height:20px;accent-color:var(--color-gold);cursor:pointer}.warning{padding:12px 20px;background:var(--color-gold-bg);color:var(--color-error);font-size:12px}.warning button{font-size:11px;min-height:32px;margin-left:10px}.follow{position:absolute;bottom:118px;left:50%;transform:translateX(-50%);box-shadow:0 4px 20px var(--color-shadow);font-size:11px}.summary-banner{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--color-line);padding:8px 0 28px}.summary-banner h2{font-size:24px}.summary-banner p{font-size:12px;margin-top:10px}.summary-number{text-align:right}.summary-number b{font:46px var(--font-jp);display:block;color:var(--color-gold)}.summary-number span{font-size:10px;color:var(--color-muted)}.filters{padding:24px 0 8px}.segmented{display:inline-flex;background:var(--color-panel);border:1px solid var(--color-line);padding:4px;border-radius:10px;gap:4px}.segmented button{border:0;background:none;color:var(--color-muted);font-size:12px;min-height:36px;padding:6px 16px}.segmented button.active{background:var(--color-hover);color:var(--color-ink)}.filter-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:20px}.search{display:flex;align-items:center;gap:10px;border:1px solid var(--color-line);border-radius:8px;padding:0 12px;flex:1;min-width:200px}.search input{background:none;border:0;padding:10px 0;width:100%;min-width:0;font-size:12px;min-height:44px}.check{font-size:11px;color:var(--color-muted);display:flex;gap:6px;align-items:center;min-height:44px;white-space:nowrap}input[type=checkbox]{accent-color:var(--color-gold)}select{background:var(--color-panel);border:1px solid var(--color-line);padding:10px;border-radius:8px;min-height:44px;font-size:12px}.results-head{display:flex;align-items:center;justify-content:space-between;margin:12px 0;color:var(--color-muted);font-size:11px}.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding-bottom:90px}.card-grid .card-title{font-size:23px}.selection-bar{position:sticky;bottom:16px;background:var(--color-panel);border:1px solid var(--color-line);border-radius:12px;box-shadow:0 8px 32px var(--color-shadow);padding:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px}.selection-bar>div{display:flex;gap:8px}.selection-bar button{font-size:11px}.empty-result{padding:70px 20px;text-align:center;grid-column:1/-1;color:var(--color-muted)}dialog{background:var(--color-panel);color:var(--color-ink);border:1px solid var(--color-line);border-radius:16px;padding:28px;max-width:480px;width:calc(100% - 32px);max-height:85vh;overflow:auto;box-shadow:0 20px 80px var(--color-shadow)}dialog::backdrop{background:var(--color-shadow)}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.modal-head button{border:0;background:none;padding:4px 10px;font-size:24px}.modal-description{font-size:12px;line-height:1.9;margin-bottom:24px}.form-label{display:block;font-size:12px;margin:18px 0 8px}.field,textarea{width:100%;background:var(--color-bg);border:1px solid var(--color-line);border-radius:8px;padding:12px;min-height:44px}.sources{display:grid;gap:8px}.sources label{border:1px solid var(--color-line);border-radius:10px;padding:14px;cursor:pointer;display:flex;align-items:center;gap:12px}.sources label:has(input:checked){border-color:var(--color-gold);background:var(--color-gold-bg)}.sources small{display:block;color:var(--color-muted)}.sources input{accent-color:var(--color-gold)}.modal-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:24px}.detail-section{margin-top:22px;border-top:1px solid var(--color-line);padding-top:18px}.detail-section h3{margin-bottom:8px}.detail-section p{font-size:13px}.detail-section li{font-size:12px;color:var(--color-muted);margin:8px 0}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);padding:12px 20px;background:var(--color-ink);color:var(--color-bg);border-radius:10px;font-size:12px;box-shadow:0 8px 32px var(--color-shadow);z-index:10;pointer-events:none;opacity:0;transition:opacity var(--dur-fast) var(--ease-out)}#toast.show{opacity:1}.compact .app{max-width:460px;display:block}.compact .nav,.compact .context,.compact .local-label{display:none}.compact main{padding:20px 12px}.compact .live-grid{display:block}.compact .stream-panel{height:calc(100vh - 180px);min-height:420px}.compact .card-grid{grid-template-columns:minmax(0,1fr)}.compact .page-head{margin-bottom:16px}.compact .page-head h1{font-size:22px}.compact .app{border-inline:1px solid var(--color-line)}.compact .selection-bar{flex-direction:column}.compact .filter-row{gap:8px}.compact .header-actions{gap:4px}.compact .header-actions button{font-size:11px;padding:8px}.compact .nav-links{display:flex}.compact #review-view{padding-bottom:10px}.compact .summary-banner h2{font-size:19px}.compact .prototype-bar{justify-content:center;gap:8px}.compact .prototype-bar>span{font-size:0}.compact .prototype-bar b{font-size:10px}@keyframes arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1450px){main{padding:40px 56px}.live-grid{gap:40px}}@media(max-width:1100px){.app{grid-template-columns:170px minmax(0,1fr)}main{padding:24px}.live-grid{gap:20px;grid-template-columns:minmax(0,1.4fr) minmax(210px,.8fr)}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nav{padding-inline:12px}}@media(max-width:800px){.app{grid-template-columns:70px minmax(0,1fr)}.nav{padding:24px 8px}.brand>span:last-child,.nav-links button span,.nav-links small,.nav-bottom{display:none}.brand{padding:0;justify-content:center}.nav-links button{justify-content:center;font-size:20px}.context{display:none}.live-grid{display:block}.stream-panel{max-height:none;height:calc(100vh - 200px)}.prototype-bar{padding:0 12px}.prototype-bar>span{font-size:10px}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:540px){.app{display:block}.nav{padding:12px 16px;border-right:0;border-bottom:1px solid var(--color-line);flex-direction:row;justify-content:space-between;align-items:center}.brand>span:last-child{display:block;font-size:12px}.brand-sub{font-size:10px}.brand-mark{height:30px;width:28px;font-size:20px}.nav-links{display:flex;margin:0;gap:4px}.nav-links button{padding:6px 12px;min-height:40px}.prototype-bar>span{font-size:0}.prototype-bar b{font-size:10px}.prototype-bar button{padding-inline:6px}main{padding:20px 12px}.page-head{margin-bottom:18px}h1{font-size:24px}.local-label{display:none}.stream-panel{height:calc(100dvh - 245px);min-height:450px}.session-head{padding:18px 16px}.feed{padding:14px}.card{padding:18px}.context{display:none}.card-grid{grid-template-columns:minmax(0,1fr)}.summary-banner h2{font-size:19px}.selection-bar{flex-direction:column;align-items:stretch;bottom:8px}.selection-bar>div{justify-content:space-between}.filter-row{gap:8px}.search{min-width:100%;flex-basis:100%}.header-actions button{padding:8px;font-size:11px}.legend{gap:12px}.empty-live h2{font-size:22px}.summary-number b{font-size:36px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.compact .stream-panel{height:calc(100dvh - 245px)}

.identity-prompt{flex-shrink:0;border:1px solid var(--color-line);background:var(--color-bg);padding:20px;border-radius:12px}.identity-prompt h3{font-size:18px;margin:10px 0}.identity-prompt p{font-size:12px;margin-bottom:10px}.identity-options{display:grid;gap:8px;margin-top:16px}.identity-options>button{text-align:left;white-space:nowrap;min-height:48px;height:48px;padding:10px 15px}.identity-options small{color:var(--color-muted);margin-left:12px}.identity-input{position:relative;min-width:0;width:100%}.identity-input input{min-width:0;width:100%;height:48px;padding:12px 76px 12px 15px;background:var(--color-panel)}.identity-input button{position:absolute;right:4px;top:4px;min-height:40px;height:40px;padding:0 12px;border:0;background:none;white-space:nowrap;color:var(--color-gold);text-align:center}.identity-input button:hover{background:var(--color-hover)}.identity-prompt .text-button{margin-top:8px}#identify{min-height:28px;font-size:10px}dialog .identity-prompt{border:0;padding:0;background:none}

.context{min-height:0}.context section{height:calc(100vh - 205px);min-height:560px;max-height:850px;display:flex;flex-direction:column;border-bottom:0}.context .transcript{overflow-y:auto;flex:1;min-height:0;scrollbar-width:thin;scrollbar-color:var(--color-line) var(--color-bg);margin-top:20px;padding-right:12px}.transcript-line{padding:14px 0 18px;border-bottom:1px solid var(--color-line)}.transcript-line time{font:11px var(--font-mono);color:var(--color-dim)}.transcript-line p{margin:8px 0 0;color:var(--color-muted);line-height:1.9;font-size:15px}.transcript-line.current p{color:var(--color-ink)}.transcript-line.current time{color:var(--color-gold)}#transcript-follow{align-self:flex-start;margin-top:8px}

.status.recording::before{display:inline-block;animation:record-pulse 1.4s var(--ease-in-out) infinite}@keyframes record-pulse{0%,100%{opacity:1}50%{opacity:.25}}@media(prefers-reduced-motion:reduce){.status.recording::before{animation:none}}

/* Compact player controls */
.session-head{align-items:center}
.session-head>div:first-child{min-width:0}
.session-controls{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:8px;min-width:108px}
.session-controls .timer{padding:0;font:12px/1.3 var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:1px;color:var(--color-ink)}
.session-controls .record-actions{display:flex;align-items:center;justify-content:center;gap:4px;padding:4px;border:1px solid var(--color-line);border-radius:28px;background:var(--color-bg)}
.session-controls .record-icon{position:relative;display:grid;place-items:center;flex:none;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:50%;background:none;color:var(--color-muted)}
.session-controls .record-icon svg{position:relative;width:18px;height:18px;z-index:1}
.session-controls #pause::before,.session-controls #start::before{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--color-ink)}
.session-controls #pause{color:var(--color-bg)}
.session-controls #start{color:var(--color-bg)}
.session-controls #start::before{background:var(--color-gold)}
.session-controls #stop svg{width:15px;height:15px}
.session-controls .record-icon:hover:not(:disabled){background:var(--color-hover);color:var(--color-ink)}
.session-controls #pause:hover:not(:disabled),.session-controls #start:hover:not(:disabled){color:var(--color-bg)}
.session-controls #pause:hover::before,.session-controls #start:hover::before{background:var(--color-gold)}
.session-controls .record-icon:disabled{opacity:.45}
.stream-panel>.follow{bottom:20px}

/* Keep dialog controls outside the scrolling content. */
dialog{padding:0;overflow:hidden;max-height:85dvh}
#dialog-content{display:flex;flex-direction:column;max-height:calc(85dvh - 2px);min-height:0}
#dialog-content>.modal-head{flex-shrink:0;margin:0;padding:16px 24px;border-bottom:1px solid var(--color-line);background:var(--color-panel)}
.modal-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:24px;scrollbar-width:thin;scrollbar-color:var(--color-line) var(--color-panel)}

.card-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.card-bottom{flex-wrap:wrap;row-gap:10px}.card-actions .note-action{color:var(--color-gold);border-color:var(--color-gold-line);padding:4px 10px}.card-actions button{white-space:nowrap}

/* Workspace navigation without a sidebar. */
.app{display:block;max-width:1180px}.page-head{margin-bottom:24px}.workspace-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.workspace-nav button{border:0;background:none;color:var(--color-muted);font-size:14px;padding:10px 16px}.workspace-nav button:first-child{font-size:22px;font-weight:600;padding-left:0;margin-right:12px;color:var(--color-ink)}.workspace-nav button.active:not(:first-child){background:var(--color-hover);color:var(--color-ink)}.workspace-nav button:first-child:not(.active){color:var(--color-muted)}.workspace-nav small{margin-left:6px;font:11px var(--font-mono);color:var(--color-dim)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.card-source{font-size:10px;color:var(--color-dim);margin-top:12px}.compact .app{border:0}.compact .stream-panel{height:calc(100dvh - 150px)}.filters{padding-top:0}@media(max-width:540px){.workspace-nav{gap:4px;flex-wrap:nowrap;width:100%}.workspace-nav button{padding:8px;font-size:12px}.workspace-nav button:first-child{font-size:18px;margin-right:auto;padding-right:8px}.workspace-nav small{margin-left:4px}.stream-panel{height:calc(100dvh - 155px)}}

.session-result-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 0 24px;margin-bottom:24px;border-bottom:1px solid var(--color-line)}.session-result-head h2{font-size:22px}.session-result-head p{font-size:12px;margin-top:8px}

.card-top-actions{display:flex;align-items:center;gap:12px;flex-shrink:0}.card-top .detail-icon{display:grid;place-items:center;width:32px;height:32px;min-height:32px;padding:0;border:0;background:none;color:var(--color-muted)}.card-top .detail-icon:hover{color:var(--color-ink);background:var(--color-hover)}.card-top .detail-icon::before{content:'';position:absolute;width:44px;height:44px}.detail-icon{position:relative}.frequency-meter{display:inline-flex;align-items:center;gap:4px;height:28px}.frequency-meter i{display:block;width:3px;height:16px;border-radius:2px;background:var(--color-line)}.frequency-meter i.lit{background:var(--color-ink)}.card-actions .note-action[aria-pressed=true]{color:var(--color-muted);border-color:var(--color-line)}

.selection-bar{justify-content:flex-end}.selection-bar>div{margin-left:auto}

.workspace-nav button:first-child:hover:not(:disabled){background:none;color:var(--color-gold)}
.workspace-nav button:first-child.active{background:none;color:var(--color-gold)}
.workspace-nav button.active:not(:first-child),.workspace-nav button:hover:not(:disabled){background:none;color:var(--color-gold)}
.workspace-nav button.active small,.workspace-nav button:hover small{color:inherit}

.card>.card-title,.card>.reading,.card>.meaning,.card>.quote{text-align:center}.card>.card-title{margin-top:20px}.card>.quote{border-left:0;padding:0;margin:20px 0 8px;line-height:1.9}.keyword-highlight{background:none;color:var(--color-gold);font-weight:500}

.reading-toggle{font:inherit;color:inherit;min-height:0;padding:2px 6px;margin:-2px -6px;border:0;background:none;position:relative}.reading-toggle::before{content:'';position:absolute;inset:-8px -4px}.reading-toggle:hover:not(:disabled){color:var(--color-gold);background:none}.card>.reading{min-height:20px}

.transcript-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.transcript-head button{display:grid;place-items:center;width:36px;height:36px;min-height:36px;padding:0;border:0;background:none;color:var(--color-muted)}.transcript-head button:hover{background:none;color:var(--color-gold)}.context section:first-child{padding-top:0}.transcript-hidden .context{display:none}.transcript-hidden .live-grid{grid-template-columns:minmax(0,1fr)}#show-transcript{flex-shrink:0;padding:8px 12px;color:var(--color-muted)}#show-transcript:hover{color:var(--color-gold);background:none}@media(max-width:800px){body:not(.transcript-hidden) .context{display:block}body:not(.transcript-hidden) .context section{height:420px;min-height:0;margin-top:24px}}@media(max-width:540px){.page-head{flex-wrap:wrap;gap:4px}#show-transcript{margin-left:auto}}

/* Media player: artwork, title, live sentence, transport. */
.live-grid{row-gap:18px}.media-player{grid-column:1/-1;display:grid;grid-template-columns:minmax(150px,230px) minmax(0,1fr) 108px;gap:24px;padding:18px 20px;border:1px solid var(--color-line);border-radius:14px;background:var(--color-panel);min-width:0}.media-info{display:flex;align-items:center;gap:14px;min-width:0}.media-cover{width:64px;height:64px;flex-shrink:0;display:grid;place-items:center;position:relative;overflow:hidden;border-radius:8px;border:1px solid var(--color-line);background:var(--color-bg);color:var(--color-dim)}.media-cover img{width:100%;height:100%;object-fit:cover}.media-cover.has-poster .cover-placeholder{display:none}.media-title{min-width:0}.media-title h2{font-size:14px;line-height:1.5;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.media-title #identify{margin-top:4px}.player-screen{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0;min-height:68px;padding:12px 18px;border:1px solid var(--color-line);background:var(--color-bg);border-radius:8px;white-space:normal;text-align:center}.player-screen:disabled{opacity:1;cursor:default}.player-screen:hover:not(:disabled){background:var(--color-bg);border-color:var(--color-gold-line)}.player-screen .status{font-size:11px;flex-shrink:0}.player-screen .status.recording:before{margin-right:0}.player-screen #player-transcript{font-size:14px;line-height:1.7;overflow-wrap:anywhere}.live-grid>.stream-panel{height:calc(100dvh - 280px);min-height:420px;max-height:none}.context section{height:calc(100dvh - 280px);min-height:420px;max-height:none}@media(max-width:800px){.media-player{grid-template-columns:minmax(0,1fr) 108px;gap:12px;margin-bottom:18px}.player-screen{grid-column:1/-1;grid-row:2}.media-player .session-controls{grid-column:2;grid-row:1}.media-cover{width:52px;height:52px}.live-grid>.stream-panel{height:calc(100dvh - 345px);min-height:360px}}@media(max-width:540px){.media-player{padding:14px;gap:12px}.media-info{gap:10px}.media-title h2{font-size:13px}.media-cover{width:44px;height:44px}.player-screen{min-height:62px;padding:10px}.player-screen #player-transcript{font-size:13px}}

.player-screen{flex-direction:column;gap:7px;padding:10px 18px;min-height:72px}.screen-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:14px}.screen-meta .timer{padding:0;font:11px/1 var(--font-mono);letter-spacing:1px;font-variant-numeric:tabular-nums;color:var(--color-muted)}.player-screen #player-transcript{width:100%;text-align:center}.media-player .session-controls{justify-content:center;align-self:stretch;gap:0}

.media-title #session-title{font:inherit;line-height:inherit;text-align:left;white-space:normal;padding:0;min-height:32px;border:0;background:none;color:var(--color-ink)}.media-title #session-title:hover:not(:disabled){background:none;color:var(--color-gold)}.media-title #session-title:disabled{opacity:1;cursor:default}

.screen-meta{justify-content:center}.screen-line{display:flex;align-items:center;justify-content:center;gap:9px;min-width:0;width:100%;min-height:24px}.player-screen #player-transcript{width:auto;min-width:0}.screen-line .status{display:inline-flex;align-items:center;justify-content:center;line-height:1.7}.screen-line .status.recording::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--color-gold);margin:0}.screen-line .status.paused::before{content:'';display:block;width:9px;height:11px;border-left:3px solid var(--color-gold);border-right:3px solid var(--color-gold);box-sizing:border-box}

.screen-line .status.recording,.screen-line .status.paused{width:12px;height:12px}.screen-line .status.recording::before{width:10px;height:10px}.screen-line .status.paused::before{width:10px;height:10px}.screen-meta .timer{min-height:14px;line-height:14px}

/* Narrow workspace swaps panels; wide workspace can show both. */
@media(max-width:1099px){
  .live-grid{display:grid;grid-template-columns:minmax(0,1fr)}
  body:not(.transcript-hidden) .live-grid>.stream-panel{display:none}
  body:not(.transcript-hidden) .live-grid>.context{display:block}
  body:not(.transcript-hidden) .context section{height:calc(100dvh - 280px);min-height:420px;margin-top:0}
}
@media(max-width:800px){
  .media-player{margin-bottom:0}
  body:not(.transcript-hidden) .context section{height:calc(100dvh - 345px);min-height:360px}
}
@media(min-width:1100px){
  .workspace-nav{width:100%}
  .workspace-nav button[data-view="review"]{margin-left:auto}
  body:not(.transcript-hidden) .live-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr)}
  body:not(.transcript-hidden) .live-grid>.stream-panel{display:flex}
  body:not(.transcript-hidden) .live-grid>.context{display:block}
}
@media(max-width:380px){
  .workspace-nav{flex-wrap:wrap}
  .workspace-nav button:first-child{flex-basis:100%;text-align:left;margin-right:0}
  .workspace-nav button[data-view="review"]{margin-left:auto}
}
.workspace-nav{width:100%}
.workspace-nav button[data-view="review"]{margin-left:auto}
.screen-line{align-items:flex-start;--player-line-height:23.8px}
.screen-line .status{align-self:flex-start;margin-top:calc((var(--player-line-height) - 12px)/2)}
@media(max-width:540px){.screen-line{--player-line-height:22.1px}}

.feed,.context .transcript{overflow-anchor:none}
@media(max-width:540px){
  .workspace-nav{flex-wrap:nowrap;gap:2px}
  .workspace-nav button:first-child{flex:0 1 auto;min-width:0;font-size:clamp(13px,4vw,18px);padding:8px 4px 8px 0;margin-right:4px;letter-spacing:-.3px}
  .workspace-nav button:not(:first-child){flex-shrink:0;padding:8px 5px;font-size:11px}
  .workspace-nav small{font-size:9px;margin-left:3px}
  .workspace-nav button[data-view="review"]{margin-left:auto}
}
.player-screen #player-transcript{display:block;white-space:nowrap;overflow:hidden;text-overflow:clip;overflow-wrap:normal;min-width:0;max-width:100%}
.screen-line{flex-wrap:nowrap}

.session-save-card{flex-shrink:0}.session-save-card button{width:100%;min-height:66px;padding:16px;border:1px solid var(--color-gold);border-radius:12px;color:var(--color-bg);background:var(--color-gold);font-weight:600;white-space:normal}.session-save-card button:hover:not(:disabled){background:var(--color-ink);border-color:var(--color-ink);color:var(--color-bg)}.session-save-card button:disabled{color:var(--color-muted);border-color:var(--color-line);background:var(--color-card);opacity:1}

#review-view .card-grid{padding-bottom:24px}

/* Connected application controls */
.input-mode select{background:var(--color-bg);border:1px solid var(--color-line);border-radius:5px;font-size:12px;max-width:170px;padding:4px 8px;height:32px}.prototype-bar{gap:8px}.load-more{display:block;margin:16px auto}.runtime-info{font-size:12px;color:var(--color-muted);padding-top:12px}.warning{white-space:normal}#connection-label{font-size:11px!important}.reading-toggle{max-width:100%;white-space:normal}.detail-section p{overflow-wrap:anywhere} .quote{overflow-wrap:anywhere}.transcript-line{padding:14px 0;border-bottom:1px solid var(--color-line)}.transcript-line time{font-size:10px;color:var(--color-muted)}.transcript-line.latest p{color:var(--color-ink)}.transcript-line.partial p{opacity:.55}@media(max-width:380px){.prototype-bar{padding:0 10px}.input-mode select{max-width:145px;font-size:11px}.prototype-bar>div{gap:0}#connection-label{font-size:10px!important}}

/* Source switches beside transport, settings in navigation. */
.app{min-height:100dvh}.workspace-nav{gap:28px}.workspace-nav button{padding-inline:0}.workspace-nav button:first-child{margin-right:0}.workspace-nav .settings-icon{display:grid;place-items:center;width:40px;min-width:40px;padding:0;flex-shrink:0}
.media-player{grid-template-columns:minmax(140px,210px) minmax(0,1fr) auto}.media-player .session-controls{flex-direction:row;gap:16px;min-width:0}.input-toggles{display:flex;align-items:center;gap:6px}.input-toggle{display:grid;place-items:center;flex:none;width:40px;height:44px;min-height:44px;padding:0;border:0;background:transparent;color:var(--color-dim);border-radius:0}.input-toggle[aria-pressed=true]{color:var(--color-gold)}.input-toggle:hover:not(:disabled){color:var(--color-gold);background:transparent}.input-toggle:disabled{opacity:.65}.input-toggle svg{width:17px;height:17px;pointer-events:none}.live-grid>.stream-panel,.context section{height:calc(100dvh - 234px)}
@media(max-width:800px){.media-player{grid-template-columns:minmax(0,1fr) auto;gap:12px}.media-player .session-controls{gap:10px}.input-toggles{gap:2px}.input-toggle{width:36px}.live-grid>.stream-panel,.context section{height:calc(100dvh - 299px)}}
@media(max-width:540px){.workspace-nav{gap:14px}.workspace-nav button:first-child{font-size:clamp(13px,4vw,18px);padding-right:0;margin-right:0}.workspace-nav button:not(:first-child){padding-inline:0}.workspace-nav .settings-icon{width:30px;min-width:30px}.workspace-nav small{margin-left:3px}}
@media(max-width:360px){.workspace-nav{gap:8px}.workspace-nav button:first-child{font-size:12px;letter-spacing:-.4px}.workspace-nav button:not(:first-child){font-size:10px}.workspace-nav .settings-icon{width:28px;min-width:28px}.workspace-nav small{font-size:8px;margin-left:2px}.media-player{grid-template-columns:minmax(0,1fr)}.media-player .media-info{grid-column:1;grid-row:1}.media-player .session-controls{grid-column:1;grid-row:2;justify-self:end}.media-player .player-screen{grid-column:1;grid-row:3}.live-grid>.stream-panel,.context section{height:calc(100dvh - 350px)}}

.api-config{margin-top:24px;border-top:1px solid var(--color-line);padding-top:18px}.api-config summary{cursor:pointer;color:var(--color-gold)}.api-config h3{font-size:14px;margin-top:22px}.api-config label{display:block;margin-top:12px}.api-config input{width:100%;min-width:0}.api-config .primary{margin-top:16px}

/* Distinct level colors, shared by focus controls, conveyor and cards. */
.level-focus{display:flex;gap:2px;align-items:center}.level-focus button{padding:0 7px;min-width:36px;min-height:44px;border:1px solid transparent;background:transparent;color:var(--color-muted);font-size:12px;font-weight:600}.level-focus button[aria-pressed=true]{color:var(--level-color);border-color:transparent;background:transparent}.level-tag{color:var(--level-color)}.card.level-match{border-color:var(--level-color);background:color-mix(in srgb,var(--level-color) 7%,var(--color-card))}.card.level-match mark{color:var(--level-color)}.data-credit{font-size:11px;line-height:1.7;margin-bottom:16px}.data-credit a{text-decoration:underline}.media-player .session-controls{flex-wrap:wrap;justify-content:flex-end;gap:8px}@media(max-width:1100px){.media-player{grid-template-columns:minmax(0,1fr) auto}.media-player .player-screen{grid-column:1/-1;grid-row:2}}@media(max-width:650px){.media-player .session-controls{grid-column:1/-1;grid-row:2;justify-content:space-between}.media-player .player-screen{grid-row:3}.level-focus button{min-width:35px}.live-grid>.stream-panel,.context section{height:calc(100dvh - 350px)}}

/* Settings use the same immediate-save interaction for switches and selectors. */
.settings-panel{display:flex;flex-direction:column;gap:24px;min-width:0}
.settings-account{display:flex;flex-direction:column;gap:4px;padding-bottom:20px;border-bottom:1px solid var(--color-line)}
.settings-caption{font-size:11px;color:var(--color-muted)}.settings-account strong{font-size:18px;font-weight:550;overflow-wrap:anywhere}
.byok-settings{min-width:0}.byok-settings>label.check{justify-content:space-between;font-size:15px;gap:16px;margin-bottom:8px;white-space:normal;line-height:1.5;color:var(--color-ink)}
.byok-settings .data-credit{margin:0}.settings-field,.settings-microphone{display:grid;gap:8px;min-width:0}.settings-field label,.settings-microphone label{font-size:13px}
.settings-panel .field{display:block;min-width:0;max-width:100%;font-size:14px}.settings-panel input[aria-invalid=true]{border-color:var(--color-gold)}
#byok-enabled{appearance:none;position:relative;flex:none;margin:0;width:38px;height:22px;border:1px solid var(--color-line);border-radius:12px;background:var(--color-panel);cursor:pointer}
#byok-enabled::before{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:var(--color-muted);transition:transform .15s}
#byok-enabled:checked{background:var(--color-gold);border-color:var(--color-gold)}#byok-enabled:checked::before{transform:translateX(16px);background:var(--color-bg)}#byok-enabled:disabled{opacity:.45;cursor:not-allowed}
#byok-fields{display:grid;gap:20px;margin-top:20px;min-width:0}.byok-provider{display:grid;gap:12px;min-width:0;padding-top:16px;border-top:1px solid var(--color-line)}.byok-provider h3{font-size:14px;color:var(--color-gold)}
#byok-clear{justify-self:start}#byok-message:empty{display:none}#byok-message{font-size:12px;margin-top:12px;overflow-wrap:anywhere}
.settings-microphone{padding-top:20px;border-top:1px solid var(--color-line)}.settings-panel .api-config{margin:0}
.settings-credit{padding-top:20px;border-top:1px solid var(--color-line);margin:0;overflow-wrap:anywhere}.settings-footer{display:flex;justify-content:center;padding-top:4px}.settings-footer:empty{display:none}.settings-footer .text-button{font-size:12px;padding:4px 16px;min-height:44px}
@media(max-width:540px){.modal-body:has(.settings-panel){padding:20px 16px}.settings-panel .field{font-size:16px}.settings-panel{gap:20px}}


/* Streaming text and status updates must not animate or displace existing cards. */
.card{animation:none}
.player-screen{height:72px;min-height:72px;max-height:72px}
.screen-line{height:24px;flex-shrink:0}

/* Animate the recording indicator independently of transcript repainting. */
.screen-line .status.recording::before{animation:none}
.screen-line .status.recording{animation:learn-recording-breathe 1.4s ease-in-out infinite;transform-origin:center}
@keyframes learn-recording-breathe{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.78)}}
@media(prefers-reduced-motion:reduce){.screen-line .status.recording{animation:none}}

/* Real pending cards travel left into the tray on the two-second release clock. */
.card-conveyor{height:64px;min-height:64px;flex-shrink:0;display:flex;align-items:center;gap:12px;margin-bottom:12px;border-bottom:1px solid var(--color-line)}
.conveyor-window{height:52px;position:relative;overflow:hidden;flex:1;min-width:0;isolation:isolate;mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent)}
.conveyor-track{position:absolute;inset:0;z-index:2;pointer-events:none}
.conveyor-card{position:absolute;left:0;top:4px;width:23px;height:23px;border-radius:4px;background:var(--queue-color);border:1px solid color-mix(in srgb,var(--queue-color) 75%,white);box-shadow:0 2px 0 #0005;will-change:transform;transform-origin:center;pointer-events:auto;}
.conveyor-card.expression{width:31px;height:20px;top:7px}
.conveyor-belt{position:absolute;left:42px;right:0;top:29px;height:8px;border-block:1px solid var(--color-line);background:repeating-linear-gradient(110deg,transparent 0 18px,var(--color-line) 18px 20px,transparent 20px 22px);opacity:.7}
.conveyor-box{position:absolute;left:0;top:15px;width:44px;height:36px;z-index:3;overflow:visible}
.box-back{fill:var(--color-bg);stroke:var(--color-line);stroke-width:1.3}
.box-front{fill:var(--color-panel);stroke:var(--color-muted);stroke-width:1.3;stroke-linejoin:round}
.box-edge{fill:none;stroke:var(--color-muted);stroke-width:1.3;stroke-linejoin:round}
.conveyor-count{flex:none;min-width:25px;text-align:right;font:11px var(--font-mono);color:var(--color-muted);font-variant-numeric:tabular-nums;padding-right:3px}
.level-focus button{color:var(--color-muted);opacity:1}
.level-focus button[aria-pressed=true]{opacity:1;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.level-focus button:hover:not(:disabled){background:transparent}
.level-focus button[aria-pressed=false]:hover:not(:disabled){color:var(--color-muted)}
@media(prefers-reduced-motion:reduce){.conveyor-card{will-change:auto}}

/* Hallmark · component: overhead card transport · inherited charcoal theme
 * pre-emit critique: P4 H4 E4 S5 R4 V4 */
.card-conveyor{grid-column:1/-1;display:flex;align-items:center;justify-content:center;height:auto;min-height:0;margin:0;padding:0;border:0;background:none;min-width:0}
.conveyor-scene{display:block;width:600px;max-width:100%;height:auto;overflow:visible}
.conveyor-lane{fill:none}
.conveyor-guide{fill:none;stroke:var(--color-conveyor-guide);stroke-width:1}
.conveyor-scene .conveyor-card{position:static;width:auto;height:auto;top:auto;left:auto;border:0;box-shadow:none;background:none;transform-origin:0 0;will-change:transform,opacity;pointer-events:auto}
.conveyor-card rect{fill:var(--queue-color);stroke:var(--color-paper-rule);stroke-width:1}
.conveyor-card .paper-inset{fill:none;stroke:var(--color-paper-rule);stroke-width:1}
.conveyor-scene .conveyor-count{fill:var(--color-muted);font:11px var(--font-mono)}
@media(max-width:1099px){body:not(.transcript-hidden) .live-grid>.card-conveyor{display:none}}
@media(prefers-reduced-motion:reduce){.conveyor-scene .conveyor-card{will-change:auto}}

/* Keep transit immediately above the feed; no counter or empty end-state rail. */
.card-conveyor{margin-top:-8px;margin-bottom:-12px}
.conveyor-level{fill:var(--color-bg);font-family:var(--font-body);font-size:16px;font-weight:650;pointer-events:none}

/* Cards fall through the strip boundaries at full opacity. */
.conveyor-scene{overflow:hidden}

/* The live queue occupies the collection-button area within the card panel. */
.stream-panel>.card-conveyor{grid-column:auto;margin:0 20px;padding:4px 0 0;border-bottom:1px solid var(--color-line);flex-shrink:0}
.conveyor-card rect{stroke:none}
@media(max-width:540px){.stream-panel>.card-conveyor{margin-inline:14px}}

/* Library controls share the player's level colors without changing recording focus. */
.library-levels{flex-wrap:wrap;gap:3px}.library-levels button:first-child{padding-inline:9px;font-weight:400}.results-head #clear-cards{min-height:40px;padding:6px 10px;font-size:12px}.clear-favorites-option{margin-top:20px;font-size:13px;color:var(--color-ink)}.clear-favorites-option input{width:16px;height:16px}.danger-button{color:var(--color-error);border-color:var(--color-error)}
@media(max-width:540px){.library-levels{order:3;flex-basis:100%;justify-content:space-between}.library-levels button{padding-inline:6px}.filter-row #type{flex:1}}