/* Polished Notion-like styles (no build) */
:root{
  --bg:#f5f6f7; --card:#ffffff; --muted:#6b7280; --accent:#0f172a; --accent-2:#0ea5a3;
  --max-width:880px; --sidebar-width:260px;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial;background:var(--bg);color:var(--accent);-webkit-font-smoothing:antialiased}
.app{display:flex;min-height:100vh}
.sidebar{width:var(--sidebar-width);background:transparent;padding:28px;border-right:1px solid rgba(15,23,42,0.04);position:sticky;top:0;height:100vh}
.brand{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.logo{font-size:20px}
.brand-text{font-weight:700}
.nav-section{margin-bottom:18px}
.section-title{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.09em;margin-bottom:8px}
.nav{list-style:none;padding:0;margin:0}
.nav li{display:flex;align-items:center;justify-content:space-between}
.nav a{display:block;padding:8px 10px;border-radius:8px;color:inherit;text-decoration:none;margin-bottom:6px;width:100%}
.nav a:hover{background:#fff}
.nav a.active{background:linear-gradient(180deg, rgba(255,255,255,1), rgba(250,250,250,1));box-shadow:0 1px 0 rgba(16,24,40,0.04)}
.nav-meta{font-size:12px;color:var(--muted)}
.footer-note{font-size:12px;color:var(--muted);margin-top:18px}
.content-wrap{flex:1;padding:36px;display:flex;justify-content:center}
.content{width:100%;max-width:var(--max-width)}
.page-cover{height:160px;background-size:cover;background-position:center;border-radius:12px;margin-bottom:18px}
.page-header{margin-bottom:18px}
.title{font-size:28px;margin:0 0 6px}
.meta{color:var(--muted);font-size:13px}
.markdown{background:var(--card);padding:28px;border-radius:12px;box-shadow:0 8px 30px rgba(2,6,23,0.04)}
.markdown h1{font-size:22px;margin-top:0}
.markdown h2{font-size:18px}
.markdown p{line-height:1.7;color:#0b1220}
.markdown ul{padding-left:1.05rem}
.blockquote{background:#f8fafc;padding:12px;border-left:3px solid #e6f2f2}
.callout{background:#f8fafc;padding:12px;border-left:3px solid var(--accent-2);border-radius:8px}
pre{background:#0b1220;color:#e6eef0;padding:16px;border-radius:8px;overflow:auto}
code{background:#f3f4f6;padding:2px 6px;border-radius:6px}
@media(max-width:920px){.sidebar{display:none}.content-wrap{padding:18px}}