:root { --neon:#00e5ff; --bg:#050505; --line:rgba(255,255,255,.11); }
* { box-sizing:border-box; } html { background:var(--bg); }
body { margin:0; min-width:320px; color:#eefaff; background:var(--bg); font-family:Urbanist,sans-serif; line-height:1.7; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.24; background-image:linear-gradient(rgba(31,31,31,.7) 1px,transparent 1px),linear-gradient(90deg,rgba(31,31,31,.7) 1px,transparent 1px); background-size:50px 50px; mask-image:radial-gradient(circle at 50% 25%,black,transparent 70%); }
main { width:min(100% - 32px,860px); margin:0 auto; padding:32px 0 64px; position:relative; }
nav { display:flex; align-items:center; justify-content:space-between; padding:8px 0 48px; font-family:Syncopate,sans-serif; font-size:.7rem; letter-spacing:.06em; }
.brand { color:#fff; font-weight:700; text-decoration:none; font-size:1rem; } .brand span { color:var(--neon); }
.back { color:rgba(255,255,255,.7); text-decoration:none; transition:color .2s; } .back:hover,a:hover { color:var(--neon); }
article { padding:clamp(24px,5vw,48px); background:rgba(255,255,255,.035); border:1px solid var(--line); border-radius:24px; backdrop-filter:blur(12px); }
.eyebrow { margin:0 0 12px; color:var(--neon); font:700 .68rem Syncopate,sans-serif; letter-spacing:.11em; }
h1,h2 { font-family:Syncopate,sans-serif; line-height:1.3; } h1 { margin:0; font-size:clamp(1.55rem,4vw,2.25rem); } h2 { margin:36px 0 8px; color:var(--neon); font-size:clamp(.95rem,2.2vw,1.15rem); }
p { margin:0 0 16px; color:rgba(238,250,255,.82); } .updated { color:rgba(238,250,255,.52); font-size:.92rem; margin:16px 0 28px; } strong { color:#fff; } a { color:var(--neon); } footer { padding-top:24px; color:rgba(255,255,255,.4); font:600 .65rem Syncopate,sans-serif; text-align:center; letter-spacing:.06em; }