
:root{--bg:#0b0e14;--panel:#12161f;--panel2:#161b26;--tx:#e8eaf0;--mut:#8a93a6;--gold:#d7a94c;--line:#1e2430;
--blue:#6ea8fe;--green:#6fdc8c;--violet:#b195ff;--cyan:#56cfe1;--rose:#ff8fa3}
*{box-sizing:border-box;margin:0;padding:0}
html{color-scheme:dark}
body{background:var(--bg);color:var(--tx);font:15px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;display:flex;min-height:100vh}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}
aside{width:248px;flex-shrink:0;border-right:1px solid var(--line);padding:28px 18px;display:flex;flex-direction:column;gap:22px;position:sticky;top:0;height:100vh}
.brand{display:flex;gap:12px;align-items:center;padding:0 8px}
.mark{color:var(--gold);font-size:22px}
.bname{font-weight:700;letter-spacing:.22em;font-size:14px}.bsub{color:var(--mut);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
nav{display:flex;flex-direction:column;gap:2px}
.cat{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:var(--mut);font-size:13.5px}
.cat:hover{background:var(--panel);color:var(--tx);text-decoration:none}
.cat.active{background:var(--panel2);color:var(--tx)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--mut);flex-shrink:0}
.c-gold .dot{background:var(--gold)}.c-blue .dot{background:var(--blue)}.c-green .dot{background:var(--green)}
.c-violet .dot{background:var(--violet)}.c-cyan .dot{background:var(--cyan)}.c-rose .dot{background:var(--rose)}.d-all{background:#fff}
.cnt{margin-left:auto;color:var(--mut);font-size:11.5px;font-variant-numeric:tabular-nums}
.foot{margin-top:auto;color:#76809a;font-size:11px;padding:0 10px;line-height:1.5}
main{flex:1;padding:36px 44px 80px;max-width:980px}
.head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:8px}
h1.page{font-size:24px;letter-spacing:.01em}
.sub{color:var(--mut);font-size:13px;margin-bottom:26px}
#q{background:var(--panel);border:1px solid var(--line);color:var(--tx);border-radius:10px;padding:9px 14px;width:260px;font-size:13.5px;outline:none}
#q:focus{border-color:var(--gold)}
.group{margin:30px 0 8px;color:var(--mut);font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 18px 14px;display:flex;flex-direction:column;gap:9px;transition:border-color .15s}
.card:hover{border-color:#2b3345;text-decoration:none}
.chip{align-self:flex-start;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;padding:3px 9px;border-radius:99px;border:1px solid}
.chip-gold{color:var(--gold);border-color:#4a3d20;background:#1c1709}.chip-blue{color:var(--blue);border-color:#233a5e;background:#0e1727}
.chip-green{color:var(--green);border-color:#244a30;background:#0d1a11}.chip-violet{color:var(--violet);border-color:#3a2f63;background:#151027}
.chip-cyan{color:var(--cyan);border-color:#1f4a52;background:#0c1b1e}.chip-rose{color:var(--rose);border-color:#57303a;background:#1f1013}
.ctitle{color:var(--tx);font-size:15px;font-weight:600;line-height:1.4}
.cmeta{color:var(--mut);font-size:12px;margin-top:auto}
.art{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:34px 38px}
.art h1{font-size:21px;margin-bottom:4px}.art .cmeta{margin-bottom:22px}
.art h2{margin:26px 0 8px;font-size:17px}.art h3{margin:22px 0 6px;font-size:15px;color:#c9cfdd}
.art p{margin:10px 0}.art li{margin:4px 0 4px 20px}
.art blockquote{border-left:3px solid var(--gold);padding:4px 14px;color:#c9cfdd;background:#131005;margin:12px 0;border-radius:0 8px 8px 0}
.art pre{background:#0a0d13;border:1px solid var(--line);border-radius:10px;padding:14px;overflow-x:auto;margin:12px 0;font-size:13px}
.art code{background:#0a0d13;border:1px solid var(--line);border-radius:6px;padding:1px 6px;font-size:13px}
.art hr{border:0;border-top:1px solid var(--line);margin:20px 0}
.li-num .num{color:var(--gold);font-weight:700}
.pager{display:flex;justify-content:space-between;margin-top:22px;gap:12px}
.pager a{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 16px;color:var(--tx);font-size:13px;max-width:47%}
.pager a:hover{border-color:var(--gold);text-decoration:none}
.empty{color:var(--mut);padding:40px 0}
@media(max-width:840px){body{flex-direction:column}aside{width:100%;height:auto;position:static;flex-direction:row;flex-wrap:wrap;border-right:0;border-bottom:1px solid var(--line);padding:16px}main{padding:24px 18px 60px}#q{width:100%}.art{padding:22px 18px}}
