:root{--ink: #cfe0ff;--dim: #7d8db8}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#03030a;color:var(--ink);font-family:Helvetica Neue,Helvetica,Arial,system-ui,sans-serif}#scene{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;background:radial-gradient(ellipse at 50% 45%,#0b0a1f,#050410 45%,#010008)}#hud{position:fixed;top:24px;left:28px;z-index:10;pointer-events:none;text-shadow:0 2px 18px rgba(0,0,0,.8)}#hud h1{margin:0;font-size:26px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;background:linear-gradient(90deg,#fff,#9db8ff 60%,#c79bff);-webkit-background-clip:text;background-clip:text;color:transparent}#hud p{margin:6px 0 0;font-size:13px;letter-spacing:.08em;color:var(--dim)}#connector{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:15;pointer-events:none}#connector-line{stroke:#aac8ff8c;stroke-width:1.2;stroke-dasharray:5 6;filter:drop-shadow(0 0 4px rgba(140,180,255,.7));opacity:0;transition:opacity .6s ease}#connector-line.show{opacity:1}#pip{position:fixed;right:28px;bottom:28px;z-index:20;width:220px;height:220px;border-radius:14px;overflow:hidden;background:#0608168c;border:1px solid rgba(150,180,255,.25);box-shadow:0 10px 40px #0009,inset 0 0 30px #506ec81f;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transform:translateY(12px) scale(.97);transition:opacity .7s ease,transform .7s ease}#pip.show{opacity:1;transform:translateY(0) scale(1)}#pip.hidden{display:block}#pip-canvas{width:100%;height:100%;display:block}#pip-label{position:absolute;left:12px;bottom:10px;display:flex;flex-direction:column;line-height:1.3;text-shadow:0 1px 8px rgba(0,0,0,.9);pointer-events:none}#pip-name{font-size:13px;font-weight:600;letter-spacing:.12em;color:#eaf1ff}#pip-type{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}