
:root{--bg:#161618;--card:#1e1e22;--teal:#0d9488;--teal2:#14b8a6;--lime:#a3e635;--txt:#d4d4d8;--dim:#71717a;--brd:#27272a;--r:12px;--mw:740px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--txt);line-height:1.75;font-size:16px}
a{color:var(--teal2);text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;display:block;border-radius:var(--r)}
.w{max-width:var(--mw);margin:0 auto;padding:0 20px}

header{background:var(--card);border-bottom:1px solid var(--brd)}
.hdr{max-width:var(--mw);margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.hdr img{height:28px}
header nav ul{list-style:none;display:flex;gap:16px;margin:0;padding:0;flex-wrap:wrap}
header nav a{color:var(--dim);font-size:.8rem;font-weight:600;transition:.15s}
header nav a:hover{color:var(--teal2)}
header nav a.on{color:var(--teal2)}

.hero{margin:24px 0;border-radius:var(--r);overflow:hidden;position:relative}
.hero img{width:100%;max-height:240px;object-fit:cover}
.hero-cap{position:absolute;bottom:0;left:0;right:0;padding:24px;background:linear-gradient(transparent,rgba(22,22,24,.95))}
.hero-cap h1{font-size:1.5rem;color:#fff;margin:0 0 6px;line-height:1.3}
.hero-cap p{color:var(--dim);margin:0;font-size:.85rem}
@media(max-width:600px){.hero-cap h1{font-size:1.2rem}}

main{padding-bottom:48px}
.bc{color:var(--dim);font-size:.74rem;margin:0 0 16px}.bc a{color:var(--dim)}.bc a:hover{color:var(--teal2)}
.intro{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:20px;margin:0 0 28px;font-size:.93rem}

article h2{font-size:1.15rem;color:#fff;margin:40px 0 14px;display:flex;align-items:center;gap:8px}
article h2::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--teal);flex:none}
article h2[id]{scroll-margin-top:24px}
article h3{color:var(--teal2);font-size:.84rem;font-weight:700;margin:20px 0 6px}
article p{color:var(--dim);margin:0 0 14px}article p strong{color:var(--txt)}

.links{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:24px 0}
.lnk{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:16px;text-decoration:none;transition:.12s}
.lnk:hover{border-color:var(--teal);text-decoration:none}
.lnk strong{display:block;color:#fff;font-size:.85rem;margin-bottom:3px}
.lnk small{color:var(--dim);font-size:.72rem}

.wg{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:20px;margin:24px 0}
.wg h3{margin:0 0 12px;color:var(--teal2);font-size:.9rem}
.wg-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.fld{flex:1;min-width:120px}
.fld label{display:block;font-size:.7rem;color:var(--dim);margin-bottom:3px}
.fld input,.fld select{width:100%;padding:8px 10px;border-radius:8px;border:1px solid var(--brd);background:var(--bg);color:var(--txt);font-size:.84rem}
.wg button{background:var(--teal);color:#fff;border:none;padding:8px 18px;border-radius:8px;font-weight:700;cursor:pointer;font-size:.82rem}
.wg button:hover{background:var(--teal2)}
.wg-out{margin-top:10px;padding:12px;background:var(--bg);border-radius:8px;font-size:.84rem;color:var(--dim)}
.wg-out b{color:var(--teal2)}

.tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:12px}
.tb{background:var(--bg);border:1px solid var(--brd);color:var(--dim);padding:5px 12px;border-radius:14px;font-size:.74rem;font-weight:600;cursor:pointer}
.tb.on{background:var(--teal);color:#fff;border-color:var(--teal)}
.tp{display:none}.tp.on{display:block}

.acc details{border-bottom:1px solid var(--brd)}
.acc summary{padding:12px 0;cursor:pointer;font-weight:600;font-size:.84rem;color:var(--txt);list-style:none;display:flex;justify-content:space-between}
.acc summary::after{content:'+';color:var(--teal)}
.acc details[open] summary::after{content:\u2212}
.acc .ans{padding:0 0 12px;color:var(--dim);font-size:.84rem}

table{width:100%;border-collapse:collapse;margin:14px 0;font-size:.8rem}
th{padding:8px 10px;text-align:left;background:var(--teal);color:#fff;font-weight:600}
td{padding:8px 10px;border-bottom:1px solid var(--brd);color:var(--dim)}

.fig{margin:24px 0}.fig img{border-radius:var(--r)}.fig figcaption{color:var(--dim);font-size:.7rem;margin-top:5px;text-align:center}

.author{display:flex;gap:12px;align-items:center;border-top:1px solid var(--brd);padding-top:20px;margin-top:36px}
.av{width:44px;height:44px;border-radius:50%;background:var(--teal);display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;font-size:.9rem;flex:none}
.author h4{margin:0;color:#fff;font-size:.84rem}.author p{margin:2px 0 0;font-size:.74rem;color:var(--dim)}
.disc{font-size:.7rem;color:var(--dim);margin-top:14px}
footer{background:var(--card);border-top:1px solid var(--brd);padding:20px;text-align:center;color:var(--dim);font-size:.74rem}
