*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --green:#00FF41;--green-dim:#00B32A;--green-dark:#003B0D;
  --green-bg:#030D05;--black:#0A0A0A;--red:#B5001C;
  --font:'Courier Prime','Courier New',Courier,monospace;
}
html,body{width:100%;min-height:100%;background:var(--black);color:var(--green);font-family:var(--font);overflow-x:hidden}
#matrix-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0;opacity:.15}
.grain{
  position:fixed;inset:-50%;width:200%;height:200%;z-index:1;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity:.03;animation:grain .4s steps(1) infinite
}
@keyframes grain{
  0%{transform:translate(0,0)}10%{transform:translate(-2%,-3%)}20%{transform:translate(3%,2%)}
  30%{transform:translate(-1%,4%)}40%{transform:translate(4%,-1%)}50%{transform:translate(-3%,3%)}
  60%{transform:translate(2%,-4%)}70%{transform:translate(-4%,2%)}80%{transform:translate(1%,-2%)}
  90%{transform:translate(3%,-3%)}100%{transform:translate(0,0)}
}
.scanlines{position:fixed;inset:0;z-index:1;pointer-events:none;background:repeating-linear-gradient(to bottom,transparent,transparent 2px,rgba(0,0,0,.06) 2px,rgba(0,0,0,.06) 4px)}
.wrapper{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 20px}
.hidden{display:none!important}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.blink-cursor{animation:blink .8s step-end infinite}
@keyframes fade-up{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* BOOT */
.boot-screen{width:100%;max-width:560px;padding:20px 10px}
.boot-logo{font-size:clamp(48px,14vw,90px);font-weight:700;color:var(--green);letter-spacing:10px;margin-bottom:36px;text-shadow:0 0 24px rgba(0,255,65,.55);line-height:1}
.boot-text{font-family:var(--font);font-size:clamp(12px,3vw,15px);line-height:2;color:var(--green-dim);white-space:pre-wrap;word-break:break-word}

/* MAIN */
.main-content{width:100%;max-width:520px;display:flex;flex-direction:column;gap:24px;animation:fade-up .5s ease forwards}
.header{text-align:center}
.logo{font-size:clamp(64px,20vw,108px);font-weight:700;letter-spacing:16px;color:var(--green);text-shadow:0 0 32px rgba(0,255,65,.45);position:relative;display:inline-block;line-height:1}
.glitch::before,.glitch::after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;letter-spacing:inherit;font-size:inherit;font-weight:inherit}
.glitch::before{color:var(--red);clip-path:polygon(0 0,100% 0,100% 33%,0 33%);left:3px;animation:gt 4s infinite}
.glitch::after{color:#00E5FF;clip-path:polygon(0 67%,100% 67%,100% 100%,0 100%);left:-3px;animation:gb 4s infinite}
@keyframes gt{0%,84%,96%,100%{transform:none;opacity:0}85%{transform:translate(-3px,0);opacity:.85}86%{transform:translate(3px,0);opacity:.85}87%{transform:translate(0,1px);opacity:.85}88%{transform:translate(-1px,0);opacity:.85}89%{transform:none;opacity:0}}
@keyframes gb{0%,80%,94%,100%{transform:none;opacity:0}81%{transform:translate(3px,0);opacity:.7}82%{transform:translate(-3px,1px);opacity:.7}83%{transform:translate(1px,0);opacity:.7}84%{transform:translate(-1px,-1px);opacity:.7}85%{transform:none;opacity:0}}
.tagline{font-size:clamp(9px,2.4vw,12px);color:var(--green-dim);letter-spacing:4px;margin-top:8px;text-transform:uppercase}

/* SYSTEM BLOCK */
.system-block{border:1px solid var(--green-dark);padding:16px 18px;background:rgba(0,15,4,.55);backdrop-filter:blur(4px)}
.sys-line{font-size:clamp(11px,2.6vw,14px);color:var(--green-dim);line-height:2}
.prompt{color:var(--green);margin-right:6px}

/* FORM */
.form-container{border:1px solid var(--green-dark);padding:24px 20px;background:rgba(0,15,4,.45);backdrop-filter:blur(4px)}
.form-header{margin-bottom:22px;text-align:center;border-bottom:1px solid var(--green-dark);padding-bottom:14px}
.form-header-line{font-size:clamp(10px,2.4vw,12px);color:var(--green);letter-spacing:2px}
.field-group{margin-bottom:20px}
.field-label{display:block;font-size:clamp(10px,2.2vw,12px);color:var(--green-dim);letter-spacing:1px;margin-bottom:7px}
input[type=text],input[type=tel],input[type=email]{
  width:100%;background:var(--green-bg);border:1px solid var(--green-dark);
  color:var(--green);font-family:var(--font);font-size:clamp(13px,3.2vw,15px);
  padding:13px 14px;outline:none;transition:border-color .2s,box-shadow .2s;
  border-radius:0;-webkit-appearance:none;appearance:none;
  -webkit-text-fill-color:var(--green);caret-color:var(--green)
}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px var(--green-bg) inset;-webkit-text-fill-color:var(--green)}
input::placeholder{color:#163D1E;font-family:var(--font)}
input:focus{border-color:var(--green);box-shadow:0 0 10px rgba(0,255,65,.15)}
input.has-error{border-color:var(--red);box-shadow:0 0 8px rgba(181,0,28,.25)}
.field-error{display:block;font-size:11px;color:var(--red);margin-top:6px;min-height:15px}

/* LOADING */
.loading-container{margin-bottom:18px}
.loading-label{font-size:12px;color:var(--green-dim);margin-bottom:8px;letter-spacing:1px;animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
.loading-bar-track{width:100%;height:3px;background:var(--green-dark);overflow:hidden}
.loading-bar{height:100%;width:0%;background:linear-gradient(90deg,var(--green-dim),var(--green));box-shadow:0 0 10px rgba(0,255,65,.7);transition:width .08s linear}
.loading-pct{font-size:10px;color:var(--green-dim);text-align:right;margin-top:5px;letter-spacing:1px}

/* SUBMIT BTN */
.submit-btn{width:100%;background:var(--green);color:var(--black);border:1px solid var(--green);font-family:var(--font);font-size:clamp(13px,3vw,15px);font-weight:700;letter-spacing:4px;padding:17px 24px;cursor:pointer;transition:background .15s,color .15s,box-shadow .15s,transform .1s;text-transform:uppercase;border-radius:0;-webkit-appearance:none;appearance:none;margin-top:4px}
.submit-btn:hover:not(:disabled){background:transparent;color:var(--green);box-shadow:0 0 16px rgba(0,255,65,.25)}
.submit-btn:active:not(:disabled){transform:scale(.985)}
.submit-btn:disabled{opacity:.45;cursor:not-allowed}
.legal-text{font-size:10px;color:#1A4422;text-align:center;margin-top:18px;line-height:1.7}

/* CONFIRMATION */
.confirmation{border:1px solid var(--green-dark);padding:32px 24px;background:rgba(0,15,4,.55);backdrop-filter:blur(4px);animation:fade-up .4s ease forwards}
.confirm-line{font-size:clamp(13px,3.2vw,16px);color:var(--green);line-height:2.1;min-height:1.6em}
.confirm-line::before{content:'> ';color:var(--green-dim)}
.confirm-blink::after{content:'_';animation:blink .8s step-end infinite;color:var(--green)}

/* REDIRECT BTN */
.redirect-btn{
  display:block;width:100%;margin-top:28px;padding:16px 24px;
  background:transparent;color:var(--green);border:1px solid var(--green);
  font-family:var(--font);font-size:clamp(13px,3vw,15px);font-weight:700;
  letter-spacing:4px;text-align:center;text-decoration:none;text-transform:uppercase;
  transition:background .15s,color .15s,box-shadow .15s;
  animation:fade-up .5s ease .8s both
}
.redirect-btn:hover{background:var(--green);color:var(--black);box-shadow:0 0 16px rgba(0,255,65,.3)}

/* RESPONSIVE */
@media(max-width:380px){
  .wrapper{padding:16px 14px}
  .form-container,.system-block,.confirmation{padding:18px 14px}
  .logo{letter-spacing:10px}
}
@media(prefers-reduced-motion:reduce){
  .grain,.loading-label{animation:none}
  .glitch::before,.glitch::after{animation:none;opacity:0}
  .main-content,.redirect-btn{animation:none}
}