:root{
  --bg:#f7f4ef; --panel:#ffffff; --ink:#1c1917; --muted:#57534e;
  --line:#e7e0d6; --accent:#d9480f; --accent2:#c2255c; --card:#ffffff;
  --soft:#fff7ed; --shadow:0 8px 24px rgba(28,25,23,.08);
  --radius:12px; --font:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;
  --cta-bg:#e11d48; --cta-bg2:#f97316; --cta-ink:#ffffff;
}
*{box-sizing:border-box}
html{font-size:18px}
body{margin:0;font-family:var(--font);color:var(--ink);background:
  linear-gradient(180deg,#fffdf9 0%, var(--bg) 40%, #f3eee6 100%);
  line-height:1.75; min-height:100vh; padding-bottom:100px}
a{color:var(--accent2); text-decoration-thickness:1px; text-underline-offset:3px}
a:hover{color:var(--accent)}
.wrap{width:min(1120px, calc(100% - 32px)); margin:0 auto}
.wrap-narrow{width:min(760px, calc(100% - 32px)); margin:0 auto}
.topbar{position:sticky; top:0; z-index:20; backdrop-filter:blur(10px);
  background:rgba(255,253,249,.92); border-bottom:1px solid var(--line)}
.bar{display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:64px}
.mark{font-weight:800; font-size:1.1rem; color:var(--ink); text-decoration:none; letter-spacing:.04em}
.mark span{color:var(--accent2)}
.nav{display:flex; flex-wrap:wrap; gap:8px 14px}
.nav a{color:var(--muted); text-decoration:none; font-size:.88rem; padding:6px 0; border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current=page]{color:var(--ink); border-bottom-color:var(--accent)}
.ember-hero{padding:42px 0 28px; background:
  radial-gradient(700px 280px at 100% 0%, rgba(249,115,22,.14), transparent 60%),
  radial-gradient(560px 240px at 0% 30%, rgba(194,37,92,.10), transparent 55%),
  linear-gradient(180deg,#fffdf9, var(--bg));
  border-bottom:1px solid var(--line)}
.ember-hero h1{margin:8px 0 12px; font-size:clamp(1.6rem, 3vw, 2.2rem); line-height:1.25; color:var(--ink)}
.kicker{margin:0; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); font-weight:700}
.lede{margin:0; color:var(--muted); max-width:46rem; font-size:1.02rem}
.layout-rail{display:grid; grid-template-columns:220px 1fr; gap:28px; padding:28px 0 40px}
.rail{display:flex; flex-direction:column; gap:10px; position:sticky; top:84px; align-self:start}
.rail a{display:block; padding:12px 14px; background:var(--panel); border:1px solid var(--line);
  border-radius:var(--radius); text-decoration:none; color:var(--ink); box-shadow:var(--shadow)}
.rail a strong{display:block; font-size:.95rem}
.rail a span{display:block; color:var(--muted); font-size:.78rem; margin-top:4px; line-height:1.45}
.section{margin:0 0 28px}
.section h2{margin:0 0 14px; font-size:1.25rem; color:var(--ink)}
.section.lead p{color:var(--muted)}
.note{background:var(--soft); border:1px solid #fed7aa; border-radius:var(--radius); padding:12px 14px; color:#9a3412}
.cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px}
.card{display:flex; flex-direction:column; gap:8px; padding:16px; background:var(--card);
  border:1px solid var(--line); border-radius:var(--radius); text-decoration:none; color:inherit; box-shadow:var(--shadow)}
.card:hover{border-color:#fdba74; transform:translateY(-1px)}
.card h3{margin:0; font-size:1.02rem; line-height:1.4; color:var(--ink)}
.card p{margin:0; color:var(--muted); font-size:.9rem}
.meta{font-size:.78rem; color:#a8a29e}
.chip{display:inline-block; padding:2px 10px; border-radius:999px; background:#fff1f2; color:#be123c;
  border:1px solid #fecdd3; font-size:.78rem; text-decoration:none; margin-right:6px}
.prose{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:28px 26px; box-shadow:var(--shadow)}
.prose h1{margin-top:0; font-size:1.65rem; line-height:1.3}
.prose p{margin:0 0 1em; color:#292524}
.foot{border-top:1px solid var(--line); padding:28px 0 100px; color:var(--muted); font-size:.9rem; background:#fffdf9}
.foot a{color:var(--muted)}
.flinks{display:flex; flex-wrap:wrap; gap:12px 18px}
.age{opacity:.85}
.alist{display:flex;flex-direction:column;gap:14px;margin:0;padding:0}
.acard{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;color:inherit;
  box-shadow:var(--shadow);transition:border-color .15s,transform .15s}
.acard:hover{border-color:#fdba74;transform:translateY(-2px);color:inherit}
.acard i{flex:0 0 10px;width:10px;height:10px;margin-top:8px;border-radius:50%;
  background:linear-gradient(135deg,var(--cta-bg),var(--cta-bg2));box-shadow:0 0 0 4px rgba(225,29,72,.12)}
.acard span{display:flex;flex-direction:column;gap:6px;min-width:0}
.acard b{font-size:1.02rem;line-height:1.4;color:var(--ink);font-weight:700}
.acard em{font-style:normal;color:var(--muted);font-size:.9rem;line-height:1.55;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.related{display:flex;flex-direction:column;gap:10px;margin-top:28px;padding-top:18px;border-top:1px solid var(--line)}
.related strong{color:var(--ink)}
.related a{display:block;padding:12px 14px;background:var(--soft);border:1px solid #fed7aa;
  border-radius:10px;text-decoration:none;color:var(--ink);line-height:1.4}
.related a:hover{border-color:var(--accent);color:var(--accent)}
.meta-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.site-cta{position:fixed;z-index:40;left:50%;bottom:18px;transform:translateX(-50%);
  width:min(420px,calc(100% - 28px));box-sizing:border-box;
  display:flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:12px 22px;border-radius:999px;overflow:hidden;
  background:linear-gradient(105deg,var(--cta-bg) 0%,var(--cta-bg2) 55%,#fb923c 100%);
  background-size:200% 200%;
  color:var(--cta-ink)!important;text-decoration:none!important;
  box-shadow:0 10px 28px rgba(225,29,72,.38),0 0 0 3px rgba(255,255,255,.55);
  font-weight:800;letter-spacing:.02em;font-size:.98rem;
  animation:ctaFloat 2.8s ease-in-out infinite, ctaShine 4.5s ease-in-out infinite}
.site-cta::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 48%,transparent 62%);
  transform:translateX(-120%);animation:ctaSweep 2.6s ease-in-out infinite}
.site-cta:hover{filter:brightness(1.08);color:#fff!important}
.cta-blob{position:relative;z-index:1;width:10px;height:10px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 4px rgba(255,255,255,.35);animation:ctaPulse 1.4s ease-in-out infinite;flex-shrink:0}
.cta-label{position:relative;z-index:1;white-space:nowrap}
@keyframes ctaPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.25);opacity:.75}}
@keyframes ctaFloat{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-6px)}}
@keyframes ctaShine{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes ctaSweep{0%{transform:translateX(-120%)}45%,100%{transform:translateX(120%)}}
@media (prefers-reduced-motion:reduce){
  .site-cta,.site-cta::before,.cta-blob{animation:none}
}
@media (max-width:860px){
  .layout-rail{grid-template-columns:1fr}
  .rail{position:static;display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .bar{flex-direction:column;align-items:flex-start;padding:10px 0}
  .prose{padding:22px 16px}
  .cta-label{font-size:.9rem;white-space:normal;text-align:center;line-height:1.35}
  .site-cta{bottom:calc(12px + env(safe-area-inset-bottom));min-height:56px;padding:12px 16px;width:min(440px,calc(100% - 20px))}
  body{padding-bottom:88px}
}