:root{color-scheme:dark;--bg:#242323;--card:#2f2e2e;--text:#ececea;--muted:#a7aaa9;--line:#41403f;--accent:#25d5b2;--accent-strong:#5fe6cb;--on-accent:#0c201c;--accent-soft:rgba(37,213,178,.13);--code:#262525;--warn:rgba(37,213,178,.08);--warn-line:rgba(37,213,178,.45)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.7 Georgia,'Iowan Old Style','Palatino Linotype',serif}
a{color:var(--accent)}a:hover{color:var(--accent-strong)}
::selection{background:var(--accent);color:var(--on-accent)}
.wrap{max-width:1120px;margin:0 auto;padding-inline:20px}
header.site{border-bottom:3px solid var(--accent);background:#1c1b1b}
header.site .wrap{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:6px 28px;padding-block:18px;padding-right:110px}
.brand{display:inline-flex;align-items:center;gap:12px;font:700 1.45rem/1.2 system-ui,sans-serif;color:var(--text);text-decoration:none;letter-spacing:-.02em}
.brand:hover{color:var(--accent)}
.brand img{width:52px;height:auto;display:block}
.tagline{font:.9rem system-ui,sans-serif;color:var(--muted)}
nav.main{width:100%;display:flex;flex-wrap:wrap;gap:4px 18px;font:500 .92rem system-ui,sans-serif}
nav.main a{color:var(--muted);text-decoration:none}nav.main a:hover{color:var(--accent)}
.lang{position:absolute;top:18px;right:20px;display:flex;border:1px solid var(--line);border-radius:99px;overflow:hidden;font:600 .8rem/1 system-ui,sans-serif}
.lang a,.lang span{padding:7px 12px;text-decoration:none;color:var(--muted)}
.lang span{background:var(--accent);color:var(--on-accent)}
.lang a:hover{background:var(--accent-soft);color:var(--accent)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:48px;padding-block:36px}
@media (max-width:860px){.layout{grid-template-columns:minmax(0,1fr)}}
main{min-width:0}
article.post{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:clamp(18px,4vw,44px)}
article.post h1{font:700 clamp(1.7rem,4vw,2.4rem)/1.2 system-ui,sans-serif;letter-spacing:-.02em;margin:.2em 0 .4em}
.meta{font:.88rem system-ui,sans-serif;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 14px;margin-bottom:22px}
.meta a{color:var(--muted)}
.hero{width:100%;border-radius:8px;margin-bottom:24px;aspect-ratio:16/9;object-fit:cover;background:var(--code)}
.content{overflow-wrap:break-word}
.content h1,.content h2,.content h3,.content h4{font-family:system-ui,sans-serif;line-height:1.3;margin-top:1.8em}
.content h1{font-size:1.6rem}
.content img{max-width:100%;height:auto;border-radius:6px}
.content figure{margin:1.5em 0}.content figcaption{font:.85rem system-ui,sans-serif;color:var(--muted);text-align:center}
.content blockquote{margin:1.4em 0;padding:.4em 1.2em;border-left:4px solid var(--accent);background:var(--accent-soft);border-radius:0 6px 6px 0}
.content pre{background:var(--code);padding:14px;border-radius:6px;overflow-x:auto;font-size:.85rem}
.content code{background:var(--code);padding:.1em .3em;border-radius:3px;font-size:.9em}
.content pre code{background:none;padding:0}
.content table{border-collapse:collapse;display:block;overflow-x:auto;font:.9rem/1.5 system-ui,sans-serif}
.content td,.content th{border:1px solid var(--line);padding:6px 10px;vertical-align:top}
.content .wp-block-columns{display:flex;flex-wrap:wrap;gap:20px}.content .wp-block-column{flex:1 1 240px}
.content .wp-block-gallery{display:flex;flex-wrap:wrap;gap:10px}.content .wp-block-gallery figure{flex:1 1 200px;margin:0}
.embed a{display:block;padding:14px 18px;border:1px solid var(--line);border-radius:8px;font:.9rem system-ui,sans-serif;text-decoration:none;word-break:break-all}
.note{font:.9rem/1.5 system-ui,sans-serif;background:var(--warn);border:1px solid var(--warn-line);border-radius:8px;padding:10px 14px;margin-bottom:22px}
.draftbar{font:700 .85rem system-ui,sans-serif;background:#c0392b;color:#fff;border-radius:6px;padding:6px 12px;margin-bottom:18px;display:inline-block}
.tags{margin-top:32px;display:flex;flex-wrap:wrap;gap:8px;font:.82rem system-ui,sans-serif}
.tags a,.chip{background:var(--accent-soft);color:var(--accent);padding:3px 10px;border-radius:99px;text-decoration:none;border:1px solid rgba(37,213,178,.25)}
.tags a:hover,.chip:hover{background:var(--accent);color:var(--on-accent)}
.list{display:grid;gap:22px}
.card{display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;transition:border-color .15s}
.card:hover{border-color:var(--accent)}
@media (max-width:620px){.card{grid-template-columns:1fr}}
.card img{width:100%;height:100%;min-height:150px;object-fit:cover;background:var(--code);display:block}
.card .body{padding:16px 20px 16px 0}@media (max-width:620px){.card .body{padding:0 18px 18px}}
.card h2{font:700 1.2rem/1.3 system-ui,sans-serif;margin:.1em 0 .35em}.card h2 a{color:var(--text);text-decoration:none}.card h2 a:hover{color:var(--accent)}
.card p{margin:.3em 0 0;font-size:.95rem;color:var(--muted)}
.page-title{font:700 1.6rem system-ui,sans-serif;margin:0 0 20px}
aside.side{font:.92rem/1.6 system-ui,sans-serif}
aside.side section{margin-bottom:30px}
aside.side h3{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);margin:0 0 10px;padding-bottom:6px;border-bottom:1px solid var(--line)}
aside.side ul{list-style:none;padding:0;margin:0}aside.side li{padding:3px 0}
aside.side a{color:var(--text);text-decoration:none}aside.side a:hover{color:var(--accent)}
.cloud{display:flex;flex-wrap:wrap;gap:6px}
footer.site{background:#1c1b1b;border-top:1px solid var(--line);font:.85rem system-ui,sans-serif;color:var(--muted);padding-block:26px}