:root{
  --pink:#ff1493;
  --hotpink:#ff69b4;
  --black:#0b0b0b;
  --white:#ffffff;
  --gray:#222;
  --accent:#ffd1ea;
  --rail:#2b2b2b;
  --card:#1a1a1a;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:linear-gradient(180deg,var(--hotpink),var(--pink));color:var(--white);font-family:'Poppins',Arial,Helvetica,sans-serif}
a{color:#fff;text-decoration:none}
a:hover{text-decoration:underline}
header{
  background:var(--black);
  padding:24px 16px;
  text-align:center;
  position:sticky;top:0;z-index:10;
  border-bottom:4px solid var(--pink);
}
.site-title{font-size:clamp(28px,4vw,44px);margin:0;letter-spacing:1px}
.subtitle{margin:6px 0 0;color:#f8c7e6;font-weight:500}

nav{
  background:linear-gradient(90deg,var(--pink),var(--hotpink));
  display:flex;flex-wrap:wrap;gap:10px;justify-content:center;
  padding:10px 12px;border-bottom:4px dashed #fff6;
}
nav a{
  background:#000000aa;
  padding:10px 14px;border-radius:999px;
  font-weight:700;border:2px solid #fff3;
}
nav a.active{outline:3px solid #fff; background:#000;}

.main{
  max-width:1000px;margin:24px auto;padding:16px;
  background:#00000066;border:2px solid #ffffff22;border-radius:16px;
  box-shadow:0 10px 40px #0008;
}
footer{
  margin:40px 0 0; padding:18px; text-align:center;
  background:#0009; border-top:4px solid var(--pink);
}

/* Train banner */
.banner{
  position:relative;
  background:#000c;
  border:2px solid #fff3;border-radius:14px;
  padding:14px 14px 40px 14px;overflow:hidden;
}
.track{position:absolute; left:0; right:0; bottom:8px; height:14px;
  background:repeating-linear-gradient(90deg,var(--rail) 0 40px,#444 40px 60px);
  border-top:4px solid #666;border-bottom:4px solid #666;
}
.train{
  width:120px; position:absolute; bottom:18px; left:-140px;
  animation:chug 18s linear infinite;
}
@keyframes chug{0%{left:-140px} 100%{left:calc(100% + 140px)}}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin:16px 0}
.card{
  background:var(--card); border:1px solid #ffffff22; border-radius:14px;
  padding:16px; box-shadow:0 8px 24px #0007;
}
.card h3{margin:0 0 8px}
.badge{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--pink);font-size:12px;font-weight:700}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.gallery img{width:100%; height:160px; object-fit:cover; border-radius:10px; cursor:pointer; border:2px solid #fff3}
.lightbox{
  position:fixed; inset:0; display:none; align-items:center; justify-content:center;
  background:#000c; z-index:1000;
}
.lightbox img{max-width:90vw; max-height:80vh; border-radius:12px; border:4px solid #fff}
.lightbox.show{display:flex}
.lightbox .close{position:absolute; top:16px; right:16px; background:#000; border:2px solid #fff; color:#fff; padding:8px 10px; border-radius:8px; cursor:pointer}

/* Post styles */
.post{background:var(--card); border:1px solid #ffffff22; border-radius:14px; padding:16px; margin:16px 0}
.post time{opacity:.8; font-size:.9rem}
.post .tags{margin-top:8px}
.tag{display:inline-block;margin:4px 6px 0 0; padding:4px 8px; border-radius:999px; background:#333; border:1px solid #fff3; font-size:.8rem}

/* Table-like list */
.list{display:grid;gap:12px;margin:16px 0}
.item{display:flex;gap:10px;align-items:flex-start;background:#141414;border:1px solid #ffffff22;padding:12px;border-radius:12px}
.item .emoji{font-size:22px; line-height:1}
.item .meta{opacity:.8; font-size:.9rem}