/* OzarkMesh — style.css */
:root {
  --bg:      #0d1117; --bg2: #161b22; --bg3: #21262d;
  --border:  #30363d;
  --text:    #e6edf3; --muted: #8b949e;
  --green:   #39d353; --green-dim: #1a3d24;
  --blue:    #58a6ff;
  --mono:    'IBM Plex Mono', monospace;
  --sans:    'Inter', system-ui, sans-serif;
  --r:       6px; --max: 760px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.7;min-height:100vh}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;border-radius:var(--r)}

/* container */
.container{max-width:1080px;margin:0 auto;padding:0 1.25rem}

/* header */
.site-header{position:sticky;top:0;z-index:100;background:rgba(13,17,23,.93);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;height:54px;gap:1.5rem}
.site-logo{display:flex;align-items:center;gap:8px;color:var(--text);font-weight:600;font-size:17px;letter-spacing:-.02em;flex-shrink:0}
.site-logo:hover{text-decoration:none}
.logo-dot{width:8px;height:8px;border-radius:50%;background:var(--green);animation:blink 2.5s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
.main-nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.main-nav a{color:var(--muted);font-size:14px;padding:5px 10px;border-radius:var(--r);transition:.15s}
.main-nav a:hover{color:var(--text);background:var(--bg3);text-decoration:none}
.nav-drop{position:relative}
.nav-drop-toggle{color:var(--muted);font-size:14px;padding:5px 10px;border-radius:var(--r);cursor:pointer;user-select:none;transition:.15s}
.nav-drop-toggle:hover{color:var(--text);background:var(--bg3)}
.nav-drop-menu{display:none;position:absolute;right:0;top:calc(100% + 4px);background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);min-width:175px;padding:5px;z-index:200}
.nav-drop.open .nav-drop-menu{display:block}
.nav-drop-menu a{display:block;padding:7px 10px;color:var(--muted);font-size:13px;border-radius:4px}
.nav-drop-menu a:hover{color:var(--text);background:var(--bg3);text-decoration:none}
.nav-burger{display:none;background:none;border:none;color:var(--text);font-size:20px;cursor:pointer;margin-left:auto}

/* mobile nav */
.mob-nav{display:none;flex-direction:column;background:var(--bg2);border-bottom:1px solid var(--border);padding:.75rem 1.25rem;gap:2px}
.mob-nav a{color:var(--muted);font-size:15px;padding:7px 6px;border-radius:var(--r)}
.mob-nav a:hover{color:var(--text);text-decoration:none}
.mob-nav-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding:10px 6px 4px}
body.nav-open .mob-nav{display:flex}
@media(max-width:660px){.main-nav{display:none}.nav-burger{display:block}}

/* layout */
.page-wrap{display:grid;grid-template-columns:1fr 270px;gap:3rem;max-width:1080px;margin:2.5rem auto;padding:0 1.25rem;align-items:start}
.page-wrap.wide{grid-template-columns:1fr;max-width:var(--max)}
@media(max-width:820px){.page-wrap{grid-template-columns:1fr}.sidebar{display:none}}

/* hero */
.hero{background:linear-gradient(160deg,var(--bg2) 0%,var(--bg) 100%);border-bottom:1px solid var(--border);padding:3.5rem 0 2.5rem}
.hero-eye{font-family:var(--mono);font-size:11px;color:var(--green);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.75rem}
.hero h1{font-size:clamp(26px,5vw,40px);font-weight:600;letter-spacing:-.03em;line-height:1.2;margin-bottom:.75rem}
.hero p{font-size:16px;color:var(--muted);max-width:500px}

/* post cards */
.posts-list{display:flex;flex-direction:column}
.post-card{padding:1.5rem 0;border-bottom:1px solid var(--border)}
.post-card:first-child{padding-top:0}
.card-meta{display:flex;align-items:center;gap:.6rem;margin-bottom:.4rem;flex-wrap:wrap}
.cat-pill{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--green);background:var(--green-dim);padding:2px 7px;border-radius:3px}
.cat-pill:hover{text-decoration:none;opacity:.8}
.post-date{font-family:var(--mono);font-size:12px;color:var(--muted)}
.post-card h2{font-size:19px;font-weight:600;letter-spacing:-.02em;line-height:1.3;margin-bottom:.35rem}
.post-card h2 a{color:var(--text)}
.post-card h2 a:hover{color:var(--blue);text-decoration:none}
.post-excerpt{color:var(--muted);font-size:14px;margin-bottom:.6rem}
.read-more{font-family:var(--mono);font-size:11px;color:var(--blue);text-transform:uppercase;letter-spacing:.05em}

