:root{--bg:#0e1016;--fg:#e8ecf5;--sub:#95a0b8;--accent:#b48cff;--card:#161a24;--line:#232a38}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);
font:16px/1.6 ui-sans-serif,system-ui,Segoe UI,sans-serif}
nav{display:flex;gap:18px;align-items:center;padding:14px 22px;border-bottom:1px solid var(--line)}
nav .brand{font-weight:800;color:var(--accent);margin-right:auto;font-size:19px}
nav a{color:var(--sub);text-decoration:none}nav a.on,nav a:hover{color:var(--fg)}
main{max-width:960px;margin:0 auto;padding:34px 22px}
.hero h1{font-size:44px;margin:0}.hero .tag{color:var(--sub);font-size:19px}
.socials{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.soc{color:var(--fg);text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:6px 15px;font-size:14px}
.soc:hover{border-color:var(--accent)}.soc.pat{background:var(--accent);color:#1a1030;border:0}
.about{margin-top:38px}.cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:34px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;text-decoration:none;color:var(--fg)}
.card:hover{border-color:var(--accent)}.card h3{margin:0 0 6px}.card p{color:var(--sub);margin:0}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin:14px 0 34px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;text-decoration:none;color:var(--fg)}
.tile img{width:100%;display:block;aspect-ratio:3/4;object-fit:cover}.tile span{display:block;padding:8px 10px;font-size:14px}
.empty{color:var(--sub)}.vid{margin:22px 0}.vid iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:12px}
@media(max-width:640px){.cards{grid-template-columns:1fr}.hero h1{font-size:34px}}
footer{max-width:960px;margin:0 auto;padding:26px 22px;color:var(--sub);border-top:1px solid var(--line);font-size:13px}