:root{--bg:#f5f6fb;--card:#fff;--ink:#12142b;--t:#3b4160;--m:#6b7194;--b:#e3e6f2;--p:#5b4bdb;--pd:#4636c0;--g:#12b886;--w:#ff7a59;--r:16px}
@media(prefers-color-scheme:dark){:root{--bg:#0d0f1f;--card:#161a33;--ink:#f1f3ff;--t:#c3c8e6;--m:#8f95bb;--b:#272c52;--p:#8b7dff;--pd:#7566f0}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--t);line-height:1.65;font-size:16px}
h1,h2,h3{font-family:Sora,"DM Sans",system-ui,sans-serif;color:var(--ink);line-height:1.2;margin:0 0 .6rem;letter-spacing:-.02em}
h1{font-size:clamp(1.7rem,5vw,2.6rem)}h2{font-size:1.4rem;margin-top:2rem}h3{font-size:1.05rem;margin-top:1.2rem}
a{color:var(--p)}.wrap{max-width:1040px;margin:auto;padding:1rem}
.hd{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 85%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--b)}
.hd .in{max-width:1040px;margin:auto;display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem}
.logo{display:flex;align-items:center;gap:.5rem;font:800 1.2rem Sora,sans-serif;color:var(--ink);text-decoration:none;margin-right:auto}.logo img{width:30px;height:30px}
nav{display:flex;gap:.2rem}nav a{padding:.45rem .8rem;border-radius:99px;color:var(--t);text-decoration:none;transition:.2s}nav a:hover{background:var(--b);color:var(--ink)}
#cur{width:auto;padding:.35rem .5rem;border-radius:10px}#burger{display:none;background:var(--card);border:1px solid var(--b);color:var(--ink);border-radius:10px;font-size:1.2rem;padding:.2rem .6rem}
.crumb{font-size:.88rem;color:var(--m);margin-bottom:.5rem}.crumb a{text-decoration:none}.lead{font-size:1.1rem;max-width:720px}
.hero{padding:2.5rem 1rem 1.5rem;text-align:center;background:radial-gradient(60% 80% at 50% 0,#5b4bdb26,transparent)}.hero p{max-width:620px;margin:0 auto 1.2rem;font-size:1.1rem}
.hero input{max-width:420px;margin:auto;padding:.8rem 1.1rem;border-radius:99px;box-shadow:0 6px 24px #5b4bdb1f}
.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.tool{display:block;background:var(--card);border:1px solid var(--b);border-radius:var(--r);padding:1.1rem;text-decoration:none;transition:.2s}
.tool:hover{transform:translateY(-3px);border-color:var(--p);box-shadow:0 10px 26px #5b4bdb22}.tool .ic{font-size:1.8rem}.tool h3{margin:.4rem 0 .2rem;font-size:1rem}.tool p{margin:0;font-size:.88rem;color:var(--m)}
.calc{display:grid;gap:1rem;grid-template-columns:1fr;margin:1.2rem 0}@media(min-width:800px){.calc{grid-template-columns:1.1fr 1fr}}
.in,.out,.seo,.rel,.card{background:var(--card);border:1px solid var(--b);border-radius:var(--r);padding:1.2rem}
.out{background:linear-gradient(160deg,#2b2370,#12142b);color:#dfe2ff;border:0;align-self:start}
label{display:block;font-size:.85rem;font-weight:600;margin:.8rem 0 .25rem;color:var(--ink)}label:first-child{margin-top:0}
input,select,textarea{width:100%;padding:.65rem .8rem;border:1px solid var(--b);border-radius:12px;font:1rem "DM Sans",sans-serif;background:var(--bg);color:var(--ink)}
input:focus,select:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:0;border-color:var(--p);box-shadow:0 0 0 3px #5b4bdb45}
.r{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid #ffffff1c}.r b{text-align:right}
.big{display:block;border:0;padding-bottom:.9rem}.big span{display:block;font-size:.9rem;color:#b9bfff}.big b{display:block;text-align:left;font:800 clamp(1.7rem,6vw,2.3rem) Sora,sans-serif;color:#fff}
.bar{height:10px;border-radius:9px;background:var(--w);margin-top:1rem;overflow:hidden}.bar i{display:block;height:100%;background:var(--g)}
.lg{display:flex;justify-content:space-between;font-size:.8rem;margin-top:.4rem}.lg s{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:.35rem;text-decoration:none}.lg .a{background:var(--g)}.lg .b{background:var(--w)}
.msg{margin:0;color:#ffd6cc}.btn{background:var(--p);color:#fff;border:0;border-radius:12px;padding:.7rem 1.2rem;font:600 1rem "DM Sans",sans-serif;cursor:pointer;transition:.2s;text-decoration:none;display:inline-block;margin-top:.8rem}.btn:hover{background:var(--pd)}
.gh,.gr{display:grid;grid-template-columns:1.5fr 1fr 1fr 34px;gap:.4rem;margin-bottom:.4rem;align-items:center}.gh{font-size:.8rem;font-weight:600;color:var(--m)}.x{border:0;background:none;color:var(--m);font-size:1.3rem;cursor:pointer}
.seo{margin-top:1.5rem}.seo h2:first-child{margin-top:0}.rel{margin-top:1rem}.rel div{display:flex;flex-wrap:wrap;gap:.5rem}.rel a{background:var(--bg);border:1px solid var(--b);border-radius:99px;padding:.35rem .9rem;text-decoration:none;font-size:.92rem}.rel a:hover{border-color:var(--p)}
footer{max-width:1040px;margin:1rem auto 0;padding:1.5rem 1rem 2rem;text-align:center;color:var(--m);font-size:.9rem}footer a{margin:0 .5rem;color:var(--t)}
@media(max-width:700px){#burger{display:block}nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--card);flex-direction:column;padding:.5rem;border-bottom:1px solid var(--b)}nav.open{display:flex}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}