.cpill{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11px;
        font-weight:600;letter-spacing:.03em;text-transform:uppercase;padding:5px 10px;border-radius:999px;
        background:var(--fg-soft);color:var(--fg)}
  .cpill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
  .cpill.c-nor{color:#f0c065;background:color-mix(in oklch,#e0a13a 26%,transparent)}
  .cpill.c-for{color:#cfe98a;background:color-mix(in oklch,var(--accent) 26%,transparent)}
  .cpill.c-sic{color:#f0a79c;background:color-mix(in oklch,#d9564a 24%,transparent)}
  .cpill.c-amb{color:#7fe0c0;background:color-mix(in oklch,#2fae86 24%,transparent)}
  .cpill.c-azi{color:#aebff0;background:color-mix(in oklch,#5a76d9 24%,transparent)}

  .art-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:20px;
        font-family:var(--font-mono);font-size:13px;color:var(--on-ink-muted)}
  .art-meta .dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.6}

  .art-cover{margin:-64px auto 0;max-width:var(--container);padding:0 var(--gutter);position:relative;z-index:2}
  .art-cover img{width:100%;aspect-ratio:16/7;object-fit:cover;border-radius:var(--radius-lg);
        box-shadow:0 24px 60px -24px rgba(10,20,36,.4);display:block}
  @media(max-width:600px){.art-cover img{aspect-ratio:16/10}}

  .prose{max-width:860px;margin:0 auto;font-size:18px;line-height:1.72;color:var(--fg)}
  .prose .lede{font-size:20px;line-height:1.6;color:var(--fg);font-weight:500;margin:0 0 28px}
  .prose h2{font-size:24px;letter-spacing:-.01em;margin:38px 0 12px}
  .prose p{margin:0 0 20px;color:#3f4952}
  .prose ul{margin:0 0 22px;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:11px}
  .prose ul li{position:relative;padding-left:28px;color:#3f4952}
  .prose ul li::before{content:"";position:absolute;left:2px;top:9px;width:9px;height:9px;border-radius:3px;
        background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}

  .art-tags{max-width:860px;margin:36px auto 0;display:flex;flex-wrap:wrap;gap:8px;
        padding-top:26px;border-top:1px solid var(--border)}
  .art-tags .tg{font-family:var(--font-mono);font-size:12px;color:var(--muted);
        padding:6px 11px;border:1px solid var(--border);border-radius:999px;background:var(--surface)}

  .art-share{max-width:860px;margin:22px auto 0;display:flex;align-items:center;gap:12px;
        font-size:14px;color:var(--muted)}
  .art-share button{cursor:pointer;font:inherit;font-size:13px;display:inline-flex;align-items:center;gap:7px;
        padding:8px 14px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--fg)}
  .art-share button:hover{border-color:var(--accent-line)}
  .art-share button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2}

  .rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  @media(max-width:920px){.rel-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:600px){.rel-grid{grid-template-columns:1fr}}
  .rel{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);
        border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}
  .rel:hover{transform:translateY(-3px);box-shadow:0 20px 40px -20px rgba(10,20,36,.26)}
  .rel .rm{aspect-ratio:16/10;overflow:hidden;background:var(--fg-soft)}
  .rel .rm img{width:100%;height:100%;object-fit:cover;display:block}
  .rel .rb{padding:16px 18px 20px;display:flex;flex-direction:column;gap:9px;flex:1}
  .rel h3{font-size:16px;line-height:1.3;margin:0}
  .rel h3 a{color:var(--fg);text-decoration:none}.rel:hover h3 a{color:var(--accent-ink)}
  .rel .rf{margin-top:auto;font-family:var(--font-mono);font-size:11.5px;color:var(--muted)}