.top-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0}.top-overlay{position:fixed;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:12vh;pointer-events:none;transition:opacity .4s}.top-overlay.faded{opacity:0;pointer-events:none!important}.top-overlay>*{pointer-events:auto}.top-title{text-align:center;margin-bottom:2rem;user-select:none}.top-title h1{font-size:clamp(2.4rem,6vw,5rem);font-weight:200;letter-spacing:.3em;text-transform:uppercase;color:#fff;text-shadow:0 0 40px rgba(180,120,255,.4),0 0 80px rgba(180,120,255,.15)}.top-tagline{font-size:clamp(.7rem,1.5vw,1rem);letter-spacing:.2em;color:#c8b4ff99;margin-top:.5rem}.top-search-box{position:relative;width:min(90vw,480px)}.top-search-input{width:100%;padding:.8rem 1.2rem;font-size:1rem;font-family:inherit;background:#ffffff0d;border:1px solid rgba(255,255,255,.12);border-radius:8px;color:#fff;outline:none;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:border-color .3s,box-shadow .3s}.top-search-input::placeholder{color:#ffffff4d}.top-search-input:focus{border-color:#b478ff80;box-shadow:0 0 24px #b478ff26}.top-results{position:absolute;top:calc(100% + 4px);left:0;right:0;max-height:280px;overflow-y:auto;background:#0a0814eb;border:1px solid rgba(255,255,255,.08);border-radius:8px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:none}.top-results.open{display:block}.result-item{padding:.6rem 1rem;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.04);transition:background .15s}.result-item:hover{background:#b478ff1a}.result-item .name{color:#c8b0ff;font-weight:500}.result-item .desc{font-size:.8rem;color:#fff6;margin-top:.15rem}.top-stats{margin-top:1.5rem;font-size:.8rem;letter-spacing:.15em;color:#ffffff4d;user-select:none}.top-scroll-hint{position:fixed;bottom:3rem;left:50%;transform:translate(-50%);z-index:12;user-select:none;pointer-events:none;transition:opacity .5s}.scroll-arrow{display:block;font-size:1.4rem;color:#ffffff40;animation:top-bounce 2s infinite}@keyframes top-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(8px)}}.top-area51{position:fixed;bottom:0;left:50%;transform:translate(-50%);z-index:15;display:flex;flex-direction:column;align-items:center;pointer-events:none;padding-bottom:1.2rem;transition:opacity .4s}.area51-pulse{width:120px;height:4px;background:radial-gradient(ellipse at center,rgba(80,200,255,.5),transparent 70%);margin-bottom:.5rem;transition:all .3s}.area51-pulse.active{width:200px;height:6px;background:radial-gradient(ellipse at center,rgba(80,255,180,.9),rgba(80,200,255,.4) 50%,transparent 80%);box-shadow:0 0 30px #50ffb466}.area51-label{display:flex;align-items:center;gap:.5rem;user-select:none}.a51-icon{color:#50c8ff99;font-size:.7rem}.a51-name{font-size:.85rem;font-weight:600;letter-spacing:.15em;color:#50c8ffb3}.a51-path{font-size:.65rem;color:#fff3}.top-install-log{margin-top:.4rem;font-size:.75rem;color:#50ffb4b3;height:1.2em;transition:opacity .5s;text-align:center}.top-tooltip{position:fixed;z-index:100;padding:.5rem .8rem;background:#0a0814e6;border:1px solid rgba(180,120,255,.3);border-radius:6px;font-size:.8rem;pointer-events:none;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);max-width:260px;transition:opacity .15s}.top-tooltip.hidden{opacity:0}.tt-name{color:#c8b0ff;font-weight:600}.tt-desc{color:#ffffff80;margin-top:.2rem}.top-pkg-labels{position:fixed;inset:0;z-index:8;pointer-events:none;overflow:hidden}.pkg-label{position:absolute;white-space:nowrap;font-size:.65rem;color:#c8b4ff80;pointer-events:auto;cursor:pointer;user-select:none;transition:color .2s;will-change:transform}.pkg-label:before{content:"";position:absolute;right:100%;top:50%;width:20px;height:1px;background:linear-gradient(to left,rgba(200,180,255,.25),transparent);margin-right:4px}.pkg-label:hover{color:#c8b4ffe6}.top-modal-backdrop{position:fixed;inset:0;z-index:19;cursor:pointer;background:#03020a66;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.top-pkg-detail{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.9);z-index:25;width:min(90vw,440px);background:#05030feb;border:1px solid rgba(180,120,255,.25);border-radius:12px;padding:2rem;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);opacity:0;pointer-events:none;transition:opacity .5s,transform .5s}.top-pkg-detail.visible{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}.top-pkg-detail-close{position:absolute;top:.8rem;right:.8rem;background:none;border:none;color:#ffffff4d;font-size:1.4rem;cursor:pointer;line-height:1;padding:.2rem .4rem;transition:color .2s}.top-pkg-detail-close:hover{color:#fffc}.top-pkg-detail h2{font-size:1.4rem;font-weight:300;letter-spacing:.15em;color:#c8b0ff;margin-bottom:.3rem}.top-pkg-detail .pd-desc{font-size:.85rem;color:#ffffff73;margin-bottom:1.5rem}.top-pkg-detail .pd-section{margin-bottom:1.2rem}.top-pkg-detail .pd-section h3{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.15em;color:#50c8ff99;margin-bottom:.4rem}.top-pkg-detail .pd-note{font-size:.75rem;color:#ffffff4d;margin-top:.4rem}.top-pkg-detail pre{background:#ffffff0a;border:1px solid rgba(255,255,255,.06);border-radius:6px;padding:.6rem .8rem;overflow-x:auto}.top-pkg-detail code{font-size:.8rem;color:#50ffb4cc}.top-area51-detail{position:fixed;right:5vw;top:50%;transform:translateY(-50%) translate(40px);z-index:20;width:min(90vw,420px);max-height:80vh;overflow-y:auto;background:#05030fe0;border:1px solid rgba(80,200,255,.2);border-radius:12px;padding:2rem;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);opacity:0;pointer-events:none;transition:opacity .6s,transform .6s}.top-area51-detail.visible{opacity:1;pointer-events:auto;transform:translateY(-50%) translate(0)}.top-area51-detail h2{font-size:1.6rem;font-weight:300;letter-spacing:.2em;color:#50c8ffe6;margin-bottom:.2rem}.a51-subtitle{font-size:.8rem;color:#ffffff59;letter-spacing:.1em;margin-bottom:1.5rem}.a51-section{margin-bottom:1.5rem}.a51-section h3{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.15em;color:#50c8ff99;margin-bottom:.5rem}.a51-section p{font-size:.8rem;color:#ffffff80;line-height:1.5;margin-top:.4rem}.a51-section strong{color:#b478ffcc;font-weight:500}.a51-section pre{background:#ffffff0a;border:1px solid rgba(255,255,255,.06);border-radius:6px;padding:.6rem .8rem;overflow-x:auto}.a51-section code{font-size:.78rem;color:#50ffb4cc}.a51-flow{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.8rem 0}.a51-node{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:#e0e0e0}.a51-node-icon{font-size:.7rem}.a51-node-desc{font-size:.7rem;color:#ffffff4d}.a51-arrow{font-size:1rem;color:#50c8ff80}.top-area51-close{position:absolute;top:.8rem;right:.8rem;background:none;border:none;color:#ffffff4d;font-size:1.4rem;cursor:pointer;line-height:1;padding:.2rem .4rem;transition:color .2s}.top-area51-close:hover{color:#fffc}.top-content{position:relative;z-index:5;margin-top:100vh;background:linear-gradient(to bottom,transparent 0%,rgba(3,2,10,.85) 5%,rgba(3,2,10,.95) 15%,rgb(3,2,10) 30%);padding-top:6rem}.top-content section{padding:4rem 0}.section-inner{max-width:800px;margin:0 auto;padding:0 2rem}.top-content section h2{font-size:1.6rem;font-weight:300;letter-spacing:.15em;color:#c8b4ffd9;margin-bottom:1.5rem}.top-content section p{font-size:.9rem;line-height:1.7;color:#ffffff8c}.top-content section strong{color:#b478ffcc;font-weight:500}.flow-diagram{display:flex;flex-direction:column;align-items:center;gap:.6rem;margin:2rem 0;padding:1.5rem;background:#ffffff05;border:1px solid rgba(255,255,255,.05);border-radius:10px}.flow-node{display:flex;align-items:center;gap:.8rem}.flow-icon{font-size:1.2rem}.flow-icon.bh{color:#b478ffcc}.flow-icon.earth{color:#50c8ffcc}.flow-title{font-size:1rem;font-weight:500;color:#e0e0e0}.flow-desc{font-size:.75rem;color:#ffffff4d}.flow-arrow{color:#50c8ff80;font-size:.9rem}.flow-arrow code{font-size:.75rem;color:#50ffb499;margin-left:.5rem}.code-block{background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:1.2rem 1.5rem;overflow-x:auto}.code-block code{font-size:.82rem;color:#50ffb4cc;line-height:1.8}.c-comment{color:#ffffff40}.top-package-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;margin-top:1rem}.pkg-card{background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:1rem;transition:border-color .2s,background .2s,transform .2s,box-shadow .2s;cursor:pointer}.pkg-card:hover{border-color:#b478ff4d;background:#b478ff0d;transform:translateY(-2px);box-shadow:0 4px 16px #b478ff1a}.pkg-card:active{transform:translateY(0)}.pkg-card .pkg-name{font-size:.9rem;font-weight:500;color:#c8b0ff;margin-bottom:.3rem}.pkg-card .pkg-desc{font-size:.75rem;color:#ffffff59;line-height:1.4}.top-footer{padding:3rem 0;text-align:center;border-top:1px solid rgba(255,255,255,.04)}.top-footer p{font-size:.8rem;color:#ffffff40;letter-spacing:.1em}.top-footer .footer-sub{font-size:.7rem;color:#50c8ff4d;margin-top:.3rem}.copy-btn{position:absolute;top:.4rem;right:.4rem;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:4px;color:#ffffff59;font-family:inherit;font-size:.65rem;padding:.2rem .5rem;cursor:pointer;transition:all .2s}.copy-btn:hover{background:#ffffff1f;color:#ffffffb3}.copy-btn.copied{color:#50ffb4cc;border-color:#50ffb44d}