/* single post */
.post-title{font-size:clamp(22px,4vw,34px);font-weight:600;letter-spacing:-.03em;line-height:1.2;margin-bottom:.75rem}
.post-body{font-size:16px;line-height:1.8}
.post-body h2{font-size:21px;font-weight:600;margin:2rem 0 .6rem;letter-spacing:-.02em}
.post-body h3{font-size:17px;font-weight:600;margin:1.5rem 0 .4rem}
.post-body p{margin-bottom:1.2rem}
.post-body ul,.post-body ol{margin:0 0 1.2rem 1.5rem}
.post-body li{margin-bottom:.3rem}
.post-body blockquote{border-left:3px solid var(--green);padding:.5rem 0 .5rem 1.25rem;margin:1.5rem 0;color:var(--muted);font-style:italic}
.post-body code{font-family:var(--mono);font-size:13px;background:var(--bg3);padding:2px 6px;border-radius:3px;color:var(--green)}
.post-body pre{background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);padding:1rem 1.25rem;overflow-x:auto;margin-bottom:1.5rem}
.post-body pre code{background:none;padding:0}
.post-body a{color:var(--blue)}

/* affiliate box */
.aff-box{display:flex;align-items:center;gap:1rem;background:var(--bg2);border:1px solid var(--border);border-left:3px solid var(--green);border-radius:var(--r);padding:1rem 1.25rem;margin:1.5rem 0;flex-wrap:wrap}
.aff-info{flex:1;min-width:180px}
.aff-info strong{display:block;margin-bottom:2px}
.aff-info span{font-size:13px;color:var(--muted)}
.aff-btn{display:inline-block;background:var(--green);color:#0d1117;font-weight:600;font-size:13px;padding:8px 16px;border-radius:var(--r);white-space:nowrap;transition:opacity .15s}
.aff-btn:hover{opacity:.85;text-decoration:none}

/* sidebar */
.sidebar{position:sticky;top:70px}
.s-widget{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);padding:1.25rem;margin-bottom:1.25rem}
.s-title{font-family:var(--mono);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);border-bottom:1px solid var(--border);padding-bottom:.5rem;margin-bottom:.75rem}
.s-cat-list{list-style:none}
.s-cat-list li{padding:5px 0;border-bottom:1px solid var(--border)}
.s-cat-list li:last-child{border-bottom:none}
.s-cat-list a{color:var(--muted);font-size:14px;display:flex;justify-content:space-between}
.s-cat-list a:hover{color:var(--text);text-decoration:none}
.s-cat-list .ct{font-family:var(--mono);font-size:12px}

/* page header */
.page-hdr{padding:2.5rem 0 1.5rem;border-bottom:1px solid var(--border);margin-bottom:2rem}
.page-eye{font-family:var(--mono);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.4rem}
.page-hdr h1{font-size:clamp(20px,4vw,30px);font-weight:600;letter-spacing:-.02em}

/* pagination */
.pager{display:flex;gap:6px;justify-content:center;margin-top:2.5rem;flex-wrap:wrap}
.pager a,.pager span{display:inline-block;padding:6px 13px;border:1px solid var(--border);border-radius:var(--r);font-family:var(--mono);font-size:12px;color:var(--muted)}
.pager a:hover{color:var(--text);background:var(--bg3);text-decoration:none}
.pager span.cur{border-color:var(--green);color:var(--green)}

/* footer */
.site-footer{margin-top:5rem;border-top:1px solid var(--border);padding:2.5rem 0 0}
.footer-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;margin-bottom:2rem}
@media(max-width:580px){.footer-inner{grid-template-columns:1fr}}
.footer-brand p{font-size:13px;color:var(--muted);margin-top:.6rem;line-height:1.6}
.footer-links{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.footer-links strong{display:block;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:.6rem}
.footer-links a{display:block;color:var(--muted);font-size:13px;padding:3px 0}
.footer-links a:hover{color:var(--text)}
.footer-bar{border-top:1px solid var(--border);padding:.75rem 0;font-family:var(--mono);font-size:12px;color:var(--muted)}

/* empty */
.empty{text-align:center;padding:4rem 1rem;color:var(--muted)}
.empty .ico{font-size:2rem;margin-bottom:.75rem}