:root{--bg: #ffffff;--panel: #ffffff;--text: #111827;--muted: #6b7280;--line: #e5e7eb;--accent: #2563eb;--accent-strong: #1d4ed8;--shadow: 0 6px 20px rgba(17, 24, 39, .05)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-atkinson),"Avenir Next","Segoe UI",sans-serif;color:var(--text);background:var(--bg);line-height:1.65;min-height:100vh;overflow-x:hidden}.site-shell{width:min(860px,calc(100% - 2rem));margin:0 auto}.site-header{margin-top:1.25rem;padding:.8rem 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.brand-lockup{display:inline-flex;align-items:center;text-decoration:none;color:inherit;font-weight:700}.brand-text{font-size:1.05rem}.top-nav{display:flex;gap:.5rem}.top-nav a{font-size:.92rem;text-decoration:none;padding:.35rem .7rem;border-radius:8px;border:1px solid var(--line);color:var(--muted);transition:.16s ease}.top-nav a:hover{color:var(--accent);border-color:#bfdbfe;background:#f8fbff}.site-main{padding:2rem 0}.site-footer{padding:.9rem 0 2rem;color:var(--muted);font-size:.93rem;text-align:center}.page-title{font-size:clamp(1.8rem,2.1vw,2.4rem);line-height:1.2;margin:0;font-weight:800;letter-spacing:-.02em}.page-subtitle{margin:.7rem 0 0;color:var(--muted);font-size:.98rem}.post-grid{list-style:none;padding:0;margin:1.35rem 0 0;display:grid;gap:1rem}.post-card{display:block;padding:1rem 1.1rem;border-radius:12px;border:1px solid var(--line);text-decoration:none;background:var(--panel);box-shadow:var(--shadow);transform:translateY(0);transition:transform .19s ease,box-shadow .19s ease,border-color .19s ease}.post-card:hover{transform:translateY(-2px);box-shadow:0 12px 24px #11182714;border-color:#bfdbfe}.post-title{margin:0;font-size:1.15rem;line-height:1.25;color:var(--text)}.post-meta{margin:.45rem 0 0;font-size:.85rem;color:var(--muted)}.post-desc{margin:.7rem 0 0;font-size:.95rem;color:#374151}.tag-row{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.7rem}.tag-pill{padding:.2rem .55rem;border-radius:999px;font-size:.75rem;font-weight:700;letter-spacing:.02em;color:var(--accent-strong);background:#eff6ff;border:1px solid #dbeafe}.lang-switcher{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .6rem;border-radius:8px;border:1px solid var(--line);background:#f9fafb;font-size:.85rem;margin-bottom:1.1rem}.lang-switcher strong{font-weight:700}.lang-switcher a{text-decoration:none;font-weight:700;color:var(--accent)}.article-card{padding:clamp(1rem,3vw,1.8rem);border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow)}.article-hero{width:100%;max-height:320px;object-fit:cover;border-radius:12px;margin-bottom:1rem}.article-title{margin:0;font-size:clamp(1.4rem,3vw,1.9rem);line-height:1.2;letter-spacing:-.02em}.article-date{margin:.45rem 0 0;font-size:.9rem;color:var(--muted)}.post-body{margin-top:1rem;font-size:1rem;color:#1f2937}.post-body h2,.post-body h3,.post-body h4{line-height:1.25;margin:1.3rem 0 .5rem}.post-body p,.post-body li{margin:.75rem 0}.post-body a{color:var(--accent-strong);font-weight:600;text-underline-offset:2px}.post-body code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:6px;padding:.08rem .32rem}.post-body pre{overflow-x:auto;border-radius:10px;padding:.9rem;background:#162739;color:#e8f0fb}.post-body blockquote{margin:1rem 0;padding:.75rem 1rem;border-left:4px solid var(--accent);background:#f9fafb;border-radius:6px}.back-link{display:inline-block;margin-top:1.2rem;font-size:.92rem;text-decoration:none;color:var(--accent-strong);font-weight:700}.fade-in{animation:fade-up .35s ease both}@keyframes fade-up{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@media(max-width:720px){.site-header{margin-top:.7rem}.site-main{padding-top:1.35rem}.post-card{padding:1rem}.article-card{padding:.9rem}}.sr-only{border:0;padding:0;margin:0;position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px);clip-path:inset(50%);white-space:nowrap}
