.recall-timeline{display:grid;gap:18px;max-width:1200px;margin:0 auto;color:var(--navy)}
.timeline-header{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.timeline-header h1{font:400 44px var(--font-serif);margin:0}.timeline-header .view-title{margin-bottom:10px}
.timeline-controls,.timeline-filters{display:flex;gap:12px;flex-wrap:wrap;align-items:end}
.recall-timeline .btn{min-height:48px;border-radius:24px;white-space:normal}
.recall-timeline input:not([type=range]),.recall-timeline select{font:inherit;min-height:48px;border:1px solid var(--paper-border);border-radius:12px;padding:10px 14px;background:var(--paper-raised);color:var(--navy);box-sizing:border-box;max-width:100%}
.timeline-filters label{display:grid;gap:8px;font-size:14px;flex:1;min-width:180px}.timeline-filters label:first-child{flex:3}
.timeline-muted{font-size:14px;color:var(--muted);line-height:1.6;margin:0}.timeline-error{color:var(--rust);margin:0}.timeline-error:empty{display:none}
.timeline-ruler{padding:24px;border:1px solid var(--paper-line);border-radius:20px;background:var(--paper-raised)}
.timeline-ruler[hidden]{display:none}.timeline-eyebrow{font:500 18px var(--font-sans);margin:0 0 20px}
.timeline-hours{display:grid;grid-template-columns:repeat(24,minmax(0,1fr));gap:3px;align-items:end}
.timeline-hour{height:80px;padding:4px 1px;background:transparent;border:0;color:var(--muted);display:flex;flex-direction:column;justify-content:end;gap:8px;align-items:center;cursor:pointer;font:12px var(--font-mono);border-radius:6px}
.timeline-hour span:last-child{height:16px}.timeline-bar{display:block;width:75%;background:var(--navy);opacity:.45;border-radius:4px}
.timeline-hour[aria-pressed=true]{background:var(--paper-fill)}.timeline-hour[aria-pressed=true] .timeline-bar{opacity:1}
.timeline-ruler label{display:grid;gap:12px;font-size:14px;margin:12px 0}.timeline-ruler input[type=range]{width:100%;min-height:32px;accent-color:var(--navy)}
.timeline-controls [aria-pressed=true]{background:var(--navy);color:var(--paper)}
.timeline-results{display:grid;gap:24px}.timeline-conversation{border-left:2px solid var(--paper-border);padding-left:24px}
.timeline-when{font:13px var(--font-mono);color:var(--muted);margin-bottom:12px}
.timeline-conversation details{border:1px solid var(--paper-line);background:var(--paper-raised);border-radius:16px;overflow:hidden}
.timeline-conversation summary{display:flex;align-items:flex-start;flex-direction:column;gap:8px;padding:20px;text-align:left;cursor:pointer}
.timeline-conversation summary strong{font:500 26px var(--font-serif);overflow-wrap:anywhere}.timeline-conversation summary span{font-size:14px;color:var(--muted)}
.timeline-conversation summary::after{content:'Expand recordings +';font:500 14px var(--font-sans);color:var(--navy)}.timeline-conversation details[open]>summary::after{content:'Collapse recordings −'}
.timeline-recording{display:grid;gap:8px;padding:18px 20px;border:1px solid var(--paper-line);border-radius:16px;background:var(--paper-raised);min-width:0}
details .timeline-recording{border:0;border-top:1px solid var(--paper-line);border-radius:0}
.timeline-recording .btn{text-align:left;justify-self:start;font:500 22px var(--font-serif);max-width:100%;overflow-wrap:anywhere}
.timeline-recording p{line-height:1.6;color:var(--body);margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:700px){.timeline-header h1{font-size:34px}.timeline-ruler{padding:14px}.timeline-conversation{padding-left:12px}.timeline-controls{gap:8px}.timeline-hour{font-size:10px}}
