/* Notice pages, styled to match the site itself.
 *
 * Every token below was measured off the rendered homepage, not guessed:
 *   ink #18191b (text + primary buttons)   page #fcfcfc   muted #5f5f68
 *   hairline #e7e7ea   buttons 8px radius, 14px/500   headings Gellix 500
 *   with -0.02em tracking, body GeistSans, code GeistMono.
 *
 * The fonts are the site's own variable woff2s, copied to _offline/fonts/.
 * They cannot be referenced where they really live -- the "immutable" media
 * directory under _next/static -- because build.sh renames that directory to
 * carry a content hash on every build, so a URL into it written here would die
 * the next time the chunk stamp changes. (Spelling out its full path here
 * would get THIS comment rewritten by that same stamping pass.)
 *
 * The site is light-only, so these pages are too -- a dark variant here would
 * match the visitor's OS but not the site around it. */
@font-face{font-family:Gellix;src:url("/_offline/fonts/Gellix.woff2") format("woff2");
  font-weight:100 900;font-display:swap}
@font-face{font-family:GeistSans;src:url("/_offline/fonts/Geist.woff2") format("woff2");
  font-weight:100 900;font-display:swap}
@font-face{font-family:GeistMono;src:url("/_offline/fonts/GeistMono.woff2") format("woff2");
  font-weight:100 900;font-display:swap}

:root{--bg:#fcfcfc;--ink:#18191b;--muted:#5f5f68;--line:#e7e7ea;--card:#fff}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;display:grid;place-items:center;padding:24px;
  background:var(--bg);color:var(--ink);
  font:15px/1.6 GeistSans,ui-sans-serif,system-ui,sans-serif;
  -webkit-font-smoothing:antialiased}

.card{max-width:560px;width:100%;text-align:center;background:var(--card);
  border:1px solid var(--line);border-radius:16px;padding:56px 40px 48px;
  box-shadow:0 1px 2px rgba(24,25,27,.04)}

/* Same lift-deterrence the site gives the mark: the image ignores the pointer,
 * so the click lands on the link wrapped around it and still goes home. */
.logo{height:30px;width:auto;display:block;margin:0 auto 28px;
  pointer-events:none;user-select:none;-webkit-user-select:none;
  -webkit-user-drag:none;-webkit-touch-callout:none}

.tag{display:inline-block;font-size:11px;font-weight:500;text-transform:uppercase;
  letter-spacing:.08em;color:var(--muted);background:var(--bg);
  border:1px solid var(--line);border-radius:999px;padding:4px 11px;margin-bottom:18px}

h1{margin:0 0 12px;font-family:Gellix,GeistSans,sans-serif;font-weight:500;
  font-size:30px;line-height:1.15;letter-spacing:-.02em;color:var(--ink)}

p{margin:0 auto 22px;max-width:42ch;font-size:15px;color:var(--muted)}

.url{display:block;word-break:break-all;text-align:left;background:var(--bg);
  border:1px solid var(--line);border-radius:8px;padding:10px 14px;
  font:12.5px/1.6 GeistMono,ui-monospace,SFMono-Regular,Menlo,monospace;
  color:var(--ink);margin:0 0 24px}

a.back{display:inline-flex;align-items:center;justify-content:center;height:40px;
  padding:0 18px;background:var(--ink);color:#fff;text-decoration:none;
  border-radius:8px;font-size:14px;font-weight:500;letter-spacing:-.01em;
  transition:background .15s ease}
a.back:hover{background:#2e2f33}
