.fps-result__viz{position:relative;margin-top:0;padding-top:var(--fps-pad);border-top:1px solid var(--border);background:transparent;overflow:hidden}.fps-result__viz[hidden]{display:none}.fps-result__viz-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem .875rem;margin-bottom:var(--fps-gap)}.fps-result__viz-heading{display:flex;flex-direction:column;gap:.125rem;min-width:0}.fps-result__viz-title{font-size:var(--fps-fs-eyebrow);font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted)}.fps-result__viz-preset{font-size:var(--fps-fs-xs);font-weight:600;color:var(--accent);white-space:nowrap}.fps-result__viz-modes{display:inline-flex;gap:2px;padding:2px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-full, 999px);box-shadow:inset 0 1px 2px color-mix(in srgb,var(--border) 50%,transparent);flex-shrink:0}.fps-viz-mode{min-height:var(--fps-segment-h);padding:.3125rem .875rem;background:transparent;border:none;border-radius:var(--radius-full, 999px);color:var(--text-secondary);font-size:var(--fps-fs-sm);font-weight:600;letter-spacing:.01em;white-space:nowrap;cursor:pointer;touch-action:manipulation;transition:background-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease}.fps-viz-mode[hidden]{display:none}.fps-viz-mode:hover:not(.is-active){color:var(--text-primary);background:color-mix(in srgb,var(--accent) 10%,transparent)}.fps-viz-mode.is-active{background:var(--accent);color:var(--bg-primary);box-shadow:0 1px 5px color-mix(in srgb,var(--accent) 34%,transparent)}.fps-result__viz-canvas{position:relative;width:100%;height:clamp(200px,34vw,300px)}@media(max-width:520px){.fps-result__viz-modes{width:100%}.fps-viz-mode{flex:1 1 0;min-width:0;min-height:40px}}.fps-result__viz-canvas canvas{display:block;width:100%!important;height:100%!important}.fps-viz-tip{position:absolute;left:0;top:0;z-index:20;display:flex;flex-direction:column;gap:.375rem;min-width:8.5rem;padding:.5rem .6875rem;background:color-mix(in srgb,var(--accent) 5%,var(--bg-secondary));border:1px solid color-mix(in srgb,var(--accent) 22%,var(--border));border-radius:var(--radius-md);box-shadow:0 8px 22px -6px color-mix(in srgb,var(--accent) 20%,transparent),0 2px 8px #00000024;color:var(--text-primary);font-size:var(--fps-fs-xs);line-height:1.3;pointer-events:none;opacity:0;transform:translate(-50%,-100%);transition:opacity .14s ease;will-change:left,top,opacity}.fps-viz-tip--below{transform:translate(-50%)}.fps-viz-tip__title{font-size:var(--fps-fs-xs);font-weight:700;letter-spacing:.01em;color:var(--text-primary);padding-bottom:.3125rem;border-bottom:1px solid color-mix(in srgb,var(--border) 70%,transparent)}.fps-viz-tip__rows{display:flex;flex-direction:column;gap:.25rem}.fps-viz-tip__row{display:flex;align-items:center;gap:.4375rem}.fps-viz-tip__dot{width:.5625rem;height:.5625rem;border-radius:3px;flex-shrink:0}.fps-viz-tip__label{color:var(--text-secondary);font-weight:600}.fps-viz-tip__val{margin-left:auto;padding-left:.75rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text-primary)}.fps-viz-tip__unit{margin-left:.1875rem;font-size:.625rem;font-weight:600;color:var(--text-muted)}.fps-result__viz-legend{display:flex;flex-wrap:wrap;gap:clamp(.75rem,2vw,1.25rem);margin-top:clamp(.5rem,1.5vw,.875rem);padding-top:.625rem;border-top:1px solid var(--border)}.fps-viz-legend__item{display:inline-flex;align-items:center;gap:.4rem;font-size:var(--fps-fs-xs);font-weight:600;color:var(--text-secondary)}.fps-viz-legend__swatch{width:.8125rem;height:.8125rem;border-radius:4px;flex-shrink:0}.fps-viz-legend__swatch--avg{background:rgb(var(--accent-rgb))}.fps-viz-legend__swatch--low{background:rgba(var(--accent-rgb),.55)}html.dark .fps-viz-legend__swatch--low{background:rgba(var(--accent-rgb),.45)}@media(hover:hover){.fps-preset__btn:hover:not(.is-active){transform:translateY(-1px)}}.fps-preset__btn:active{transform:translateY(0) scale(.98)}.fps-preset__btn.is-active{transform:translateY(-1px)}.fps-result .res-card{transition:border-color .2s ease,box-shadow .2s ease,transform .2s cubic-bezier(.22,1,.36,1);will-change:transform}@media(hover:hover){.fps-result .res-card:hover:not(.res-card--incompatible){transform:translateY(-3px)}}.fps-result .res-card:active{transform:translateY(-1px) scale(.99)}.fps-result .res-card.is-selected{transform:translateY(-2px)}@media(prefers-reduced-motion:reduce){.fps-preset__btn,.fps-preset__btn.is-active,.fps-result .res-card,.fps-result .res-card.is-selected{transform:none;transition:border-color .2s ease,box-shadow .2s ease,background-color .18s ease,color .18s ease}}