:root {
  --bg-dark: #040812; --bg-card: rgba(14, 22, 38, 0.75); --border-color: rgba(255, 255, 255, 0.09);
  --border-highlight: rgba(0, 196, 140, 0.35); --emerald: #00c48c; --cyan: #38bdf8;
  --text-white: #f8fafc; --text-gray: #94a3b8; --text-muted: #64748b; --max-width: 760px;
}
* { box-sizing: border-box; margin:0; padding:0; }
html { scroll-behavior: smooth; font-family: 'Plus Jakarta Sans', 'Inter', sans-serif; background: var(--bg-dark); color: var(--text-white); }
body { min-height:100vh; }
.wrap { max-width: var(--max-width); margin: 0 auto; padding: 0 24px; }
header { padding: 24px 0; border-bottom: 1px solid var(--border-color); }
header .wrap { display:flex; align-items:center; justify-content:space-between; }
.logo img { height: 40px; width:40px; object-fit:cover; border-radius:8px; }
.back { color: var(--emerald); text-decoration:none; font-size:14px; font-weight:600; }
article { padding: 50px 0 30px; }
.eyebrow { display:inline-block; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--emerald); background:rgba(0,196,140,.08); border:1px solid var(--border-highlight); padding:6px 14px; border-radius:999px; margin-bottom:20px; }
h1 { font-size: clamp(28px,5vw,42px); font-weight:800; line-height:1.15; letter-spacing:-.01em; margin-bottom:14px; }
.meta { color: var(--text-muted); font-size:14px; margin-bottom:36px; }
.content p { color: var(--text-gray); font-size:17px; line-height:1.85; margin-bottom:20px; }
.content h2 { font-size:22px; font-weight:800; margin: 36px 0 14px; color: var(--text-white); }
.content h3 { font-size:18px; font-weight:700; margin: 26px 0 10px; color: var(--text-white); }
.content ul, .content ol { color: var(--text-gray); font-size:16px; line-height:1.8; margin: 0 0 20px 22px; }
.content li { margin-bottom: 6px; }
.content strong { color: var(--text-white); }
.content blockquote { border-left: 3px solid var(--emerald); padding: 4px 20px; margin: 24px 0; color: var(--text-white); font-size:18px; font-weight:600; font-style:italic; }
.share-bar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding: 28px 0; border-top:1px solid var(--border-color); border-bottom:1px solid var(--border-color); margin: 40px 0; }
.share-label { font-size:13px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:.04em; margin-right:6px; }
.share-btn { display:inline-flex; align-items:center; gap:6px; padding:9px 16px; border-radius:999px; background:var(--bg-card); border:1px solid var(--border-color); color:var(--text-white); text-decoration:none; font-size:13px; font-weight:700; transition: border-color .2s, transform .2s; cursor:pointer; }
.share-btn:hover { border-color: var(--border-highlight); transform: translateY(-2px); }
.author-box { display:flex; align-items:center; gap:14px; background:var(--bg-card); border:1px solid var(--border-color); border-radius:16px; padding:20px; margin-top:20px; }
.author-box img { width:52px; height:52px; border-radius:50%; object-fit:cover; }
.author-box .name { font-weight:700; font-size:15px; }
.author-box .role { font-size:13px; color:var(--text-muted); }
footer { padding: 40px 0; text-align:center; }
footer p { color: var(--text-muted); font-size:13px; }