/* Home page and /burn: the language row, the ad line with its command and star button, real Burn
   output in cards, and the differentiation line. Site palette: navy #07101E, panel #0C1828, teal #2ABCB4. */
.hero-langs{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 10px;margin:0;font:500 13px/1.4 'DM Sans',system-ui,sans-serif;color:#6F7F8C}
.hero-langs a{color:#94A3B0;text-decoration:underline;text-decoration-color:rgba(148,163,176,.4);text-underline-offset:3px}
.hero-langs a:hover{color:#E6EEF3}
.hero-langs [aria-current]{color:#E6EEF3}
.why-ad{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:1000px;text-align:center}
.why-ad-line{margin:0;font-size:18px;line-height:1.5;color:#E6EEF3;text-wrap:balance}
.why-ad-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;width:100%}
.why-ad-row .cmd,.hero .why-ad-row .cmd{flex:0 1 auto;min-width:0;width:auto;text-align:left}
.why-ad-row .cmd pre{font-size:14px}
.gh-star{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 14px;border:1px solid rgba(230,238,243,.2);border-radius:8px;color:#E6EEF3!important;font:600 14px/1 'DM Sans',system-ui,sans-serif;text-decoration:none!important;white-space:nowrap}
.gh-star:hover{border-color:rgba(230,238,243,.45)}
.gh-star svg{width:16px;height:16px;fill:#E3B341;flex:none}
.gh-star-count{padding-left:8px;border-left:1px solid rgba(230,238,243,.2);font-variant-numeric:tabular-nums}
.gh-star-count[hidden]{display:none}
.out-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.out-card{gap:12px}
.out-card h3{margin:0;font-size:18px;line-height:1.35}
.out-term{display:flex;flex-direction:column;background:#07101E;border:1px solid rgba(255,255,255,.08);border-radius:8px;overflow:hidden;min-width:0}
.out-scroll{overflow-x:auto;max-width:100%}
.out-scroll:focus-visible{outline:2px solid #2ABCB4;outline-offset:-2px}
.out-pre,.card .out-pre{margin:0;background:#07101E;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:14px 16px;font:400 12.5px/1.6 'JetBrains Mono',monospace;color:#CFD8DF;white-space:pre;overflow:visible;overflow-wrap:normal;text-align:left}
.out-pre code{white-space:inherit;overflow-wrap:inherit}
.out-pre.wrap{white-space:pre-wrap;overflow-wrap:anywhere}
.out-term .out-pre{border:0;border-radius:0;width:max-content;min-width:100%}
.out-term .out-pre.wrap{width:auto}
.out-tip,.card .out-tip{border-top:1px solid rgba(42,188,180,.35)!important;color:#E6EEF3}
.out-calendar,.card .out-calendar{line-height:1.45}
.out-caption{margin:0;font-size:13px;line-height:1.55;color:#94A3B0}
.out-caption code{font-size:12px}
.diff-line{margin:8px 0 0;max-width:820px;padding-left:16px;border-left:3px solid #2ABCB4;font-size:18px;line-height:1.55;color:#E6EEF3;text-wrap:pretty}
/* One card per row: the widest output line (80 characters) fits unwrapped on a desktop. */
@media(min-width:900px){
  .out-grid{gap:24px}
}
@media(max-width:899.98px){
  /* The home hero is left-aligned on phones; the /burn hero stays centered. */
  .recorded-hero .why-ad{align-items:stretch;text-align:left}
  .recorded-hero .why-ad-row,.recorded-hero .hero-langs{justify-content:flex-start}
  .why-ad-line{font-size:17px}
  .out-pre,.card .out-pre{font-size:11px;padding:12px}
  .diff-line{font-size:16px}
}