.connect{padding:var(--s3) var(--s2) calc(var(--s5) + env(safe-area-inset-bottom));flex:1;overflow-y:auto}.connect>*{max-width:1000px;margin-left:auto;margin-right:auto}.connect h2{font:800 1.5rem/1.15 var(--font-text);overflow-wrap:anywhere;margin-top:0}.connect a{color:var(--black)}.routes-walk{align-items:center;gap:var(--s1);margin:var(--s2) auto;flex-wrap:wrap;display:flex}.routes-said{color:var(--black-60);font-size:.875rem;line-height:1.5}.routes-chart{-webkit-overflow-scrolling:touch;border-top:var(--rule-hair);border-bottom:var(--rule-hair);overflow-x:auto}.connect .slide{margin:var(--s1) 0 0}.routes-figure{isolation:isolate;background:var(--stock);height:auto;display:block}.routes-figure text.label.root{font-weight:800}@keyframes draw-whole{0%{stroke-dashoffset:1px}}.routes-figure .edge[pathLength]{stroke-dasharray:1;animation:draw-whole .7s var(--ease-out) backwards;animation-delay:calc(var(--order) * .5s)}.routes-figure .edge:not([pathLength]){animation:fade .5s var(--ease-out) backwards;animation-delay:calc(var(--order) * .5s + .2s)}.routes-figure :is(.node,.root){animation:pop .42s var(--ease-out) backwards;animation-delay:calc(var(--order) * .5s + .16s)}.routes-figure text.label{animation:rise .36s var(--ease-out) backwards;animation-delay:calc(var(--order) * .5s + .28s)}.routes-figure :is(.grid,.axis){animation:fade .6s var(--ease-out) backwards}.routes-list{font:.8125rem var(--font-data);padding-left:2.25rem}.routes-list li{border-bottom:1px solid var(--glass-line)}.routes-list summary{align-items:center;gap:var(--s1);min-height:var(--tap);cursor:pointer;padding:4px 0;list-style:none;display:flex}.routes-list summary::-webkit-details-marker{display:none}.routes-list summary:hover{background:var(--chip)}.routes-list summary>div{flex:1;min-width:0}.routes-list summary span{font:.875rem/1.3 var(--font-text);display:block}.routes-list summary small{color:var(--black-60);display:block}.routes-list summary:after{content:"+";width:var(--tap);text-align:center;color:var(--black-60);flex:none;font-size:1rem}.routes-list details[open] summary:after{content:"−"}.routes-list details[open] summary span{font-weight:700}.routes-chain{align-items:center;gap:0 var(--s1);margin:0 0 var(--s1);font:.875rem var(--font-text);flex-wrap:wrap;display:flex}.routes-chain a{min-height:var(--tap);align-items:center;display:inline-flex}.routes-chain small{color:var(--black-60)}.routes-pair{margin:0 0 var(--s1);font-size:.8125rem}.routes-key{margin-top:var(--s3);font-size:.8125rem;line-height:1.4}.routes-key div{align-items:center;gap:var(--s1);padding:4px 0;display:flex}.routes-swatch{isolation:isolate;flex:none;width:26px;height:14px}.routes-key div>span:first-child{padding-left:calc(26px + var(--s1))}.connect details{margin-top:var(--s2);font-size:.8125rem}.connect summary{cursor:pointer;color:var(--black-60);padding:12px 0}.connect details ul{margin:0;padding-left:1.25rem;line-height:1.5}.connect details li{overflow-wrap:anywhere;padding:2px 0}.connect footer{margin-top:var(--s3);font:.75rem/1.6 var(--font-data);color:var(--black-60)}.connect footer p{overflow-wrap:anywhere}@media (width>=900px){.connect{column-gap:var(--s2);padding:var(--s2);grid-template:"head stage panel""walk stage panel""said stage panel""list stage panel"minmax(0,1fr)"list hint panel"/300px minmax(0,1fr) 380px;display:grid;overflow:hidden}.connect>*{max-width:none;margin:0}.connect h2{grid-area:head;font-size:1.25rem}.routes-walk{grid-area:walk}.routes-said{grid-area:said;margin:0}.routes-chart{border:0;grid-area:stage;min-height:0;overflow:hidden}.routes-figure{width:100%;height:100%}.routes-figure .reach{cursor:pointer}.connect>.hint{margin:var(--s1) 0 0;grid-area:hint}.connect .slide{display:none}.routes-list{grid-area:list;min-height:0;padding-left:2.25rem;overflow-y:auto}.routes-panel{box-sizing:border-box;min-height:0;padding:var(--s2);border:1px solid var(--glass-line);background:var(--glass);border-radius:16px;grid-area:panel;overflow-y:auto}.routes-key{margin-top:0}.routes-panel footer{margin-top:var(--s2)}}@media (width>=900px) and (pointer:fine){.routes-walk{gap:4px}.routes-walk .chip{min-height:24px;padding:2px 10px;font-size:.6875rem}.routes-list summary{min-height:28px;padding:2px 0}.routes-chain a{min-height:24px}}:root[data-card] .connect{flex-direction:column;padding:0;display:flex;overflow:hidden}:root[data-card] .connect>*{max-width:none}:root[data-card] .connect :is(.routes-walk,.routes-list,.routes-panel,.hint){display:none}:root[data-card] .connect h2{margin-bottom:4px;font-size:34px}:root[data-card] .routes-said{margin:0 0 8px}:root[data-card] .routes-chart{border:0;justify-content:center;display:flex}:root[data-card] .routes-figure{width:auto;max-width:100%;height:auto;max-height:420px}