:root{
  --ink:#1B1F23; --ink-soft:#5B564C;
  --paper:#F8F6F1; --paper-raised:#EFECE2;
  --line:#DCD6C8;
  --accent:#2F6E62; --accent-hover:#255852;
  --deep:#10231F; --deep-line:#2A4A43; --deep-text:#CFDEDA;
  --focus:#8AB5AC;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'IBM Plex Sans', sans-serif; font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Newsreader', serif; font-weight:500; line-height:1.14; margin:0 0 .5em; color:var(--ink); letter-spacing:-.01em;}
a{color:var(--accent);}
code, .mono{font-family:'IBM Plex Mono', monospace;}
.wrap{max-width:1080px; margin:0 auto; padding:0 28px;}
.prose{max-width:660px;}
.eyebrow{font-family:'IBM Plex Mono', monospace; font-size:12.5px; letter-spacing:.04em; color:var(--accent); text-transform:uppercase; margin:0 0 10px; display:block;}
header{position:sticky; top:0; z-index:20; border-bottom:1px solid var(--line); background:rgba(248,246,241,.92); backdrop-filter:saturate(140%) blur(6px); padding:16px 0;}
header .wrap{display:flex; align-items:center; justify-content:space-between;}
.wordmark{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); font-family:'Newsreader', serif; font-size:19px; font-weight:500;}
nav{display:flex; align-items:center; gap:24px;}
nav a{color:var(--ink); text-decoration:none; font-size:14.5px;}
nav a:hover{color:var(--accent);}
.btn{display:inline-flex; align-items:center; gap:8px; font-size:14.5px; font-weight:500; text-decoration:none; padding:9px 16px; border-radius:5px; border:1px solid transparent;}
.btn-primary{background:var(--accent); color:#fff;}
.btn-primary:hover{background:var(--accent-hover); color:#fff;}
.btn-ghost{border-color:var(--line); color:var(--ink);}
.btn-ghost:hover{border-color:var(--accent); color:var(--accent);}
section{padding:48px 0;}
.rule{border-top:1px solid var(--line);}
.stats{display:flex; flex-wrap:wrap; gap:10px; margin:18px 0;}
.stats img{display:block; height:20px;}
.terminal{background:var(--ink); border-radius:8px; overflow:hidden; margin:20px 0;}
.terminal-bar{display:flex; align-items:center; gap:6px; padding:11px 14px; background:#15181B;}
.terminal-bar span{width:9px; height:9px; border-radius:50%; background:#343A40;}
.terminal pre{margin:0; padding:20px 22px 24px; color:#E9E6DC; font-size:14px; line-height:1.9; overflow-x:auto;}
.terminal .c{color:#6E9A8E;} .terminal .p{color:#8AA6C2;}
.pkg-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
@media (max-width:760px){ .pkg-grid{grid-template-columns:1fr;} }
.pkg-card{border:1px solid var(--line); border-radius:10px; padding:26px; background:var(--paper-raised); text-decoration:none; color:var(--ink); display:block;}
.pkg-card:hover{border-color:var(--accent);}
.pkg-card h3{font-size:19px; margin:0 0 6px;}
.pkg-card .ver{font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--accent); margin-bottom:10px; display:inline-block;}
.pkg-card p{margin:0; color:var(--ink-soft); font-size:14.5px;}
.feature-list{margin:8px 0 0; padding-left:20px; color:var(--ink-soft); font-size:15px;}
.feature-list li{margin-bottom:6px;}
footer{border-top:1px solid var(--line); padding:36px 0; color:var(--ink-soft); font-size:13.5px;}
footer a{color:var(--ink);}

/* responsive header */
header .wrap{flex-wrap:wrap; gap:10px 20px;}
nav{flex-wrap:wrap;}
@media (max-width:640px){ nav{gap:6px 16px;} nav a{font-size:13.5px;} }

/* RESPONSIVE-NAV:START */
img{max-width:100%;height:auto}
.post-body{overflow-wrap:break-word}
.post-body a{overflow-wrap:anywhere}
.post-body pre{overflow-x:auto}
.post-body table{display:block;overflow-x:auto}
@media (max-width:820px){
  header .wrap{flex-wrap:wrap;row-gap:8px;height:auto}
  header nav{display:flex;flex-wrap:wrap;gap:6px 16px;width:100%}
  header nav a.hide-sm:not([href^="#"]){display:inline-block !important}
}
/* RESPONSIVE-NAV:END */

/* WIDE-LAYOUT:START */
:root{--wrap-max:1320px}
.wrap{box-sizing:border-box !important;width:100% !important;max-width:var(--wrap-max) !important;margin-left:auto !important;margin-right:auto !important;padding-left:clamp(16px,3vw,40px) !important;padding-right:clamp(16px,3vw,40px) !important}
/* WIDE-LAYOUT:END */

/* MOBILE-FIT:START */
img,svg,video,canvas{max-width:100%;height:auto}
pre{overflow-x:auto;max-width:100%}
@media (max-width:760px){
  html{overflow-x:hidden}
  body{overflow-x:clip}
  .wrap > *{min-width:0}
  [class*="grid"],[class*="hero"],[class*="cols"],[class*="split"]{grid-template-columns:minmax(0,1fr) !important}
  .terminal{max-width:100%;overflow:hidden}
  h1,h2,h3{overflow-wrap:anywhere}
  .btn,.btn-primary,.btn-ghost{max-width:100%;white-space:normal}
}
/* MOBILE-FIT:END */
