:root{--pg-line:var(--rule);--pg-mute:var(--muted);--pg-ink:var(--fg);--pg-bg:var(--bg);--pg-pass-bg:#f0f0f0;--pg-pass-fg:#5e5e5e;--pg-pass-bd:#cacaca;--pg-miss-bg:#ececec;--pg-miss-fg:#5a5a5a;--pg-miss-bd:#bcbcbc;--pg-hit-bg:#f2f2f2;--pg-hit-fg:#666;--pg-hit-bd:#c1c1c1;--pg-mod-bg:#f8f8f8;--pg-mod-fg:#5e5e5e;--pg-mod-bd:#e2e2e2}html.dark{--pg-pass-bg:oklch(22% 0 0);--pg-pass-fg:oklch(76% 0 0);--pg-pass-bd:oklch(36% 0 0);--pg-miss-bg:oklch(21% 0 0);--pg-miss-fg:oklch(72% 0 0);--pg-miss-bd:oklch(35% 0 0);--pg-hit-bg:oklch(21% 0 0);--pg-hit-fg:oklch(73% 0 0);--pg-hit-bd:oklch(35% 0 0);--pg-mod-bg:oklch(23% 0 0);--pg-mod-fg:oklch(82% 0 0);--pg-mod-bd:oklch(38% 0 0)}.pg-card{border:1px solid var(--pg-line);border-radius:6px;margin:16px 0 32px;overflow:hidden}.pg-toolbar{background:color-mix(in oklch, var(--pg-bg) 60%, transparent);border-bottom:1px solid var(--pg-line);flex-wrap:wrap;align-items:center;gap:8px;padding:10px 14px;display:flex}.pg-badge{font-family:var(--font-mono);font-size:var(--step--2);background:color-mix(in oklch, var(--pg-ink) 10%, transparent);color:var(--pg-mute);border-radius:20px;margin-left:auto;padding:4px 10px}.pg-badge.hit{background:var(--pg-pass-bg);color:var(--pg-pass-fg)}.pg-badge.miss{background:var(--pg-miss-bg);color:var(--pg-miss-fg)}#flow-svg{background:var(--pg-bg);width:100%;padding:10px 16px;display:block}.svg-label{font-family:var(--font-sans);font-size:var(--step--1);fill:var(--pg-mute)}.svg-small{font-family:var(--font-mono);font-size:var(--step--3);fill:var(--pg-mute)}.svg-latency{font-family:var(--font-mono);font-size:var(--step--1);fill:var(--pg-ink);font-weight:600}.pg-log{background:color-mix(in oklch, var(--pg-bg) 20%, oklch(10% 0 0));color:#d0d0d0;font-family:var(--font-mono);font-size:var(--step--2);min-height:64px;max-height:140px;padding:12px 16px;line-height:1.7;overflow-y:auto}.pg-log-empty{color:#666;font-style:italic}.pg-log .log-hit{color:#b0b0b0}.pg-log .log-miss{color:#929292}.pg-log .log-info{color:#b0b0b0}.pg-two-col{grid-template-columns:1fr 1fr;display:grid}.pg-controls{border-right:1px solid var(--pg-line);padding:16px}.pg-output{padding:16px}.pg-group{margin-bottom:16px}.pg-label{font-size:var(--step--2);letter-spacing:.08em;text-transform:uppercase;color:var(--pg-mute);margin-bottom:6px;font-weight:600;display:block}.pg-radio,.pg-check{font-size:var(--step--1);cursor:pointer;margin-bottom:4px;display:block}.pg-radio input,.pg-check input{margin-right:6px}.pg-output-label{font-size:var(--step--2);letter-spacing:.08em;text-transform:uppercase;color:var(--pg-mute);margin-bottom:8px;font-weight:600}.pg-header-string{font-family:var(--font-mono);font-size:var(--step--1);background:color-mix(in oklch, var(--pg-ink) 6%, transparent);border:1px solid var(--pg-line);word-break:break-all;color:var(--pg-ink);border-radius:4px;margin-bottom:12px;padding:10px 12px;line-height:1.6}.pg-interpret{font-size:var(--step--1);color:var(--pg-mute);line-height:1.6}.pg-interpret p{margin-bottom:8px}.pg-interpret .tag{font-size:var(--step--2);border-radius:3px;margin-bottom:4px;margin-right:4px;padding:2px 7px;font-weight:600;display:inline-block}.tag-cdn{background:var(--pg-hit-bg);color:var(--pg-hit-fg)}.tag-browser{background:var(--pg-pass-bg);color:var(--pg-pass-fg)}.tag-none{background:var(--pg-miss-bg);color:var(--pg-miss-fg)}.sim-pops{border-bottom:1px solid var(--pg-line);grid-template-columns:repeat(3,1fr);display:grid}.sim-pop{text-align:center;border-right:1px solid var(--pg-line);padding:16px}.sim-pop:last-child{border-right:none}.sim-pop-name{font-size:var(--step--1);margin-bottom:10px;font-weight:600}.sim-pop-status{font-family:var(--font-mono);font-size:var(--step--2);background:color-mix(in oklch, var(--pg-ink) 10%, transparent);color:var(--pg-mute);border-radius:20px;margin-bottom:6px;padding:4px 10px;font-weight:600;display:inline-block}.sim-pop-status.hit{background:var(--pg-pass-bg);color:var(--pg-pass-fg)}.sim-pop-status.miss{background:var(--pg-miss-bg);color:var(--pg-miss-fg)}.sim-pop-ttl{font-family:var(--font-mono);font-size:var(--step--2);color:var(--pg-mute);margin-bottom:6px}.sim-pop-stats{font-size:var(--step--2);color:var(--pg-mute)}.stack-wrap{background:var(--pg-bg);justify-content:space-between;align-items:center;gap:0;padding:24px 20px 16px;display:flex;position:relative;overflow:hidden}.stack-wire{background:var(--pg-line);z-index:0;height:2px;position:absolute;top:50%;transform:translateY(-50%)}.stack-packet{background:var(--pg-ink);z-index:10;opacity:0;pointer-events:none;border-radius:50%;width:12px;height:12px;transition:left .4s cubic-bezier(.4,0,.2,1),background .2s;position:absolute;top:50%;transform:translateY(-50%)}.stack-node{z-index:1;background:var(--pg-bg);border:1.5px solid var(--pg-line);text-align:center;border-radius:6px;flex-shrink:0;min-width:80px;padding:10px 12px;transition:border-color .2s,box-shadow .2s;position:relative}.stack-node.wide{min-width:150px}.stack-node.active{border-color:var(--pg-ink);box-shadow:0 0 0 3px color-mix(in oklch, var(--pg-ink) 10%, transparent)}.sn-icon{justify-content:center;align-items:center;height:28px;margin-bottom:4px;display:flex}.sn-name{font-size:var(--step--2);color:var(--pg-ink);margin-bottom:8px;font-weight:600}.sn-ms{font-family:var(--font-mono);font-size:var(--step--3);color:var(--pg-mute);min-height:14px;margin-top:4px}.sn-layer{font-size:var(--step--2);border:1px solid var(--pg-line);color:var(--pg-mute);text-align:left;border-radius:3px;margin-bottom:3px;padding:4px 6px;transition:background .25s,color .25s,border-color .25s}.sn-layer.pass{background:var(--pg-pass-bg);color:var(--pg-pass-fg);border-color:var(--pg-pass-bd)}.sn-layer.hit{background:var(--pg-hit-bg);color:var(--pg-hit-fg);border-color:var(--pg-hit-bd)}.sn-layer.block{background:var(--pg-miss-bg);color:var(--pg-miss-fg);border-color:var(--pg-miss-bd)}.sn-layer.miss{background:var(--pg-mod-bg);color:var(--pg-mod-fg);border-color:var(--pg-mod-bd)}.phase-wrap{background:var(--pg-bg);padding:20px 16px 16px}.phase-track{background:var(--pg-line);border-radius:2px;height:4px;margin-bottom:16px;position:relative;overflow:visible}.phase-ball{background:var(--pg-ink);border-radius:50%;width:14px;height:14px;transition:left .45s cubic-bezier(.4,0,.2,1),background .2s;position:absolute;top:-5px;left:0}.phase-boxes{align-items:center;gap:0;display:flex;overflow-x:auto}.phase-box{border:1.5px solid var(--pg-line);text-align:center;background:color-mix(in oklch, var(--pg-ink) 4%, transparent);border-radius:5px;flex-shrink:0;min-width:90px;padding:8px 10px;transition:background .25s,border-color .25s}.phase-box.pass{background:var(--pg-pass-bg);border-color:var(--pg-pass-bd)}.phase-box.mod{background:var(--pg-mod-bg);border-color:var(--pg-mod-bd)}.phase-box.block{background:var(--pg-miss-bg);border-color:var(--pg-miss-bd)}.phase-box.skip{opacity:.45}.ph-name{font-family:var(--font-mono);font-size:var(--step--3);color:var(--pg-ink);margin-bottom:3px;font-weight:500}.ph-desc{font-size:var(--step--3);color:var(--pg-mute)}.phase-box.pass .ph-name,.phase-box.pass .ph-desc{color:var(--pg-pass-fg)}.phase-box.mod .ph-name,.phase-box.mod .ph-desc{color:var(--pg-mod-fg)}.phase-box.block .ph-name,.phase-box.block .ph-desc{color:var(--pg-miss-fg)}.phase-arrow{color:var(--pg-line);font-size:var(--step--1);flex-shrink:0;padding:0 4px}.phase-status{font-size:var(--step--1);color:var(--pg-mute);min-height:20px;margin-top:12px;font-style:italic}.bucket-wrap{background:var(--pg-bg);align-items:flex-start;gap:24px;padding:20px;display:flex}.bucket-left{flex-direction:column;align-items:center;gap:8px;display:flex}.bucket-outer{border:2px solid var(--pg-line);background:color-mix(in oklch, var(--pg-ink) 8%, transparent);border-top:none;border-radius:0 0 8px 8px;width:100px;height:155px;position:relative;overflow:hidden}.bucket-refill{background:#5e5e5e1f;height:0;transition:height .3s;position:absolute;top:0;left:0;right:0}.bucket-inner{flex-wrap:wrap;align-content:flex-end;gap:3px;padding:4px 4px 0;display:flex;position:absolute;bottom:32px;left:0;right:0}.token-dot{background:var(--pg-ink);border-radius:50%;flex-shrink:0;width:12px;height:12px;transition:opacity .2s}.token-dot.used{border:1.5px solid color-mix(in oklch, var(--pg-ink) 30%, transparent);background:0 0}.bucket-level-label{text-align:center;font-family:var(--font-mono);font-size:var(--step--2);color:var(--pg-mute);border-top:1px solid var(--pg-line);line-height:28px;position:absolute;bottom:0;left:0;right:0}.bucket-drain-arrow{font-size:var(--step--2);color:var(--pg-mute);text-align:center}.bucket-right{flex:1}.bucket-stat-row{border-bottom:1px solid var(--pg-line);justify-content:space-between;align-items:center;padding:6px 0;display:flex}.bucket-stat-label{font-size:var(--step--1);color:var(--pg-mute)}.bucket-stat-val{font-family:var(--font-mono);font-size:var(--step-0);color:var(--pg-ink);font-weight:500}.bucket-log{font-family:var(--font-mono);font-size:var(--step--2);max-height:100px;color:var(--pg-mute);margin-top:10px;line-height:1.8;overflow-y:auto}.bucket-log .bl-ok{color:#5e5e5e}.bucket-log .bl-err{color:#5a5a5a}.csm-wrap{background:var(--pg-bg);padding:20px}.csm-states{align-items:center;gap:0;margin-bottom:20px;display:flex;overflow-x:auto}.csm-state{text-align:center;border:1.5px solid var(--pg-line);border-radius:6px;flex-shrink:0;min-width:100px;padding:10px 14px;transition:border-color .25s,box-shadow .25s}.csm-state.active{border-color:var(--pg-ink);box-shadow:0 0 0 3px color-mix(in oklch, var(--pg-ink) 10%, transparent)}.csm-state.active .csm-dot{background:var(--pg-ink);transform:scale(1.2)}.csm-dot{background:var(--pg-line);border-radius:50%;width:10px;height:10px;margin:0 auto 6px;transition:background .25s,transform .25s}.csm-name{font-size:var(--step--2);color:var(--pg-ink);margin-bottom:3px;font-weight:600}.csm-desc{font-size:var(--step--3);color:var(--pg-mute)}.csm-arrow{color:var(--pg-line);font-size:var(--step-0);flex-shrink:0;padding:0 6px}.csm-ttl-wrap{margin-bottom:12px}.csm-ttl-label{font-size:var(--step--2);color:var(--pg-mute);margin-bottom:4px}.csm-ttl-label span{font-family:var(--font-mono);color:var(--pg-ink)}.csm-ttl-bar{background:color-mix(in oklch, var(--pg-ink) 10%, transparent);border-radius:3px;height:6px;overflow:hidden}.csm-ttl-fill{background:var(--pg-ink);border-radius:3px;height:100%;transition:width .5s linear}.csm-explain{font-size:var(--step--1);color:var(--pg-mute);min-height:20px;font-style:italic}@media (width<=600px){.pg-two-col{grid-template-columns:1fr}.pg-controls{border-right:none;border-bottom:1px solid var(--pg-line)}.sim-pops{grid-template-columns:1fr}.sim-pop{border-right:none;border-bottom:1px solid var(--pg-line)}.stack-wrap{flex-direction:column;align-items:stretch;gap:8px}.stack-wire,.stack-packet{display:none}.stack-node.wide{min-width:unset}.bucket-wrap{flex-direction:column}.csm-states,.phase-boxes{flex-wrap:wrap;gap:6px}.csm-arrow,.phase-arrow{display:none}}.pg-section-heading{font-family:var(--font-serif);font-weight:600;font-size:var(--step-1);letter-spacing:-.01em;margin:2rem 0 .4rem}.pg-section-text{color:var(--muted);margin:0 0 1rem;line-height:1.7}