:root{--bg:#faf9ff;--ink:#1a1633;--mut:#5d5878;--pri:#5b3df5;--pri-d:#4528d6;--bd:#e2ddf5;--card:#fff;--err:#b3261e;--ok:#17703a}
@media(prefers-color-scheme:dark){:root{--bg:#14112a;--ink:#f1eefc;--mut:#b4aed3;--bd:#2f2a55;--card:#1d1940;--pri:#8a74ff;--pri-d:#a190ff;--err:#ff8a80;--ok:#6fd89a}}
*{box-sizing:border-box}html{scroll-padding-top:70px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--pri)}.wrap{max-width:1080px;margin:0 auto;padding:0 18px}.narrow{max-width:720px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--card);padding:8px;z-index:9}
:focus-visible{outline:3px solid var(--pri);outline-offset:2px}
.hd{border-bottom:1px solid var(--bd);background:var(--bg);position:sticky;top:0;z-index:5}.hd-in{display:flex;align-items:center;justify-content:space-between;min-height:58px;gap:12px}
.logo{font-weight:800;font-size:1.2rem;color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:8px}.logo-i{background:var(--pri);color:#fff;border-radius:8px;width:28px;height:28px;display:grid;place-items:center}
.nav{display:flex;gap:16px;align-items:center}.nav a,.more summary{color:var(--ink);text-decoration:none;cursor:pointer;padding:6px 2px}.nav a:hover{color:var(--pri)}
.more{position:relative}.more div{position:absolute;right:0;top:100%;background:var(--card);border:1px solid var(--bd);border-radius:10px;padding:8px;min-width:190px;display:flex;flex-direction:column;box-shadow:0 8px 24px #0002}
.burger{display:none;background:none;border:1px solid var(--bd);border-radius:8px;padding:6px 12px;color:var(--ink);font:inherit}
@media(max-width:820px){.burger{display:block}.nav{display:none;position:absolute;left:0;right:0;top:58px;background:var(--bg);border-bottom:1px solid var(--bd);flex-direction:column;align-items:flex-start;padding:12px 18px}.nav.open{display:flex}.more div{position:static;box-shadow:none}}
.hero{padding:44px 0 28px}h1{font-size:clamp(1.9rem,5vw,3rem);line-height:1.15;margin:.2em 0 .4em;letter-spacing:-.02em}h2{margin:1.8em 0 .5em;font-size:1.5rem}
.lead{font-size:1.1rem;color:var(--mut);max-width:60ch}.tag{display:inline-block;font-weight:700;background:linear-gradient(90deg,#f58529,#dd2a7b,#8134af);-webkit-background-clip:text;background-clip:text;color:transparent}
.tool{background:var(--card);border:1px solid var(--bd);border-radius:16px;padding:16px;margin-top:16px;max-width:760px}
.row{display:flex;gap:8px;flex-wrap:wrap}.row input[type=url]{flex:1 1 260px;min-width:0;padding:14px;font:inherit;border:2px solid var(--bd);border-radius:10px;background:var(--bg);color:var(--ink)}
.sub{margin:10px 0;align-items:center;justify-content:space-between;font-size:.9rem;color:var(--mut)}.chip{background:var(--bg);border:1px solid var(--bd);border-radius:99px;padding:2px 12px}
.btn{font:inherit;font-weight:700;border-radius:10px;border:2px solid var(--pri);padding:12px 18px;cursor:pointer;display:inline-block}.ghost{background:none;color:var(--pri)}.go{background:var(--pri);color:#fff;width:100%}
.btn:hover{filter:brightness(1.08)}.btn:disabled{opacity:.6;cursor:wait}.msg{min-height:1.4em;margin:10px 0 0}.err{color:var(--err)}.okc{color:var(--ok)}
.res{border-top:1px solid var(--bd);margin-top:12px;padding-top:12px;display:grid;gap:10px}.res img{max-width:160px;height:auto;border-radius:8px}.res a.btn{width:auto;text-decoration:none;margin:4px 6px 4px 0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.card{display:block;background:var(--card);border:1px solid var(--bd);border-radius:14px;padding:18px;color:var(--ink);text-decoration:none}
.card:hover{border-color:var(--pri)}.card h3{margin:0 0 6px}.card p{margin:0 0 10px;color:var(--mut)}.st,.grid small{font-size:.8rem;color:var(--mut)}
.card.ig{border:2px solid transparent;background:linear-gradient(var(--card),var(--card)) padding-box,linear-gradient(135deg,#f58529,#dd2a7b,#8134af) border-box;grid-column:span 2}@media(max-width:560px){.card.ig{grid-column:auto}}
.grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}.grid a{display:block;padding:12px;background:var(--card);border:1px solid var(--bd);border-radius:10px;text-decoration:none;color:var(--ink)}.grid b,.grid small{display:block}
.steps li{margin:.6em 0}.ticks{padding-left:1.2em}details{background:var(--card);border:1px solid var(--bd);border-radius:10px;padding:10px 14px;margin:8px 0}summary{font-weight:600;cursor:pointer}
.crumbs{font-size:.9rem;color:var(--mut)}.page{padding:36px 18px}.cform{display:grid;gap:12px}.cform label{display:grid;gap:4px;font-weight:600}.cform input,.cform textarea{font:inherit;padding:10px;border:2px solid var(--bd);border-radius:8px;background:var(--card);color:var(--ink)}.hp{position:absolute;left:-9999px}
.filebtn{text-align:center;width:100%}#wapreview img,#wapreview video{max-width:100%;border-radius:10px;margin-top:10px}
.ft{border-top:1px solid var(--bd);margin-top:48px;padding-top:28px}.ft-in{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px}.ft a{display:block;color:var(--mut);text-decoration:none;padding:2px 0}.copy{color:var(--mut);font-size:.85rem;padding-bottom:24px}
@media(max-width:640px){.ft-in{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
.adm-nav{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--bd)}.adm-nav a{color:var(--ink);text-decoration:none}.inl{display:inline}.inl .btn{padding:6px 12px;margin-left:6px}
.adm h1{margin-top:20px}.plist{padding-left:1.2em}.slot{border:1px solid var(--bd);border-radius:10px;margin:12px 0;padding:10px}.chk{display:flex!important;gap:8px;align-items:center;font-weight:600}.chk input{width:auto}
.msgbox{background:var(--card);border:1px solid var(--bd);border-radius:10px;padding:12px;margin:10px 0}.msgbox.unread{border-left:4px solid var(--pri)}.ad{margin:16px auto;text-align:center;max-width:100%;overflow:hidden;min-height:20px}
.cform textarea{width:100%}.more div{max-height:70vh;overflow:auto}
