.timeline-typography{font-size:var(--text-base);line-height:1.6}.th-wrap{position:relative;--pill-h: 3.75rem;--axis-h: 2rem;--stem-h: 2.5rem;height:calc(var(--pill-h) + var(--stem-h) + var(--axis-h));margin-bottom:calc(var(--spacing) * 6)}.th-steps{position:absolute;inset:0}.th-step{position:absolute;left:var(--pos);top:0;transform:translate(-50%);width:max-content;display:flex;flex-direction:column;gap:3px;appearance:none;background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius-xl);padding:calc(var(--spacing) * 3) calc(var(--spacing) * 4);cursor:pointer;font:inherit;text-align:left;transition:background var(--duration-base) var(--ease-out),border-color var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out),box-shadow var(--duration-base) var(--ease-out)}.th-step:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);width:1px;height:var(--stem-h, 2.5rem);background:linear-gradient(to bottom,color-mix(in oklch,var(--border-strong) 50%,transparent),color-mix(in oklch,var(--border-strong) 10%,transparent));transition:background var(--duration-base) var(--ease-out)}.th-step--first:after{left:calc(var(--spacing) * 6);transform:none}.th-step--last:after{left:auto;right:calc(var(--spacing) * 6);transform:none}.th-step.active:after{background:linear-gradient(to bottom,color-mix(in oklch,var(--accent) 70%,transparent),color-mix(in oklch,var(--accent) 15%,transparent))}.th-step--first{left:0;transform:none}.th-step--last{left:auto;right:0;transform:none}.th-step:hover{background:var(--bg-elevated);border-color:var(--border-strong);transform:translate(-50%) translateY(-2px);box-shadow:0 4px 16px color-mix(in oklch,var(--fg) 6%,transparent)}.th-step--first:hover,.th-step--last:hover{transform:translateY(-2px)}.th-step.active{background:color-mix(in oklch,var(--accent) 10%,var(--bg-raised));border-color:var(--accent);box-shadow:0 0 0 1px color-mix(in oklch,var(--accent) 30%,transparent),0 4px 20px color-mix(in oklch,var(--accent) 18%,transparent)}.th-step:focus-visible{outline:2px solid var(--accent-ring);outline-offset:2px}.th-step-label{display:block;font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--fg-muted);transition:color var(--duration-base) var(--ease-out)}.th-step.active .th-step-label{color:color-mix(in oklch,var(--accent) 85%,var(--fg))}.th-step-date{display:block;font-family:var(--font-mono);font-size:var(--text-sm);font-weight:500;letter-spacing:-.01em;color:var(--fg);white-space:nowrap;transition:color var(--duration-base) var(--ease-out)}.th-axis{position:absolute;left:22px;right:22px;bottom:0;height:var(--axis-h, 2rem)}.th-axis-line{position:absolute;left:0;right:0;top:50%;height:1px;background:linear-gradient(to right,color-mix(in oklch,var(--fg) 8%,transparent),color-mix(in oklch,var(--fg) 18%,transparent),color-mix(in oklch,var(--fg) 8%,transparent))}.th-axis-progress{position:absolute;left:0;top:50%;height:1px;width:var(--progress, 0%);background:linear-gradient(to right,transparent,color-mix(in oklch,var(--accent) 70%,transparent),color-mix(in oklch,var(--accent) 95%,transparent));box-shadow:0 0 8px color-mix(in oklch,var(--accent) 50%,transparent)}.th-axis-ms-dot{position:absolute;left:var(--pos);top:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:var(--radius-full);background:var(--bg);border:1px solid color-mix(in oklch,var(--fg) 30%,transparent);transition:background var(--duration-base) var(--ease-out),border-color var(--duration-base) var(--ease-out),box-shadow var(--duration-base) var(--ease-out)}.th-axis-ms-dot--first{left:0;transform:translateY(-50%)}.th-axis-ms-dot--last{left:auto;right:0;transform:translateY(-50%)}.th-axis-ms-dot.active{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in oklch,var(--accent) 20%,transparent),0 0 10px color-mix(in oklch,var(--accent) 50%,transparent)}.th-axis-now{position:absolute;left:var(--pos);top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center}.th-axis-now-dot{width:12px;height:12px;border-radius:var(--radius-full);background:var(--accent);box-shadow:0 0 0 4px color-mix(in oklch,var(--accent) 18%,transparent),0 0 18px color-mix(in oklch,var(--accent) 60%,transparent);animation:th-now-pulse 2.4s ease-in-out infinite}.th-axis-now-label{position:absolute;top:calc(50% + 16px);font-family:var(--font-mono);font-size:var(--text-2xs);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--accent);white-space:nowrap}@keyframes th-now-pulse{0%,to{transform:scale(1);box-shadow:0 0 0 4px color-mix(in oklch,var(--accent) 18%,transparent),0 0 14px color-mix(in oklch,var(--accent) 50%,transparent)}50%{transform:scale(1.15);box-shadow:0 0 0 6px color-mix(in oklch,var(--accent) 12%,transparent),0 0 22px color-mix(in oklch,var(--accent) 70%,transparent)}}@media(max-width:720px){.th-axis{display:none}}@media(prefers-reduced-motion:reduce){.th-axis-now-dot{animation:none}}.timeline-typography .timeline-shell{width:100%;background:color-mix(in oklch,var(--bg-raised) 70%,transparent);border:1px solid var(--border);border-radius:var(--radius-2xl);backdrop-filter:blur(12px);overflow:hidden}@media(max-width:600px){.th-wrap{height:auto}.th-steps{position:static;display:flex;flex-direction:column;gap:calc(var(--spacing) * 2);margin-bottom:calc(var(--spacing) * 4)}.th-step,.th-step--first,.th-step--last{position:static;transform:none;width:100%}.th-step:hover,.th-step--first:hover,.th-step--last:hover{transform:none}.th-axis{position:static;display:none}}.timeline-typography .timeline-detail-frame{animation:timeline-fade-in var(--duration-base) var(--ease-out) both}.timeline-typography .timeline-detail-title{margin:0 0 calc(var(--spacing) * 2);color:var(--fg);font-size:clamp(var(--text-xl),1rem + .7vw,var(--text-2xl));line-height:1.25;font-weight:500;letter-spacing:var(--tracking-tight)}.timeline-typography .timeline-detail-deadline{margin:0 0 calc(var(--spacing) * 4);color:var(--accent);font-family:var(--font-mono);font-size:var(--text-sm);letter-spacing:var(--tracking-caps);text-transform:uppercase}.timeline-typography .timeline-detail-text{margin:0 0 calc(var(--spacing) * 5);color:var(--fg-muted);line-height:1.65;max-width:68ch}.timeline-typography .timeline-detail-action-label{margin:0 0 calc(var(--spacing) * 1);font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--fg-subtle)}.timeline-typography .timeline-detail-action-text{margin:0;color:var(--fg-muted);line-height:1.7;font-size:var(--text-base);border-left:2px solid color-mix(in oklch,var(--accent) 40%,transparent);padding-left:calc(var(--spacing) * 4)}@keyframes timeline-fade-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.th-step,.timeline-typography .timeline-detail-frame{transition:none;animation:none}}