/* Animal Lens 2.0: a dark field-instrument console. Self-contained; no external fonts. */
.al{--bg:#070d1a;--p1:#0d1730;--p2:#122044;--line:#223559;--tx:#e8eef9;--mu:#93a4c3;--sig:#4cc9f0;--warm:#ffb86b;--ok:#5eead4;--no:#ff8a80;--ac:#4cc9f0;
  --disp:Bahnschrift,"DIN Alternate","Roboto Condensed","Segoe UI Semibold","Helvetica Neue",Arial,sans-serif;
  max-width:820px;margin:0 auto;padding:14px;color:var(--tx);background:var(--bg);border:1px solid var(--line);border-radius:18px;
  background-image:linear-gradient(rgba(76,201,240,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(76,201,240,.05) 1px,transparent 1px);background-size:28px 28px;
  font:16px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-sizing:border-box}
.al *{box-sizing:border-box}
.al h2,.al h3,.al h4{font-family:var(--disp);margin:0;letter-spacing:.005em;color:var(--tx)}
.al h2{font-size:clamp(2rem,6vw,2.9rem);line-height:1.04;font-weight:700;margin-bottom:10px}
.al h3{font-size:1.08rem;font-weight:700;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.al h4{font-size:.98rem;font-weight:700;margin:20px 0 6px;color:var(--ac)}
.al p{margin:0 0 10px}
.al-mono{font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--sig)}

/* top bar */
.al-top{display:flex;align-items:center;gap:6px;padding:4px 4px 12px;font:.74rem ui-monospace,Menlo,Consolas,monospace;color:var(--mu)}
.al-top i{width:9px;height:9px;border-radius:50%;background:var(--line)}
.al-top i:first-child{background:var(--no)}.al-top i:nth-child(2){background:var(--warm)}.al-top i:nth-child(3){background:var(--ok)}
.al-top span{margin-left:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* hero */
.al-head{display:grid;grid-template-columns:150px 1fr;gap:22px;align-items:center;padding:10px 6px 22px}
.al-orb{position:relative;width:150px;height:150px;display:grid;place-items:center}
.al-orb svg{position:absolute;inset:0;width:100%;height:100%}
.al-orb .r1{fill:none;stroke:var(--sig);stroke-width:1.2;stroke-dasharray:3 6;transform-origin:60px 60px;animation:al-spin 40s linear infinite}
.al-orb .r2{fill:rgba(76,201,240,.06);stroke:var(--line);stroke-width:1.5}
.al-orb .tk{stroke:var(--sig);stroke-width:2;fill:none}
#al-orb-em{font-size:58px;line-height:1;filter:drop-shadow(0 0 14px rgba(76,201,240,.45));transition:opacity .25s}
@keyframes al-spin{to{transform:rotate(360deg)}}
.al-sub{color:var(--mu);max-width:58ch}
.al-pack{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.al-pack span{width:38px;height:38px;display:grid;place-items:center;font-size:20px;background:var(--p1);border:1px solid var(--line);border-radius:10px}

/* input modules */
.al-box{display:flex;flex-direction:column;gap:14px}
.al-mod{background:var(--p1);border:1px solid var(--line);border-left:3px solid var(--sig);border-radius:12px;padding:16px 18px}
.al-mod h3 b{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--sig);color:#04101c;font:700 .82rem ui-monospace,Menlo,monospace}
.al-mod p{color:var(--mu);margin:8px 0 12px}
.al-chip{font:600 .72rem ui-monospace,Menlo,monospace;font-style:normal;padding:2px 9px;border-radius:99px;border:1px solid var(--line);color:var(--mu);margin-left:auto}
.al-chip.ok{color:#04101c;background:var(--ok);border-color:var(--ok)}
.al-field{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:.88rem;margin-top:10px}
.al-field input{font:inherit;font-weight:400;padding:11px 12px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--tx)}
.al-field input::placeholder{color:#5f7296}
.al-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.al-btn{display:inline-block;font:600 .95rem var(--disp);letter-spacing:.01em;border-radius:10px;padding:11px 18px;cursor:pointer;border:1px solid var(--sig);background:var(--sig);color:#04101c;text-align:center;transition:transform .12s,box-shadow .12s}
.al-btn:hover{box-shadow:0 0 0 3px rgba(76,201,240,.22)}
.al-btn:active{transform:translateY(1px)}
.al-btn.alt{background:transparent;color:var(--tx);border-color:var(--line)}
.al-btn.alt:hover{border-color:var(--sig)}
.al-btn.go{padding:13px 26px;font-size:1.02rem}
.al-btn[disabled]{opacity:.4;cursor:not-allowed;box-shadow:none}
.al button:focus-visible,.al input:focus-visible,.al label:focus-within,.al [role=tab]:focus-visible{outline:3px solid var(--warm);outline-offset:2px}
#al-bars{display:flex;gap:2px;align-items:flex-end;height:38px;margin:12px 0 0}
#al-bars:empty{display:none}
#al-bars i{flex:1;background:linear-gradient(var(--sig),#2a6df4);border-radius:2px;min-height:2px}
.al-st{font-size:.88rem;margin:8px 0 0!important;min-height:1.2em}
.al-st.ok{color:var(--ok)}
.al-scan{position:relative;display:inline-block;margin-top:12px;border-radius:10px;overflow:hidden;border:1px solid var(--line)}
.al-thumb{display:block;max-width:220px;max-height:220px}
.al-scan[hidden]{display:none}
.al-scan i{position:absolute;left:0;right:0;top:0;height:2px;background:var(--sig);box-shadow:0 0 14px 3px rgba(76,201,240,.7);animation:al-scan 1.6s ease-in-out 2}
@keyframes al-scan{0%{top:0}50%{top:calc(100% - 2px)}100%{top:0}}
.al-consent{display:flex;gap:10px;align-items:flex-start;font-size:.88rem;color:var(--mu);cursor:pointer;padding:0 4px}
.al-consent input{margin-top:3px;width:18px;height:18px;accent-color:var(--sig);flex:none}
.al-msg{margin:0;font-size:.9rem;min-height:1.2em;padding:0 4px}
.al-msg.err{color:var(--no);font-weight:600}
.al-log{margin:0;padding:14px 16px;background:#030711;border:1px solid var(--line);border-radius:12px;font:.82rem/1.7 ui-monospace,Menlo,Consolas,monospace;color:var(--ok);white-space:pre-wrap}
.al-log.busy::after{content:"_";animation:al-blink .8s steps(1) infinite}
@keyframes al-blink{50%{opacity:0}}

/* report */
#al-out{margin-top:22px}
.al-rep{--ac:var(--sig)}
.al-hero{position:relative;display:grid;grid-template-columns:auto 1fr 200px;gap:22px;align-items:center;padding:24px;background:linear-gradient(135deg,var(--p2),var(--p1));border:1px solid var(--ac);border-radius:16px;box-shadow:0 0 0 1px rgba(255,255,255,.03),0 0 36px -8px var(--ac)}
.al-hero:before,.al-hero:after{content:"";position:absolute;width:18px;height:18px;border:2px solid var(--ac)}
.al-hero:before{top:8px;left:8px;border-right:0;border-bottom:0;border-radius:6px 0 0 0}
.al-hero:after{bottom:8px;right:8px;border-left:0;border-top:0;border-radius:0 0 6px 0}
.al-ring{position:relative;width:132px;height:132px;display:grid;place-items:center}
.al-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.al-ring .bg{fill:none;stroke:var(--line);stroke-width:7}
.al-ring .fg{fill:none;stroke:var(--ac);stroke-width:7;stroke-linecap:round;filter:drop-shadow(0 0 5px var(--ac))}
.al-ring span{font-size:50px;line-height:1}
.al-ring b{position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);padding:1px 9px;background:var(--bg);border:1px solid var(--ac);border-radius:99px;font:600 .72rem ui-monospace,Menlo,monospace;color:var(--ac);white-space:nowrap}
.al-ht{min-width:0}
.al-ht small{display:block;font:.76rem ui-monospace,Menlo,monospace;color:var(--mu);margin-bottom:2px}
.al-ht .nm{font:700 clamp(2rem,6.5vw,3rem)/1 var(--disp);color:var(--ac);overflow-wrap:anywhere}
.al-ht p{margin:6px 0 0;color:var(--tx)}
.al-ht p.tg{font-weight:700}
.al-radar{width:100%;height:auto;display:block}
.al-radar .gr{fill:none;stroke:var(--line);stroke-width:1}
.al-radar .ax{stroke:var(--line);stroke-width:1}
.al-radar .tg{fill:none;stroke:var(--mu);stroke-width:1.2;stroke-dasharray:3 3}
.al-radar .me{fill:var(--ac);fill-opacity:.25;stroke:var(--ac);stroke-width:2}
.al-radar text{font:600 9px ui-monospace,Menlo,monospace;fill:var(--mu)}
.al-leg{white-space:nowrap;margin-top:6px;font:.7rem ui-monospace,Menlo,monospace;color:var(--mu);text-align:center;margin-top:2px}

.al-tabs{display:flex;gap:4px;overflow-x:auto;margin:20px 0 0;padding:0 0 0;border-bottom:1px solid var(--line);scrollbar-width:thin}
.al-tabs button{flex:none;background:transparent;border:0;border-bottom:3px solid transparent;color:var(--mu);font:600 .92rem var(--disp);padding:11px 14px;cursor:pointer;margin-bottom:-1px}
.al-tabs button:hover{color:var(--tx)}
.al-tabs button[aria-selected=true]{color:var(--ac);border-bottom-color:var(--ac)}
.al-panel{padding:20px 6px 6px}
.al-panel[hidden]{display:none}
.al-panel ul{margin:0 0 6px;padding-left:1.15em}
.al-panel li{margin-bottom:6px}
.al-panel li::marker{color:var(--ac)}
.al-panel ul.ok,.al-panel ul.no{list-style:none;padding:0}
.al-panel ul.ok li,.al-panel ul.no li{position:relative;padding:8px 12px 8px 34px;margin:0 0 6px;background:var(--p1);border:1px solid var(--line);border-radius:9px}
.al-panel ul.ok li:before,.al-panel ul.no li:before{position:absolute;left:11px;top:8px;font:700 .95rem ui-monospace,Menlo,monospace}
.al-panel ul.ok li:before{content:"+";color:var(--ok)}
.al-panel ul.no li:before{content:"\00D7";color:var(--no);font-size:1.15rem;top:5px}
.al-note{font-size:.86rem;color:var(--mu);border-left:3px solid var(--warm);padding:4px 0 4px 12px;margin:16px 0 0}
.al-meter{display:grid;grid-template-columns:120px 1fr 38px;gap:12px;align-items:center;font-size:.9rem;margin:7px 0}
.al-meter .t{height:9px;background:var(--p2);border-radius:5px;overflow:hidden}
.al-meter .t i{display:block;height:100%;background:linear-gradient(90deg,var(--ac),#fff3);background-color:var(--ac);border-radius:5px}
.al-meter b{font:500 .85rem ui-monospace,Menlo,monospace;text-align:right;color:var(--mu)}
.al-kv{display:grid;grid-template-columns:150px 1fr;gap:4px 16px;margin:0 0 6px}
.al-kv dt{font:600 .85rem ui-monospace,Menlo,monospace;color:var(--ac);padding:8px 0;border-top:1px solid var(--line)}
.al-kv dd{margin:0;padding:8px 0;border-top:1px solid var(--line)}
.al-kv dd small{display:block;color:var(--mu);font-size:.84rem;margin-top:2px}
.al-plan{display:grid;gap:8px;margin:0 0 6px}
.al-plan div{background:var(--p1);border:1px solid var(--line);border-left:3px solid var(--warm);border-radius:10px;padding:11px 14px}
.al-plan b{display:block;font:700 .95rem var(--disp);color:var(--warm);margin-bottom:2px}
.al-foot{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.al-disc{font-size:.8rem;color:var(--mu);margin:18px 4px 4px}

@media (prefers-reduced-motion:reduce){.al-orb .r1,.al-scan i,.al-log.busy::after{animation:none}#al-orb-em{transition:none}}
@media(max-width:680px){
  .al-head{grid-template-columns:1fr;text-align:left}.al-orb{width:110px;height:110px}#al-orb-em{font-size:44px}
  .al-hero{grid-template-columns:1fr;justify-items:start}.al-radar{max-width:240px}
  .al-meter{grid-template-columns:96px 1fr 34px}.al-kv{grid-template-columns:1fr;gap:0}.al-kv dt{border-bottom:0;padding-bottom:0}.al-kv dd{border-top:0;padding-top:2px}
}

.al-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.al-row{grid-template-columns:1fr}}
.al-field input.bad{border-color:#f26b6b}
