.status{padding:.6rem 0 1rem;color:var(--g-muted)}.status[hidden]{display:none}
.site-search{max-width:34rem;position:relative;z-index:5}
.site-search-label{display:block;font-weight:800;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;margin:0 0 .5rem}
.site-search-field{position:relative}
.site-search-input{width:100%;font:inherit;font-size:1.02rem;padding:.85rem 1.2rem;border-radius:99px;border:var(--g-bw) solid var(--g-line);background:var(--g-input);color:var(--g-text);box-shadow:var(--g-small-shadow)}
.site-search-input::placeholder{color:var(--g-muted)}
.site-search-list{position:absolute;left:0;right:0;top:calc(100% + .5rem);margin:0;padding:.4rem;list-style:none;background:var(--g-pop);border:var(--g-bw) solid var(--g-line);border-radius:18px;box-shadow:var(--g-shadow);max-height:20rem;overflow-y:auto;z-index:20}
.site-search-list[hidden]{display:none}
.site-search-option{all:unset;box-sizing:border-box;display:grid;gap:.1rem;width:100%;padding:.55rem .8rem;border-radius:12px;cursor:pointer}
.site-search-option:hover,.site-search-option.is-active,.site-search-option[aria-selected="true"]{background:var(--g-accent-bg);color:var(--g-accent-ink)}
.site-search-option:focus-visible{outline:3px solid var(--g-focus)}
.site-search-option-name{font-weight:800}
.site-search-option-meta{font-size:.8rem;opacity:.8}
.site-search-empty{margin:0;padding:.7rem .8rem;color:var(--g-muted)}
.site-search-hint{margin:.6rem 0 0;font-size:.88rem;color:var(--g-muted);min-height:1.2em}
.showcase{padding:1rem 0 clamp(2rem,5vw,3.5rem)}.showcase[hidden]{display:none}
.showcase-meta{display:grid;gap:.55rem 1.2rem;margin:.4rem 0 1.6rem}
.showcase-badges{display:flex;flex-wrap:wrap;gap:.4rem .5rem}
.badge{display:inline-flex;align-items:center;width:max-content;border:2px solid var(--g-line);border-radius:99px;padding:.2rem .75rem;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;background:var(--g-badge-bg);color:var(--g-badge-ink)}
.badge--options{background:var(--g-chip);color:var(--g-text)}.badge[hidden]{display:none}
.showcase-title h2{font-size:clamp(1.9rem,4vw,3rem);overflow-wrap:anywhere;margin-top:.4rem}
.showcase-meta-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.7rem 1.2rem}
.meta-row{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin:0;color:var(--g-muted);font-weight:700;font-size:.95rem}
.meta-row span:empty{display:none}.meta-row span+span::before{content:"\00b7";margin-right:.9rem}
.showcase-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:.65rem .85rem;flex:1 1 auto;min-width:min(100%,16rem)}
.showcase-actions .btn{min-height:2.7rem;padding:.4rem 1.1rem}
.pager{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.pager[hidden]{display:none}
.pager-btn,.preview-mode button,.compare-tabs button,.option-rail button,.browse summary{font:inherit}
.pager-btn{min-height:2.7rem;padding:.4rem 1.1rem;border-radius:99px;border:var(--g-bw) solid var(--g-line);background:var(--g-surface);color:var(--g-text);font-weight:800;cursor:pointer;box-shadow:var(--g-small-shadow);transition:transform .15s,box-shadow .15s}
.pager-btn:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:var(--g-small-shadow-h)}
.pager-btn:disabled{opacity:.4;cursor:default}
.pager-count{min-width:4rem;text-align:center;font-weight:800;color:var(--g-muted);font-variant-numeric:tabular-nums}
.lh-site-meta{margin:.2rem 0 0;font-size:.86rem;font-weight:700;color:var(--g-muted)}.lh-site-meta:empty{display:none}
.compare-tabs{display:none}
.preview-mode-bar{display:flex;justify-content:flex-end;margin:0 0 .9rem}
.preview-mode{display:grid;grid-template-columns:1fr 1fr;width:min(20rem,100%);gap:.2rem;padding:.22rem;border:var(--g-bw) solid var(--g-line);border-radius:99px;background:var(--g-surface)}
.preview-mode button,.compare-tabs button{border:0;background:transparent;color:var(--g-text);min-height:2.3rem;padding:.25rem .8rem;border-radius:99px;font-weight:800;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.preview-mode button[aria-checked="true"],.compare-tabs button[aria-selected="true"]{background:var(--g-accent-bg);color:var(--g-accent-ink)}
.compare{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1rem,2.4vw,1.8rem);align-items:start}
.frame{margin:0;background:var(--g-surface);border:var(--g-bw) solid var(--g-line);border-radius:var(--g-radius);overflow:hidden;box-shadow:var(--g-shadow);min-width:0}
.frame-label{display:flex;padding:.8rem 1rem 0}
.frame-label span{font-family:var(--display);font-weight:800;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;padding:.2rem .8rem;border-radius:99px;border:2px solid var(--g-line)}
.frame[data-frame="before"] .frame-label span{background:var(--g-before-chip);color:var(--g-before-ink)}
.frame[data-frame="after"] .frame-label span{background:var(--g-after-chip);color:var(--g-after-ink)}
.browser-bar{display:flex;align-items:center;gap:.5rem;padding:.7rem .9rem}
.browser-dots{display:flex;gap:.28rem;flex:none}.browser-dots i{width:.6rem;height:.6rem;border-radius:50%;border:2px solid var(--g-line);background:var(--g-d1)}
.browser-dots i:nth-child(2){background:var(--g-d2)}.browser-dots i:nth-child(3){background:var(--g-d3)}
.browser-url{flex:1;min-width:0;font-size:.8rem;font-weight:700;color:var(--g-muted);background:var(--g-url);border:2px solid var(--g-line);border-radius:99px;padding:.2rem .8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.browser-url-link{display:block;color:inherit;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.browser-url-link:hover,.browser-url-link:focus-visible{text-decoration:underline;color:var(--g-text)}
.browser-url-link[hidden],.browser-url [data-before-url-text][hidden]{display:none!important}
.viewport{aspect-ratio:4/3;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;background:#101418;border-top:var(--g-bw) solid var(--g-line);scrollbar-width:thin;scrollbar-color:var(--g-scroll) transparent;position:relative}
[data-after-viewport][data-preview-mode="mobile"]{aspect-ratio:9/14}
.viewport img{width:100%;height:auto;display:block}
.viewport--live{--preview-width:1440px;--preview-zoom:calc(100cqi / var(--preview-width));--preview-height:calc(var(--preview-width) * 3 / 4);overflow:hidden;container-type:inline-size}
.viewport--live iframe{position:absolute;top:0;left:0;width:var(--preview-width);height:var(--preview-height);border:0;display:block;background:#fff;transform:scale(var(--preview-zoom));transform-origin:0 0}
.viewport--live iframe[hidden]{display:none}
.viewport--live[data-preview-mode="mobile"]{--preview-width:680px;--preview-height:calc(var(--preview-width) * 14 / 9)}
.viewport--before img[data-capture="before"]{position:static;width:100%;height:auto}
.viewport--before img[data-capture="before"][hidden]{display:none!important}
.viewport--before .before-empty{position:absolute;inset:0;display:grid;place-items:center;padding:1rem;background:linear-gradient(180deg,#12242c,#0b171e)}
.viewport--before .before-empty[hidden]{display:none!important}
.before-empty-svg{width:min(100%,20rem);height:auto}
.after-stage.has-options{display:grid;grid-template-columns:7rem minmax(0,1fr);align-items:stretch}
.option-rail{display:flex;flex-direction:column;gap:.35rem;padding:.5rem;border-top:var(--g-bw) solid var(--g-line);border-right:var(--g-bw) solid var(--g-line);background:var(--g-surface);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.option-rail[hidden]{display:none}
.option-rail button{border:2px solid transparent;background:transparent;color:var(--g-text);min-height:2.75rem;padding:.4rem .55rem;border-radius:.8rem;font-size:.8rem;font-weight:700;line-height:1.25;text-align:left;overflow-wrap:anywhere;cursor:pointer}
.option-rail button:hover{border-color:var(--g-line)}
.option-rail button[aria-checked="true"]{background:var(--g-accent-bg);color:var(--g-accent-ink);border-color:var(--g-line)}
.frame-hint{margin:0;padding:.55rem 1rem .8rem;color:var(--g-muted);font-size:.84rem;font-weight:600}
.lh-panel{padding:0 .9rem 1rem;border-top:var(--g-bw) solid var(--g-line);min-width:0}
.lh-empty,.lh-error{margin:.9rem 0 .2rem;padding:.85rem 1rem;border-radius:14px;background:var(--g-note);font-size:.9rem;line-height:1.45}
.lh-empty-title,.lh-error-title{margin:0 0 .25rem;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.lh-empty p,.lh-error p{margin:0}.lh-error-title{color:var(--g-weak)}
.lh-row{display:grid;gap:.7rem;margin-top:.95rem;min-width:0}.lh-row--meters{grid-template-columns:minmax(0,1fr)}
.lh-item{min-width:0;--lh-color:var(--g-muted)}
.lh-item[data-band="strong"]{--lh-color:var(--g-strong)}.lh-item[data-band="mid"]{--lh-color:var(--g-mid)}.lh-item[data-band="weak"]{--lh-color:var(--g-weak)}
.lh-label{display:block;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--g-muted)}
.lh-score{font-family:var(--display);font-weight:800;font-variant-numeric:tabular-nums;color:var(--g-score)}
.lh-meter{display:grid;grid-template-columns:minmax(0,7.2rem) minmax(0,1fr) 2.6rem;align-items:center;gap:.6rem}
.lh-meter-track{height:.8rem;border-radius:99px;background:var(--g-track);border:2px solid var(--g-line);overflow:hidden}
.lh-meter-fill{display:block;height:100%;width:0;border-radius:inherit;background:var(--lh-color)}
.lh-panel.is-animated .lh-meter-fill{width:var(--lh-fill,0%);transition:width 680ms cubic-bezier(.22,1,.36,1)}
.lh-panel.is-animated .lh-meter:nth-child(2) .lh-meter-fill{transition-delay:40ms}.lh-panel.is-animated .lh-meter:nth-child(3) .lh-meter-fill{transition-delay:80ms}.lh-panel.is-animated .lh-meter:nth-child(4) .lh-meter-fill{transition-delay:120ms}
.lh-meter .lh-score{text-align:right;font-size:1.15rem}
.lh-delta{margin-top:1.2rem;padding:1rem 1.1rem 1.1rem;border:var(--g-bw) solid var(--g-line);border-radius:var(--g-radius);background:var(--g-surface);box-shadow:var(--g-small-shadow);min-width:0}.lh-delta[hidden]{display:none}
.lh-delta-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.35rem 1rem;margin-bottom:.8rem}
.lh-delta-title{margin:0;font-family:var(--display);font-weight:800;font-size:1.1rem}
.lh-delta-note{margin:0;font-size:.84rem;color:var(--g-muted)}
.lh-delta-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem}
.lh-delta-item{min-width:0;padding:.7rem .5rem;border-radius:14px;background:var(--g-note);text-align:center;border:2px solid var(--g-line)}
.lh-delta-item[data-dir="up"] .lh-delta-value{color:var(--g-strong)}.lh-delta-item[data-dir="down"] .lh-delta-value{color:var(--g-weak)}
.lh-delta-value{display:block;font-family:var(--display);font-size:1.7rem;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1;color:var(--g-muted)}
.lh-delta-footnote{margin:.8rem 0 0;max-width:42rem;font-size:.8rem;color:var(--g-muted)}
.showcase-summary{max-width:46rem;margin:1.4rem 0 0;font-size:1.08rem}
.browse{margin:1.6rem 0 0;border:var(--g-bw) solid var(--g-line);border-radius:var(--g-radius);background:var(--g-surface);box-shadow:var(--g-small-shadow)}
.browse summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1.2rem;font-family:var(--display);font-weight:800;font-size:1.1rem}
.browse summary::-webkit-details-marker{display:none}
.browse summary .ic{transition:transform .25s}.browse[open] summary .ic{transform:rotate(135deg)}
.browse-list{list-style:none;margin:0;padding:0 .8rem .9rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem .6rem;max-height:26rem;overflow-y:auto;overscroll-behavior:contain}
.browse-list button{all:unset;box-sizing:border-box;display:grid;gap:.05rem;width:100%;padding:.5rem .7rem;border-radius:12px;cursor:pointer}
.browse-list button:hover,.browse-list button[aria-current="true"]{background:var(--g-accent-bg);color:var(--g-accent-ink)}
.browse-list button:focus-visible{outline:3px solid var(--g-focus)}
.browse-list .bn{font-weight:800;font-size:.95rem}.browse-list .bm{font-size:.78rem;opacity:.8}
.flinks{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}
@media (max-width:1100px){.lh-delta-row{grid-template-columns:repeat(2,minmax(0,1fr))}.browse-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){
.showcase-meta-bar{flex-direction:column;align-items:stretch}
.showcase-actions{width:100%;justify-content:space-between}
.pager{margin-left:auto}
.compare{grid-template-columns:minmax(0,1fr)}
.preview-mode-bar{justify-content:stretch}.preview-mode{width:100%}
.compare-tabs{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;margin-bottom:.8rem;padding:.3rem;border:var(--g-bw) solid var(--g-line);border-radius:99px;background:var(--g-surface)}
.compare .frame{display:none}.compare .frame.is-active{display:block}
.after-stage.has-options{display:block}
.option-rail{flex-direction:row;gap:.4rem;padding:.4rem .6rem;border-right:0;border-top:0;border-bottom:var(--g-bw) solid var(--g-line);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity}
.option-rail button{flex:0 0 auto;min-height:2.75rem;min-width:2.75rem;max-width:14rem;padding:.4rem .95rem;border-radius:99px;border-color:var(--g-line);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;scroll-snap-align:start}
.lh-meter{grid-template-columns:minmax(0,6.2rem) minmax(0,1fr) 2.4rem;gap:.4rem}
}
@media (max-width:520px){.lh-delta-row{grid-template-columns:repeat(2,minmax(0,1fr))}.browse-list{grid-template-columns:minmax(0,1fr)}}
@media (max-width:420px){.lh-meter{grid-template-columns:1fr auto;grid-template-areas:"label score" "bar bar"}.lh-meter .lh-label{grid-area:label}.lh-meter .lh-score{grid-area:score}.lh-meter-track{grid-area:bar}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.lh-meter-fill,.lh-panel.is-animated .lh-meter-fill{transition:none}}
:root{--g-surface:var(--paper);--g-input:#fff;--g-pop:var(--paper);--g-line:var(--ink);--g-text:var(--ink);--g-muted:#47557a;--g-bw:3px;--g-radius:20px;
--g-shadow:7px 7px 0 var(--ink);--g-small-shadow:3px 3px 0 var(--ink);--g-small-shadow-h:5px 5px 0 var(--ink);
--g-accent-bg:var(--sun);--g-accent-ink:var(--ink);--g-focus:var(--coral);--g-badge-bg:var(--ink);--g-badge-ink:var(--sun);--g-chip:var(--sky);
--g-before-chip:var(--coral);--g-before-ink:#fff;--g-after-chip:var(--sun);--g-after-ink:var(--ink);--g-d1:var(--coral);--g-d2:var(--cream);--g-d3:var(--teal);
--g-url:#fff;--g-scroll:var(--ink);--g-strong:#0b7d79;--g-mid:#d98a00;--g-weak:var(--coral);--g-score:var(--ink);--g-track:var(--cream);--g-note:var(--cream)}
.browser-bar{background:var(--sun);border-bottom:var(--g-bw) solid var(--ink)}
.viewport{border-top:0}
.lh-meter-fill{border-right:2px solid var(--ink)}
.lh-score{font-size:1.2rem}
.lh-delta-item[data-dir="up"]{background:var(--sky)}.lh-delta-item[data-dir="down"]{background:#ffd9cf}
.flinks a{text-decoration:none;font-weight:700}.flinks a:hover{color:var(--sun)}
.frame[data-frame="before"] .frame-label span{background:var(--coral-ink)}
.viewport--before:focus-visible{outline:3px solid var(--ink);outline-offset:-6px}
