/* Scouter lens: decorative alien telemetry surrounds the actual target/readout. */
#bp-scan .bp-scan-visual{display:block;min-height:0;height:232px;padding:0;margin:4px 0 16px;border:1px solid #74b476;border-radius:5px 25px 5px 25px;isolation:isolate;background:radial-gradient(ellipse at 50% 42%,#438b4c 0,#215e36 45%,#0c3829 100%);box-shadow:inset 0 0 40px #041e22aa,0 0 16px #75b67512;overflow:hidden}
#bp-scan .bp-lens-grid{position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,transparent 49.8%,#c4ee7433 50%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,#c4ee7422 50%,transparent 50.2%),repeating-linear-gradient(0deg,#bbf29a07 0 1px,transparent 1px 4px);opacity:.75}
#bp-scan .bp-lens-target{position:absolute;inset:14px 0 35px;display:flex;align-items:center;justify-content:center;z-index:1;filter:sepia(.65) saturate(.8) hue-rotate(43deg);opacity:.95}
#bp-scan .bp-lens-target canvas{width:142px;height:172px;max-height:100%;object-fit:contain;filter:drop-shadow(0 6px 6px #001e2380)}
#bp-scan .bp-lens-hud{position:absolute;inset:0 0 25px;width:100%;height:calc(100% - 25px);color:#dfed86;z-index:2;pointer-events:none;opacity:.86}
#bp-scan .bp-lens-orbit,#bp-scan .bp-lens-lock{transform-origin:250px 112px}.bp-lens-glyphs{opacity:.82}
#bp-scan .bp-lens-caption{position:absolute;inset:auto 0 0;display:flex;align-items:center;gap:8px;padding:8px 12px;background:#09281fe8;border-top:1px solid #afd68e55;z-index:4}
#bp-scan .bp-lens-caption p{margin:0;color:#e0efb0;font:600 11px/1.4 system-ui;letter-spacing:.07em}.bp-lens-caption-code{margin-left:auto;font:9px ui-monospace,monospace;letter-spacing:.1em;color:#9db997}.bp-lens-indicator{width:6px;height:6px;border-radius:50%;background:#d5eb84;box-shadow:0 0 7px #b9db69}
#bp-scan .bp-scan-beam{display:none;z-index:3;left:0;right:0;top:0;height:34px;background:linear-gradient(transparent,#e5ef901e,#eeffc183);border-bottom:1px solid #f4ffb1;box-shadow:0 6px 14px #bdd98a29;opacity:0}
#bp-scan[open].scanning:not([data-scan-state=error]) .bp-scan-beam{display:block;animation:bp-lens-sweep 1.6s ease-in-out 1 both}
#bp-scan[open].scanning:not([data-scan-state=error]) .bp-lens-orbit{animation:bp-lens-orbit 1.8s cubic-bezier(.16,.7,.2,1) 1 both}
#bp-scan[open].scanning:not([data-scan-state=error]) .bp-lens-lock{animation:bp-lens-lock 1.4s ease-out 1 both}
#bp-scan[open].scanning:not([data-scan-state=error]) .bp-glyph-run{animation:bp-lens-decode 1.5s steps(6,end) 1 both}.bp-glyph-run-b{animation-delay:.12s!important}.bp-glyph-run-c{animation-delay:.23s!important}
#bp-scan[data-scan-state=error] .bp-lens-hud{color:#e2ac88;opacity:.4}#bp-scan[data-scan-state=error] .bp-lens-target{opacity:.3}#bp-scan[data-scan-state=error] .bp-lens-indicator{background:#e7a285;box-shadow:none}
#bp-scan[data-scan-state=inspect] .bp-scan-visual{height:54px}#bp-scan[data-scan-state=inspect] .bp-lens-hud{display:none}
#bp-scan .bp-resists{padding:14px}#bp-scan .bp-resists h3{margin-bottom:12px;font-size:1rem}#bp-scan .bp-resist-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0}
#bp-scan .bp-resist{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px;padding:11px 10px 14px;background:#142a34;border:1px solid #36515a;border-radius:7px;overflow:hidden}
#bp-scan .bp-resist dt{font-size:12px;color:#b7ccd0;overflow-wrap:anywhere}#bp-scan .bp-resist dd{margin:0;font:600 14px/1.25 ui-monospace,monospace;font-variant-numeric:tabular-nums;color:#a5b8be}
#bp-scan .bp-resist.resistant{border-color:#52765b}#bp-scan .bp-resist.resistant dd{color:#c3e9a1}#bp-scan .bp-resist.vulnerable{border-color:#a16b55}#bp-scan .bp-resist.vulnerable dd{color:#ffc6a4}
.bp-resist-track{position:absolute;bottom:0;left:0;right:0;height:3px;background:#0c202a}.bp-resist-track::after{content:'';display:block;width:var(--resist-fill);height:100%;background:#91b879}.vulnerable .bp-resist-track::after{background:#e3936f}
#bp-scan .bp-resist-note{font-size:11px;color:#e9b895;margin:10px 0 0}#bp-scan .bp-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}#bp-scan .bp-metrics div{min-width:0;padding:12px}#bp-scan .bp-metrics dd{font-size:clamp(.95rem,4.5vw,1.35rem);overflow-wrap:anywhere}#bp-scan .bp-metrics dt{font-size:12px}
@keyframes bp-lens-sweep{0%{transform:translateY(-36px);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateY(225px);opacity:0}}
@keyframes bp-lens-orbit{from{transform:rotate(-125deg) scale(1.16);opacity:.3}to{transform:rotate(0) scale(1);opacity:1}}
@keyframes bp-lens-lock{from{transform:scale(1.65);opacity:.1}60%{opacity:.8}to{transform:scale(1);opacity:1}}
@keyframes bp-lens-decode{0%{clip-path:inset(0 80% 0 0);opacity:.4}35%{clip-path:inset(0 0 0 15%)}60%{clip-path:inset(0 35% 0 0);opacity:.8}100%{clip-path:inset(0);opacity:1}}
#bp-scan.bp-scan-paused *{animation-play-state:paused!important}
@media(max-width:360px){#bp-scan .bp-scan-visual{height:204px}#bp-scan .bp-lens-target canvas{width:115px;height:147px}#bp-scan .bp-lens-caption-code{display:none}#bp-scan .bp-resist{padding:10px 8px 13px;gap:4px}#bp-scan .bp-resist dt{font-size:11px}#bp-scan .bp-resist dd{font-size:12px}}
@media(prefers-reduced-motion:reduce){#bp-scan[open] .bp-scan-visual *{animation:none!important}#bp-scan[open] .bp-scan-beam{display:none!important}}

/* Compact scan readout; details remain readable without large metric cards. */
#bp-scan:not(.bp-item-mode){padding:12px}
#bp-scan:not(.bp-item-mode)>header{padding:0 0 8px;gap:8px}
#bp-scan:not(.bp-item-mode)>header h2{font-size:1.25rem;margin:2px 0}
#bp-scan:not(.bp-item-mode)>header small{font-size:10px}
#bp-scan:not(.bp-item-mode) .bp-scan-visual{height:110px;margin:0 0 8px}
#bp-scan:not(.bp-item-mode) .bp-lens-target{inset:2px 0 23px}
#bp-scan:not(.bp-item-mode) .bp-lens-target canvas{height:82px;width:70px}
#bp-scan:not(.bp-item-mode) .bp-lens-caption{padding:4px 8px}
#bp-scan:not(.bp-item-mode) .bp-metrics{gap:0 14px;margin:0 0 8px}
#bp-scan:not(.bp-item-mode) .bp-metrics>div{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:6px 0;background:none;border:0;border-bottom:1px solid #38535e;border-radius:0}
#bp-scan:not(.bp-item-mode) .bp-metrics dd{font-size:13px;margin:0}
#bp-scan:not(.bp-item-mode) .bp-group{padding:8px 0;margin:0;border:0;border-top:1px solid #38535e;border-radius:0;background:none}
#bp-scan:not(.bp-item-mode) .bp-group h3{font-size:13px;margin:0 0 6px}
#bp-scan:not(.bp-item-mode) .bp-group p{font-size:12px;line-height:1.4;margin:4px 0}
#bp-scan:not(.bp-item-mode) .bp-resist-grid{gap:0 16px}
#bp-scan:not(.bp-item-mode) .bp-resist{padding:5px 0;background:none;border:0;border-radius:0}
#bp-scan:not(.bp-item-mode) .bp-resist dd{font-size:12px}
#bp-scan:not(.bp-item-mode) .bp-resist-track{display:none}
#bp-scan .bp-empty-affects{font-size:12px;margin:6px 0;color:#b7ccd0}
#bp-scan .bp-drops ul{list-style:none;padding:0;margin:0}
#bp-scan .bp-drops li{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:7px;align-items:center;padding:4px 0;border-bottom:1px solid #38535e66;font-size:12px}
#bp-scan .bp-drop-chance{font:600 12px ui-monospace,monospace;color:#d8c28d}
#bp-scan .bp-drop-name{overflow-wrap:anywhere}
#bp-scan .bp-drop-link{font-size:11px;min-height:36px;padding:4px 7px;color:#87d6dc}
#bp-scan:not(.bp-item-mode) .bp-original{font-size:12px;margin:8px 0}
#bp-scan:not(.bp-item-mode)>footer{padding-top:6px}
#bp-scan:not(.bp-item-mode)>footer button{font-size:12px;min-height:36px;padding:5px 10px}

#bp-scan .bp-metrics dd{white-space:nowrap;overflow-wrap:normal}
@media(max-width:480px){#bp-scan .bp-metrics{grid-template-columns:minmax(0,1fr)}}

/* Name-only drop lists have no percentage cell. Use the whole row. */
#bp-scan .bp-drops li>span:only-child{grid-column:1/-1;min-width:0;overflow-wrap:anywhere}
#bp-scan-data{min-width:0}
body.beta-client #bp-scan>header{position:sticky;top:0;z-index:10;background:var(--ui-chrome,#122631);padding-bottom:8px}
body.beta-client #bp-scan #bp-scan-close{flex:0 0 44px;min-height:44px;padding:4px;font-size:26px;line-height:1;color:var(--ui-accent,#eee5c7)}

/* Desktop gives the portrait its own column and the readout readable type. */
@media(min-width:900px){
 body.beta-client #bp-scan:not(.bp-item-mode){width:min(1000px,calc(100vw - 48px));height:fit-content;font-size:16px;line-height:1.5}
 #bp-scan:not(.bp-item-mode)[open]{display:grid;grid-template-columns:280px minmax(0,1fr);column-gap:24px;align-content:start}
 #bp-scan:not(.bp-item-mode)>header{grid-column:1/-1;margin-bottom:12px}
 #bp-scan:not(.bp-item-mode)>header h2{font-size:24px}
 #bp-scan:not(.bp-item-mode)>header small{font-size:12px}
 #bp-scan:not(.bp-item-mode) .bp-scan-visual{grid-column:1;grid-row:2;align-self:start;height:240px;margin:0}
 #bp-scan:not(.bp-item-mode) .bp-lens-target{inset:14px 0 35px}
 #bp-scan:not(.bp-item-mode) .bp-lens-target canvas{width:142px;height:172px}
 #bp-scan:not(.bp-item-mode) .bp-lens-caption-code{display:none}
 #bp-scan:not(.bp-item-mode) #bp-scan-data{grid-column:2;grid-row:2}
 #bp-scan:not(.bp-item-mode) #bp-scan-actions,#bp-scan:not(.bp-item-mode)>footer{grid-column:2}
 #bp-scan:not(.bp-item-mode) .bp-metrics{grid-template-columns:1fr}
 #bp-scan:not(.bp-item-mode) .bp-metrics dt{font-size:16px}
 #bp-scan:not(.bp-item-mode) .bp-metrics dd{font-size:18px}
 #bp-scan:not(.bp-item-mode) .bp-group h3{font-size:18px}
 #bp-scan:not(.bp-item-mode) .bp-group p,#bp-scan:not(.bp-item-mode) .bp-resist dd,
 #bp-scan:not(.bp-item-mode) .bp-empty-affects,#bp-scan:not(.bp-item-mode) .bp-drops li,
 #bp-scan:not(.bp-item-mode) .bp-original{font-size:16px}
 #bp-scan:not(.bp-item-mode) .bp-resist dt{font-size:14px}
 #bp-scan:not(.bp-item-mode) .bp-drops li{grid-template-columns:52px minmax(0,1fr) auto;padding:8px 0}
 #bp-scan:not(.bp-item-mode) .bp-drop-chance{font-size:14px}
 body.beta-client #bp-scan:not(.bp-item-mode) .bp-drop-link,
 body.beta-client #bp-scan:not(.bp-item-mode)>footer button{font-size:14px;min-height:44px}
}
