.site .pbg{gap:32px;display:grid}.site .pbg-panel{border:1px solid var(--line-2)}.site .pbg-controls{border-bottom:1px solid var(--line);grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px 20px;padding:16px;display:grid}.site .pbg-field{align-content:start;gap:6px;min-width:0;display:grid}@media (max-width:559px){.site .pbg-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}.site .pbg-field.is-wide{grid-column:1/-1}}.site .pbg-field>span{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .pbg input[type=range]{width:100%;accent-color:var(--fg)}.site .pbg input[type=range]:focus-visible{outline:1px solid var(--fg);outline-offset:4px}.site .pbg-seg{border:1px solid var(--line-2);grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;display:grid}.site .pbg-seg button{border:0;border-left:1px solid var(--line-2);font:500 11.5px/1.2 var(--mono);color:var(--fg-2);cursor:pointer;background:0 0;padding:7px 4px}.site .pbg-seg button:first-child{border-left:0}.site .pbg-seg button[aria-checked=true]{background:var(--fg);color:var(--bg)}.site .pbg-seg button:focus-visible{outline:1px solid var(--fg);outline-offset:-3px}.site .pbg-color{border:1px solid var(--line-2);grid-template-columns:minmax(0,1fr) 36px;display:grid}.site .pbg-color input[type=text]{min-width:0;font:400 12.5px/1.3 var(--mono);color:var(--fg);background:0 0;border:0;border-radius:0;padding:7px 10px}.site .pbg-color input[type=text]::placeholder{color:var(--fg-3)}.site .pbg-color input[type=color]{border:0;border-left:1px solid var(--line-2);cursor:pointer;background:0 0;border-radius:0;width:100%;height:100%;min-height:30px;padding:4px}.site .pbg-color:focus-within{border-color:var(--fg)}.site .pbg-color input:focus-visible{outline:0}.site .pbg-color input[aria-invalid=true]{-webkit-text-decoration:underline wavy var(--fg-3);text-decoration:underline wavy var(--fg-3)}.site .pbg-stage{background:var(--panel);padding:16px}.site .pbg-stage-k{font:500 10px/1.4 var(--mono);color:var(--fg-3);flex-wrap:wrap;justify-content:space-between;gap:4px 16px;margin:0 0 8px;display:flex}.site .pbg-frame{border:1px solid var(--line-2);background:var(--bg);color:var(--fg);position:relative;overflow:hidden;transform:translateZ(0)}.site .pbg-scroll{overscroll-behavior:contain;scroll-behavior:auto;scroll-timeline-name:--pbg-root;scroll-timeline-axis:block;height:clamp(280px,36vw,360px);overflow-y:auto}.site .pbg-scroll:focus-visible{outline:1px solid var(--fg);outline-offset:-1px}.site .pbg-page{max-width:560px;margin:0 auto;padding:0 clamp(16px,4vw,28px)}.site .pbg-site{border-bottom:1px solid var(--line);font:500 10.5px/1.4 var(--mono);color:var(--fg-3);justify-content:space-between;gap:12px;padding:18px 0 14px;display:flex}.site .pbg-article{padding:24px 0 28px}.site .pbg-article.is-tracked{outline:1px dashed var(--fg-3);outline-offset:-1px;margin:12px calc(-1*clamp(8px,2vw,12px)) 0;padding-left:clamp(8px,2vw,12px);padding-right:clamp(8px,2vw,12px)}.site .pbg-art-k{font:500 10px/1.4 var(--mono);color:var(--fg-3);margin:0 0 8px}.site .pbg-art-h{letter-spacing:-.02em;color:var(--fg);margin:0 0 16px;font-size:clamp(20px,2.4vw,26px);font-weight:500;line-height:1.15}.site .pbg-art-p{color:var(--fg-2);margin:0 0 12px;font-size:13.5px;line-height:1.65}.site .pbg-art-fig{width:100%;height:auto;color:var(--fg-3);border:1px solid var(--line);margin:4px 0 16px;display:block}.site .pbg-after{border-top:1px solid var(--line);gap:10px;padding:20px 0 40px;display:grid}.site .pbg-after-k{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .pbg-line{background:var(--line);width:100%;height:8px;display:block}.site .pbg-line.is-short{width:62%}.site .pbg-transport{border-top:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:12px 20px;padding:12px 16px;display:flex}.site .pbg-btn{border:1px solid var(--line-2);font:500 12px/1 var(--mono);color:var(--fg);cursor:pointer;background:0 0;border-radius:0;padding:8px 14px}.site .pbg-btn:hover,.site .pbg-btn:focus-visible{border-color:var(--fg);outline:0}.site .pbg-scrub{flex:200px;gap:4px;min-width:0;display:grid}.site .pbg-scrub span{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .pbg-read{font:500 10px/1.4 var(--mono);color:var(--fg-3);flex-wrap:wrap;gap:4px 16px;margin:0;display:flex}.site .pbg-read b{color:var(--fg);font-variant-numeric:tabular-nums;font-weight:500}.site .pbg-warn{border-top:1px solid var(--line);border-left:2px solid var(--accent);color:var(--fg-2);margin:0;padding:10px 16px;font-size:13px;line-height:1.5}.site .pbg-warn code{font:400 12px/1.5 var(--mono);color:var(--fg)}.site .pbg-code{min-width:0;display:grid}.site .pbg-tabs{flex-wrap:wrap;display:flex}.site .pbg-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;padding:8px 14px}.site .pbg-tab:first-child{border-left-width:1px}.site .pbg-tab[aria-selected=true]{color:var(--fg);background:var(--panel)}.site .pbg-tab:focus-visible{outline:1px solid var(--fg);outline-offset:-3px}.site .pbg-code-note{border:1px solid var(--line-2);background:var(--panel);color:var(--fg-2);margin:0;padding:10px 14px;font-size:13px;line-height:1.55}.site .pbg-code .code-box{border-top:0;margin-top:0}.site .pbg-code .code-box+.code-box{border-top:1px solid var(--line-2);margin-top:12px}.site .pbg-gap,.site .pbg-cmp-wrap{margin-top:24px}.site .pbg-cmp{border-collapse:collapse;width:100%;font-size:13.5px}.site .pbg-cmp th,.site .pbg-cmp td{border-top:1px solid var(--line);text-align:left;vertical-align:top;padding:10px 12px 10px 0}.site .pbg-cmp thead th{font:500 10px/1.4 var(--mono);color:var(--fg-3)}.site .pbg-cmp td{color:var(--fg-2);line-height:1.55}.site .pbg-cmp tbody th{font:500 12px/1.6 var(--mono);color:var(--fg);white-space:nowrap}@media (max-width:559px){.site .pbg-cmp tr{border-top:1px solid var(--line);grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;padding:10px 0;display:grid}.site .pbg-cmp th,.site .pbg-cmp td{border-top:0;padding:0}.site .pbg-cmp tbody th,.site .pbg-cmp thead th:first-child{grid-column:1/-1;margin-bottom:6px}.site .pbg-cmp thead th:first-child{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}}.site .pbg-opts .stk-q{grid-template-columns:136px minmax(0,1fr)}.site .pbg-opts .stk-q-n{color:var(--fg);overflow-wrap:anywhere}@media (max-width:559px){.site .pbg-opts .stk-q{grid-template-columns:minmax(0,1fr);gap:6px;padding-top:20px}}.site .pbf svg{width:100%;height:auto}.site .pbf-title{font:500 11px var(--mono);fill:var(--fg-2)}.site .pbf-doc{color:var(--fg-3)}.site .pbf-text{color:var(--line-2)}.site .pbf-vp{color:var(--fg);stroke-width:1.5px}.site .pbf-track{color:var(--line-2);stroke-width:4px}.site .pbf-bar{color:var(--fg);stroke-width:4px}.site .pbf-dim{color:var(--fg-3)}.site .pbf-k{font:500 10.5px var(--mono);fill:var(--fg-2)}.site .pbf-v{font:500 11px var(--mono);fill:var(--fg)}@media (max-width:559px){.site .pbf-title,.site .pbf-k{font-size:13.5px}.site .pbf-v{font-size:14px}}