html{background:#ffffff;scroll-behavior:smooth}
body{margin:0;background:#ffffff;color:#1e1d1a;font:400 15.5px/1.65 "Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-wrap:pretty}
.layout{display:grid;grid-template-columns:266px minmax(0,1fr);align-items:start;min-height:100vh}
.sidebar{position:sticky;top:0;padding:34px 26px 26px 34px;border-right:1px solid rgba(30,29,26,.12);display:flex;flex-direction:column;gap:26px;min-height:100vh;box-sizing:border-box}
.logo-title{font:600 18px/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:-0.005em}
.logo-subtitle{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#8a867e;margin-top:6px;font-family:Arial}
.sidebar-nav{display:flex;flex-direction:column;gap:1px;margin-left:-10px}
.last-update{margin-top:auto;font-size:11.5px;line-height:1.6;color:#a09c94}
.content{padding:56px 40px 0;display:flex;flex-direction:column;min-height:100vh;box-sizing:border-box}
.content-inner{max-width:720px;width:100%;flex:1}
.site-footer{margin-top:80px;padding:26px 0 34px;border-top:1px solid rgba(30,29,26,.12);font-size:12.5px;line-height:1.75;color:#8a867e;max-width:720px}

.content-inner{opacity:0;animation:fadeIn .5s ease-out forwards}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion: reduce){.content-inner{opacity:1;animation:none}}

.back-to-top{position:fixed;bottom:28px;right:28px;width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:#1e1d1a;color:#fff;border-radius:50%;text-decoration:none;border-bottom:none;font-size:16px;box-shadow:0 4px 12px rgba(0,0,0,.18);transition:transform 120ms ease,background 120ms ease}
.back-to-top:hover{background:oklch(0.45 0.07 250);transform:translateY(-3px)}

.error-section{padding:8vh 0 0}
.error-code{font:600 88px/1 "Helvetica Neue",Helvetica,Arial,sans-serif;color:oklch(0.45 0.07 250);letter-spacing:-0.02em;margin:0 0 6px}
.error-section p{color:#6b6862;font-size:15.5px;max-width:440px}
.error-back{display:inline-block;margin-top:10px;font-weight:600}

html{background:#ffffff}
body{margin:0;background:#ffffff;color:#1e1d1a;font:400 15.5px/1.65 "Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-wrap:pretty}
*,*::before,*::after{box-sizing:border-box}
a{color:oklch(0.45 0.07 250);text-decoration:none;border-bottom:1px solid oklch(0.86 0.035 250)}
a:hover{color:oklch(0.34 0.08 250);border-bottom-color:currentColor}
h1{font:400 clamp(26px,3vw,32px)/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:-0.01em;margin:0 0 26px}
h2{font:600 19px/1.3 "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:-0.005em;color:oklch(0.48 0.07 250);margin:42px 0 12px}
h3{font:600 17px/1.3 "Helvetica Neue",Helvetica,Arial,sans-serif;margin:24px 0 8px;color:#1e1d1a}
p{margin:0 0 12px}
ul,ol{margin:0 0 16px;padding-left:22px}
li{margin-bottom:5px}
li::marker{color:oklch(0.62 0.05 250)}
strong{font-weight:600}
code{font:13.5px/1.5 ui-monospace,Menlo,monospace;background:rgba(30,29,26,.06);padding:1px 5px}
table{border-collapse:collapse;width:100%;margin:6px 0 18px;font-size:15.5px}
th{text-align:left;font:600 11.5px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:#57534c;padding:0 14px 7px 0;border-bottom:1px solid rgba(30,29,26,.35)}
td{padding:8px 14px 8px 0;border-bottom:1px solid rgba(30,29,26,.1);color:#3a3833}
hr{border:none;border-top:1px solid rgba(30,29,26,.13);margin:38px 0 30px}
::selection{background:oklch(0.9 0.05 250)}
main a{color:oklch(0.45 0.07 250);text-decoration:none;border-bottom:1px solid oklch(0.86 0.035 250)}
main a:hover{color:oklch(0.34 0.08 250);border-bottom-color:currentColor}
.logo-link{display:block;text-decoration:none;color:inherit;border-bottom:none;cursor:pointer}
.nav-item{display:flex;align-items:baseline;padding:6px 10px;margin-left:-10px;cursor:pointer;font-size:14.5px;color:#4a4741;text-decoration:none;border-bottom:none;border-radius:3px;transition:background 120ms ease}
.nav-item:hover{background:rgba(30,29,26,.05)}
.nav-item.active{color:#1e1d1a;font-weight:600;background:rgba(30,29,26,.055);box-shadow:inset 2px 0 0 oklch(0.48 0.09 250)}
.home-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));column-gap:32px;margin:14px 0 0}
.home-item{display:flex;align-items:baseline;gap:14px;padding:11px 0;border-bottom:1px solid rgba(30,29,26,.1);text-decoration:none;min-width:230px}
.home-item:hover{background:rgba(30,29,26,.035)}
.home-item-dot{font:500 11px ui-monospace,Menlo,monospace;color:#a8a49b}
.home-item-label{font:400 16px/1.3 "Helvetica Neue",Helvetica,Arial,sans-serif;color:oklch(0.45 0.07 250)}

/* Mobile nav collapse: hidden checkbox + label, pure CSS sibling selectors, no JS.
   Desktop (default): label stays hidden, nav is always shown (base .sidebar-nav rule).
   Mobile (<=720px): nav starts collapsed; tapping the label toggles it via :checked. */
.nav-toggle-label{display:none;cursor:pointer;font:600 12.5px "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#4a4741;padding:8px 10px;margin-left:-10px;border-radius:4px}
.nav-toggle-label::after{content:"+";float:right;color:#a8a49b;font-size:15px;font-weight:400}
.nav-toggle-input:checked ~ .nav-toggle-label::after{content:"\2212"}
.nav-toggle-label:hover{background:rgba(30,29,26,.05)}

@media (max-width:720px){
  .layout{grid-template-columns:1fr}
  .sidebar{position:static;min-height:0;border-right:none;border-bottom:1px solid rgba(30,29,26,.12);padding:20px 24px;gap:14px}
  .content{padding:32px 24px 0}
  .last-update{display:none}
  .home-list{grid-template-columns:1fr}
  .back-to-top{width:38px;height:38px;bottom:18px;right:18px}

  .nav-toggle-label{display:block}
  .sidebar-nav{display:none}
  .nav-toggle-input:checked ~ .sidebar-nav{display:flex}
}