.site .typ{gap:32px;min-width:0;display:grid}.site .typ-panel{border:1px solid var(--line-2);grid-template-columns:minmax(0,1fr);grid-template-areas:"mode""view""controls""msgs";min-width:0;display:grid}.site .typ-mode{grid-area:mode}.site .typ-view{grid-area:view}.site .typ-controls{grid-area:controls}.site .typ-msgs{grid-area:msgs}@media (min-width:900px){.site .typ-panel{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-areas:"mode mode""view controls""msgs msgs"}.site .typ-controls{border-left:1px solid var(--line)}}.site .typ-k{font:500 10px/1.4 var(--mono);color:var(--fg-3);margin:0}.site .typ-mode{border-bottom:1px solid var(--line);gap:8px;padding:16px;display:grid}.site .typ-mode .typ-seg{max-width:600px}.site .typ-mode-d{max-width:72ch;color:var(--fg-2);margin:0;font-size:14px;line-height:1.6}@media (max-width:479px){.site .typ-mode .typ-seg{grid-auto-flow:row}.site .typ-mode .typ-seg button{border-left:0;border-top:1px solid var(--line-2)}.site .typ-mode .typ-seg button:first-child{border-top:0}}.site .typ-controls{align-content:start;min-width:0;display:grid}.site .typ-group{border:0;border-bottom:1px solid var(--line);gap:12px;min-width:0;margin:0;padding:16px;display:grid}.site .typ-group:last-child{border-bottom:0}.site .typ-group legend{float:left;width:100%;font:500 11px/1.4 var(--mono);color:var(--fg);padding:0}.site .typ-group legend+*{clear:both}.site .typ-field{align-content:start;gap:6px;min-width:0;display:grid}.site .typ-field>span:first-child{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .typ-field em{font-style:normal}.site .typ-field.is-off>span:first-child{text-decoration:line-through;-webkit-text-decoration-color:var(--line-2);text-decoration-color:var(--line-2)}.site .typ-field textarea{appearance:none;border:1px solid var(--line-2);width:100%;min-width:0;min-height:92px;font:400 13px/1.5 var(--mono);color:var(--fg);resize:vertical;background:0 0;border-radius:0;padding:8px 12px}.site .typ-field textarea:focus-visible{border-color:var(--fg);outline:0}.site .typ input[type=range]{width:100%;accent-color:var(--fg);margin:8px 0 4px}.site .typ input[type=range]:focus-visible{outline:1px solid var(--fg);outline-offset:4px}.site .typ input[type=range]:disabled{opacity:.4;cursor:not-allowed}.site .typ-help{color:var(--fg-2);margin:0;font-size:13px;line-height:1.55}.site .typ-seg{border:1px solid var(--line-2);grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;display:grid}.site .typ-seg button{border:0;border-left:1px solid var(--line-2);min-width:0;font:500 11px/1.2 var(--mono);color:var(--fg-2);cursor:pointer;overflow-wrap:anywhere;background:0 0;border-radius:0;padding:8px 4px}.site .typ-seg button:first-child{border-left:0}.site .typ-seg button[aria-checked=true]{background:var(--fg);color:var(--bg)}.site .typ-seg button:focus-visible{outline:1px solid var(--fg);outline-offset:-3px}.site .typ-seg button:disabled{cursor:not-allowed}.site .typ-seg[aria-disabled=true]{opacity:.45}.site .typ-view{background:var(--panel);align-content:start;gap:10px;min-width:0;padding:16px;display:grid}.site .typ-stage{min-width:0;color:var(--fg);position:relative}.site .typ-stage p{margin:0}.site .typ-stage.is-css,.site .typ-stage.is-typer{border:1px solid var(--line-2);background:var(--bg);place-items:center;min-height:clamp(160px,20vw,220px);padding:24px 16px;display:grid;overflow:hidden}.site .typ-stage.is-css{container-type:inline-size}.site .typ-stage.is-typer{place-items:center start}.site .typ-stage .typer,.site .typ-stage .typed{font-family:var(--sans);letter-spacing:-.01em;overflow-wrap:anywhere;font-size:clamp(22px,2.6vw,30px);font-weight:500;line-height:1.3}.site .typ-frame{border:1px solid var(--line-2);background:var(--bg);position:relative}.site .typ-box{overscroll-behavior:contain;height:280px;overflow:hidden auto}@media (max-width:599px){.site .typ-box{height:240px}}.site .typ-box:focus-visible{outline:1px solid var(--fg);outline-offset:3px}.site .typ-room{height:100%}.site .typ-host{padding:0 72px 0 16px}.site .typ-overlay{pointer-events:none;position:absolute;inset:0;overflow:hidden}.site .typ-line{border-top:1px dashed var(--fg-3);height:0;position:absolute;left:0;right:0}.site .typ-line.is-end{border-top-style:dotted}.site .typ-line i{font:500 9.5px/1.2 var(--mono);color:var(--fg-3);font-style:normal;position:absolute;bottom:3px;right:6px}.site .typ-transport{flex-wrap:wrap;align-items:center;gap:10px 16px;display:flex}.site .typ-btns{gap:8px;display:flex}.site .typ-btn{border:1px solid var(--line-2);font:500 12px/1 var(--mono);color:var(--fg);cursor:pointer;white-space:nowrap;background:0 0;border-radius:0;padding:8px 14px}.site .typ-btn:hover,.site .typ-btn:focus-visible{border-color:var(--fg);outline:0}.site .typ-scrub{flex:220px;gap:4px;min-width:0;display:grid}.site .typ-scrub span{font:500 10px/1.4 var(--mono);color:var(--fg-3);font-variant-numeric:tabular-nums}.site .typ-facts{border-top:1px solid var(--line);margin:0;display:grid}.site .typ-facts>div{border-bottom:1px solid var(--line);grid-template-columns:84px minmax(0,1fr);gap:12px;padding:7px 0;display:grid}.site .typ-facts dt{font:500 10px/1.8 var(--mono);color:var(--fg-3)}.site .typ-facts dd{min-width:0;color:var(--fg-2);overflow-wrap:anywhere;margin:0;font-size:13px;line-height:1.5}.site .typ-msgs{display:grid}.site .typ-warn,.site .typ-note{border-top:1px solid var(--line);color:var(--fg-2);margin:0;padding:10px 16px;font-size:13px;line-height:1.55}.site .typ-warn{border-left:2px solid var(--accent)}.site .typ-code{min-width:0;display:grid}.site .typ-tabs{flex-wrap:wrap;display:flex}.site .typ-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 .typ-tab:first-child{border-left-width:1px}.site .typ-tab[aria-selected=true]{color:var(--fg);background:var(--panel)}.site .typ-tab:focus-visible{outline:1px solid var(--fg);outline-offset:-3px}.site .typ-code .code-box{margin-top:0}.site .typ-hint{color:var(--fg-2);margin:12px 0 0;font-size:13px;line-height:1.55}.site .typ-table{border-collapse:collapse;width:100%;margin:8px 0 0;font-size:13.5px}.site .typ-table th,.site .typ-table td{border-top:1px solid var(--line);text-align:left;vertical-align:top;padding:10px 14px 10px 0}.site .typ-table thead th{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .typ-table tbody th{width:112px;font:500 10.5px/1.6 var(--mono);color:var(--fg)}.site .typ-table td{color:var(--fg-2);line-height:1.6}@media (max-width:699px){.site .typ-table thead{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.site .typ-table,.site .typ-table tbody,.site .typ-table tr{display:block}.site .typ-table tr{border-top:1px solid var(--line);padding:10px 0}.site .typ-table th,.site .typ-table td{border-top:0;width:auto;padding:2px 0;display:block}.site .typ-table tbody th{padding-bottom:4px}.site .typ-table td:before{content:attr(data-k) " · ";font:500 10px/1.4 var(--mono);color:var(--fg-3)}}.site .typ-b{color:var(--fg);font-weight:500}.site .typf svg{width:100%;height:auto;display:block;overflow:visible}.site .typf-axis{color:var(--fg-3)}.site .typf-grid{color:var(--line-2)}.site .typf-ramp{color:var(--fg-3)}.site .typf-step{color:var(--fg)}.site .typf-now{color:var(--fg-2)}.site .typf-cell{color:var(--line-2)}.site .typf-edge{color:var(--fg)}.site .typf-dot{fill:var(--fg)}.site .typf-dot.is-ramp{fill:var(--bg);stroke:var(--fg-3)}.site .typf-k{font:500 10.5px var(--mono);fill:var(--fg-3)}.site .typf-n{font:500 11px var(--mono);fill:var(--fg-2)}.site .typf-code{font:500 11.5px var(--mono);fill:var(--fg)}.site .typf-ch{font:500 17px var(--mono);fill:var(--fg)}.site .typf-caret{fill:var(--fg)}