/* Notch: the logo's own palette, charcoal and white, and nothing else. */
:root {
  --char: #2b2e37;
  --char-2: #24262e;
  --white: #ffffff;
  --soft: rgba(255, 255, 255, .64);
  --faint: rgba(255, 255, 255, .4);
  --hair: rgba(255, 255, 255, .14);
  --sans: Montserrat, "Helvetica Neue", Arial, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; background: var(--char); }
body {
  min-height: 100svh; background: var(--char); color: var(--white);
  font: 400 14px/1.55 var(--sans); -webkit-font-smoothing: antialiased;
  padding: max(64px, calc(env(safe-area-inset-top) + 40px)) 24px max(32px, env(safe-area-inset-bottom));
  display: flex; justify-content: center;
}
main { width: 100%; max-width: 400px; display: flex; flex-direction: column; min-height: calc(100svh - 96px); }
a { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }

/* The wordmark, set as in the logo: NOTCH in a medium geometric sans, LYTHAM small and widely spaced. */
.logo { display: block; text-align: center; line-height: 1; }
.logo .n { display: block; font-weight: 500; font-size: 30px; letter-spacing: .34em; margin-right: -.34em; }
.logo .l { display: block; margin-top: 9px; font-weight: 500; font-size: 7.5px; letter-spacing: .62em; margin-right: -.62em; color: var(--soft); }

.label { font-weight: 500; font-size: 10px; letter-spacing: .28em; text-transform: uppercase; color: var(--faint); }

/* Rows: a label on the left, the detail on the right, hairlines between. */
.rows { border-top: 1px solid var(--hair); }
.rows a {
  display: flex; justify-content: space-between; align-items: baseline; gap: 16px;
  padding: 19px 2px; border-bottom: 1px solid var(--hair);
  transition: padding .2s ease, background-color .2s ease;
}
.rows .k { font-weight: 500; font-size: 11.5px; letter-spacing: .2em; text-transform: uppercase; }
.rows .v { font-size: 13px; color: var(--soft); text-align: right; }
.rows a:hover, .rows a:focus-visible { padding-left: 8px; padding-right: 8px; background: var(--char-2); outline: none; }

.foot { margin-top: auto; padding-top: 48px; text-align: center; font-size: 11.5px; line-height: 1.8; color: var(--faint); }
