/* Typed command line: <p class="term"><b>›</b> <span data-type="…"></span><i class="cursor"></i></p> (js/site.js types it). */
.term { display: flex; align-items: center; gap: 8px; margin: 0; font: 500 15px/1.4 ui-monospace, "SF Mono", Menlo, monospace; color: #59ff8c; text-shadow: 0 0 18px rgba(89, 255, 140, .35); text-align: left; letter-spacing: 0; text-transform: none; }
.term b { font-weight: 500; color: #a7b0aa; text-shadow: none; }
.term span { white-space: pre; }
.term .cursor { display: inline-block; width: .55em; height: 1.1em; background: #59ff8c; box-shadow: 0 0 12px rgba(89, 255, 140, .6); animation: term-blink 1s steps(1) infinite; }
.term.small { font-size: 13px; margin-bottom: 10px; }
.term.center { justify-content: center; }
.term.big { font-size: clamp(15px, 1.6vw, 19px); }
@keyframes term-blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .term .cursor { animation: none; } }

/* Shared by the homepage and every inner page: the typed green command line (.term) and the phone menu.
   Phone menu: The ☰ button opens the header's nav as a full
   screen sheet; links marked .m-only appear only there. */
.menu-btn { display: none; width: 42px; height: 42px; margin-left: 4px; border-radius: 999px; border: 1px solid rgba(245, 242, 236, .18); background: rgba(13, 19, 21, .4); color: #f5f2ec; align-items: center; justify-content: center; cursor: pointer; flex: 0 0 auto; }
.menu-btn span, .menu-btn span::before, .menu-btn span::after { display: block; width: 18px; height: 2px; border-radius: 2px; background: currentColor; position: relative; transition: transform .25s, background .25s; }
.menu-btn span::before, .menu-btn span::after { content: ""; position: absolute; left: 0; }
.menu-btn span::before { top: -6px; }
.menu-btn span::after { top: 6px; }
.mast.open .menu-btn span { background: transparent; }
.mast.open .menu-btn span::before { transform: translateY(6px) rotate(45deg); }
.mast.open .menu-btn span::after { transform: translateY(-6px) rotate(-45deg); }
.mast nav .m-only { display: none; }

@media (max-width: 1080px) {
  body .mast nav { display: none; }
  .menu-btn { display: inline-flex; }
  body .mast.open { background: #0d1315; border-color: rgba(245, 242, 236, .1); }
  body .mast.open nav { display: flex; flex-direction: column; gap: 2px; position: fixed; top: 72px; left: 0; right: 0; bottom: 0; margin: 0; padding: 18px 20px 40px; background: #0d1315; overflow-y: auto; animation: menu-in .25s ease; }
  body .mast.open nav a { display: block; padding: 15px 6px; border-radius: 0; border-bottom: 1px solid rgba(245, 242, 236, .08); background: none; color: #f5f2ec; font-size: 22px; font-weight: 600; letter-spacing: -.02em; }
  body .mast.open nav a[aria-current="page"] { color: #9db5a6; }
  body .mast.open nav .m-only { display: block; }
  body .mast.open nav a.m-signin { margin-top: 18px; border: 1px solid rgba(245, 242, 236, .18); border-radius: 999px; text-align: center; font-size: 17px; padding: 13px; }
  body.menu-open { overflow: hidden; }
}
@keyframes menu-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { body .mast.open nav { animation: none; } }
@media (max-width: 1080px) { body .mast-row > nav + * { margin-left: auto; } }
@media (max-width: 600px) { body .mast-row > .signin + * { margin-left: auto; } }
.center .term, .pg-final .term { justify-content: center; }
.hero-term { margin-top: 26px; min-height: 1.4em; }
.term.small + h2, .term.small + h1 { margin-top: 0; }
body p.term, body .prose p.term { color: #59ff8c; font-family: ui-monospace, "SF Mono", Menlo, monospace; }
body .prose p.term b { color: #a7b0aa; }
/* A backdrop-filter on the header would trap the fixed menu sheet inside the 72px bar once the page has scrolled. */
body .mast.open, body .mast.open.solid { backdrop-filter: none; -webkit-backdrop-filter: none; background: #0d1315; }