/* Shared styles for NightMaw sub-pages (dev log, press kit).
   The homepage keeps its own inline styles but uses the same tokens. */
:root {
  --bg: #08070a; --panel: #131218; --line: #26242e; --fg: #f1eef2; --muted: #a29fae;
  --maw: #4f6bff; --glow: #7d8cff;
  --display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --body: "IBM Plex Sans", system-ui, sans-serif;
}
* { box-sizing: border-box; }
html { color-scheme: dark; background: var(--bg); }
body { margin: 0; background: var(--bg); color: var(--fg); font-family: var(--body); line-height: 1.6; }
a { color: var(--maw); }
img, video { display: block; max-width: 100%; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--maw); outline-offset: 3px; }

.wrap { max-width: 1000px; margin: 0 auto; padding-inline: 20px; }
.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--maw); }
.display { font-family: var(--display); font-weight: 900; text-transform: uppercase; line-height: .9; text-wrap: balance; }

/* Top bar */
.bar { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between; gap: 12px;
       padding: calc(env(safe-area-inset-top, 0px) + 12px) 20px 12px; background: rgba(8,7,10,.88); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.bar .logo { display: block; line-height: 0; }
.bar .logo img { height: 22px; width: auto; }
.bar nav { display: flex; align-items: center; gap: 18px; }
.bar nav a.txt { color: var(--fg); text-decoration: none; font-size: 14px; font-weight: 500; opacity: .8; }
.bar nav a.txt:hover, .bar nav a.txt[aria-current="page"] { opacity: 1; }
.bar nav a.txt[aria-current="page"] { color: var(--maw); }

.btn { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; font: inherit; font-weight: 600; font-size: 15px; padding: 10px 18px; border-radius: 999px; background: var(--maw); color: #fff; border: 0; cursor: pointer; }
.btn.small { padding: 7px 14px; font-size: 14px; }
.btn.ghost { background: transparent; color: var(--fg); border: 1px solid var(--line); }
.btn:hover { filter: brightness(1.12); }

footer.site { border-top: 1px solid var(--line); margin-top: 80px; }
footer.site .wrap { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-block: 24px calc(env(safe-area-inset-bottom, 0px) + 28px); color: var(--muted); font-size: 13px; }
footer.site a { color: var(--muted); }

@media (max-width: 640px) {
  .bar nav { gap: 12px; }
  .bar nav a.txt.opt { display: none; }
}

/* Live vs dev: anything marked data-wip is hidden on nightmaw.com and shown on the test address */
html.live [data-wip] { display: none !important; }
html.dev body::after { content: "DEV"; position: fixed; left: 10px; bottom: calc(env(safe-area-inset-bottom, 0px) + 10px); z-index: 99; font: 700 11px/1 system-ui, sans-serif; letter-spacing: .12em; color: #fff; background: #4f6bff; padding: 5px 8px; border-radius: 4px; pointer-events: none; }