/* Nomad style for nfc.nomadailab.com. Static. No scripts, no fonts, no trackers. */
:root {
  --void: #0b0a18;
  --surface: #151331;
  --cyan: #2bf3ff;
  --violet: #9c7cff;
  --mint: #3dffd0;
  --amber: #ffd166;
  --text: #f1effc;
  --muted: #b7b2d9;
  --line: rgba(156, 124, 255, .28);
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, system-ui, sans-serif;
}
* { box-sizing: border-box; }
html { color-scheme: dark; background: var(--void); }
body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  font: 17px/1.55 var(--sans);
  color: var(--text);
  background:
    radial-gradient(60rem 36rem at 15% -10%, rgba(156, 124, 255, .28), transparent 60%),
    radial-gradient(50rem 30rem at 100% 110%, rgba(43, 243, 255, .16), transparent 60%),
    linear-gradient(rgba(156, 124, 255, .05) 1px, transparent 1px) 0 0 / 100% 40px,
    linear-gradient(90deg, rgba(156, 124, 255, .05) 1px, transparent 1px) 0 0 / 40px 100%,
    var(--void);
  -webkit-font-smoothing: antialiased;
}
main {
  max-width: 34rem;
  margin: 0 auto;
  padding: max(1.5rem, env(safe-area-inset-top)) 1.25rem max(2.5rem, env(safe-area-inset-bottom));
}
.brand { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.5rem; }
.brand img { width: 44px; height: 44px; border-radius: 10px; box-shadow: 0 0 24px rgba(43, 243, 255, .35); }
.brand span {
  font: 700 .95rem/1 var(--mono);
  letter-spacing: .22em;
  text-transform: uppercase;
  background: linear-gradient(90deg, var(--cyan), var(--violet));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.radar { position: relative; width: 11rem; height: 11rem; margin: .5rem auto 1.5rem; }
.radar i {
  position: absolute; inset: 0; margin: auto; border-radius: 50%;
  border: 1.5px solid rgba(43, 243, 255, .55);
  animation: ping 3.2s ease-out infinite;
}
.radar i:nth-child(1) { width: 34%; height: 34%; animation-delay: 0s; }
.radar i:nth-child(2) { width: 34%; height: 34%; animation-delay: 1.05s; }
.radar i:nth-child(3) { width: 34%; height: 34%; animation-delay: 2.1s; }
.radar img {
  position: absolute; inset: 0; margin: auto; width: 34%; height: 34%;
  border-radius: 22%; box-shadow: 0 0 36px rgba(156, 124, 255, .55);
}
@keyframes ping { from { transform: scale(1); opacity: .9; } to { transform: scale(3); opacity: 0; } }
h1 { font-size: clamp(1.6rem, 6.5vw, 2.1rem); line-height: 1.15; margin: 0 0 .75rem; letter-spacing: -.01em; }
h1 em { font-style: normal; background: linear-gradient(90deg, var(--cyan), var(--violet)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lead { color: var(--muted); margin: 0 0 1.5rem; }
.eyebrow { font: 600 .8rem/1 var(--mono); letter-spacing: .18em; text-transform: uppercase; color: var(--cyan); margin: 0 0 .75rem; }
.eyebrow::before { content: "// "; color: var(--violet); }
.card {
  background: linear-gradient(180deg, rgba(21, 19, 49, .92), rgba(21, 19, 49, .72));
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 1.1rem 1.2rem;
  margin: 0 0 1rem;
  box-shadow: 0 0 0 1px rgba(43, 243, 255, .04) inset, 0 12px 40px rgba(0, 0, 0, .35);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.card h2 { font: 600 .8rem/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--cyan); margin: 0 0 .8rem; }
.card h2::before { content: "// "; color: var(--violet); }
.card p { margin: 0 0 .6rem; }
.card p:last-child { margin-bottom: 0; }
ol.steps { list-style: none; counter-reset: s; margin: 0; padding: 0; }
ol.steps li { counter-increment: s; display: flex; gap: .85rem; padding: .55rem 0; align-items: flex-start; }
ol.steps li + li { border-top: 1px solid rgba(156, 124, 255, .14); }
ol.steps li::before {
  content: counter(s);
  flex: none; width: 1.7rem; height: 1.7rem; border-radius: 50%;
  display: grid; place-items: center;
  font: 700 .85rem/1 var(--mono); color: var(--void);
  background: linear-gradient(135deg, var(--cyan), var(--violet));
}
.note { border-color: rgba(255, 209, 102, .35); }
.note h2 { color: var(--amber); }
.note h2::before { color: var(--amber); }
.pill { display: inline-block; font: 600 .75rem/1 var(--mono); letter-spacing: .08em; padding: .4rem .65rem; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); margin: 0 .35rem .35rem 0; }
.pill b { color: var(--mint); font-weight: 600; }
footer { margin-top: 1.5rem; color: var(--muted); font: .8rem/1.5 var(--mono); text-align: center; }
@media (prefers-reduced-motion: reduce) { .radar i { animation: none; opacity: .35; transform: scale(2); } }
@media (prefers-color-scheme: light) { html { color-scheme: dark; } }