:root{color-scheme:dark;--bg:#0c171e;--line:#284650;--muted:#92aeb6;--mint:#78dda8}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 15% 0,#183743 0,transparent 34%),var(--bg);color:#edf6f5;font-family:system-ui,sans-serif}main{max-width:1120px;margin:auto;padding:34px 20px}header{display:flex;justify-content:space-between;align-items:flex-start}h1{font-size:clamp(2.2rem,6vw,4.3rem);line-height:.95;letter-spacing:-.055em;margin:6px 0 12px}.eyebrow{font-size:.72rem;letter-spacing:.18em;color:var(--mint);font-weight:800;margin:0}.sub,small,.legend{color:var(--muted)}button,.ghost,select,input{border-radius:9px;padding:10px;border:1px solid #365761}.ghost,select,input{background:#0b1b22;color:white}.connection{display:flex;gap:13px;align-items:center;background:#132630;border:1px solid var(--line);border-radius:15px;padding:15px 18px;margin:24px 0 18px}.connection i{width:11px;height:11px;border-radius:50%;background:#ffbd72}.connection.online i{background:var(--mint)}.connection div{display:grid}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.probe,.panel{background:linear-gradient(145deg,#182e38,#11242d);border:1px solid var(--line);border-radius:20px;padding:18px}.probe.active{border-color:#3a6956}.probeHead,.ambient,.panelHead{display:flex;justify-content:space-between}.probeHead span,.label{font-size:.75rem;color:var(--muted)}.value{font-size:2.8rem;margin:0;letter-spacing:-.05em}.ambient{border-top:1px solid var(--line);padding-top:13px;margin-top:15px}.target{display:flex;gap:7px;margin-top:18px}.target input{width:70px}.target button,form button{background:var(--mint);color:#102a20;font-weight:800;border:0}.panel{margin-top:16px}canvas{width:100%;height:auto;margin-top:15px}.overlay{position:fixed;inset:0;background:#061015ee;display:grid;place-items:center;padding:20px}.overlay[hidden],[hidden]{display:none!important}form{width:min(100%,380px);background:#182e38;border:1px solid var(--line);border-radius:18px;padding:24px}label{display:grid;gap:5px;margin:14px 0}form input,form button{width:100%}#toast{position:fixed;right:22px;bottom:22px;background:#e8f8ee;color:#173126;padding:13px 17px;border-radius:11px}@media(max-width:850px){.cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){main{padding:22px 10px}.cards{gap:8px}.probe{padding:12px}.value{font-size:2rem}.target{display:grid}.target input{width:100%}}