.tf{position:fixed;inset:0;z-index:1000;background:radial-gradient(900px 500px at 50% 0%,#16351299,transparent),#0b0b0b;color:#fff;opacity:0;pointer-events:none;transition:opacity .25s;font-family:Poppins,system-ui,sans-serif}
.tf.open{opacity:1;pointer-events:auto}
.tf-bar{position:absolute;top:0;left:0;right:0;height:4px;background:#1c1c1c}
.tf-fill{height:100%;width:0;background:#1A8210;transition:width .4s ease}
.tf-x{position:absolute;top:18px;right:20px;width:42px;height:42px;border-radius:50%;border:1px solid #2e2e2e;background:#141414;color:#ddd;font-size:24px;line-height:1;cursor:pointer;z-index:3;font-family:inherit}
.tf-x:hover{border-color:#1A8210;color:#fff}
.tf-stage{position:absolute;inset:0;overflow:hidden}
.tf-step{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;max-width:720px;margin:0 auto;padding:80px 28px;opacity:0;transform:translateY(40px);pointer-events:none;transition:opacity .35s ease,transform .35s ease;overflow-y:auto}
.tf-step.on{opacity:1;transform:none;pointer-events:auto}
.tf-step.up{transform:translateY(-40px)}
.tf-step.down{transform:translateY(40px)}
.tf-intro{align-items:flex-start}
.tf-intro h2{font-size:clamp(30px,4.4vw,46px);font-weight:800;line-height:1.1;letter-spacing:-.02em;margin:18px 0 14px}
.tf-intro p{font-size:clamp(16px,1.8vw,20px);color:#bdbdbd;max-width:560px}
.tf-proof{color:#F5B301;font-size:15px;letter-spacing:2px}
.tf-proof span{color:#fff;letter-spacing:0;font-weight:600;margin-left:6px}
.tf-q{display:flex;gap:12px;align-items:flex-start}
.tf-num{color:#7ee06f;font-size:15px;font-weight:600;white-space:nowrap;margin-top:8px}
.tf-num b{font-size:13px}
.tf-q h2{font-size:clamp(22px,3vw,30px);font-weight:600;line-height:1.3;letter-spacing:-.01em}
.tf-q h2 i{color:#7ee06f;font-style:normal}
.tf-hint{color:#9a9a9a;font-size:16px;margin:8px 0 0 calc(12px + 2.2em)}
.tf-in,.tf-opts,.tf-two,.tf-act,.tf-err,.tf-consent{margin-left:calc(12px + 2.2em)}
.tf-two .tf-in{margin-left:0}
.tf-in{display:block;width:calc(100% - 12px - 2.2em);margin-top:30px;background:transparent;border:0;border-bottom:2px solid #3a3a3a;color:#fff;font-family:inherit;font-size:clamp(20px,2.6vw,28px);padding:6px 0 10px;outline:none;resize:none;transition:border-color .2s}
.tf-in::placeholder{color:#5b5b5b}
.tf-in:focus{border-bottom-color:#1A8210}
.tf-two{display:grid;grid-template-columns:1fr 1fr;gap:24px;width:calc(100% - 12px - 2.2em)}
.tf-two .tf-in{width:100%}
.tf-opts{display:flex;flex-direction:column;gap:10px;margin-top:28px;max-width:440px}
.tf-opt{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:rgba(26,130,16,.08);border:1px solid rgba(126,224,111,.35);border-radius:8px;color:#fff;font-family:inherit;font-size:17px;padding:10px 14px;cursor:pointer;transition:background .15s,border-color .15s}
.tf-opt:hover{background:rgba(26,130,16,.18)}
.tf-opt kbd{flex:none;width:26px;height:26px;border:1px solid rgba(126,224,111,.6);border-radius:4px;display:grid;place-items:center;font-size:12px;font-weight:700;font-family:inherit;color:#7ee06f;background:#0b0b0b}
.tf-opt span{flex:1}
.tf-opt em{font-style:normal;color:#7ee06f;opacity:0;font-weight:700}
.tf-opt.sel{background:rgba(26,130,16,.28);border-color:#7ee06f}
.tf-opt.sel kbd{background:#1A8210;color:#fff;border-color:#1A8210}
.tf-opt.sel em{opacity:1}
.tf-opt.blink{animation:tfblink .42s}
@keyframes tfblink{0%,100%{background:rgba(26,130,16,.28)}25%,75%{background:rgba(26,130,16,.08)}50%{background:rgba(26,130,16,.32)}}
.tf-err{color:#ff8a8a;font-size:14px;min-height:20px;margin-top:10px}
.tf-act{display:flex;align-items:center;gap:14px;margin-top:18px}
.tf-intro .tf-act{margin-left:0;margin-top:30px}
.tf-ok{display:inline-flex;align-items:center;gap:8px;background:#1A8210;color:#fff;border:0;border-radius:8px;padding:12px 22px;font-family:inherit;font-size:18px;font-weight:700;cursor:pointer;box-shadow:0 8px 24px rgba(26,130,16,.35);transition:background .15s}
.tf-ok:hover{background:#22a315}
.tf-ok:disabled{opacity:.7;cursor:default}
.tf-act small{color:#8a8a8a;font-size:13px}
.tf-act small b{color:#cfcfcf;font-weight:600}
.tf-consent{font-size:12px;color:#7d7d7d;margin-top:22px;max-width:560px;line-height:1.5}
.tf-consent a{color:#7ee06f}
.tf-nav{position:absolute;right:20px;bottom:20px;display:flex;gap:2px;z-index:3}
.tf-nav button{width:40px;height:36px;border:0;background:#1A8210;color:#fff;font-size:18px;cursor:pointer;font-family:inherit}
.tf-nav button:first-child{border-radius:8px 0 0 8px}
.tf-nav button:last-child{border-radius:0 8px 8px 0}
.tf-nav button:disabled{opacity:.4;cursor:default}
.tf-brand{position:absolute;left:24px;bottom:26px;font-size:13px;color:#6f6f6f;font-weight:600;z-index:3}
@media(max-width:600px){
.tf-step{padding:72px 20px 90px;justify-content:flex-start;padding-top:96px}
.tf-hint,.tf-in,.tf-opts,.tf-two,.tf-act,.tf-err,.tf-consent{margin-left:0}
.tf-in,.tf-two{width:100%}
.tf-two{grid-template-columns:1fr;gap:0}
.tf-q{flex-direction:column;gap:4px}
.tf-num{margin-top:0}
.tf-opts{max-width:none}
.tf-act small{display:none}
.tf-brand{display:none}
}

.tf-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;margin:26px 0 0 calc(12px + 2.2em);width:calc(100% - 12px - 2.2em)}
.tf-field{display:flex;flex-direction:column;gap:2px}
.tf-field.wide{grid-column:1/-1}
.tf-field span{font-size:13px;color:#9a9a9a;font-weight:600;letter-spacing:.02em}
.tf-field span i{color:#7ee06f;font-style:normal}
.tf-grid .tf-in{margin:0;width:100%;font-size:clamp(18px,2vw,22px);padding:6px 0 8px}
.tf-grid .tf-in.bad{border-bottom-color:#ff8a8a}
@media(max-width:600px){.tf-grid{grid-template-columns:1fr;margin-left:0;width:100%;gap:14px}}
