.web-vitals-panel{margin-top:24px;border:1px solid var(--line,rgba(255,255,255,.12));border-radius:18px;padding:22px;background:linear-gradient(145deg,rgba(124,156,255,.08),rgba(255,255,255,.03));overflow:hidden}.web-vitals-panel__head,.web-vitals-panel__footer{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap}.web-vitals-panel__kicker{display:block;margin-bottom:7px;color:var(--accent,#7c9cff);font-size:12px;font-weight:800;letter-spacing:.12em}.web-vitals-panel h2{margin:0;font:800 clamp(1.45rem,3vw,2rem)/1.05 Inter,system-ui,sans-serif;letter-spacing:-.035em}.web-vitals-panel__hint{max-width:650px;margin:0;color:var(--muted,#8d96a8);line-height:1.6}.web-vitals-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}.web-vital-card{position:relative;min-height:185px;border:1px solid var(--line,rgba(255,255,255,.12));border-radius:14px;padding:17px;background:rgba(0,0,0,.14);overflow:hidden}.web-vital-card::after{content:"";position:absolute;inset:auto 0 0;height:4px;background:var(--vital-color,#7c9cff);opacity:.85}.web-vital-card[data-rating="good"]{--vital-color:#67e8a5}.web-vital-card[data-rating="needs-improvement"]{--vital-color:#facc6b}.web-vital-card[data-rating="poor"]{--vital-color:#fb7185}.web-vital-card[data-rating="unsupported"]{--vital-color:#8d96a8}.web-vital-card__top{display:flex;align-items:center;justify-content:space-between;gap:10px}.web-vital-card__name{font-size:12px;font-weight:800;letter-spacing:.1em}.web-vital-card__rating{border:1px solid currentColor;border-radius:999px;padding:5px 8px;color:var(--vital-color,#7c9cff);font-size:10px;font-weight:900;letter-spacing:.08em}.web-vital-card__value{display:block;margin:22px 0 6px;font:800 clamp(2rem,5vw,3rem)/1 Inter,system-ui,sans-serif;letter-spacing:-.055em}.web-vital-card__threshold{display:block;color:var(--muted,#8d96a8);font-size:12px;line-height:1.45}.web-vital-card__bar{height:7px;margin-top:16px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.web-vital-card__bar span{display:block;width:0;height:100%;border-radius:inherit;background:var(--vital-color,#7c9cff);transition:width .35s ease}.web-vitals-panel__footer{margin-top:18px;padding-top:16px;border-top:1px solid var(--line,rgba(255,255,255,.12));align-items:center}.web-vitals-panel__status{color:var(--muted,#8d96a8);line-height:1.5}.web-vitals-panel__status strong{color:var(--text,#f5f7fb)}.web-vitals-refresh{border:1px solid var(--line,rgba(255,255,255,.12));border-radius:9px;padding:10px 13px;background:rgba(255,255,255,.055);color:inherit;font:800 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;cursor:pointer}.web-vitals-refresh:hover{background:rgba(124,156,255,.12)}.web-vitals-note{width:100%;margin:0;color:var(--muted,#8d96a8);font-size:12px;line-height:1.5}@media(max-width:760px){.web-vitals-grid{grid-template-columns:1fr}.web-vital-card{min-height:155px}}@media(prefers-reduced-motion:reduce){.web-vital-card__bar span{transition:none}}