:root{
  --bg:#0e0f13; --card:#171922; --card2:#1e2130; --text:#f2f3f7; --muted:#9aa0b4;
  --accent:#7c5cff; --accent2:#00d4a6; --danger:#ff5c7a; --radius:18px;
  --grad:linear-gradient(135deg,#7c5cff 0%,#00d4a6 100%);
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;line-height:1.55;min-height:100vh}
.container{max-width:960px;margin:0 auto;padding:0 20px}
a{color:var(--accent2);text-decoration:none}

header{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.logo{font-weight:800;font-size:1.25rem;letter-spacing:-.02em}
.logo span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lang-toggle{background:var(--card);border:1px solid #2a2e40;color:var(--muted);border-radius:999px;padding:6px 14px;cursor:pointer;font-size:.85rem}

.hero{text-align:center;padding:48px 0 32px}
.hero h1{font-size:clamp(1.9rem,5vw,3rem);font-weight:800;letter-spacing:-.03em;line-height:1.15}
.hero h1 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:var(--muted);margin-top:14px;font-size:1.05rem}
.badges{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:20px}
.badge{background:var(--card);border:1px solid #2a2e40;border-radius:999px;padding:6px 14px;font-size:.82rem;color:var(--muted)}
.badge b{color:var(--accent2)}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;padding:24px 0 56px}
.tool-card{background:var(--card);border:1px solid #2a2e40;border-radius:var(--radius);padding:24px;display:block;color:var(--text);transition:transform .15s,border-color .15s}
.tool-card:hover{transform:translateY(-3px);border-color:var(--accent)}
.tool-card .emoji{font-size:2rem}
.tool-card h3{margin:10px 0 6px;font-size:1.1rem}
.tool-card p{color:var(--muted);font-size:.9rem}
.tool-card .tag{display:inline-block;margin-top:12px;font-size:.75rem;border-radius:999px;padding:3px 10px;background:#12281f;color:var(--accent2)}
.tool-card .tag.pro{background:#241a3d;color:var(--accent)}

/* tool page */
.tool-page{max-width:560px;margin:0 auto;padding:24px 0 64px;text-align:center}
.tool-page h1{font-size:1.6rem;letter-spacing:-.02em}
.tool-page .sub{color:var(--muted);margin:8px 0 24px}
.drop{border:2px dashed #3a3f58;border-radius:var(--radius);padding:48px 20px;cursor:pointer;background:var(--card);transition:border-color .15s}
.drop.drag{border-color:var(--accent2)}
.drop .emoji{font-size:2.4rem}
.drop p{color:var(--muted);margin-top:10px}
.btn{display:inline-block;border:0;border-radius:999px;padding:14px 32px;font-size:1rem;font-weight:700;cursor:pointer;background:var(--grad);color:#fff;margin-top:20px}
.btn:disabled{opacity:.45;cursor:default}
.btn.secondary{background:var(--card2);color:var(--text);border:1px solid #2a2e40}
progress{width:100%;height:10px;border-radius:99px;margin-top:20px;accent-color:var(--accent2)}
.status{color:var(--muted);font-size:.9rem;margin-top:10px;min-height:1.4em}
.result{display:none;margin-top:24px;background:var(--card);border-radius:var(--radius);padding:24px;border:1px solid #2a3d35}
.result.show{display:block}
.result h3{color:var(--accent2)}
video.preview{max-width:100%;max-height:360px;border-radius:12px;margin-top:14px;background:#000}
.options{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:18px 0 0}
.opt{background:var(--card);border:1px solid #2a2e40;border-radius:999px;padding:8px 18px;cursor:pointer;font-size:.9rem;color:var(--muted)}
.opt.sel{border-color:var(--accent2);color:var(--text);background:#12281f}
.note{font-size:.8rem;color:var(--muted);margin-top:18px}
footer{border-top:1px solid #23263a;color:var(--muted);font-size:.8rem;text-align:center;padding:24px 0;margin-top:40px}

/* modo embed (tool dentro de iframe em página SEO) */
body.embed .tool-page{padding-top:8px}
body.embed .container{padding:0 12px}

/* waitlist (Fase 0) */
.waitlist{max-width:420px;margin:0 auto;text-align:center}
.waitlist .emoji{font-size:2.2rem}
.waitlist h2{font-size:1.3rem;margin-top:8px}
.waitlist .sub{color:var(--muted);margin-top:10px;font-size:.95rem}
.wa-btn{width:100%;text-align:center;box-sizing:border-box}
.wl-form{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}
.wl-form input{flex:1;min-width:180px;background:var(--card2);border:1px solid #2a2e40;border-radius:999px;padding:12px 18px;color:var(--text);font-size:.95rem}
.wl-form input:focus{outline:2px solid var(--accent)}
.wl-form button{white-space:nowrap}
.wl-msg{margin-top:14px;font-size:.9rem}
.wl-msg.ok{color:var(--accent2)}
.wl-msg.err{color:var(--danger)}
.tool-card .tag.soon{background:#3a2a12;color:#ffb757}

/* hero waitlist (index) */
.hero-waitlist{max-width:420px;margin:26px auto 0}
.hero-waitlist .wl-form{margin-top:12px}