:root{
  --pink:#F4A8C2; --purple:#8E6BD1; --purple-deep:#6E47B8;
  --navy:#1A1B3A; --muted:#6B6B82; --bg:#FAFAFD; --surface:#fff;
  --outline:#ECEAF3; --pink-soft:#FBEAF1;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--navy);
  font-family:'Inter',-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  line-height:1.55; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.brand,.hero h1,.stat .num{font-family:'Poppins',inherit}
a{color:var(--purple-deep);text-decoration:none}
.grad{
  background:linear-gradient(90deg,var(--pink),var(--purple));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}
/* Readable column for feeds + articles inside the wide wrap. */
.card{max-width:760px;margin-left:auto;margin-right:auto}
.post-list,article.post{max-width:820px;margin-left:auto;margin-right:auto}

/* Header / nav */
header.site{
  position:sticky;top:0;z-index:10;background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--outline);
}
header.site .wrap{display:flex;align-items:center;gap:18px;height:60px}
.brand{font-weight:800;font-size:22px}
nav.main{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap}
nav.main a{
  padding:8px 14px;border-radius:20px;font-weight:600;color:var(--muted);
  font-size:14.5px;
}
nav.main a.active,nav.main a:hover{
  color:#fff;background:linear-gradient(90deg,var(--pink),var(--purple));
}

