.lens-wrap{--low:#30d158;--med:#ff9f0a;--high:#ff453a;perspective:1200px;width:100%;max-width:440px;margin-inline:auto;position:relative}.lens{--c:var(--low);--rx:0deg;--ry:0deg;--mx:50%;--my:30%;color:#f5f5f7;-webkit-backdrop-filter:blur(28px)saturate(180%);backdrop-filter:blur(28px)saturate(180%);box-shadow:0 40px 80px -30px #000000b3,0 0 0 1px #0006,0 0 80px -20px color-mix(in srgb,var(--c) 45%,transparent);transform:rotateX(var(--rx)) rotateY(var(--ry));will-change:transform;background:linear-gradient(160deg,#ffffff1c,#ffffff0a);border:1px solid #ffffff24;border-top-color:#ffffff57;border-radius:28px;padding:22px;transition:transform .28s cubic-bezier(.23,1,.32,1),box-shadow .5s cubic-bezier(.23,1,.32,1);position:relative;overflow:hidden}.lens-medium{--c:var(--med)}.lens-high{--c:var(--high)}.lens-spot{pointer-events:none;background:radial-gradient(260px circle at var(--mx) var(--my),#ffffff29,transparent 65%);opacity:0;transition:opacity .3s;position:absolute;inset:0}.lens-wrap:hover .lens-spot{opacity:1}.lens-top{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.lens-dots{gap:6px;display:flex}.lens-dots i{background:#ffffff38;border-radius:50%;width:10px;height:10px}.lens-badge{letter-spacing:.14em;color:#ffffff8c;font:600 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.lens-url{color:#fff;background:#00000059;border:1px solid #ffffff1a;border-radius:14px;align-items:center;gap:10px;height:48px;padding:0 16px;font:500 15px/1 ui-monospace,SFMono-Regular,Menlo,monospace;display:flex;position:relative;overflow:hidden}.lens-url svg{color:#fff9;flex:none}.lens-url-text{white-space:nowrap;text-overflow:ellipsis;animation:.42s cubic-bezier(.23,1,.32,1) both lens-type;overflow:hidden}@keyframes lens-type{0%{opacity:0;filter:blur(4px);transform:translateY(6px)}to{opacity:1;filter:none;transform:none}}.lens-beam{pointer-events:none;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--c) 55%,#fff 10%),transparent);opacity:0;width:45%;position:absolute;top:0;bottom:0;left:0;transform:translate(-100%)}.is-scanning .lens-beam{opacity:.75;animation:1.1s cubic-bezier(.77,0,.175,1) infinite lens-sweep}@keyframes lens-sweep{to{transform:translate(260%)}}.lens-body{align-items:center;gap:20px;margin:22px 0 18px;display:flex}.lens-gauge{flex:none;width:112px;height:112px;position:relative}.lens-gauge svg{width:100%;height:100%;display:block}.g-track,.g-fill{fill:none;stroke-width:9px;stroke-linecap:round}.g-track{stroke:#ffffff1a}.g-fill{stroke:var(--c);filter:drop-shadow(0 0 8px color-mix(in srgb,var(--c) 70%,transparent));transition:stroke-dashoffset .9s cubic-bezier(.23,1,.32,1),stroke .4s}.g-center{color:var(--c);place-items:center;transition:color .4s;display:grid;position:absolute;inset:0}.g-center svg{opacity:.5;width:34px;height:34px;transition:transform .6s cubic-bezier(.34,1.56,.64,1),opacity .3s;transform:scale(.9)}.is-done .g-center svg{opacity:1;transform:scale(1)}.lens-verdict{flex-direction:column;gap:6px;min-width:0;display:flex}.lens-label{letter-spacing:-.025em;color:#fff;font:700 clamp(24px,3.4vw,30px)/1.05 -apple-system,BlinkMacSystemFont,SF Pro Display,Inter,system-ui,sans-serif}.is-done .lens-label{background:linear-gradient(180deg,#fff,color-mix(in srgb,var(--c) 70%,#fff));color:#0000;-webkit-background-clip:text;background-clip:text}.lens-note{color:#ffffff9e;font:400 14px/1.4 system-ui,sans-serif}.lens-sources{gap:8px;margin:0;padding:0;list-style:none;display:grid}.lens-sources li{color:#ffffffd1;background:#ffffff0d;border:1px solid #ffffff12;border-radius:12px;align-items:center;gap:10px;padding:10px 12px;font:500 13.5px/1 system-ui,sans-serif;transition:background .3s,border-color .3s,transform .4s cubic-bezier(.23,1,.32,1);display:flex}.lens-sources em{color:#ffffff80;margin-left:auto;font-size:12px;font-style:normal}.src-dot{background:#ffffff4d;border-radius:50%;width:8px;height:8px;transition:background .3s,box-shadow .3s}.src-clear .src-dot{background:var(--low);box-shadow:0 0 10px var(--low)}.src-clear em{color:var(--low)}.src-warn .src-dot{background:var(--med);box-shadow:0 0 10px var(--med)}.src-warn em{color:var(--med)}.src-bad .src-dot{background:var(--high);box-shadow:0 0 10px var(--high)}.src-bad em{color:var(--high)}.is-scanning .lens-sources li{animation:1.1s ease-in-out infinite lens-pulse}.is-scanning .lens-sources li:nth-child(2){animation-delay:.15s}.is-scanning .lens-sources li:nth-child(3){animation-delay:.3s}@keyframes lens-pulse{50%{background:#ffffff1a}}.lens-picks{justify-content:center;gap:8px;margin-top:16px;display:flex}.pick{color:#ffffffbf;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff24;border-radius:999px;align-items:center;gap:8px;height:38px;padding:0 16px;font:600 13px/1 system-ui,sans-serif;transition:transform .16s cubic-bezier(.23,1,.32,1),background .2s,color .2s,border-color .2s;display:inline-flex}.pick i{border-radius:50%;width:8px;height:8px}.pick-low i{background:var(--low)}.pick-medium i{background:var(--med)}.pick-high i{background:var(--high)}.pick:active{transform:scale(.96)}.pick.on{color:#111;background:#fff;border-color:#fff}.pick:focus-visible{outline-offset:3px;outline:2px solid #fff}@media (hover:hover) and (pointer:fine){.pick:not(.on):hover{color:#fff;background:#ffffff24}}.lens-foot{text-align:center;color:#ffffff73;margin:12px 0 0;font:400 12px/1.4 system-ui,sans-serif}@media (max-width:520px){.lens{border-radius:24px;padding:18px}.lens-gauge{width:92px;height:92px}.lens-body{gap:14px}}@media (prefers-reduced-motion:reduce){.lens{transition:box-shadow .3s;transform:none!important}.lens-beam{display:none}.lens-url-text,.is-scanning .lens-sources li{animation:none}.g-fill,.g-center svg{transition:none}}@media (prefers-reduced-transparency:reduce){.lens{-webkit-backdrop-filter:none;backdrop-filter:none;background:#1c1c1e}}@media (prefers-contrast:more){.lens{background:#111;border-color:#fff}}.motion-off .lens{transform:none!important}.motion-off .lens-beam{display:none}.g-fill{transition:stroke-dashoffset .9s cubic-bezier(.23,1,.32,1),stroke .4s,opacity .2s}.is-scanning .g-fill{opacity:0}
