/* The privacy surface.

   Carried from the page it replaces with two changes the standard requires:
   it sits under the terminal header rather than at the top of the viewport,
   and it answers the colour toggle instead of nailing one register into the
   markup. The type, the rules and the spacing are the page's own. */

/* app/design-system.css paints the shell its own ink under !important, so the
   surface states its ground with the same weight. Without it the bright
   register kept a dark ground under bright type. */
.view-privacy { min-height: 100vh; background: #f2efe8 !important; color: #0a1408; }

.privacy-shell {
  box-sizing: border-box;
  width: min(720px, calc(100% - 48px));
  margin: 0 auto;
  padding: calc(var(--se-header-height, 104px) + 40px) 0 96px;
}

.privacy-back {
  display: inline-flex; align-items: center; gap: 6px;
  color: #0f6d72;
  font: 700 10px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .19em; text-transform: uppercase; text-decoration: none;
}
.privacy-back:hover, .privacy-back:focus-visible { color: #0a1408; outline: none; }

.privacy-shell h1 { margin: 22px 0 6px; font: 300 clamp(30px, 4vw, 44px)/1.1 Inter, sans-serif; letter-spacing: -.02em; }
.privacy-shell > p.privacy-lede { margin: 0 0 40px; color: rgba(10, 20, 8, .58); font-size: 13px; }

.privacy-section { padding: 22px 0; border-top: 1px solid rgba(10, 20, 8, .12); }
.privacy-section > span {
  display: block; color: #0f6d72;
  font: 700 10px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .19em;
}
.privacy-section p { margin: 10px 0 0; max-width: 640px; color: rgba(10, 20, 8, .68); font-size: 13.5px; line-height: 1.6; }

/* Dark register, the toggle's other state. */
html:not(.se-bright) .view-privacy { background: #07100f !important; color: #f5f0e6; }
html:not(.se-bright) .privacy-back { color: #59dce8; }
html:not(.se-bright) .privacy-back:hover, html:not(.se-bright) .privacy-back:focus-visible { color: #b7ff2a; }
html:not(.se-bright) .privacy-shell > p.privacy-lede { color: #9aa39f; }
html:not(.se-bright) .privacy-section { border-top-color: rgba(255, 255, 255, .08); }
html:not(.se-bright) .privacy-section > span { color: #59dce8; }
html:not(.se-bright) .privacy-section p { color: #c7cec9; }

@media (max-width: 600px) {
  .privacy-shell { padding: calc(var(--se-header-height, 104px) + 24px) 0 64px; }
}
