*{box-sizing:border-box;margin:0;padding:0}body,html,#app{color:#fff;background:#000;width:100%;height:100%;overflow:hidden}#app{position:relative}.nav-form{-webkit-backdrop-filter:blur(12px);background:#111111d1;border:1px solid #ffffff2e;border-radius:999px;align-items:center;gap:.75rem;width:min(90vw,32rem);padding:.7rem .9rem .7rem 1.1rem;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 18px 45px #00000061}.nav-input{color:#fff;letter-spacing:.02em;background:0 0;border:none;outline:none;flex:1;min-width:0;font-size:1rem}.nav-input::placeholder{color:#ffffff9e}.nav-button{color:#111827;cursor:pointer;background:linear-gradient(135deg,#fff,#cfe2ff);border:none;border-radius:999px;padding:.72rem 1.2rem;font-size:.95rem;font-weight:700;transition:transform .15s,box-shadow .15s;box-shadow:0 8px 20px #fff3}.nav-button:hover{transform:translateY(-1px)}.nav-button:active{transform:translateY(0)}canvas{width:100%;height:100%;display:block}.overlay{-webkit-backdrop-filter:blur(8px);letter-spacing:.04em;color:#fff;z-index:1;pointer-events:none;background:#00000080;place-items:center;font-size:1.5rem;font-weight:600;display:grid;position:absolute;inset:0}