*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#070712;--surface:rgba(255,255,255,.04);--border:rgba(255,255,255,.08);
  --text:#f1f5f9;--muted:#94a3b8;--primary:#ef4444;--primary-2:#f59e0b;--wa:#25d366;
}
html,body{background:var(--bg);color:var(--text);font-family:'Inter',sans-serif;min-height:100vh;overflow-x:hidden}
body{position:relative}
.bg-orb{position:fixed;border-radius:50%;filter:blur(100px);opacity:.35;z-index:0;pointer-events:none;animation:float 18s ease-in-out infinite}
.orb1{width:500px;height:500px;background:#ef4444;top:-200px;left:-150px}
.orb2{width:450px;height:450px;background:#f59e0b;bottom:-150px;right:-100px;animation-delay:-6s}
.orb3{width:380px;height:380px;background:#8b5cf6;top:40%;left:45%;animation-delay:-12s}
@keyframes float{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(1.1)}}

.nav{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:20px 32px;flex-wrap:wrap;gap:16px}
.brand{display:flex;align-items:center;gap:14px}
.logo{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,#ef4444,#f59e0b);display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk';font-weight:700;font-size:18px;box-shadow:0 8px 30px rgba(239,68,68,.4)}
.brand-text h1{font-family:'Space Grotesk';font-size:18px;font-weight:700;letter-spacing:.5px}
.brand-text span{font-size:12px;color:var(--muted)}
.wa-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:12px;background:var(--wa);color:#fff;text-decoration:none;font-weight:600;font-size:14px;transition:transform .2s,box-shadow .2s;box-shadow:0 6px 20px rgba(37,211,102,.35)}
.wa-btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(37,211,102,.5)}

main{position:relative;z-index:2;max-width:1100px;margin:0 auto;padding:40px 24px 80px}
.hero{text-align:center;margin-bottom:40px;animation:fadeUp .8s ease}
.hero h2{font-family:'Space Grotesk';font-size:clamp(32px,5vw,56px);font-weight:700;line-height:1.1;margin-bottom:16px}
.grad{background:linear-gradient(135deg,#ef4444,#f59e0b,#8b5cf6);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:var(--muted);font-size:16px;max-width:600px;margin:0 auto 36px}

.input-card{display:flex;gap:10px;max-width:700px;margin:0 auto;background:var(--surface);backdrop-filter:blur(20px);border:1px solid var(--border);padding:10px;border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.input-card input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:15px;padding:12px 16px}
.input-card input::placeholder{color:var(--muted)}
.btn-primary{position:relative;background:linear-gradient(135deg,#ef4444,#f59e0b);color:#fff;border:none;padding:14px 28px;border-radius:12px;font-weight:600;font-size:15px;cursor:pointer;transition:transform .2s,box-shadow .2s;display:flex;align-items:center;gap:10px}
.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 30px rgba(239,68,68,.5)}
.btn-primary:disabled{opacity:.7;cursor:wait}
.spinner{display:none;width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}
.btn-primary.loading .spinner{display:inline-block}
.btn-primary.loading .btn-label{opacity:.7}
@keyframes spin{to{transform:rotate(360deg)}}

.status{margin-top:18px;font-size:14px;min-height:20px}
.status.error{color:#fca5a5}
.status.info{color:#93c5fd}
.status.success{color:#86efac}

.result{display:grid;grid-template-columns:1fr 1fr;gap:32px;background:var(--surface);backdrop-filter:blur(20px);border:1px solid var(--border);border-radius:24px;padding:32px;animation:fadeUp .6s ease}
.result.hidden{display:none}
@media(max-width:800px){.result{grid-template-columns:1fr}}
.thumb-wrap img{width:100%;border-radius:16px;display:block;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.thumb-wrap .btn-ghost{margin-top:14px;width:100%}
.info h3{font-family:'Space Grotesk';font-size:22px;margin-bottom:10px;line-height:1.3}
.meta{display:flex;gap:16px;color:var(--muted);font-size:13px;margin-bottom:20px;flex-wrap:wrap}
.desc-wrap,.downloads{margin-bottom:20px}
.desc-wrap label,.downloads label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:8px;font-weight:600}
.desc-wrap textarea{width:100%;min-height:120px;max-height:220px;background:rgba(0,0,0,.3);border:1px solid var(--border);border-radius:12px;padding:12px;color:var(--text);font-family:inherit;font-size:13px;resize:vertical;margin-bottom:10px}
.btn-ghost{background:rgba(255,255,255,.06);border:1px solid var(--border);color:var(--text);padding:10px 16px;border-radius:10px;cursor:pointer;font-weight:500;font-size:13px;transition:background .2s}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.download-list{display:flex;flex-direction:column;gap:8px}
.dl-item{display:flex;justify-content:space-between;align-items:center;background:rgba(0,0,0,.3);border:1px solid var(--border);border-radius:10px;padding:10px 14px;font-size:13px}
.dl-item a{color:#fbbf24;text-decoration:none;font-weight:600;padding:6px 12px;border-radius:8px;background:rgba(251,191,36,.15);transition:background .2s}
.dl-item a:hover{background:rgba(251,191,36,.3)}
.dl-item .q{font-weight:600}
.dl-item .t{color:var(--muted);font-size:11px}

footer{position:relative;z-index:2;text-align:center;padding:24px;color:var(--muted);font-size:13px;border-top:1px solid var(--border)}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
