/* Shared style for prowl.world content pages (blog, /aso, /press).
   Inlined into each HTML file so a single static-file fetch is enough — no
   second roundtrip for crawlers, no FOUC for humans. */

:root{
  --bg:#07070a;
  --bg-2:#0c0c10;
  --bg-3:#111116;
  --ink:#ececf0;
  --ink-dim:#a0a0a8;
  --ink-faint:#56565e;
  --line:rgba(255,255,255,.08);
  --line-2:rgba(255,255,255,.14);
  --accent:#10b981;
  --accent-2:#34d399;
  --accent-glow:rgba(16,185,129,.35);
  --accent-tint:rgba(16,185,129,.08);
  --warn:#f59e0b;
  --bad:#ef4444;
  --sans:'Geist','Inter',-apple-system,system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --serif:'Instrument Serif',ui-serif,Georgia,serif;
  --pad-x:clamp(1.25rem,4vw,2.5rem);
  --col:760px;
  --col-wide:1100px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .15s}
a:hover{border-bottom-color:var(--accent)}
::selection{background:var(--accent);color:#000}

body::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(var(--line) 1px,transparent 1px),
    linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse at 50% 0%,#000 0%,transparent 70%);
}

header.site{
  position:sticky;top:0;z-index:50;
  background:rgba(7,7,10,.85);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  padding:.85rem var(--pad-x);
}
header.site .inner{
  max-width:var(--col-wide);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
header.site .brand{font-family:var(--mono);font-weight:600;letter-spacing:-.02em;color:var(--ink);font-size:1rem;border:0}
header.site .brand strong{color:var(--accent)}
header.site nav{display:flex;gap:1.25rem;font-family:var(--mono);font-size:.85rem}
header.site nav a{color:var(--ink-dim);border:0}
header.site nav a:hover{color:var(--accent)}

main.article{
  position:relative;z-index:1;
  max-width:var(--col);margin:0 auto;
  padding:3rem var(--pad-x) 6rem;
}

.meta{
  font-family:var(--mono);font-size:.78rem;letter-spacing:.04em;color:var(--ink-faint);
  text-transform:uppercase;display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem;
}
.meta .tag{color:var(--accent)}

h1{
  font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,5.5vw,3.6rem);
  line-height:1.05;letter-spacing:-.025em;margin-bottom:1.5rem;color:var(--ink);
}
h1 em{color:var(--accent);font-style:italic}

.lede{
  font-family:var(--serif);font-style:italic;font-size:1.4rem;line-height:1.5;
  color:var(--ink-dim);margin-bottom:3rem;padding-bottom:2rem;border-bottom:1px solid var(--line);
}

h2{
  font-family:var(--sans);font-weight:600;font-size:1.7rem;line-height:1.2;
  letter-spacing:-.02em;margin-top:3.5rem;margin-bottom:1rem;color:var(--ink);
  border-top:1px solid var(--line);padding-top:2.5rem;
}
h2:first-of-type{border-top:0;padding-top:0;margin-top:0}

h3{
  font-family:var(--sans);font-weight:600;font-size:1.2rem;line-height:1.3;
  margin-top:2rem;margin-bottom:.6rem;color:var(--ink);letter-spacing:-.01em;
}

p{font-size:1.05rem;line-height:1.65;color:var(--ink);margin-bottom:1.2rem}
p.dim{color:var(--ink-dim)}

ul, ol{margin:0 0 1.5rem 1.5rem;color:var(--ink)}
li{font-size:1.05rem;line-height:1.65;margin-bottom:.5rem}
li > ul, li > ol{margin-top:.4rem;margin-bottom:.4rem}

strong{color:var(--ink);font-weight:600}
em{font-style:italic;color:var(--ink-dim)}

code{
  font-family:var(--mono);font-size:.9em;color:var(--accent-2);
  background:var(--bg-3);padding:.1em .4em;border-radius:3px;
  border:1px solid var(--line);
}

pre{
  background:var(--bg-3);border:1px solid var(--line);border-radius:6px;
  padding:1.25rem;margin:1.5rem 0;overflow-x:auto;
  font-family:var(--mono);font-size:.85rem;line-height:1.55;color:var(--ink);
}
pre code{background:0;padding:0;border:0;color:inherit;font-size:inherit}

blockquote{
  border-left:3px solid var(--accent);padding:.5rem 0 .5rem 1.25rem;
  margin:1.5rem 0;color:var(--ink-dim);font-style:italic;
}

table{
  width:100%;border-collapse:collapse;margin:1.5rem 0;
  font-size:.95rem;
}
th, td{
  border:1px solid var(--line);padding:.7rem .9rem;text-align:left;
  vertical-align:top;
}
th{
  background:var(--bg-3);font-weight:600;color:var(--ink);
  font-family:var(--mono);font-size:.85rem;letter-spacing:.02em;
}
td{color:var(--ink-dim)}
td strong{color:var(--ink)}

.callout{
  background:var(--accent-tint);border:1px solid var(--accent);border-radius:6px;
  padding:1.25rem 1.5rem;margin:2rem 0;color:var(--ink);
}
.callout strong{color:var(--accent-2)}

.cta{
  display:inline-block;background:var(--accent);color:#000;
  font-family:var(--mono);font-weight:600;font-size:.9rem;
  padding:.7rem 1.2rem;border-radius:4px;border:0;
  margin:.4rem .4rem 0 0;
}
.cta:hover{background:var(--accent-2);border:0}
.cta.ghost{background:transparent;color:var(--accent);border:1px solid var(--accent)}

hr{border:0;border-top:1px solid var(--line);margin:3rem 0}

footer.site{
  border-top:1px solid var(--line);padding:2.5rem var(--pad-x);
  text-align:center;color:var(--ink-faint);font-family:var(--mono);font-size:.85rem;
  position:relative;z-index:1;
}
footer.site a{color:var(--ink-dim);border:0}
footer.site a:hover{color:var(--accent)}

.toc{
  background:var(--bg-2);border:1px solid var(--line);border-radius:6px;
  padding:1.25rem 1.5rem;margin-bottom:2.5rem;
}
.toc-title{
  font-family:var(--mono);font-size:.8rem;letter-spacing:.05em;
  color:var(--ink-faint);text-transform:uppercase;margin-bottom:.75rem;
}
.toc ol{margin:0 0 0 1.25rem;color:var(--ink-dim)}
.toc li{font-size:.95rem;margin-bottom:.25rem;line-height:1.4}
.toc a{color:var(--ink);border:0}
.toc a:hover{color:var(--accent)}