.site .spn{gap:32px;display:grid}.site .spn-panel{border:1px solid var(--line-2);grid-template-columns:minmax(0,1fr);grid-template-areas:"view""transport""controls""read""rm";min-width:0;display:grid}.site .spn-controls{grid-area:controls}.site .spn-view{grid-area:view}.site .spn-transport{grid-area:transport}.site .spn-read{grid-area:read}.site .spn-rm{grid-area:rm}@media (min-width:760px){.site .spn-panel{grid-template:"controls controls""view read""transport read"1fr"rm rm"/minmax(0,1.1fr) minmax(0,1fr)}}.site .spn-k{font:500 10px/1.4 var(--mono);color:var(--fg-3);margin:0}.site .spn-controls{border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1fr);gap:20px;padding:16px;display:grid}@media (min-width:760px){.site .spn-controls{border-top:0;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) minmax(0,1fr);gap:16px 24px}}@media (max-width:759px){.site .spn-controls{border-top:1px solid var(--line)}}.site .spn-field{align-content:start;gap:8px;min-width:0;display:grid}.site .spn-field-k{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .spn-seg{border:1px solid var(--line-2);grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;display:grid}.site .spn-seg button{border:0;border-left:1px solid var(--line-2);min-width:0;font:500 11.5px/1.2 var(--mono);color:var(--fg-2);cursor:pointer;background:0 0;border-radius:0;padding:8px 4px}.site .spn-seg button:first-child{border-left:0}.site .spn-seg button:hover{color:var(--fg)}.site .spn-seg button[aria-checked=true]{background:var(--fg);color:var(--bg)}.site .spn-seg button:focus-visible{outline:1px solid var(--fg);outline-offset:-3px}.site .spn-range{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;display:grid}.site .spn-val{min-width:52px;font:500 12px/1 var(--mono);font-variant-numeric:tabular-nums;color:var(--fg);text-align:right}.site .spn input[type=range]{width:100%;accent-color:var(--fg)}.site .spn input[type=range]:focus-visible{outline:1px solid var(--fg);outline-offset:4px}.site .spn-hint{color:var(--fg-3);margin:0;font-size:12.5px;line-height:1.5}.site .spn-chip,.site .spn-btn{border:1px solid var(--line-2);font:500 11.5px/1.2 var(--mono);color:var(--fg-2);cursor:pointer;background:0 0;border-radius:0;justify-self:start;padding:7px 10px}.site .spn-btn{color:var(--fg);padding:8px 14px}.site .spn-chip:hover,.site .spn-chip:focus-visible,.site .spn-btn:hover,.site .spn-btn:focus-visible{border-color:var(--fg);color:var(--fg);outline:0}.site .spn-view,.site .spn-transport,.site .spn-read{background:var(--panel);min-width:0}.site .spn-view{align-content:start;gap:8px;padding:16px 16px 12px;display:grid}@media (min-width:760px){.site .spn-view{padding-right:12px}.site .spn-read{padding-left:12px}}.site .spn-frame{border:1px solid var(--line-2);background:var(--bg);clip-path:inset(0);position:relative}.site .spn-box{overscroll-behavior:contain;height:340px;position:relative;overflow:hidden auto}.site .spn-box:focus-visible{outline:1px solid var(--fg);outline-offset:-2px}@media (max-width:759px){.site .spn-box{height:300px}}.site .spn-flow{font:500 10.5px/1.4 var(--mono);color:var(--fg-3);flex-direction:column;justify-content:flex-end;gap:4px;padding:0 16px 16px;display:flex}.site .spn-flow.is-after{justify-content:flex-start;padding:16px}.site .spn-stage{box-sizing:border-box;border-top:1px solid var(--fg-3);border-bottom:1px solid var(--fg-3);background:var(--panel);color:var(--fg);grid-template-rows:minmax(0,1fr) auto;gap:12px;padding:16px;display:grid}.site .spn-steps{align-items:center;min-height:0;margin:0;padding:0;list-style:none;display:grid}.site .spn-step{opacity:0;grid-area:1/1;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:16px;min-width:0;transition:opacity .3s;display:grid}.site .spn-step[aria-current]{opacity:1}.site .spn-step svg{width:72px;height:72px;display:block;overflow:visible}.site .spn-step path{fill:none;stroke:currentColor;stroke-width:2px;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:calc((1 - var(--draw,0)) * 1px)}.site .spn-step-n{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .spn-step-t{letter-spacing:-.01em;margin:4px 0;font-size:18px;font-weight:500;line-height:1.25}.site .spn-step-b{color:var(--fg-2);margin:0;font-size:13px;line-height:1.5}@media (max-width:479px){.site .spn-step{grid-template-columns:52px minmax(0,1fr);gap:12px}.site .spn-step svg{width:52px;height:52px}.site .spn-step-t{font-size:16px}.site .spn-step-b{font-size:12.5px}}.site .spn-stage-foot{gap:8px;display:grid}.site .spn-ticks{grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:4px;display:grid}.site .spn-ticks i{border:1px solid var(--line-2);height:3px}.site .spn-ticks i[data-on]{border-color:var(--fg);background:var(--fg)}.site .spn-pbar{background:var(--line);height:2px;display:block}.site .spn-pbar>span{background:var(--fg);height:100%;transform:scaleX(var(--progress,0));transform-origin:0;display:block}.site .spn-overlay{z-index:1;pointer-events:none;position:absolute;inset:0;overflow:hidden}.site .spn-header{border-bottom:1px solid var(--line-2);background:repeating-linear-gradient(135deg, var(--line) 0 1px, transparent 1px 6px) var(--bg);font:500 10px/1 var(--mono);color:var(--fg-3);white-space:nowrap;align-items:center;padding:0 12px;display:flex;position:absolute;top:0;left:0;right:0;overflow:hidden}.site .spn-line{border-top:1px dashed var(--fg);height:0;position:absolute;left:0;right:0}.site .spn-line i{background:var(--bg);font:500 10px/1 var(--mono);color:var(--fg);white-space:nowrap;padding:1px 4px;font-style:normal;position:absolute;top:3px;right:12px}.site .spn-transport{flex-wrap:wrap;align-content:start;align-items:center;gap:12px;padding:4px 16px 16px;display:flex}@media (min-width:760px){.site .spn-transport{padding-right:12px}}.site .spn-scrub{flex:200px;gap:4px;min-width:0;display:grid}.site .spn-scrub span{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .spn-read{align-content:start;gap:16px;padding:16px;display:grid}@media (max-width:759px){.site .spn-read{border-top:1px solid var(--line)}}.site .spn-big{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.site .spn-big>div{gap:6px;display:grid}.site .spn-num{letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--fg);font-size:clamp(36px,4.5vw,52px);font-weight:500;line-height:1}.site .spn-num small{letter-spacing:0;color:var(--fg-3);font-size:.45em}.site .spn-bar{border:1px solid var(--line-2);background:var(--bg);height:8px;display:block;overflow:hidden}.site .spn-bar>span{background:var(--fg);transform-origin:0;height:100%;display:block}.site .spn-state{color:var(--fg-2);margin:0;font-size:13px;line-height:1.5}.site .spn-state b{font:500 11.5px/1.5 var(--mono);color:var(--fg)}.site .spn-track{gap:4px;display:grid}.site .spn-rail{height:52px;margin:0 2px;position:relative}.site .spn-rail:before{content:"";border-top:1px solid var(--line-2);position:absolute;top:50%;left:0;right:0}.site .spn-win{background:var(--fg-3);height:6px;position:absolute;top:calc(50% - 3px)}.site .spn-cut{border-left:2px solid var(--panel);height:6px;position:absolute;top:calc(50% - 3px)}.site .spn-mark{border-left:1px solid var(--fg);height:16px;position:absolute;top:calc(50% - 8px)}.site .spn-mark i{font:500 10px/1 var(--mono);color:var(--fg-2);white-space:nowrap;font-style:normal;position:absolute;bottom:19px;left:0;transform:translate(-50%)}.site .spn-mark.is-below i{top:19px;bottom:auto}.site .spn-mark.is-l i{transform:none}.site .spn-mark.is-r i{transform:translate(-100%)}.site .spn-now{border-left:2px solid var(--accent);height:24px;margin-left:-1px;position:absolute;top:calc(50% - 12px)}.site .spn-log{gap:6px;display:grid}.site .spn-log ol{border-top:1px solid var(--line-2);margin:0;padding:0;list-style:none;display:grid}.site .spn-log li{border-bottom:1px solid var(--line);color:var(--fg-2);flex-wrap:wrap;justify-content:space-between;gap:4px 12px;padding:6px 0;font-size:12.5px;line-height:1.5;display:flex}.site .spn-log li:first-child code{color:var(--fg)}.site .spn-log code{font:500 12px/1.5 var(--mono);color:var(--fg-2)}.site .spn-log li.is-none{color:var(--fg-3)}.site .spn-log-empty{color:var(--fg-3);margin:0;font-size:12.5px;line-height:1.5}.site .spn-math{border-top:1px solid var(--line-2);margin:0}.site .spn-math>div{border-bottom:1px solid var(--line);grid-template-columns:72px minmax(0,1fr);gap:12px;padding:8px 0;display:grid}.site .spn-math dt{font:500 10px/1.9 var(--mono);color:var(--fg-3)}.site .spn-math dd{font:400 12.5px/1.6 var(--mono);font-variant-numeric:tabular-nums;color:var(--fg);overflow-wrap:anywhere;margin:0}.site .spn-rm{border-top:1px solid var(--line);color:var(--fg-2);margin:0;padding:10px 16px;font-size:13px;line-height:1.5}@media (prefers-reduced-motion:reduce){.site .spn-step{transition:none}.site .spn-step path{stroke-dashoffset:0}}.site .spn-code{min-width:0;display:grid}.site .spn-tabs{flex-wrap:wrap;display:flex}.site .spn-tab{border:1px solid var(--line-2);font:500 11.5px/1 var(--mono);color:var(--fg-2);cursor:pointer;background:0 0;border-bottom:0;border-left-width:0;border-radius:0;padding:8px 14px}.site .spn-tab:first-child{border-left-width:1px}.site .spn-tab[aria-selected=true]{color:var(--fg);background:var(--panel)}.site .spn-tab:focus-visible{outline:1px solid var(--fg);outline-offset:-3px}@media (max-width:479px){.site .spn-tab{padding:8px 10px}}.site .spn-code .code-box{margin-top:0}.site .spn-code>.spn-hint{margin-top:8px}.site .spn-a{color:var(--fg);text-decoration:underline;-webkit-text-decoration-color:var(--line-2);text-decoration-color:var(--line-2);text-underline-offset:3px}.site .spn-a:hover{-webkit-text-decoration-color:var(--fg);text-decoration-color:var(--fg)}.site .spn-scroll{overflow-x:auto}.site .spn-table{border-collapse:collapse;width:100%;font-size:13.5px}.site .spn-table th,.site .spn-table td{border-top:1px solid var(--line);text-align:left;vertical-align:top;padding:10px 12px 10px 0}.site .spn-table th{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .spn-table td{color:var(--fg-2);line-height:1.6}.site .spn-table td.is-code{font:400 12.5px/1.6 var(--mono);color:var(--fg);white-space:nowrap}.site .spn-table th.is-key{min-width:120px;font:400 12.5px/1.6 var(--mono);color:var(--fg)}.site .spnf svg{width:100%;height:auto}.site .spnf-wrap,.site .spnf-win{color:var(--fg-2)}.site .spnf-head{fill:var(--line);stroke:none}.site .spnf-ghost,.site .spnf-dim,.site .spnf-start,.site .spnf-axis{color:var(--fg-3)}.site .spnf-pin{color:var(--fg)}.site .spnf-now{color:var(--fg);stroke-width:3px}.site .spnf-panel{fill:var(--panel);stroke:var(--fg);stroke-width:1.5px}.site .spnf-shape{fill:none;stroke:var(--fg);stroke-width:1.25px;stroke-linejoin:round}.site .spnf-dot{fill:var(--fg)}.site .spnf-code{font:500 12.5px var(--mono);fill:var(--fg)}.site .spnf-l,.site .spnf-in{font:500 11.5px var(--mono);fill:var(--fg)}.site .spnf-k,.site .spnf-s,.site .spnf-in-s{font:500 10.5px var(--mono);fill:var(--fg-3)}.site .spnf-n,.site .spnf-f{font:500 10.5px var(--mono);fill:var(--fg-2)}@media (max-width:560px){.site .spnf-code{font-size:14px}.site .spnf-l,.site .spnf-in{font-size:12.5px}.site .spnf-k,.site .spnf-s,.site .spnf-n,.site .spnf-f{font-size:11.5px}.site .spnf-in-s{font-size:10.5px}}