:root{color-scheme:dark;--bg:#090b19;--text:#ecf4ff;--muted:#a5bed2;--edge:#3f4e68;--teal:#91fff0}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse 70% 45% at 15% 0,#2e365b 0,transparent 80%),var(--bg);color:var(--text);font:16px/1.65 system-ui,-apple-system,Segoe UI,Arial,sans-serif;min-height:100vh}
a{color:var(--teal);outline-offset:4px}a:focus-visible{outline:3px solid #ffd79b}header{max-width:1060px;margin:auto;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.5rem 1rem;border-bottom:1px solid var(--edge)}
header a:first-child{font-size:1.2rem;font-weight:900;letter-spacing:.04em;text-decoration:none;color:#fff}header span{color:var(--teal)}
main{max-width:1000px;padding:4rem 1rem;margin:auto}.eyebrow{font-size:.75rem;color:var(--teal);letter-spacing:.16em;font-weight:900}.card{display:grid;grid-template-columns:100px 1fr;gap:2rem;padding:2rem;border-radius:20px;background:linear-gradient(150deg,#1c2a46,#101928);border:1px solid var(--edge)}
.avatar{font-size:4rem;color:var(--teal);display:flex;align-items:flex-start;justify-content:center}
h1{font-size:clamp(2rem,5vw,3.7rem);margin:0;line-height:1.2;overflow-wrap:anywhere}h2{font-size:1.55rem;margin:.2rem 0}.handle{color:var(--teal);font-weight:700}.category{color:#edc88d;font-size:.87rem;letter-spacing:.08em;text-transform:uppercase}.description{font-size:1.14rem;color:#e5eef9}.small{color:var(--muted);font-size:.9rem;max-width:65ch}.primary{display:inline-block;text-align:center;padding:.85rem 1.2rem;border-radius:10px;background:linear-gradient(90deg,#8bfff1,#a7baff);color:#071724;font-weight:900;text-decoration:none;margin-top:1rem;max-width:100%}
.share,.join{border-bottom:1px solid var(--edge);padding:2rem 0}.share p,.join p{color:var(--muted)}.share-options{display:flex;gap:.8rem;flex-wrap:wrap}.share-options a,.join a{display:inline-flex;border:1px solid #4a6576;padding:.7rem 1rem;text-decoration:none;border-radius:8px;background:#101c32;font-weight:800}
footer{text-align:center;padding:2rem 1rem;border-top:1px solid var(--edge);font-size:.83rem;color:var(--muted)}
@media(max-width:650px){main{padding:2rem 1rem}.card{grid-template-columns:1fr;padding:1.25rem;gap:.25rem}.avatar{justify-content:flex-start;font-size:2rem}header{flex-wrap:wrap}.primary{width:100%}}
