.route-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:start;gap:clamp(2rem,6vw,6rem);display:grid}.route-ticket-column{top:calc(var(--spacing-nav) + 2.5rem);filter:drop-shadow(0 0 .5px var(--color-line-strong)) drop-shadow(0 14px 18px var(--color-line));position:sticky}.route-ticket{--tooth:.625rem;max-width:24rem;padding:1.5rem 1.5rem calc(1.5rem + var(--tooth));border-radius:var(--radius-md) var(--radius-md) 0 0;background:var(--color-surface-raised);-webkit-mask:linear-gradient(black 0 0) top / 100% calc(100% - var(--tooth)) no-repeat, radial-gradient(circle at 50% 100%, transparent calc(var(--tooth) * .62), black calc(var(--tooth) * .64)) bottom / calc(var(--tooth) * 1.6) var(--tooth) repeat-x;mask:linear-gradient(black 0 0) top / 100% calc(100% - var(--tooth)) no-repeat, radial-gradient(circle at 50% 100%, transparent calc(var(--tooth) * .62), black calc(var(--tooth) * .64)) bottom / calc(var(--tooth) * 1.6) var(--tooth) repeat-x;position:relative}.route-ticket-head{border-bottom:1px dashed var(--color-line-strong);flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;padding-bottom:1rem;display:flex}.route-ticket-status{border-radius:var(--radius-full);background:var(--color-accent-soft);color:var(--color-accent);font-size:var(--text-caption);line-height:var(--text-caption--line-height);white-space:nowrap;padding:.125rem .625rem;font-weight:500}.route-ticket-lines{gap:.25rem;padding-block:1rem;display:grid}.route-ticket-lines li{min-height:2.5rem;color:var(--color-ink-subtle);font-size:var(--text-body-sm);line-height:var(--text-body-sm--line-height);transition:color var(--duration-surface) var(--ease-enter);grid-template-columns:1.25rem minmax(0,1fr) auto;align-items:center;gap:.75rem;display:grid}.route-ticket-dot{border-radius:var(--radius-full);width:1.25rem;height:1.25rem;box-shadow:inset 0 0 0 1px var(--color-line-strong);color:#0000;transition:background var(--duration-surface) var(--ease-enter), color var(--duration-surface) var(--ease-enter);place-items:center;display:grid}.route-ticket-mark{opacity:.35;filter:grayscale();min-width:3rem;transition:opacity var(--duration-surface) var(--ease-enter), filter var(--duration-surface) var(--ease-enter);justify-content:flex-end;display:flex}.route-ticket-mark svg,.route-compact-status svg{width:1rem;height:1rem}.route-ticket-lines li:is([data-state=done],[data-state=active]){color:var(--color-ink)}.route-ticket-lines li[data-state=done] .route-ticket-dot{background:var(--color-ink);color:var(--color-canvas);box-shadow:none}.route-ticket-lines li[data-state=active] .route-ticket-dot{background:var(--color-accent);color:var(--color-on-accent);box-shadow:0 0 0 4px var(--color-accent-soft)}.route-ticket-lines li:is([data-state=done],[data-state=active]) .route-ticket-mark{opacity:1;filter:none}.route-ticket-lines li[data-state=active] .route-ticket-text{font-weight:500}.route-progress{grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:.25rem;display:grid}.route-ticket-progress{border-top:1px dashed var(--color-line-strong);padding-top:1rem}.route-progress span{border-radius:var(--radius-full);background:var(--color-line);height:.25rem;transition:background var(--duration-surface) var(--ease-enter)}.route-progress span[data-state=done]{background:var(--color-ink)}.route-progress span[data-state=active]{background:var(--color-accent)}.route-compact{display:none}.route-steps{position:relative}.route-step{grid-template-columns:2rem minmax(0,1fr);gap:1.25rem;padding-bottom:clamp(3rem,7vw,5.5rem);display:grid;position:relative}.route-step:last-child{padding-bottom:0}.route-step:not(:last-child):before{content:"";background:var(--color-line);width:1px;position:absolute;top:2.25rem;bottom:.25rem;left:calc(1rem - .5px)}.route-step-number{border-radius:var(--radius-full);width:2rem;height:2rem;box-shadow:inset 0 0 0 1px var(--color-line);background:var(--color-surface-raised);color:var(--color-ink-muted);font-size:var(--text-body-sm);font-variant-numeric:tabular-nums;transition:background var(--duration-surface) var(--ease-enter), color var(--duration-surface) var(--ease-enter);place-items:center;font-weight:500;display:grid}.route-step[data-state=done] .route-step-number{background:var(--color-ink);color:var(--color-canvas);box-shadow:none}.route-step[data-state=active] .route-step-number{background:var(--color-accent);color:var(--color-on-accent);box-shadow:0 0 0 4px var(--color-accent-soft)}.route-item{border-radius:var(--radius-sm);min-height:2.5rem;box-shadow:inset 0 0 0 1px var(--color-line);align-items:center;padding:.375rem .75rem;display:flex}@media (prefers-reduced-motion:reduce){.route-ticket-lines li,.route-ticket-dot,.route-ticket-mark,.route-progress span,.route-step-number{transition-duration:.01ms}}
@media (max-width:63.99rem){.route-layout{grid-template-columns:minmax(0,1fr)}.route-ticket-column{display:none}.route-compact{top:calc(var(--spacing-nav) + .5rem);z-index:1;border-radius:var(--radius-md);background:var(--color-surface-raised);box-shadow:var(--shadow-ring), var(--shadow-soft);grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);align-items:center;gap:.25rem 1rem;padding:.75rem 1rem;display:grid;position:sticky}.route-compact-label{min-width:0;color:var(--color-ink-muted);font-size:var(--text-caption);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.route-compact-status{min-width:0;font-size:var(--text-body-sm);text-overflow:ellipsis;white-space:nowrap;justify-content:flex-end;align-items:center;gap:.5rem;font-weight:500;display:flex;overflow:hidden}.route-compact-progress{grid-column:1/-1}}