:root{--r:20px;--g:linear-gradient(135deg,#3b3bf0,#7a4bff)}
body{background:radial-gradient(900px 420px at 50% -120px,var(--soft),transparent 70%),var(--bg);-webkit-font-smoothing:antialiased}
header{position:sticky;top:0;z-index:20;backdrop-filter:blur(14px);background:color-mix(in srgb,var(--bg) 82%,transparent);border-bottom:1px solid var(--line)}
a,button,input,select,summary{outline-offset:3px}:focus-visible{outline:2px solid var(--brand)}
main>h1,.tp>h1{letter-spacing:-.02em;line-height:1.1}
.lead{max-width:60ch;font-size:17px;line-height:1.55}
.grp{display:flex;align-items:center;gap:10px;margin:34px 0 12px;font:600 13px Onest,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.grp:after{content:"";flex:1;height:1px;background:var(--line)}
.grid{gap:14px}
.tool{border-radius:var(--r);position:relative;overflow:hidden;gap:6px;padding:18px 18px 18px 78px;min-height:88px;justify-content:center}
.tool svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:44px;height:44px;padding:10px;border-radius:14px;background:var(--soft);color:var(--brand);stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;box-sizing:border-box;transition:.18s}
.tool:hover{transform:translateY(-3px);border-color:var(--brand);box-shadow:var(--shadow)}.tool:hover svg{background:var(--brand);color:#fff}
.tool strong{font-size:16px}.tool span{color:var(--muted);font-size:14px}
.tool .new{position:absolute;top:10px;right:12px;background:var(--g);color:#fff;font:600 10px Onest,sans-serif;padding:3px 8px;border-radius:99px;letter-spacing:.04em}
.card{border-radius:28px;border:1px solid var(--line)}
.drop{border-radius:22px;padding:44px 16px;background:linear-gradient(var(--bg),var(--bg)) padding-box}
.drop b{font-size:18px}
.btn{background:var(--g);border-radius:16px;padding:16px 22px;box-shadow:0 10px 24px -10px rgba(59,59,240,.6)}.btn:disabled{opacity:.6}
.btn.ghost{background:transparent;color:var(--brand);box-shadow:none;border:1px solid var(--line)}
.pp{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:18px}.pp label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--muted)}.pp select,.pp input{font:inherit;padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--ink)}
.bar{height:8px;border-radius:9px;background:var(--line);overflow:hidden;margin-top:14px}.bar i{display:block;height:100%;width:0;background:var(--g);transition:width .2s}
.kv{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px}.kv li{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:12px;background:var(--bg);font-size:14px}.kv b{font-weight:600}.kv span{color:var(--muted);text-align:right;word-break:break-word}
#net{display:inline-block;font-size:12px;padding:3px 10px;border-radius:99px;background:var(--soft);color:var(--brand)}
@media(max-width:600px){.tool{padding-left:72px}.drop{padding:34px 12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.fl{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0 0 12px}.fl a{color:var(--muted);text-decoration:none}.fl a:hover{text-decoration:underline}
.legal h2{margin-top:28px}.legal p{line-height:1.65;max-width:70ch}

/* v2 cards */
.grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));align-items:stretch}
.tool{min-height:96px;gap:4px}
.tool strong{font-size:15px;line-height:1.25;letter-spacing:-.01em;overflow-wrap:anywhere}
.tool span{line-height:1.4}
.tool .new{position:static;align-self:flex-start;order:-1;margin:0 0 4px;font-size:10px;padding:2px 8px}
.grid.mini{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
@media(max-width:560px){.grid{grid-template-columns:1fr}}
