@import "https://fonts.googleapis.com/css2?family=Orbitron:wght@600;800&family=Share+Tech+Mono&display=swap";:root{--bg:#050312;--bg-2:#0d0a2a;--panel:#08061cd1;--text:#e6f6ff;--muted:#8fa3c7;--cyan:#00f0ff;--magenta:#ff2bd6;--yellow:#f9f871;--border:#00f0ff59;--display:"Orbitron", "Segoe UI", system-ui, sans-serif;--mono:"Share Tech Mono", ui-monospace, SFMono-Regular, Menlo, monospace}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{font:17px/1.6 var(--mono);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}body:before{content:"";z-index:-2;background:radial-gradient(ellipse 80% 50% at 50% 110%, #ff2bd673, transparent 70%), radial-gradient(ellipse 60% 40% at 50% -10%, #00f0ff40, transparent 70%), linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 60%, #1a0636 100%);position:fixed;inset:0}body:after{content:"";z-index:-1;pointer-events:none;mix-blend-mode:overlay;background:repeating-linear-gradient(0deg,#ffffff09 0 1px,#0000 1px 3px);position:fixed;inset:0}.grid{z-index:-1;pointer-events:none;transform-origin:top;background-image:linear-gradient(#00f0ff59 1px,#0000 1px),linear-gradient(90deg,#ff2bd659 1px,#0000 1px);background-size:60px 60px;height:55vh;animation:6s linear infinite grid-scroll;position:fixed;bottom:-10%;left:-50%;right:-50%;transform:perspective(500px)rotateX(62deg);-webkit-mask-image:linear-gradient(#0000,#000 35% 80%,#0000);mask-image:linear-gradient(#0000,#000 35% 80%,#0000)}@keyframes grid-scroll{0%{background-position:0 0,0 0}to{background-position:0 60px,0 0}}.page{flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;min-height:100vh;padding:2rem 1rem;display:flex;position:relative}.card-wrap{filter:drop-shadow(0 0 2px #ff2bd699)drop-shadow(0 0 22px #00f0ff59)drop-shadow(0 0 60px #ff2bd659);width:100%;max-width:600px}.card{background:var(--panel);border:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px));padding:2.75rem 2.5rem;position:relative}.card:before,.card:after{content:"";pointer-events:none;width:60px;height:60px;position:absolute}.card:before{border-top:2px solid var(--cyan);border-left:2px solid var(--cyan);top:-1px;left:-1px;box-shadow:-4px -4px 16px #00f0ff80}.card:after{border-right:2px solid var(--magenta);border-bottom:2px solid var(--magenta);bottom:-1px;right:-1px;box-shadow:4px 4px 16px #ff2bd680}.eyebrow{letter-spacing:.3em;text-transform:uppercase;color:var(--cyan);text-shadow:0 0 8px #00f0ffcc;margin:0 0 .75rem;font-size:.8rem}.eyebrow:before{content:"// ";color:var(--magenta)}h1{font:800 clamp(2rem, 5vw, 3rem)/1.1 var(--display);letter-spacing:.04em;text-transform:uppercase;color:#fff;text-shadow:0 0 6px #fff9,0 0 20px #00f0ff99;margin:0 0 1.25rem;position:relative}h1:before,h1:after{content:attr(data-text);clip-path:inset(0);position:absolute;inset:0;overflow:hidden}h1:before{color:var(--cyan);animation:3.2s step-end infinite glitch-a;transform:translate(-3px)}h1:after{color:var(--magenta);animation:2.7s step-end infinite glitch-b;transform:translate(3px)}@keyframes glitch-a{0%,92%,to{clip-path:inset(100% 0 0)}93%{clip-path:inset(10% 0 70%);transform:translate(-6px,-2px)}95%{clip-path:inset(60% 0 20%);transform:translate(5px,1px)}97%{clip-path:inset(30% 0 50%);transform:translate(-4px,2px)}}@keyframes glitch-b{0%,88%,to{clip-path:inset(100% 0 0)}89%{clip-path:inset(70% 0 5%);transform:translate(6px,1px)}91%{clip-path:inset(20% 0 60%);transform:translate(-5px,-1px)}94%{clip-path:inset(45% 0 35%);transform:translate(4px,2px)}}.lead{color:var(--muted);margin:0 0 2rem}.cta{width:100%;font:700 1.05rem var(--display);letter-spacing:.18em;text-transform:uppercase;color:#0a0518;background:linear-gradient(90deg, var(--cyan), var(--magenta));clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));justify-content:center;align-items:center;gap:.75rem;padding:1.05rem 1.5rem;text-decoration:none;transition:transform .12s,box-shadow .2s,filter .2s;animation:2.4s ease-in-out infinite pulse;display:inline-flex;position:relative;box-shadow:0 0 20px #00f0ff99,0 0 40px #ff2bd680}.cta:hover{filter:brightness(1.12)saturate(1.2);animation-play-state:paused;transform:translateY(-2px);box-shadow:0 0 30px #00f0ffe6,0 0 70px #ff2bd6cc}.cta:active{transform:translateY(1px)}.cta:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}.cta .arrow{transition:transform .15s}.cta:hover .arrow{transform:translate(5px)}@keyframes pulse{0%,to{box-shadow:0 0 20px #00f0ff99,0 0 40px #ff2bd680}50%{box-shadow:0 0 28px #00f0ffe6,0 0 60px #ff2bd6cc}}.divider{color:var(--muted);letter-spacing:.2em;text-transform:uppercase;align-items:center;gap:.75rem;margin:2rem 0 1rem;font-size:.8rem;display:flex}.divider:before,.divider:after{content:"";background:linear-gradient(90deg, transparent, var(--cyan), transparent);opacity:.6;flex:1;height:1px}.manual{color:var(--muted);margin:0 0 .75rem;font-size:.95rem}.manual a{color:var(--cyan);border-bottom:1px dashed var(--cyan);text-shadow:0 0 6px #00f0ff99;text-decoration:none}.manual a:hover{color:var(--yellow);border-color:var(--yellow)}.code-row{gap:.5rem;display:flex}.code-row code{border:1px solid var(--magenta);color:var(--yellow);font:1.15rem var(--mono);letter-spacing:.12em;text-shadow:0 0 10px #f9f871b3;-webkit-user-select:all;user-select:all;background:#ff2bd614;flex:1;padding:.7rem 1rem;box-shadow:inset 0 0 18px #ff2bd633}.code-row button{border:1px solid var(--cyan);color:var(--cyan);font:.85rem var(--display);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;text-shadow:0 0 6px #00f0ff99;background:0 0;padding:0 1.1rem;transition:background .15s,color .15s,box-shadow .15s}.code-row button:hover{background:var(--cyan);color:#0a0518;text-shadow:none;box-shadow:0 0 18px #00f0ffcc}.code-row button:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}footer{color:var(--muted);letter-spacing:.2em;text-transform:uppercase;font-size:.8rem}footer:before{content:"[ ";color:var(--magenta)}footer:after{content:" ]";color:var(--cyan)}@media (width<=480px){.card{padding:2rem 1.25rem}.cta{letter-spacing:.1em;font-size:.95rem}}@media (prefers-reduced-motion:reduce){.grid,.cta,h1:before,h1:after{animation:none}h1:before,h1:after{display:none}}.card-wrap--alt{filter:drop-shadow(0 0 2px #00f0ff99)drop-shadow(0 0 22px #ff2bd659)drop-shadow(0 0 60px #00f0ff4d)}.card--feedback{border-color:#ff2bd666;grid-template-columns:1fr auto;align-items:center;gap:2rem;padding:2.25rem 2.5rem;display:grid}.card--feedback:before{border-color:var(--magenta);box-shadow:-4px -4px 16px #ff2bd680}.card--feedback:after{border-color:var(--cyan);box-shadow:4px 4px 16px #00f0ff80}.eyebrow--alt{color:var(--magenta);text-shadow:0 0 8px #ff2bd6cc}.eyebrow--alt:before{color:var(--cyan)}h2{font:800 clamp(1.4rem, 3vw, 1.8rem)/1.15 var(--display);letter-spacing:.04em;text-transform:uppercase;color:#fff;text-shadow:0 0 6px #ffffff80,0 0 18px #ff2bd699;margin:0 0 .75rem}.card--feedback .lead{margin-bottom:1.5rem}.cta--ghost{width:auto;color:var(--magenta);border:1px solid var(--magenta);clip-path:none;text-shadow:0 0 6px #ff2bd699;background:0 0;padding:.8rem 1.4rem;font-size:.9rem;animation:none;box-shadow:0 0 14px #ff2bd659,inset 0 0 14px #ff2bd626}.cta--ghost:hover{background:var(--magenta);color:#0a0518;text-shadow:none;filter:none;box-shadow:0 0 28px #ff2bd6e6}.qr-frame{border:1px solid var(--cyan);background:#00f0ff0d;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;text-decoration:none;transition:box-shadow .2s,transform .12s;display:flex;position:relative;box-shadow:0 0 18px #00f0ff59,inset 0 0 24px #00f0ff1f}.qr-frame:hover{transform:translateY(-2px);box-shadow:0 0 30px #00f0ffb3,0 0 50px #ff2bd666,inset 0 0 24px #00f0ff2e}.qr-frame:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}.qr-frame:before,.qr-frame:after{content:"";pointer-events:none;width:14px;height:14px;position:absolute}.qr-frame:before{border-top:2px solid var(--magenta);border-left:2px solid var(--magenta);top:-2px;left:-2px}.qr-frame:after{border-right:2px solid var(--magenta);border-bottom:2px solid var(--magenta);bottom:-2px;right:-2px}.qr{width:180px;height:180px;display:block}.qr-bg{fill:#f4fdff}.qr-data{fill:#0a0518}.qr-finder{fill:#a4007f}.qr-finder-ring{stroke:#a4007f}.qr-caption{letter-spacing:.3em;text-transform:uppercase;color:var(--cyan);text-shadow:0 0 8px #00f0ffcc;font-size:.7rem}.qr-caption:before{content:"< ";color:var(--magenta)}.qr-caption:after{content:" >";color:var(--magenta)}@media (width<=560px){.card--feedback{text-align:center;grid-template-columns:1fr;justify-items:center}.card--feedback .feedback-text{width:100%}}
