*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:'Inter',sans-serif;line-height:1.6}
.glow{position:fixed;z-index:-1;pointer-events:none;filter:blur(90px)}
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(5,5,5,.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--card-border);height:60px;display:flex;align-items:center;padding:0 24px}
.navbar-inner{max-width:800px;margin:0 auto;width:100%;display:flex;align-items:center;justify-content:space-between}
.nav-logo{font-family:'JetBrains Mono',monospace;font-size:15px;font-weight:700;color:white;text-decoration:none}
.nav-back{color:var(--muted-light);text-decoration:none;font-size:14px;font-weight:500;transition:color .2s}
.nav-back:hover{color:white}
.post-wrap{max-width:720px;margin:0 auto;padding:100px 24px 100px}
.post-meta{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:28px}
.post-cat{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--accent);background:var(--accent-dim);border:1px solid var(--accent-border);padding:4px 12px;border-radius:50px}
.post-date{font-size:13px;color:var(--muted);font-family:'JetBrains Mono',monospace}
.read-time{font-size:13px;color:var(--muted)}
h1{font-family:'Outfit',sans-serif;font-size:clamp(28px,5vw,44px);font-weight:900;line-height:1.15;letter-spacing:-0.5px;margin-bottom:32px}
.post-body h2{font-family:'Outfit',sans-serif;font-size:24px;font-weight:800;margin:52px 0 16px;letter-spacing:-0.3px}
.post-body h3{font-family:'Outfit',sans-serif;font-size:18px;font-weight:700;margin:32px 0 12px;color:var(--muted-light)}
.post-body ul,.post-body ol{padding-left:24px;margin-bottom:22px}
.post-body code{font-family:'JetBrains Mono',monospace;font-size:14px;background:rgba(255,255,255,.07);padding:2px 7px;border-radius:5px;color:#93c5fd}
.post-body pre{background:rgba(255,255,255,.03);border:1px solid var(--card-border);border-radius:14px;padding:24px;overflow-x:auto;margin:28px 0}
.post-body pre code{background:none;padding:0;color:#c0cdd8;font-size:14px;line-height:1.7}
.callout p{font-size:15px;color:var(--muted-light);margin:0}
footer{border-top:1px solid var(--card-border);padding:40px 0;text-align:center;color:var(--muted);font-size:14px}
footer a{color:var(--text);text-decoration:none;margin:0 12px;transition:color .2s}
footer a:hover{color:var(--accent)}
.interactions-wrap{margin-top:64px;padding-top:52px;border-top:1px solid var(--card-border)}
.like-section{display:flex;align-items:center;gap:14px;margin-bottom:56px}
.like-btn{display:inline-flex;align-items:center;gap:10px;background:var(--card-bg);border:1px solid var(--card-border);color:var(--muted-light);padding:11px 22px;border-radius:50px;font-size:15px;cursor:pointer;transition:all .25s;font-family:'Inter',sans-serif}
.like-btn:hover{border-color:rgba(248,113,113,.5);color:#f87171}
.like-btn.liked{background:rgba(248,113,113,.1);border-color:rgba(248,113,113,.4);color:#f87171}
.like-btn:disabled{opacity:.6;cursor:not-allowed}
.heart-icon{font-size:17px;line-height:1}
.like-label{font-size:14px;color:var(--muted)}
.comments-title{font-family:'Outfit',sans-serif;font-size:22px;font-weight:800;margin-bottom:28px;display:flex;align-items:center;gap:12px}
.comments-list{display:flex;flex-direction:column;gap:14px;margin-bottom:40px}
.no-comments{font-size:15px;color:var(--muted);padding:16px 0}
.comment-item{background:var(--card-bg);border:1px solid var(--card-border);border-radius:14px;padding:20px 24px}
.comment-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.comment-author{font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;color:white}
.comment-time{font-size:12px;color:var(--muted);font-family:'JetBrains Mono',monospace}
.comment-body{font-size:15px;color:var(--muted-light);line-height:1.65;margin:0}
.comment-form{background:var(--card-bg);border:1px solid var(--card-border);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:14px}
.comment-form h3{font-family:'Outfit',sans-serif;font-size:17px;font-weight:700;margin:0}
.form-input,.form-textarea{background:rgba(255,255,255,.04);border:1px solid var(--card-border);border-radius:10px;color:white;font-family:'Inter',sans-serif;font-size:15px;padding:12px 16px;transition:border-color .2s;width:100%;outline:none}
.form-input::placeholder,.form-textarea::placeholder{color:var(--muted)}
.form-textarea{resize:vertical;min-height:100px;line-height:1.6}
.submit-btn:hover{background:#e2e2e2;transform:translateY(-1px)}
.submit-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.post-body a{color:var(--accent,#4ade80);text-decoration:underline;text-decoration-color:rgba(255,255,255,.25);text-underline-offset:3px;transition:text-decoration-color .2s}
.post-body a:hover{text-decoration-color:currentColor}
