.tutorial-post{padding:0;display:grid;gap:0;overflow:hidden}.tutorial-post-hero{display:grid;gap:.8rem;padding:2.1rem 2.4rem 1.6rem;background:radial-gradient(circle at 80% 20%,rgba(0,255,127,.14),transparent 55%),linear-gradient(180deg,#081216eb,#060c0ee6);border-bottom:1px solid rgba(var(--border-color-rgb),.35)}.tutorial-post-kicker{font-size:.65rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(var(--text-color-rgb),.55)}.tutorial-post-title{font-size:2.05rem;letter-spacing:.08em;color:var(--text-color-bright)}.tutorial-post-description{color:rgba(var(--text-color-rgb),.78);max-width:640px;line-height:1.6}.tutorial-post-meta{display:flex;flex-wrap:wrap;gap:.6rem;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(var(--text-color-rgb),.6);margin-top:.4rem}.tutorial-post-meta-item{padding:.35rem .6rem;border-radius:999px;border:1px solid rgba(var(--border-color-rgb),.35);background:#050a0c99}.tutorial-post-body{display:grid;grid-template-columns:240px minmax(0,1fr);gap:2rem;padding:2rem 2.4rem 2.4rem}.tutorial-post-sidebar{display:grid;gap:1rem;align-content:start;position:sticky;top:110px}.tutorial-post-card{padding:.85rem .9rem;border-radius:14px;border:1px solid rgba(var(--border-color-rgb),.35);background:#060c0eb3}.tutorial-post-card-label{font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(var(--text-color-rgb),.5);margin-bottom:.6rem}.tutorial-post-card-item{display:flex;justify-content:space-between;gap:.6rem;font-size:.78rem;color:rgba(var(--text-color-rgb),.75)}.tutorial-post-card-key{text-transform:uppercase;letter-spacing:.12em;color:rgba(var(--text-color-rgb),.55);font-size:.6rem}.tutorial-post-card-value{color:#00ff7fd9;letter-spacing:.08em}.tutorial-post-tags{display:flex;flex-wrap:wrap;gap:.45rem}.tutorial-tag{font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;padding:.25rem .5rem;border-radius:999px;border:1px solid rgba(var(--border-color-rgb),.3);color:rgba(var(--text-color-rgb),.65)}.tutorial-post-back{text-decoration:none;text-transform:uppercase;letter-spacing:.18em;font-size:.62rem;color:rgba(var(--text-color-rgb),.7);padding:.5rem .7rem;border-radius:999px;border:1px solid rgba(var(--border-color-rgb),.35);text-align:center}.tutorial-post-back:hover{color:var(--accent-color-white);border-color:#00ff7f80;box-shadow:0 0 12px #00ff7f33}.tutorial-post-content{display:grid;gap:1.1rem;line-height:1.85;font-size:.98rem;color:rgba(var(--text-color-rgb),.82)}.tutorial-post-content h2,.tutorial-post-content h3{letter-spacing:.1em;text-transform:uppercase;color:rgba(var(--text-color-rgb),.92);position:relative;padding-left:.8rem}.tutorial-post-content h2:before,.tutorial-post-content h3:before{content:"";position:absolute;left:0;top:.3rem;bottom:.3rem;width:2px;background:#00ff7fb3}.tutorial-post-content h2{font-size:1.1rem}.tutorial-post-content h3{font-size:.95rem}.tutorial-post-content a{color:#00ff7fd9}.tutorial-post-content ul,.tutorial-post-content ol{padding-left:1.2rem;display:grid;gap:.4rem}.tutorial-post-content blockquote{margin:0;padding:.9rem 1.1rem;border-left:2px solid rgba(0,255,127,.6);background:#050a0c99;color:rgba(var(--text-color-rgb),.78)}.tutorial-post-content code{font-family:Iosevka,Share Tech Mono,monospace;font-size:.86rem;background:#050a0ccc;padding:.15rem .35rem;border-radius:6px}.tutorial-post-content pre{padding:.9rem 1rem;border-radius:12px;border:1px solid rgba(var(--border-color-rgb),.25);background:#050a0cb3;overflow-x:auto}@media(max-width:768px){.tutorial-post{padding:0}.tutorial-post-hero{padding:1.4rem 1.3rem 1.2rem}.tutorial-post-title{font-size:1.6rem}.tutorial-post-meta{gap:.35rem}.tutorial-post-meta-item{font-size:.62rem}.tutorial-post-body{grid-template-columns:1fr;padding:1.4rem 1.3rem 1.6rem}.tutorial-post-sidebar{position:static;order:2}.tutorial-post-content{order:1}}
