:root{--bg:#0f1420;--card:#1a2233;--line:#2a3650;--txt:#eef2fa;--mut:#9aa7c2;--acc:#38bdf8;--acc2:#818cf8;--ok:#34d399;--err:#f87171;--r:14px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--txt);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.65;font-size:17px}
.wrap{max-width:1080px;margin:0 auto;padding:0 1.25rem}.wrap.narrow{max-width:780px}
a{color:var(--acc)}
/* header */
.zh{background:#0c1120;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.zh-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 1.25rem;flex-wrap:wrap}
.brand{font-weight:800;font-size:1.35rem;color:var(--txt);text-decoration:none}
.bmark{color:var(--acc)}
.znav{display:flex;gap:1rem;flex-wrap:wrap;font-size:.95rem}
.znav a{color:var(--mut);text-decoration:none}.znav a:hover{color:var(--acc)}
/* tool */
.tool{padding:2.2rem 0 .5rem}
.tool-card{background:linear-gradient(135deg,#16213a,#101a30);border:1px solid var(--line);border-radius:20px;padding:1.8rem;box-shadow:0 12px 40px rgba(0,0,0,.35)}
.tabs{display:flex;gap:.6rem;margin-bottom:1.1rem}
.tab{background:#0f1830;border:1px solid var(--line);color:var(--mut);border-radius:999px;padding:.55rem 1.3rem;font-size:1rem;cursor:pointer}
.tab.on{background:linear-gradient(90deg,var(--acc),var(--acc2));color:#06121f;border:none;font-weight:700}
.urlrow{display:flex;gap:.6rem}
#dlurl{flex:1;background:#0b1226;border:1px solid var(--line);border-radius:12px;color:var(--txt);padding:.9rem 1rem;font-size:1.05rem;min-width:0}
#dlurl:focus{outline:2px solid var(--acc);border-color:var(--acc)}
.btn{background:linear-gradient(90deg,var(--acc),var(--acc2));border:none;border-radius:12px;color:#06121f;font-weight:800;font-size:1.05rem;padding:.9rem 1.8rem;cursor:pointer;white-space:nowrap}
.btn:hover{filter:brightness(1.1)}.btn:disabled{opacity:.5;cursor:wait}
.plat-hint{color:var(--mut);font-size:.85rem;margin:.7rem 0 0;text-align:center}
.status{margin-top:1rem;min-height:1.6em;color:var(--mut)}
.status.err{color:var(--err)}.status.ok{color:var(--ok)}
.result{margin-top:1rem;background:#0b1226;border:1px solid var(--line);border-radius:12px;padding:1.2rem;display:flex;gap:1.2rem;flex-wrap:wrap}
.result img{width:180px;border-radius:10px;object-fit:cover}
.rinfo{flex:1;min-width:220px}
.rtitle{font-weight:700;margin:0 0 .8rem}
.dlbtn{display:inline-block;background:var(--ok);color:#052e1f;font-weight:700;text-decoration:none;border-radius:10px;padding:.6rem 1.1rem;margin:.25rem .5rem .25rem 0;font-size:.95rem}
.dlbtn:hover{filter:brightness(1.1)}
.dlbtn.audio{background:var(--acc2);color:#0b1030}
/* content */
.hero{text-align:center;padding:2.5rem 0 1rem}.hero h1{font-size:2.2rem;margin:.2rem 0}
.lead{color:var(--mut);font-size:1.12rem;max-width:640px;margin:0 auto}
h1{font-size:1.9rem}h2{font-size:1.45rem;margin-top:2.2rem}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.9rem;margin:1.2rem 0}
.pcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.2rem .8rem;text-align:center;text-decoration:none;color:var(--txt);display:flex;flex-direction:column;gap:.3rem}
.pcard:hover{border-color:var(--acc);transform:translateY(-2px)}
.pic{font-size:1.9rem}.pname{font-weight:700}.pgo{color:var(--acc);font-size:.85rem}
.steps{padding-left:1.3rem}.steps li{margin:.6rem 0}
.feats{list-style:none;padding:0}.feats li{margin:.7rem 0}
.faqs details{background:var(--card);border:1px solid var(--line);border-radius:10px;margin:.6rem 0;padding:.9rem 1.1rem}
.faqs summary{cursor:pointer;font-weight:600}
.crumbs{color:var(--mut);font-size:.9rem;margin:1.4rem 0 .4rem}
/* footer */
.zf{border-top:1px solid var(--line);margin-top:3rem;background:#0c1120}
.zf-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:1.5rem;padding:1.5rem 0}
.zf ul{list-style:none;padding:0;margin:0}.zf li{margin:.35rem 0}.zf a{color:var(--mut);text-decoration:none;font-size:.93rem}
.zf-b{font-weight:800;font-size:1.1rem;margin:.4rem 0}
.zf-c{text-align:center;color:var(--mut);font-size:.85rem;padding:1rem 0 1.6rem}
/* ads */
.zad{text-align:center;margin:1.4rem auto;max-width:100%}
.zad-l{display:block;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);margin-bottom:.3rem}
.zad-top{background:#0c1120;border-bottom:1px solid var(--line)}
.zad-top .zad{margin:0 auto;padding:.6rem 1rem}
.zad-foot{padding-top:1rem}
.zfad{position:fixed;top:50%;transform:translateY(-50%);z-index:60}
.zfad-l{left:8px}.zfad-r{right:8px}
.zfad .zad{margin:0;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:.5rem;box-shadow:0 4px 18px rgba(0,0,0,.4)}
.zfad-x{position:absolute;top:-10px;right:-10px;width:24px;height:24px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--mut);font-size:16px;line-height:1;cursor:pointer;z-index:61}
@media(max-width:1280px){.zfad{display:none}}
@media(max-width:640px){.urlrow{flex-direction:column}.hero h1{font-size:1.7rem}.zf-grid{grid-template-columns:1fr}}
/* ---- tool UI ---- */
.toolbox{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;margin:1.5rem 0}
.toolbox textarea,.tin{width:100%;background:#0b1226;border:1px solid var(--line);border-radius:10px;color:var(--txt);padding:.8rem;font-size:1rem;font-family:inherit}
.toolbox textarea:focus,.tin:focus{outline:2px solid var(--acc)}
.tin{margin:.4rem 0}
.fin{margin:.6rem 0;color:var(--mut)}
.nin{width:90px;background:#0b1226;border:1px solid var(--line);border-radius:8px;color:var(--txt);padding:.5rem;font-size:1rem}
.btnrow{display:flex;gap:.5rem;flex-wrap:wrap;margin:.8rem 0}
.btn.sm{padding:.55rem 1rem;font-size:.92rem;border-radius:10px}
.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--mut)}
.tstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:.7rem;margin:1rem 0}
.tstat{background:#0b1226;border:1px solid var(--line);border-radius:10px;padding:.8rem;text-align:center}
.tstat b{display:block;font-size:1.4rem;color:var(--acc)}
.tstat span{font-size:.8rem;color:var(--mut)}
.optrow{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;margin:.8rem 0;color:var(--mut)}
.optrow label{display:flex;gap:.4rem;align-items:center}
.frow{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;margin:.8rem 0}
.ans{color:var(--ok);font-size:1.2rem}
.outbox{background:#0b1226;border:1px solid var(--line);border-radius:10px;padding:1rem;margin:.8rem 0;word-break:break-all;min-height:3rem}
.qrout{display:flex;justify-content:center;margin:1rem 0}
.qrout img,.qrout canvas{border-radius:8px;background:#fff;padding:8px}
.mailrow{background:#0b1226;border:1px solid var(--line);border-radius:10px;padding:.8rem;margin:.5rem 0;cursor:pointer}
.mailrow:hover{border-color:var(--acc)}
.mailbody{background:#0b1226;border:1px solid var(--line);border-radius:10px;padding:1rem;margin:.8rem 0;max-height:400px;overflow:auto}
.kwout{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}
.kwchip{background:#0b1226;border:1px solid var(--line);border-radius:999px;padding:.4rem .9rem;font-size:.9rem}
.trendbox{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:1rem;margin:1rem 0}
.trendbox iframe{border-radius:8px;background:#fff}
.smap{columns:2;list-style:none;padding:0}.smap li{margin:.3rem 0;break-inside:avoid}
/* calculator */
.calc{max-width:320px;margin:0 auto}
.cdisp{background:#0b1226;border:1px solid var(--line);border-radius:10px;padding:1rem;font-size:1.8rem;text-align:right;margin-bottom:.7rem;min-height:3.5rem;overflow:hidden}
.cgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
.ck{background:#0b1226;border:1px solid var(--line);border-radius:10px;color:var(--txt);font-size:1.2rem;padding:.9rem;cursor:pointer}
.ck:hover{border-color:var(--acc)}.ck.op{color:var(--acc);font-weight:700}
.ck.eq{background:linear-gradient(90deg,var(--acc),var(--acc2));color:#06121f;font-weight:800;border:none}
.ck.zero{grid-column:span 2}
select.tin{width:auto}
