/* Match the homepage's monochrome palette and Slay photography. */
:root {
  color-scheme: dark;
  --ink: #080808;
  --paper: #f2f2f2;
  --muted: #aaaaaa;
  --line: rgba(242, 242, 242, .16);
  --line-strong: rgba(242, 242, 242, .32);
  --blue: #bdbdbd;
  --accent-strong: #ffffff;
}
html { scroll-padding-bottom: var(--links-footer-height, 45px); }
body.links-page { padding-bottom: var(--links-footer-height, 45px); }
.links-page #hae-site-footer { position: fixed; inset: auto 0 0; z-index: 100; padding: 0 20px env(safe-area-inset-bottom); background: #080808; border-top: 1px solid #202020; }
.links-page #hae-site-footer .hae-footer-brand, .links-page #hae-site-footer .hae-footer-copyright { display: none; }
.links-page #hae-site-footer [data-public-footer-links] { justify-content: space-between; width: 100%; max-width: 592px; margin: 0 auto; gap: 0 12px; }
.links-privacy-note { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 0 8px; min-height: 44px; color: #999; font: inherit; }
.links-privacy-note > [title] { font-size: 11px; }
.links-privacy-note button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; padding: 0 4px; border: 0; background: transparent; color: #ccc; font: 500 12px/1.4 Arial, sans-serif; cursor: pointer; }
.links-privacy-note button:hover { color: #fff; }
.links-page #hae-site-footer #hae-privacy-settings { gap: 8px; color: #ccc; font-weight: 500; }
.links-page #hae-site-footer #hae-privacy-settings::after { content: ''; width: 6px; height: 6px; border-top: 1px solid #888; border-left: 1px solid #888; transform: translateY(2px) rotate(45deg); }
.links-privacy-note:has([data-analytics-status]:not(:empty)) > [title] { display: none; }
.links-privacy-note button[hidden] { display: none; }
.links-privacy-note [role="status"]:empty { display: none; }
.links-privacy-note :focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
body { background: var(--ink); }
body::before, .profile-shell::before { display: none; }
.page { grid-template-columns: minmax(0, 1fr); max-width: 640px; padding: 2rem 0; align-items: start; }
.profile-shell {
  padding: 0 1.5rem 1.25rem;
  border: 0;
  border-radius: 24px;
  background: var(--ink);
  backdrop-filter: none;
  box-shadow: none;
}
.profile-top { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; padding: 0 0 1.25rem; }
.avatar {
  position: relative;
  width: calc(100% + 3rem);
  height: auto;
  aspect-ratio: 16 / 11;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.avatar img { object-position: center 32%; filter: grayscale(1); }
.avatar::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, var(--ink), rgba(8,8,8,.35) 18%, transparent 48%);
  pointer-events: none;
}
.title { font-size: clamp(2.3rem, 8vw, 3.6rem); }
.subtitle { color: #b8b8b8; font-size: .72rem; line-height: 1.6; }
.social-row[hidden] { display: none; }
.social-link { background: rgba(255,255,255,.025); border-color: rgba(255,255,255,.12); }
.section-heading { color: #b8b8b8; }
.link-card, .link-card.compact {
  border-radius: 16px;
  background: rgba(255,255,255,.035);
  border-color: rgba(255,255,255,.08);
  box-shadow: none;
}
.link-card.primary { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.2); box-shadow: none; }
.link-card:hover { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.22); box-shadow: none; transform: translateY(-2px); }
.link-thumb, .link-card.compact .link-thumb { border-radius: 10px; background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.06); }
.link-thumb img { filter: grayscale(1) brightness(1.18) contrast(.94); }
.link-arrow { background: transparent; color: #eeeeee; }
.signup-shell { border-radius: 18px; background: rgba(255,255,255,.025); border-color: rgba(255,255,255,.06); }
.signup-form-row { border-radius: 24px; background: #080808; border-color: rgba(255,255,255,.1); }
.signup-input, .signup-submit { border-radius: 999px; }
.signup-submit { background: #f2f2f2; color: #080808; border-color: #f2f2f2; }
.signup-submit:hover, .signup-submit:focus { background: #cccccc; color: #080808; }
.signup-status.is-error, .signup-status.is-success { color: #f2f2f2; }
.signup-status.is-error { font-weight: 600; }
a:focus-visible, button:focus-visible { outline: 2px solid #ffffff; outline-offset: 4px; }
@media (max-width: 576px) {
  .page { width: 100%; padding: 0; }
  .profile-shell { padding: 0 1rem 1.25rem; border: 0; border-radius: 0; }
  .avatar { width: calc(100% + 2rem); }
  .profile-top { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .title { font-size: clamp(2.1rem, 9vw, 3rem); }
  .subtitle { font-size: .65rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
  .link-card:hover, .social-link:hover, .link-card:hover .link-arrow { transform: none; }
}