/* Hero */
.hero{
  background:
    radial-gradient(1100px 480px at 50% -120px, rgba(142,107,209,.20), transparent 70%),
    linear-gradient(180deg,#FBEFF5 0%, #F4ECFD 55%, var(--bg) 100%);
  padding:96px 0 84px; text-align:center;
  border-bottom:1px solid var(--outline);
}
.hero h1{font-size:54px;line-height:1.08;margin:0 0 16px;color:var(--navy);
  font-weight:800;letter-spacing:-.5px}
.hero p{color:#4a4660;max-width:600px;margin:0 auto 26px;font-size:19px;line-height:1.6}
@media(max-width:560px){.hero{padding:64px 0 56px}.hero h1{font-size:36px}.hero p{font-size:16.5px}}
.btn{
  display:inline-block;padding:13px 26px;border-radius:18px;font-weight:700;
  color:#fff;background:linear-gradient(90deg,var(--pink),var(--purple));
  box-shadow:0 12px 28px rgba(110,71,184,.32);
}
.btn.ghost{background:#fff;color:var(--purple-deep);box-shadow:none;
  border:1px solid var(--outline)}

/* Sections */
main{padding:30px 0 60px}
.page-title{display:flex;align-items:baseline;gap:10px;margin:6px 0 4px}
.page-title h1{font-size:30px;margin:0}
.sub{color:var(--muted);margin:0 0 22px}

/* Cards */
.card{
  background:var(--surface);border:1px solid var(--outline);
  border-radius:20px;padding:18px;margin-bottom:14px;
}
.card .top{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.avatar{
  width:38px;height:38px;border-radius:50%;flex:none;
  background:linear-gradient(135deg,var(--pink),var(--purple));
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:15px;
}
.handle{font-weight:700;font-size:15px}
.time{color:var(--muted);font-size:12.5px}
.pill{
  margin-left:auto;background:var(--pink-soft);color:var(--purple-deep);
  padding:4px 12px;border-radius:20px;font-size:12.5px;font-weight:600;
}
.body{font-size:15.5px;color:#2a2b45;white-space:pre-wrap;word-wrap:break-word}
.meta{display:flex;gap:14px;margin-top:12px;color:var(--muted);font-size:13px}
.meta .chip{
  background:var(--pink-soft);color:var(--purple-deep);padding:4px 10px;
  border-radius:14px;font-weight:600;
}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tag{background:var(--pink-soft);color:var(--purple-deep);padding:4px 11px;
  border-radius:14px;font-size:12.5px;font-weight:600}

/* Empty + footer */
.empty{text-align:center;color:var(--muted);padding:50px 0}
footer.site{border-top:1px solid var(--outline);padding:26px 0;color:var(--muted);
  font-size:13.5px}
footer.site a{margin-right:16px}
.cta-band{background:var(--pink-soft);border-radius:22px;padding:24px;
  text-align:center;margin:10px 0 26px}

/* Compose + interactive actions (Phase 2) */
.compose{background:var(--surface);border:1px solid var(--outline);
  border-radius:20px;padding:16px;margin-bottom:20px}
.compose textarea{width:100%;border:1px solid var(--outline);border-radius:14px;
  padding:12px;font:inherit;resize:vertical;min-height:74px;color:var(--navy)}
.compose .row{display:flex;gap:10px;align-items:center;margin-top:10px;flex-wrap:wrap}
.compose select{padding:9px 12px;border-radius:14px;border:1px solid var(--outline);
  font:inherit;background:#fff;color:var(--navy)}
.btn-sm{display:inline-block;padding:9px 18px;border-radius:16px;font-weight:700;
  color:#fff;background:linear-gradient(90deg,var(--pink),var(--purple));
  border:0;cursor:pointer;font-size:14px}
.btn-sm:disabled{opacity:.55;cursor:default}
.act{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.act button{background:var(--pink-soft);color:var(--purple-deep);border:0;
  padding:7px 13px;border-radius:14px;font-weight:600;cursor:pointer;font-size:13px}
.act button:hover{background:#f3e6f7}
.note{font-size:12.5px;color:var(--muted);margin-top:8px}
/* Promo stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:6px 0}
.stat{background:var(--surface);border:1px solid var(--outline);border-radius:18px;
  padding:18px 10px;text-align:center}
.stat .num{font-size:30px;font-weight:800;line-height:1}
.stat .lbl{color:var(--muted);font-size:12.5px;margin-top:5px}
@media(max-width:560px){.stats{grid-template-columns:repeat(2,1fr)}}

/* Features */
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.feature{background:var(--surface);border:1px solid var(--outline);border-radius:20px;
  padding:22px}
.feature .ficon{font-size:32px}
.feature h3{margin:12px 0 6px;font-size:18px}
.feature p{color:var(--muted);margin:0;font-size:14.5px;line-height:1.6}

/* Blog */
.post-list a{display:block;background:var(--surface);border:1px solid var(--outline);
  border-radius:20px;padding:18px;margin-bottom:12px}
.post-list h3{margin:0 0 6px;font-size:19px;color:var(--navy)}
.post-list p{margin:0;color:var(--muted);font-size:14.5px}
article.post{max-width:680px;margin:0 auto}
article.post h1{font-size:32px;margin:6px 0 4px}
article.post .lead{color:var(--muted);font-size:17px;margin:0 0 22px}
article.post h2{font-size:22px;margin:26px 0 8px}
article.post p{font-size:16px;line-height:1.7;color:#2a2b45}
article.post .byline{color:var(--muted);font-size:13px;margin-bottom:20px}
article.post ul{font-size:16px;line-height:1.8;color:#2a2b45;padding-left:20px}

/* How it works steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.step{background:var(--surface);border:1px solid var(--outline);border-radius:20px;padding:20px;text-align:center}
.step .snum{width:40px;height:40px;border-radius:50%;margin:0 auto 10px;
  background:linear-gradient(135deg,var(--pink),var(--purple));color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px}
.step h3{margin:0 0 6px;font-size:17px}
.step p{color:var(--muted);margin:0;font-size:14px}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
.stars{color:#F5A623;font-size:16px;letter-spacing:2px;margin-bottom:8px}

/* Footer columns */
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1.2fr 1fr;gap:22px}
.foot-grid p{margin:0;font-size:14px}
.foot-h{font-weight:700;color:var(--navy);margin-bottom:8px;font-size:14.5px}
.foot-grid a{display:block;color:var(--muted);padding:3px 0;font-size:14px}
.foot-grid a:hover{color:var(--purple-deep)}
@media(max-width:640px){.foot-grid{grid-template-columns:1fr 1fr}}

/* ── Polish pass ─────────────────────────────────────────── */
.card,.feature,.step,.stat,.post-list a{
  box-shadow:0 6px 22px rgba(26,27,58,.05);
}
.feature,.step,.post-list a{transition:transform .16s ease, box-shadow .16s ease}
.feature:hover,.step:hover,.post-list a:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(110,71,184,.13);
}
.hero .btn{padding:15px 30px;font-size:16px}
.page-title h1{font-size:32px;font-weight:800}
section.hero h1 .grad{font-weight:800}

/* Community peek as a side-by-side grid (landing) */
.community{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.community .card{max-width:none;margin:0}
.community .body{font-size:14.5px}

/* Article cards as a grid (landing) */
.post-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:16px;max-width:none}
.post-grid a{margin:0;height:100%}

/* Blog card grid polish */
.post-grid a{display:flex;flex-direction:column;gap:6px}
.post-grid .time{margin-bottom:2px}
.post-grid .readmore{margin-top:auto;padding-top:10px;color:var(--purple-deep);
  font-weight:700;font-size:14px}

/* ── Admin operator console ─────────────────────────────── */
.admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.seed-card{background:var(--surface);border:1px solid var(--outline);border-radius:18px;
  padding:16px;display:flex;align-items:center;gap:12px;box-shadow:0 6px 20px rgba(26,27,58,.05);
  transition:transform .14s ease, box-shadow .14s ease}
.seed-card:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(110,71,184,.14)}
.seed-card .h{font-weight:800;color:var(--navy);font-size:15px}
.seed-card .s{color:var(--muted);font-size:12.5px;margin-top:2px}
.seed-card .badges{margin-left:auto;display:flex;flex-direction:column;gap:6px;align-items:flex-end}
.badge-purple{background:linear-gradient(90deg,#8E6BD1,#6E47B8);color:#fff;padding:4px 11px;
  border-radius:20px;font-size:11.5px;font-weight:700;white-space:nowrap}
.badge-pink{background:linear-gradient(90deg,#F4A8C2,#8E6BD1);color:#fff;padding:4px 11px;
  border-radius:20px;font-size:11.5px;font-weight:700;white-space:nowrap}
.seed-card.attn{border-color:rgba(142,107,209,.5)}
.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:6px 0 22px}
@media(max-width:640px){.admin-stats{grid-template-columns:repeat(2,1fr)}}
