@font-face {
  font-family: "Supah Nunito";
  src: url("/fonts/nunito-black-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}

:root {
  --ink: #1d1d1f;
  --black: #000000;
  --muted: #6e6e73;
  --quiet: #86868b;
  --paper: #ffffff;
  --surface: #f5f5f7;
  --surface-raised: #fbfbfd;
  --line: #d2d2d7;
  --line-soft: rgba(0, 0, 0, 0.08);
  --danger: #b42318;
  --radius: 22px;
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font);
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body { margin: 0; min-height: 100vh; background: var(--paper); }
body::selection, body *::selection { background: var(--ink); color: var(--paper); }

a, button, input, textarea { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 3px;
}

.skip-link {
  position: fixed;
  z-index: 200;
  top: -80px;
  left: 20px;
  padding: 10px 16px;
  border-radius: 999px;
  background: var(--black);
  color: white;
  text-decoration: none;
  transition: top 160ms ease;
}
.skip-link:focus { top: 14px; }

.site-header {
  position: sticky;
  z-index: 100;
  top: 0;
  width: 100%;
  border-bottom: 1px solid var(--line-soft);
  background: rgba(255, 255, 255, 0.82);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  backdrop-filter: saturate(180%) blur(18px);
}

.nav-shell {
  width: min(1120px, 100%);
  height: 58px;
  margin: auto;
  padding: 0 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.brand {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  color: var(--ink);
  font-family: "Supah Nunito", Nunito, var(--font);
  font-size: 21px;
  font-weight: 900;
  font-synthesis: none;
  letter-spacing: -.025em;
  text-decoration: none;
}

.brand-mark {
  width: 23px;
  height: 23px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: var(--black);
  color: white;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: -.04em;
}

.site-header nav { display: flex; gap: 24px; align-items: center; }
.site-header nav a, .link-button {
  color: var(--ink);
  font: inherit;
  font-size: .88rem;
  font-weight: 500;
  text-decoration: none;
}
.site-header nav .button { color: white; }
.site-header nav > a:not(.button), .link-button { transition: opacity 160ms ease; }
.site-header nav > a:not(.button):hover, .link-button:hover { opacity: .55; }
.inline { display: inline; }
.link-button { padding: 0; border: 0; background: none; cursor: pointer; }

main { width: min(1120px, 100%); min-height: calc(100vh - 160px); margin: 0 auto; padding: 48px 28px 100px; }
.landing-page main { padding-top: 0; }

footer { border-top: 1px solid var(--line-soft); color: var(--quiet); font-size: .78rem; }
.footer-shell {
  width: min(1120px, 100%);
  min-height: 96px;
  margin: auto;
  padding: 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.footer-brand { color: var(--ink); font-family: "Supah Nunito", Nunito, var(--font); font-weight: 900; font-synthesis: none; letter-spacing: -.02em; }

h1, h2, h3 { color: var(--ink); text-wrap: balance; }
h1 { font-size: clamp(2.6rem, 7vw, 5.75rem); line-height: .98; letter-spacing: -.067em; }
h2 { font-size: 1.35rem; line-height: 1.16; letter-spacing: -.035em; }
h3 { letter-spacing: -.025em; }
p { line-height: 1.55; }

.eyebrow {
  margin: 0 0 18px;
  color: var(--quiet);
  font-size: .72rem;
  font-weight: 650;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.landing-kicker {
  margin: 0;
  color: var(--quiet);
  font-size: .72rem;
  font-weight: 680;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.landing-hero {
  min-height: calc(100svh - 58px);
  padding: clamp(66px, 7vw, 94px) 0 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.landing-hero-copy {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 930px;
}
.landing-hero h1 {
  max-width: 900px;
  margin: 22px auto 24px;
  font-size: clamp(3.65rem, 6.4vw, 5.8rem);
  font-weight: 600;
  line-height: .91;
  letter-spacing: -.068em;
}
.landing-lede {
  max-width: 720px;
  margin: 0 auto;
  color: var(--muted);
  font-size: clamp(1.04rem, 1.55vw, 1.24rem);
  line-height: 1.48;
  letter-spacing: -.018em;
}
.landing-actions { margin-top: 30px; display: flex; justify-content: center; align-items: center; gap: 22px; }
.landing-sign-in { color: var(--ink); font-size: .92rem; font-weight: 600; text-decoration: none; }
.landing-sign-in:hover { opacity: .55; }
.landing-product-demo { width: min(930px, 100%); margin-top: clamp(46px, 6vw, 74px); }
.product-proof-row { margin: 0 auto 13px; display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }
.product-proof-row span { padding: 7px 11px; border: 1px solid var(--line-soft); border-radius: 999px; background: rgba(255,255,255,.8); color: var(--quiet); font-size: .62rem; font-weight: 680; letter-spacing: .04em; text-transform: uppercase; }
.landing-example-note { margin: 11px 0 0; color: var(--quiet); font-size: .65rem; }

.identity-constellation {
  position: relative;
  isolation: isolate;
  width: 100%;
  height: clamp(310px, 31vw, 380px);
  border-radius: 38px;
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.96) 0 17%, rgba(255,255,255,.25) 39%, transparent 66%),
    radial-gradient(circle at 70% 17%, rgba(255,218,236,.58), transparent 34%),
    radial-gradient(circle at 23% 74%, rgba(200,229,255,.64), transparent 38%),
    #f7f7f9;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.035);
  overflow: hidden;
}
.constellation-lines {
  position: absolute;
  z-index: -1;
  inset: 0;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: rgba(29,29,31,.2);
  stroke-width: 1.2;
  stroke-dasharray: 4 9;
}
.constellation-lines ellipse:first-child { stroke-dasharray: 2 10; opacity: .6; }
.identity-center {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 50%;
  width: 132px;
  min-height: 154px;
  padding: 11px 11px 13px;
  display: grid;
  justify-items: center;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(255,255,255,.86);
  border-radius: 27px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 28px 60px rgba(32,34,43,.16), 0 4px 14px rgba(32,34,43,.07);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}
.identity-portrait {
  position: relative;
  width: 92px;
  height: 92px;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(145deg, #dbeafe, #f6d8ed);
  box-shadow: inset 0 0 0 1px rgba(29,29,31,.06);
}
.persona-frame {
  position: absolute;
  inset: 0;
  background-image: url('/images/supahid-personas-8bit.png');
  background-repeat: no-repeat;
  background-size: 300% 300%;
  opacity: 0;
  animation: persona-cycle 32s ease-in-out infinite;
  will-change: opacity;
}
.persona-frame-1 { background-position: 0 0; animation-delay: 0s; }
.persona-frame-2 { background-position: 50% 0; animation-delay: -28s; }
.persona-frame-3 { background-position: 100% 0; animation-delay: -24s; }
.persona-frame-4 { background-position: 0 50%; animation-delay: -20s; }
.persona-frame-5 { background-position: 50% 50%; animation-delay: -16s; }
.persona-frame-6 { background-position: 100% 50%; animation-delay: -12s; }
.persona-frame-7 { background-position: 0 100%; animation-delay: -8s; }
.persona-frame-8 { background-position: 50% 100%; animation-delay: -4s; }
.identity-you { margin-top: 6px; font-size: .94rem; font-weight: 720; letter-spacing: -.025em; text-transform: lowercase; }
.identity-verified { margin-top: 2px; color: var(--quiet); font-size: .59rem; font-weight: 650; letter-spacing: .03em; }
.identity-verified b { width: 14px; height: 14px; margin-right: 3px; display: inline-grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; font-size: .56rem; }

.brand-bubble {
  position: absolute;
  z-index: 2;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 20px;
  box-shadow: 0 15px 30px rgba(39,41,49,.12), 0 2px 7px rgba(39,41,49,.05);
  animation: constellation-float 7s ease-in-out infinite;
}
.brand-bubble svg { width: 27px; height: 27px; }
.brand-bubble-instagram { top: 3%; left: calc(50% - 29px); background: linear-gradient(145deg, #7856d8, #d93f91 56%, #ffb451); color: white; }
.brand-bubble-instagram svg { fill: none; stroke: currentColor; stroke-width: 2.2; }
.brand-bubble-instagram .logo-fill { fill: currentColor; stroke: none; }
.brand-bubble-strava { top: 14%; right: 13%; background: #fff0e8; color: #fc4c02; animation-delay: -1.2s; }
.brand-bubble-strava path { fill: currentColor; }
.brand-bubble-strava .strava-secondary { opacity: .58; }
.brand-bubble-linkedin { top: 45%; right: 4%; background: #0a66c2; color: white; animation-delay: -2.8s; }
.brand-bubble-linkedin strong { font: 760 1.5rem/1 Arial, sans-serif; letter-spacing: -.09em; }
.brand-bubble-facebook { right: 14%; bottom: 9%; background: #1877f2; color: white; animation-delay: -4.1s; }
.brand-bubble-facebook strong { transform: translateY(6px); font: 800 2.35rem/1 Arial, sans-serif; }
.brand-bubble-google { left: calc(50% - 29px); bottom: 2%; background: white; animation-delay: -2s; }
.brand-bubble-google strong { background: conic-gradient(from -35deg, #4285f4 0 26%, #34a853 26% 44%, #fbbc05 44% 65%, #ea4335 65% 82%, #4285f4 82%); color: transparent; font: 720 1.72rem/1 Arial, sans-serif; -webkit-background-clip: text; background-clip: text; }
.brand-bubble-openai { bottom: 9%; left: 14%; background: #171717; color: white; animation-delay: -5.6s; }
.brand-bubble-openai strong { font-size: .9rem; letter-spacing: -.04em; }
.brand-bubble-spotify { top: 45%; left: 4%; background: #1ed760; color: #101010; animation-delay: -3.4s; }
.brand-bubble-spotify circle { fill: currentColor; }
.brand-bubble-spotify path { stroke: #1ed760; stroke-width: 1.9; stroke-linecap: round; }
.brand-bubble-slack { top: 14%; left: 13%; background: white; animation-delay: -4.8s; }
.slack-cyan { fill: #36c5f0; }
.slack-green { fill: #2eb67d; }
.slack-yellow { fill: #ecb22e; }
.slack-red { fill: #e01e5a; }
@keyframes persona-cycle {
  0%, 10% { opacity: 1; }
  13%, 97% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes constellation-float {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-7px) rotate(1deg); }
}
.actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-top: 32px; }

.button, .danger {
  min-height: 46px;
  padding: 12px 21px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  appearance: none;
  border: 1px solid var(--black);
  border-radius: 999px;
  background: var(--black);
  color: white;
  cursor: pointer;
  font: inherit;
  font-size: .92rem;
  font-weight: 600;
  text-decoration: none;
  transition: transform 180ms ease, opacity 180ms ease, background 180ms ease;
}
.button:hover, .danger:hover { opacity: .72; transform: translateY(-1px); }
.button:active, .danger:active { transform: translateY(0); }
.button:disabled { cursor: wait; opacity: .45; transform: none; }
.button.ghost { border-color: transparent; background: var(--surface); color: var(--ink); }
.button.small { min-height: 34px; padding: 7px 14px; font-size: .8rem; }
.full { width: 100%; }
.danger { border-color: var(--danger); border-radius: 12px; background: var(--danger); }
.text-link { color: var(--ink); font-size: .94rem; font-weight: 600; text-decoration: none; }
.text-link span { display: inline-block; margin-left: 4px; transition: transform 160ms ease; }
.text-link:hover span { transform: translateX(3px); }

.agentic-promise {
  padding: clamp(86px, 13vw, 150px) 0;
  border-block: 1px solid var(--line-soft);
  text-align: center;
}
.agentic-promise h2 {
  max-width: 880px;
  margin: 24px auto;
  font-size: clamp(2.6rem, 6vw, 5.4rem);
  line-height: .98;
  letter-spacing: -.062em;
}
.agentic-promise > p:last-child { max-width: 650px; margin: 0 auto; color: var(--muted); font-size: 1.06rem; }

.landing-benefits { padding: 54px 0 110px; }
.landing-benefits article {
  min-height: 172px;
  padding: 42px 0;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: start;
  border-bottom: 1px solid var(--line-soft);
}
.landing-benefits article > span { padding-top: 6px; color: var(--quiet); font-size: .72rem; font-weight: 680; }
.landing-benefits h2 { margin: 0 0 9px; font-size: clamp(1.8rem, 3.4vw, 3rem); letter-spacing: -.05em; }
.landing-benefits p { max-width: 620px; margin: 0; color: var(--muted); font-size: 1rem; }

.landing-privacy {
  padding: clamp(62px, 9vw, 98px);
  border-radius: 30px;
  background: var(--black);
  color: white;
}
.landing-privacy .landing-kicker { color: rgba(255,255,255,.48); }
.landing-privacy h2 { max-width: 760px; margin: 22px 0 30px; color: white; font-size: clamp(2.7rem, 6vw, 5.3rem); line-height: .96; letter-spacing: -.064em; }
.landing-privacy > p:last-child { max-width: 610px; margin: 0; color: rgba(255,255,255,.65); font-size: 1rem; }

.landing-closing { padding: clamp(110px, 17vw, 190px) 0 48px; text-align: center; }
.landing-closing h2 { margin: 0; font-size: clamp(3.1rem, 8vw, 7rem); line-height: .94; letter-spacing: -.07em; }
.landing-closing > p { margin: 20px auto 0; color: var(--muted); font-size: 1.05rem; }

.landing-receive,
.landing-how,
.landing-where,
.landing-verified,
.landing-persona { padding: clamp(82px, 12vw, 150px) 0; }
.landing-receive,
.landing-where,
.landing-persona { border-top: 1px solid var(--line-soft); }
.landing-section-heading { max-width: 820px; margin-bottom: clamp(38px, 6vw, 68px); }
.landing-section-heading h2 {
  margin: 18px 0 0;
  font-size: clamp(2.7rem, 6vw, 5.4rem);
  line-height: .96;
  letter-spacing: -.064em;
}
.landing-card-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.landing-card-grid article {
  min-height: 260px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  border-radius: 22px;
  background: var(--surface);
}
.landing-card-grid article:nth-child(-n+3) { grid-column: span 2; }
.landing-card-grid article:nth-child(n+4) { grid-column: span 3; }
.landing-card-grid article > span { color: var(--quiet); font-size: .7rem; font-weight: 700; }
.landing-card-grid h3 { margin: auto 0 10px; font-size: 1.35rem; }
.landing-card-grid p { margin: 0; color: var(--muted); font-size: .92rem; }

.landing-how { border-top: 1px solid var(--line-soft); }
.landing-how ol { margin: 0; padding: 0; list-style: none; }
.landing-how li {
  min-height: 142px;
  padding: 28px 0;
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  border-top: 1px solid var(--line-soft);
}
.landing-how li > span { color: var(--quiet); font-size: .78rem; font-weight: 700; }
.landing-how li div { max-width: 690px; }
.landing-how h3 { margin: 0 0 8px; font-size: clamp(1.35rem, 2.6vw, 2rem); }
.landing-how p { margin: 0; color: var(--muted); }

.landing-split { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.landing-split article { min-height: 250px; padding: 32px; border-radius: 24px; background: var(--surface); }
.landing-split h3 { margin: 0 0 12px; font-size: 1.45rem; }
.landing-split p { color: var(--muted); }
.landing-split a { color: var(--ink); font-weight: 650; text-decoration: none; }
.landing-privacy a { margin-top: 28px; display: inline-block; color: white; font-weight: 650; text-decoration: none; }

.landing-persona { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, .72fr); gap: clamp(50px, 9vw, 120px); align-items: center; }
.landing-persona > div h2 { margin: 20px 0 28px; font-size: clamp(3rem, 6vw, 5.8rem); line-height: .94; letter-spacing: -.066em; }
.landing-persona > div > p:last-child { max-width: 580px; color: var(--muted); font-size: 1.04rem; }
.landing-persona aside { padding: 38px; border: 1px solid var(--line-soft); border-radius: 28px; background: var(--surface-raised); box-shadow: 0 24px 70px rgba(0,0,0,.07); }
.example-label { color: var(--quiet); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.example-avatar { width: 72px; height: 72px; margin: 34px 0 22px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; font-size: 1.6rem; font-weight: 700; }
.landing-persona aside h3 { margin: 0; font-size: 1.7rem; }
.example-alias { margin: 4px 0 24px; color: var(--quiet); }
.landing-persona aside > strong { display: block; font-size: 1.05rem; line-height: 1.45; }
.landing-persona aside > p:not(.example-alias) { color: var(--muted); font-size: .9rem; }
.verified-chip { width: fit-content; margin-top: 22px; padding: 7px 10px; display: block; border-radius: 999px; background: #eaf5ec; color: #1f6b32; font-size: .76rem; font-weight: 700; }
.landing-persona aside small { margin-top: 10px; display: block; color: var(--quiet); }

.information-page main { max-width: 980px; }
.info-hero { max-width: 880px; padding: clamp(76px, 12vw, 138px) 0 clamp(70px, 10vw, 118px); }
.info-hero h1 { margin: 22px 0 28px; font-size: clamp(3.5rem, 8vw, 7.1rem); }
.info-hero > p:last-child { max-width: 680px; margin: 0; color: var(--muted); font-size: clamp(1.08rem, 2.2vw, 1.35rem); }
.info-sections { border-top: 1px solid var(--line-soft); }
.info-sections > section { padding: 42px 0; display: grid; grid-template-columns: minmax(180px, .7fr) minmax(0, 1.3fr); gap: 54px; border-bottom: 1px solid var(--line-soft); }
.info-sections h2 { margin: 0; font-size: 1.45rem; }
.info-sections p { margin: 0; color: var(--muted); }
.info-sections a,
.help-list a,
.help-contact a { color: var(--ink); font-weight: 600; }
.trust-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid var(--line-soft); background: var(--line-soft); }
.trust-grid > section { min-height: 250px; padding: 34px; display: block; border: 0; background: white; }
.trust-grid h2 { margin-bottom: 18px; }
.info-related { padding: 42px 0 12px; display: flex; flex-wrap: wrap; gap: 10px; }
.info-related a { padding: 10px 15px; border-radius: 999px; background: var(--surface); color: var(--ink); font-size: .84rem; font-weight: 600; text-decoration: none; }
.help-list { border-top: 1px solid var(--line-soft); }
.help-list details { padding: 26px 0; border-bottom: 1px solid var(--line-soft); }
.help-list summary { cursor: pointer; font-size: 1.12rem; font-weight: 650; }
.help-list details p { max-width: 710px; margin: 16px 0 0; color: var(--muted); }
.help-contact { margin-top: 60px; padding: 38px; border-radius: 24px; background: var(--surface); }
.help-contact h2 { margin-top: 0; }
.help-contact p { margin-bottom: 0; color: var(--muted); }
.legal-draft { width: fit-content; margin: 0 0 22px; padding: 7px 11px; border-radius: 999px; background: #fff0e5; color: #9a3412; font-size: .72rem; font-weight: 700; letter-spacing: .025em; }
.provider-table { overflow: hidden; border: 1px solid var(--line); border-radius: 20px; }
.provider-table > div { padding: 20px 22px; display: grid; grid-template-columns: .6fr 1fr 1.8fr; gap: 24px; }
.provider-table > div + div { border-top: 1px solid var(--line-soft); }
.provider-table > div:first-child { background: var(--surface); font-size: .78rem; }
.provider-table span { color: var(--muted); line-height: 1.5; }
.footer-shell-expanded { align-items: flex-start; gap: 42px; }
.footer-shell-expanded p { margin: 7px 0 0; }
.footer-shell-expanded nav { max-width: 520px; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 13px 24px; }
.footer-shell-expanded nav a,
.footer-shell > a { color: var(--quiet); text-decoration: none; }
.footer-shell-expanded nav a:hover,
.footer-shell > a:hover { color: var(--ink); }

.three-up { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.three-up article, .card, .profile-card { padding: 30px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: var(--surface-raised); }
.three-up article span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; font-weight: 700; }
.three-up p, .muted { color: var(--muted); line-height: 1.55; }

.card h1 { margin: .25em 0; font-size: 2.6rem; }
.card > p:not(.eyebrow), .security > p { color: var(--muted); }
.narrow { max-width: 580px; margin: 45px auto; }
label { display: grid; gap: 8px; margin: 20px 0; color: var(--ink); font-size: .88rem; font-weight: 600; }
input, textarea {
  width: 100%;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: white;
  color: var(--ink);
  font: inherit;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
input:focus, textarea:focus { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(0,0,0,.06); outline: none; }
textarea { resize: vertical; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.prefix-input { display: flex; align-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: white; }
.prefix-input span { padding-left: 14px; color: var(--muted); }
.prefix-input input { border: 0; box-shadow: none; }
.form-error { min-height: 1.4em; color: var(--danger) !important; }

.verification-result { padding: 52px 42px 40px; text-align: center; }
.verification-result h1 { margin-top: .18em; }
.verification-result > p:not(.eyebrow) { max-width: 390px; margin: 0 auto 28px; }
.verification-result .button { margin-top: 6px; }
.verification-animation { position: relative; width: 128px; height: 128px; margin: 0 auto 30px; }
.verification-face, .verification-symbol { position: absolute; inset: 0; width: 100%; height: 100%; }
.verification-face { fill: none; stroke: var(--black); stroke-linecap: round; stroke-width: 4; animation: verification-face-out 2.1s cubic-bezier(.4,0,.2,1) forwards; }
.verification-face .face-eye { fill: var(--black); stroke: none; }
.verification-face .face-mouth { fill: none; }
.verification-face .face-scan { stroke-width: 2; animation: verification-scan 1.05s ease-in-out 2; }
.verification-symbol { opacity: 0; transform: scale(.72); animation: verification-symbol-in .55s 1.42s cubic-bezier(.2,.9,.25,1.25) forwards; }
.verification-symbol circle { stroke: none; }
.verification-symbol path { fill: none; stroke: white; stroke-linecap: round; stroke-linejoin: round; stroke-width: 8; }
.verification-result--success .verification-symbol circle { fill: #248a3d; }
.verification-result--failure .verification-symbol circle { fill: #d92d20; }
.verification-continue-note { margin-top: 15px !important; margin-bottom: 0 !important; color: var(--quiet) !important; font-size: .78rem; }

@keyframes verification-scan {
  0%, 100% { transform: translateY(-28px); opacity: .15; }
  50% { transform: translateY(28px); opacity: .8; }
}
@keyframes verification-face-out {
  0%, 62% { opacity: 1; transform: scale(1); }
  82%, 100% { opacity: 0; transform: scale(.86); }
}
@keyframes verification-symbol-in {
  to { opacity: 1; transform: scale(1); }
}

.portal-heading { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin: 12px 0 34px; }
.portal-identity { display: flex; align-items: center; gap: 22px; }
.portal-heading h1 { margin: 2px 0 6px; font-size: clamp(2rem, 5vw, 3.2rem); }
.portal-heading .eyebrow { margin-bottom: 4px; }
.portal-avatar, .settings-avatar { flex: 0 0 auto; border-radius: 50%; object-fit: cover; }
.portal-avatar { width: 110px; height: 110px; }
.settings-avatar { width: 68px; height: 68px; }
.portal-avatar--initials { display: grid; place-items: center; background: #e5e5ea; color: #6e6e73; font-size: 2rem; font-weight: 600; letter-spacing: -.04em; }
.settings-avatar.portal-avatar--initials { font-size: 1.25rem; }
.portal-avatar-editor { position: relative; width: 110px; height: 110px; flex: 0 0 auto; padding: 0; overflow: hidden; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }
.portal-avatar-editor .portal-avatar { display: grid; }
.avatar-edit-label { position: absolute; inset: 0; display: grid; place-items: end center; padding-bottom: 15px; border-radius: 50%; background: linear-gradient(transparent 38%, rgba(0,0,0,.66)); color: white; font-size: .78rem; font-weight: 700; opacity: 0; transform: translateY(4px); transition: opacity 160ms ease, transform 160ms ease; }
.portal-avatar-editor:hover .avatar-edit-label, .portal-avatar-editor:focus-visible .avatar-edit-label { opacity: 1; transform: none; }
.portal-meta { margin: 0; color: var(--muted); font-size: .92rem; }
.status-dot { width: 7px; height: 7px; margin-right: 6px; display: inline-block; border-radius: 50%; background: var(--quiet); }
.status-dot--live { background: #248a3d; }
.save-confirmation { margin: 20px 0 0; padding: 11px 15px; border-radius: 12px; background: #f0f7f1; color: #1f6b32; font-size: .88rem; font-weight: 600; }

.portal-tabs { position: sticky; z-index: 40; top: 58px; display: flex; gap: 34px; border-bottom: 1px solid var(--line-soft); background: rgba(255,255,255,.92); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.portal-tabs a { position: relative; padding: 15px 2px 14px; color: var(--muted); font-size: .92rem; font-weight: 600; text-decoration: none; }
.portal-tabs a:hover { color: var(--ink); }
.portal-tabs a[aria-current='page'] { color: var(--ink); }
.portal-tabs a[aria-current='page']::after { content: ''; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; border-radius: 2px; background: var(--ink); }
.portal-panel { padding-top: 44px; }

.settings-section { scroll-margin-top: 90px; }
.settings-section-heading { margin-bottom: 20px; display: grid; grid-template-columns: minmax(200px, .7fr) minmax(280px, 1fr); gap: 40px; align-items: end; }
.settings-section-heading .eyebrow { margin-bottom: 7px; }
.settings-section-heading h2 { margin: 0; font-size: 2.2rem; }
.settings-section-heading > p { max-width: 500px; margin: 0; color: var(--muted); font-size: .95rem; }
.settings-card { overflow: hidden; border: 1px solid var(--line-soft); border-radius: 24px; background: var(--surface-raised); box-shadow: 0 14px 50px rgba(0,0,0,.035); }
.settings-form { padding: 28px; }
.settings-form > label:first-of-type, .settings-form .split:first-child label { margin-top: 0; }
.settings-form input, .settings-form textarea { background: var(--paper); }

.setting-toggle-row span, .profile-save-row span { color: var(--muted); font-size: .82rem; }
.file-control { min-height: 34px; margin: 0; padding: 7px 14px; display: inline-flex; align-items: center; border-radius: 999px; background: var(--surface); cursor: pointer; font-size: .8rem; }
.file-control input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.text-action { padding: 5px; border: 0; background: transparent; color: var(--muted); cursor: pointer; font: inherit; font-size: .82rem; font-weight: 600; }
.text-action:hover { color: var(--ink); }

.setting-toggle-row, .profile-save-row { padding-top: 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line-soft); }
.setting-toggle-row > div, .profile-save-row > div:first-child { display: grid; gap: 4px; }
.switch { position: relative; width: 48px; height: 28px; margin: 0; display: block; }
.switch input { position: absolute; opacity: 0; pointer-events: none; }
.switch span { position: absolute; inset: 0; border-radius: 999px; background: #d2d2d7; transition: background 160ms ease; }
.switch span::after { content: ''; position: absolute; top: 2px; left: 2px; width: 24px; height: 24px; border-radius: 50%; background: white; box-shadow: 0 1px 4px rgba(0,0,0,.22); transition: transform 160ms ease; }
.switch input:checked + span { background: #248a3d; }
.switch input:checked + span::after { transform: translateX(20px); }
.switch input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 3px; }
.profile-save-row { margin-top: 24px; }
.profile-save-row .actions { margin: 0; }

.account-facts { margin-top: 24px; display: grid; grid-template-columns: 1fr 1fr; border-block: 1px solid var(--line-soft); }
.account-facts div { padding: 18px 0; display: grid; gap: 5px; }
.account-facts div + div { padding-left: 22px; border-left: 1px solid var(--line-soft); }
.account-facts span { color: var(--quiet); font-size: .72rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.account-facts strong { word-break: break-word; }

.persona-builder { display: grid; gap: 18px; }
.persona-builder-intro { padding: 24px; display: grid; grid-template-columns: 52px minmax(0, 1fr) minmax(190px, 240px); gap: 18px; align-items: center; border: 1px solid var(--line-soft); border-radius: 22px; background: var(--surface); }
.persona-builder-intro .eyebrow { margin-bottom: 4px; }
.persona-builder-intro h3 { margin: 0; font-size: clamp(1.45rem, 3vw, 2rem); letter-spacing: -.035em; }
.persona-builder-intro p:last-child { margin: 6px 0 0; color: var(--muted); font-size: .86rem; line-height: 1.5; }
.persona-intro-mark { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 15px; background: var(--ink); color: white; font-size: 1.25rem; font-weight: 750; }
.persona-builder-progress { display: grid; gap: 10px; }
.persona-builder-progress > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.persona-builder-progress strong { font-size: .8rem; }
.persona-builder-progress span { color: var(--quiet); font-size: .7rem; white-space: nowrap; }
.persona-builder-meter { height: 6px; overflow: hidden; border-radius: 999px; background: #dedee3; }
.persona-builder-meter > span { width: 0; height: 100%; display: block; border-radius: inherit; background: var(--ink); transition: width 220ms ease; }
.persona-builder-sections { display: grid; gap: 14px; }
.persona-builder-section { overflow: hidden; border: 1px solid var(--line-soft); border-radius: 18px; background: white; transition: border-color 160ms ease, box-shadow 160ms ease; }
.persona-builder-section[open] { border-color: var(--line); box-shadow: 0 10px 34px rgba(0,0,0,.035); }
.persona-builder-section > summary { padding: 18px 20px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto 18px; gap: 14px; align-items: center; cursor: pointer; list-style: none; }
.persona-builder-section > summary::-webkit-details-marker { display: none; }
.persona-section-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; background: var(--surface); color: var(--ink); font-size: 1.15rem; font-weight: 700; }
.persona-builder-section.has-value .persona-section-icon { background: var(--ink); color: white; }
.persona-section-heading { min-width: 0; display: grid; grid-template-columns: auto 1fr; gap: 2px 9px; align-items: baseline; }
.persona-section-heading strong { min-width: 0; font-size: 1rem; }
.persona-section-heading small { grid-column: 1 / -1; overflow: hidden; color: var(--muted); font-size: .79rem; font-weight: 450; text-overflow: ellipsis; white-space: nowrap; }
.persona-section-number { color: var(--quiet); font-size: .66rem; font-weight: 750; letter-spacing: .08em; }
.persona-section-status { padding: 6px 10px; border-radius: 999px; background: var(--surface); color: var(--quiet); font-size: .68rem; font-weight: 750; text-transform: uppercase; }
.persona-section-status.is-required { background: var(--ink); color: white; }
.persona-section-status.is-added { background: #eaf5ec; color: #1f6b32; }
.persona-section-chevron { width: 9px; height: 9px; border-right: 1.5px solid var(--quiet); border-bottom: 1.5px solid var(--quiet); transform: rotate(45deg); transition: transform 160ms ease; }
.persona-builder-section[open] .persona-section-chevron { transform: rotate(225deg); }
.persona-section-body { padding: 2px 24px 24px; border-top: 1px solid var(--line-soft); }
.persona-section-prompt { padding: 22px 0 4px; }
.persona-section-prompt h3 { margin: 0; font-size: 1.25rem; letter-spacing: -.02em; }
.persona-section-prompt p { margin: 6px 0 0; color: var(--muted); font-size: .84rem; }
.persona-section-footer { margin-top: 22px; padding-top: 18px; display: flex; justify-content: flex-end; border-top: 1px solid var(--line-soft); }
.persona-builder-actions { padding: 22px 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid var(--line-soft); border-radius: 20px; background: white; }
.persona-builder-actions > div:first-child { display: grid; gap: 4px; }
.persona-builder-actions > div:first-child span { color: var(--muted); font-size: .8rem; }
.persona-builder-actions > div:last-child { display: flex; gap: 9px; }
.persona-list-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.persona-work-fields { display: grid; gap: 12px; }
.persona-work-row { padding: 4px 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; border: 1px solid var(--line-soft); border-radius: 16px; background: white; }
.persona-suggestions { margin: 28px 0 24px; display: grid; gap: 9px; }
.persona-suggestions button { width: 100%; padding: 17px 18px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 12px; align-items: center; border: 1px solid var(--line); border-radius: 15px; background: white; color: var(--ink); cursor: pointer; font: inherit; text-align: left; transition: border-color 150ms ease, background 150ms ease, transform 150ms ease; }
.persona-suggestions button:hover { border-color: var(--quiet); transform: translateY(-1px); }
.persona-suggestions button.is-selected { border-color: var(--ink); background: var(--surface); }
.persona-suggestions button > span { color: var(--quiet); font-size: .68rem; font-weight: 700; }
.persona-suggestions button > strong { font-size: .88rem; line-height: 1.4; }
.persona-suggestions button > small { color: var(--muted); font-size: .72rem; font-weight: 650; white-space: nowrap; }
.persona-suggestions button.is-selected > small { color: var(--ink); }
.persona-draft-note { margin: -8px 0 0; color: var(--quiet); font-size: .76rem; }
.persona-self-published { margin-top: 24px; padding: 17px 19px; display: grid; gap: 4px; border-radius: 14px; background: var(--surface); }
.persona-self-published span { color: var(--muted); font-size: .82rem; line-height: 1.45; }
.persona-fieldset { margin: 30px 0 0; padding: 26px 0 0; border: 0; border-top: 1px solid var(--line-soft); }
.persona-fieldset legend { padding: 0; font-size: 1.05rem; font-weight: 700; }
.persona-fieldset > p { margin: 6px 0 10px; color: var(--muted); font-size: .85rem; }
.interest-picker { margin-top: 20px; padding: 20px; border: 1px solid var(--line-soft); border-radius: 18px; background: white; }
.interest-picker > label { margin: 0 0 16px; }
.interest-options { display: flex; flex-wrap: wrap; gap: 8px; }
.interest-options button { padding: 8px 12px; border: 1px solid var(--line); border-radius: 999px; background: white; color: var(--ink); cursor: pointer; font: inherit; font-size: .8rem; font-weight: 600; transition: background 140ms ease, color 140ms ease, border-color 140ms ease; }
.interest-options button:hover { background: var(--surface); }
.interest-options button.is-selected { border-color: var(--ink); background: var(--ink); color: white; }
.interest-picker-footer { margin-top: 17px; padding-top: 14px; display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line-soft); color: var(--quiet); font-size: .75rem; }
.selected-interests { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 7px; }
.selected-interests:empty { display: none; }
.selected-interests > span { padding: 7px 8px 7px 11px; display: inline-flex; align-items: center; gap: 7px; border-radius: 999px; background: #e8e8ed; color: var(--ink); font-size: .78rem; font-weight: 600; }
.selected-interests button { width: 19px; height: 19px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(0,0,0,.12); color: var(--ink); cursor: pointer; font: inherit; line-height: 1; }
.interest-empty { margin: 12px 0 0; color: var(--quiet); font-size: .8rem; }
.persona-readiness { margin-bottom: 18px; padding: 24px; display: grid; gap: 18px; border: 1px solid var(--line-soft); border-radius: 20px; background: var(--surface); }
.persona-readiness > div:first-child { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 3px 12px; }
.persona-readiness .eyebrow { grid-column: 1 / -1; margin: 0; }
.persona-readiness strong { font-size: 1.3rem; }
.persona-readiness > div:first-child span { color: var(--muted); font-size: .83rem; }
.readiness-meter { height: 6px; overflow: hidden; border-radius: 999px; background: #dedee3; }
.readiness-meter span { height: 100%; display: block; border-radius: inherit; background: var(--ink); transition: width 240ms ease; }
.persona-readiness ul { margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 16px; list-style: none; }
.persona-readiness li { color: var(--muted); font-size: .8rem; }
.persona-readiness li span { margin-right: 5px; }
.persona-readiness li.is-complete { color: #1f6b32; }

.accounts-card { padding: 28px; }
.account-adders { display: flex; flex-wrap: wrap; gap: 9px; }
.account-add { min-height: 38px; padding: 8px 14px; border: 1px solid var(--line); border-radius: 999px; background: white; color: var(--ink); cursor: pointer; font: inherit; font-size: .84rem; font-weight: 600; }
.account-add:hover { background: var(--surface); }
.account-form { margin-top: 24px; }
.account-editors { display: grid; }
.account-editor-row { min-height: 88px; padding: 16px 0; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 15px; align-items: center; border-top: 1px solid var(--line-soft); }
.account-editor-row.is-hidden { display: none; }
.account-mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; background: var(--ink); color: white; font-weight: 700; }
.account-details { min-width: 0; display: grid; gap: 7px; }
.account-url-field { display: flex; align-items: center; min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: white; }
.account-url-field span { flex: 0 0 auto; padding-left: 12px; color: var(--quiet); font-size: .82rem; white-space: nowrap; }
.account-url-field input { min-width: 100px; margin: 0; padding: 10px 12px 10px 2px; border: 0; border-radius: 0; box-shadow: none; }
.account-save { padding-top: 22px; display: flex; justify-content: flex-end; border-top: 1px solid var(--line-soft); }
.preserved-note { margin: 18px 0 0; color: var(--quiet); font-size: .78rem; }

.security-card { padding: 0 28px; }
.security-block { padding: 30px 0; }
.security-block + .security-block { border-top: 1px solid var(--line-soft); }
.security-title h3, .passkey-summary h3 { margin: 0 0 5px; }
.security-title p, .passkey-summary p, .form-note, .danger-zone p { margin: 0; color: var(--muted); font-size: .88rem; }
.compact-form { max-width: 720px; padding: 22px 0 0; }
.compact-form label { margin-bottom: 0; }
.form-submit { margin-top: 20px; display: flex; justify-content: flex-end; }
.passkey-summary { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 15px; align-items: center; }
.passkey-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 13px; background: var(--ink); color: white; font-size: 1.1rem; }
.security-status { padding: 6px 10px; border-radius: 999px; background: #eaf5ec; color: #1f6b32; font-size: .75rem; font-weight: 700; }
.form-status { min-height: 1.4em; color: #1f6b32; font-size: .86rem; }
.danger-zone { padding: 24px 0 30px; border-top: 1px solid var(--line-soft); }
.danger-zone summary { cursor: pointer; color: var(--danger); font-size: .88rem; font-weight: 650; }
.danger-zone > div { max-width: 520px; padding-top: 12px; }
.danger-zone label { margin-top: 16px; }

.photo-editor-dialog { width: min(520px, calc(100% - 28px)); max-height: calc(100vh - 30px); padding: 0; overflow: auto; border: 0; border-radius: 26px; background: white; box-shadow: 0 28px 90px rgba(0,0,0,.28); }
.photo-editor-dialog::backdrop { background: rgba(0,0,0,.34); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.photo-editor-sheet { padding: 26px; }
.photo-editor-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.photo-editor-header .eyebrow { margin-bottom: 4px; }
.photo-editor-header h2 { margin: 0; font-size: 1.8rem; }
.dialog-close { width: 32px; height: 32px; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--surface); color: var(--muted); cursor: pointer; font: inherit; font-size: 1.3rem; line-height: 1; }
.crop-stage { position: relative; width: min(340px, 100%); aspect-ratio: 1; margin: 24px auto 20px; overflow: hidden; border-radius: 20px; background: #d8d8dc; touch-action: none; cursor: grab; user-select: none; }
.crop-stage:active { cursor: grabbing; }
.crop-stage > img { position: absolute; z-index: 1; top: 50%; left: 50%; max-width: none; pointer-events: none; transform-origin: center; }
.crop-mask { position: absolute; z-index: 2; inset: 0; border: 1px solid rgba(255,255,255,.75); border-radius: 50%; box-shadow: 0 0 0 120px rgba(0,0,0,.48); pointer-events: none; }
.crop-placeholder { position: absolute; z-index: 3; inset: 0; display: grid; place-content: center; gap: 10px; text-align: center; pointer-events: none; }
.crop-placeholder span { width: 96px; height: 96px; margin: auto; display: grid; place-items: center; border-radius: 50%; background: #e5e5ea; color: #6e6e73; font-size: 1.8rem; font-weight: 600; }
.crop-placeholder p { margin: 0; color: var(--muted); font-size: .86rem; }
.crop-stage.has-image .crop-placeholder { display: none; }
.crop-controls { display: flex; align-items: center; justify-content: center; gap: 18px; }
.crop-zoom { min-width: 190px; margin: 0; display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: .8rem; }
.crop-zoom input { padding: 0; accent-color: var(--ink); }
.crop-help { margin: 15px 0 0; color: var(--muted); font-size: .82rem; text-align: center; }
.photo-editor-actions { min-height: 62px; margin-top: 20px; padding-top: 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line-soft); }
.photo-editor-actions > div { display: flex; gap: 9px; }
.photo-editor-actions form { margin: 0; }
.danger-text { color: var(--danger); }

.profile-photo { width: 110px; height: 110px; border-radius: 50%; object-fit: cover; }
.profile-photo { display: block; margin: 0 auto 18px; }
.profile-initials {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #e5e5ea;
  color: #6e6e73;
  font-size: 2.2rem;
  font-weight: 600;
  letter-spacing: -.04em;
  user-select: none;
}
.check { display: flex; grid-template-columns: auto 1fr; align-items: start; font-weight: 500; }
.check input { width: auto; }
.verified { display: inline-block; padding: 6px 10px; border-radius: 999px; background: #e8e8ed; color: var(--ink); font-size: .8rem; font-weight: 700; }

.profile-card { max-width: 760px; margin: 30px auto; padding: 48px; text-align: center; }
.profile-card h1 { margin: .35em 0 .05em; font-size: 3.8rem; }
.alias { color: var(--muted); font-size: 1.15rem; }
.persona-headline { max-width: 590px; margin: 22px auto 0; color: var(--ink); font-size: 1.35rem; font-weight: 550; line-height: 1.45; }
.proof { margin: 30px 0; padding: 18px 0; display: grid; grid-template-columns: repeat(2, 1fr); border-block: 1px solid var(--line); text-align: left; }
.proof div { padding: 0 14px; }
.proof div + div { border-left: 1px solid var(--line); }
dt { color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
dd { margin: 5px 0 0; font-weight: 650; word-break: break-word; }
.bio { font-size: 1.15rem; line-height: 1.55; }
.profile-bio { max-width: 590px; margin: 10px auto 0; color: var(--muted); font-size: .98rem; }
.persona-public-section { margin-top: 36px; text-align: left; }
.persona-public-section h2 { margin: 0 0 14px; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.known-for-list { display: flex; flex-wrap: wrap; gap: 8px; }
.known-for-list span { padding: 9px 13px; border-radius: 999px; background: var(--surface); color: var(--ink); font-size: .86rem; font-weight: 600; }
.interest-public-list { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.interest-public-list span { color: var(--muted); font-size: .9rem; }
.interest-public-list span::before { content: '·'; margin-right: 7px; color: var(--quiet); }
.current-work-list { display: grid; gap: 9px; }
.current-work-list a, .current-work-list > div { padding: 15px 17px; display: flex; justify-content: space-between; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); font-weight: 650; text-decoration: none; }
.current-work-list a:hover { background: var(--surface); }
.public-links { display: grid; gap: 10px; margin: 0; }
.public-links a { padding: 15px 18px; display: flex; justify-content: space-between; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); font-weight: 650; text-decoration: none; transition: background 160ms ease; }
.public-links a:hover { background: var(--surface); }
.ask-box { margin-top: 30px; padding: 22px; border-radius: 16px; background: var(--surface); text-align: left; }
.ask-form { display: flex; gap: 8px; }
.ask-answer { line-height: 1.5; }

@media (max-width: 820px) {
  .settings-section-heading { grid-template-columns: 1fr; gap: 10px; }
  .landing-hero-copy { max-width: 720px; }
  .landing-card-grid article:nth-child(n) { grid-column: span 3; }
  .landing-persona { grid-template-columns: 1fr; }
  .trust-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .nav-shell, main { padding-inline: 20px; }
  .nav-shell { height: 54px; }
  .site-header nav { gap: 14px; }
  .site-header nav > a:not(.button) { display: none; }
  .landing-hero { min-height: calc(100svh - 54px); padding-top: 46px; }
  .landing-hero h1 { margin-top: 18px; font-size: clamp(2.85rem, 12.3vw, 3.2rem); line-height: .93; letter-spacing: -.06em; }
  .landing-lede { max-width: 350px; font-size: 1rem; line-height: 1.48; }
  .landing-actions { margin-top: 26px; gap: 16px; flex-wrap: wrap; }
  .landing-actions .button { min-height: 42px; padding: 10px 18px; }
  .landing-product-demo { margin-top: 38px; }
  .product-proof-row { margin-bottom: 10px; gap: 5px; }
  .product-proof-row span { padding: 6px 8px; font-size: .52rem; }
  .identity-constellation { height: 292px; border-radius: 28px; }
  .identity-center { width: 112px; min-height: 132px; padding: 9px; border-radius: 23px; }
  .identity-portrait { width: 78px; height: 78px; }
  .identity-you { margin-top: 5px; }
  .identity-verified { margin-top: 1px; }
  .brand-bubble { width: 44px; height: 44px; border-radius: 15px; }
  .brand-bubble svg { width: 22px; height: 22px; }
  .brand-bubble-instagram { left: calc(50% - 22px); }
  .brand-bubble-google { left: calc(50% - 22px); }
  .brand-bubble-facebook strong { transform: translateY(5px); font-size: 1.85rem; }
  .brand-bubble-google strong { font-size: 1.38rem; }
  .brand-bubble-linkedin strong { font-size: 1.18rem; }
  .landing-example-note { padding-inline: 20px; line-height: 1.4; }
  .landing-benefits article { grid-template-columns: 42px minmax(0, 1fr); }
  .landing-card-grid { grid-template-columns: 1fr; }
  .landing-card-grid article:nth-child(n) { min-height: 220px; grid-column: auto; }
  .landing-how li { grid-template-columns: 42px minmax(0, 1fr); }
  .landing-split { grid-template-columns: 1fr; }
  .landing-split article { min-height: auto; }
  .landing-persona aside { padding: 28px; }
  .landing-privacy { margin-inline: -20px; padding: 64px 28px; border-radius: 0; }
  .footer-shell { padding-inline: 20px; }
  .footer-shell-expanded { display: grid; }
  .footer-shell-expanded nav { justify-content: flex-start; }
  .info-sections > section { grid-template-columns: 1fr; gap: 14px; }
  .provider-table { border: 0; border-radius: 0; }
  .provider-table > div { padding: 20px 0; grid-template-columns: 1fr; gap: 7px; border-bottom: 1px solid var(--line-soft); }
  .provider-table > div:first-child { display: none; }
  .three-up { grid-template-columns: 1fr; }
  .portal-heading { display: grid; align-items: flex-start; justify-items: start; gap: 18px; }
  .portal-heading > .button { justify-self: start; }
  .portal-avatar, .portal-avatar-editor { width: 76px; height: 76px; }
  .portal-identity { gap: 14px; }
  .portal-heading h1 { font-size: 2rem; }
  .portal-tabs { top: 58px; gap: 24px; overflow-x: auto; scrollbar-width: none; }
  .portal-panel { padding-top: 34px; }
  .setting-toggle-row, .profile-save-row { align-items: flex-start; }
  .profile-save-row { display: grid; }
  .account-facts, .persona-list-fields, .persona-work-row { grid-template-columns: 1fr; }
  .account-facts div + div { padding-left: 0; border-top: 1px solid var(--line-soft); border-left: 0; }
  .persona-builder-intro { padding: 20px; grid-template-columns: 46px minmax(0, 1fr); align-items: start; }
  .persona-builder-intro .persona-intro-mark { width: 46px; height: 46px; border-radius: 14px; }
  .persona-builder-progress { grid-column: 1 / -1; }
  .persona-builder-section > summary { padding: 15px 16px; grid-template-columns: 38px minmax(0, 1fr) 15px; gap: 11px; }
  .persona-section-icon { width: 38px; height: 38px; border-radius: 12px; }
  .persona-section-status { grid-column: 2; grid-row: 2; justify-self: start; margin-top: 5px; }
  .persona-section-chevron { grid-column: 3; grid-row: 1 / 3; }
  .persona-section-body { padding: 2px 16px 20px; }
  .persona-section-heading small { white-space: normal; }
  .persona-builder-actions { align-items: stretch; flex-direction: column; }
  .persona-builder-actions > div:last-child { display: grid; grid-template-columns: 1fr 1fr; }
  .persona-suggestions button { grid-template-columns: 24px minmax(0, 1fr); }
  .persona-suggestions button > small { grid-column: 2; }
  .account-editor-row { grid-template-columns: 38px minmax(0, 1fr); }
  .account-editor-row > .text-action { grid-column: 2; justify-self: start; }
  .account-mark { width: 38px; height: 38px; }
  .account-url-field { display: grid; }
  .account-url-field span { padding: 9px 12px 0; overflow: hidden; text-overflow: ellipsis; }
  .account-url-field input { padding: 4px 12px 10px; }
  .split, .proof { grid-template-columns: 1fr; }
  .proof div + div { margin-top: 12px; border-left: 0; }
  .profile-card { padding: 30px 20px; }
  .profile-card h1 { font-size: 2.8rem; }
  .ask-form { display: grid; }
  .photo-editor-sheet { padding: 22px 18px; }
  .crop-controls { align-items: stretch; flex-direction: column; }
  .crop-zoom { width: 100%; }
  .photo-editor-actions { align-items: stretch; flex-direction: column-reverse; }
  .photo-editor-actions > div:last-child { justify-content: flex-end; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
  .brand-bubble { animation: none; }
  .persona-frame { animation: none; opacity: 0; }
  .persona-frame-1 { opacity: 1; }
  .verification-face { display: none; }
  .verification-symbol { opacity: 1; transform: none; animation: none; }
}

/* Persona customization -------------------------------------------------- */
.persona-editor-shell { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); gap: 24px; align-items: start; }
.persona-editor-controls { padding: 0; overflow: hidden; }
.persona-mode-tabs { padding: 8px; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; border-bottom: 1px solid var(--line-soft); background: var(--surface); }
.persona-mode-tabs button { min-height: 42px; border: 0; border-radius: 12px; background: transparent; color: var(--muted); font: inherit; font-weight: 650; cursor: pointer; }
.persona-mode-tabs button[aria-selected="true"] { background: var(--paper); color: var(--ink); box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.persona-editor-controls .settings-form { padding: 26px; }
.persona-save-bar, .persona-visibility-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.persona-save-bar { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line-soft); }
.persona-save-bar span, .persona-visibility-card span { color: var(--muted); font-size: .82rem; }
.persona-visibility-card { margin-top: 18px; padding: 20px 22px; border: 1px solid var(--line-soft); border-radius: 18px; background: var(--surface-raised); }
.persona-visibility-card > div { display: grid; gap: 4px; }
.style-fieldset { margin: 0 0 24px; padding: 0; border: 0; }
.style-fieldset legend { padding: 0; font-size: 1rem; font-weight: 700; }
.style-fieldset > p { margin: 5px 0 16px; color: var(--muted); font-size: .84rem; }
.preset-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.preset-card { position: relative; display: grid; gap: 8px; cursor: pointer; }
.preset-card input { position: absolute; opacity: 0; pointer-events: none; }
.preset-card strong { font-size: .82rem; }
.preset-sample { height: 112px; padding: 18px; display: grid; align-content: center; gap: 7px; border: 2px solid transparent; border-radius: 16px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); transition: border-color 160ms ease, transform 160ms ease; }
.preset-card input:checked + .preset-sample { border-color: var(--ink); transform: translateY(-1px); }
.preset-card input:focus-visible + .preset-sample { outline: 2px solid var(--ink); outline-offset: 3px; }
.preset-sample b { font-size: 1.4rem; }
.preset-sample i { width: 75%; height: 5px; border-radius: 99px; background: currentColor; opacity: .35; }
.preset-sample i:last-child { width: 52%; }
.preset-card--classic .preset-sample { background: #fff; color: #1d1d1f; }
.preset-card--editorial .preset-sample { background: #f4eddf; color: #34291f; font-family: Georgia, serif; }
.preset-card--poster .preset-sample { background: #315fc4; color: #fff; }
.preset-card--night .preset-sample { background: #171719; color: #fff; }
.fine-tune { margin-bottom: 26px; border: 1px solid var(--line-soft); border-radius: 14px; }
.fine-tune summary { padding: 14px 16px; font-weight: 700; cursor: pointer; }
.fine-tune-grid { padding: 0 16px 16px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.section-order { margin: 0; padding: 0; display: grid; gap: 8px; list-style: none; }
.section-order li { padding: 12px 14px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid var(--line-soft); border-radius: 12px; background: var(--paper); font-size: .88rem; font-weight: 650; }
.section-order button, .link-row-actions button { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); color: var(--ink); cursor: pointer; }
.persona-live-preview { position: sticky; top: 126px; overflow: hidden; border: 1px solid var(--line-soft); border-radius: 22px; background: #ececf0; }
.preview-toolbar { padding: 12px 16px; display: flex; justify-content: space-between; border-bottom: 1px solid var(--line-soft); background: rgba(255,255,255,.86); font-size: .76rem; }
.preview-toolbar span { color: var(--muted); }
.preview-persona { --preview-bg: #fff; --preview-ink: #1d1d1f; --preview-accent: #1d1d1f; min-height: 600px; padding: 34px 28px; background: var(--preview-bg); color: var(--preview-ink); text-align: center; transition: background 180ms ease, color 180ms ease; }
.preview-persona > img, .preview-initials { width: 82px; height: 82px; margin: 0 auto 12px; display: grid; place-items: center; border-radius: 50%; object-fit: cover; background: #dedee3; font-size: 1.5rem; font-weight: 700; }
.preview-persona > small { display: inline-block; padding: 5px 8px; border: 1px solid var(--preview-accent); border-radius: 999px; background: transparent; color: var(--preview-accent); font-weight: 750; }
.preview-persona h3 { margin: 12px 0 2px; color: inherit; font-size: 1.75rem; }
.preview-persona > em { color: color-mix(in srgb, var(--preview-ink) 60%, transparent); font-style: normal; }
.preview-persona > p { margin: 16px auto 24px; line-height: 1.45; }
.preview-sections { display: grid; gap: 12px; text-align: left; }
.preview-sections section { padding: 13px; border: 1px solid color-mix(in srgb, var(--preview-ink) 16%, transparent); border-radius: 12px; }
.preview-sections section > b { display: block; margin-bottom: 7px; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; }
.preview-sections section p { margin: 0; font-size: .78rem; }
.preview-sections section div { display: flex; flex-wrap: wrap; gap: 5px; }
.preview-sections section div span { padding: 5px 7px; border-radius: 999px; background: color-mix(in srgb, var(--preview-accent) 12%, transparent); font-size: .67rem; }
.preview-persona.persona-preset-editorial { --preview-bg: #f4eddf; --preview-ink: #34291f; }
.preview-persona.persona-preset-poster { --preview-bg: #315fc4; --preview-ink: #fff; }
.preview-persona.persona-preset-night { --preview-bg: #171719; --preview-ink: #f7f7f4; }
.preview-persona.persona-type-serif { font-family: Georgia, "Times New Roman", serif; }
.preview-persona.persona-type-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.preview-persona.persona-accent-violet { --preview-accent: #7c3aed; }
.preview-persona.persona-accent-cobalt { --preview-accent: #2456b8; }
.preview-persona.persona-accent-moss { --preview-accent: #356347; }
.preview-persona.persona-accent-clay { --preview-accent: #a94f3d; }
.preview-persona.persona-preset-poster.persona-accent-violet { --preview-accent: #f8e3ff; }
.preview-persona.persona-preset-poster.persona-accent-cobalt { --preview-accent: #fff; }
.preview-persona.persona-preset-poster.persona-accent-moss { --preview-accent: #c7f4d2; }
.preview-persona.persona-preset-poster.persona-accent-clay { --preview-accent: #ffe3de; }
.preview-persona.persona-preset-night.persona-accent-violet { --preview-accent: #c9afff; }
.preview-persona.persona-preset-night.persona-accent-cobalt { --preview-accent: #a9c9ff; }
.preview-persona.persona-preset-night.persona-accent-moss { --preview-accent: #a9dfb9; }
.preview-persona.persona-preset-night.persona-accent-clay { --preview-accent: #ffb4a6; }
.preview-persona.persona-portrait-framed > img, .preview-persona.persona-portrait-framed > .preview-initials { border-radius: 16px; box-shadow: 7px 7px 0 var(--preview-accent); }
.preview-persona.persona-portrait-hero > img, .preview-persona.persona-portrait-hero > .preview-initials { width: 100%; height: 155px; border-radius: 16px; }
.preview-persona.persona-links-pills [data-preview-section="connections"] span { border-radius: 999px; }
.preview-persona.persona-links-cards [data-preview-section="connections"] span { flex-basis: calc(50% - 4px); border-radius: 8px; }

.links-card { padding: 0; overflow: visible; }
.links-heading { padding: 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line-soft); }
.links-heading h3, .verified-connections h3 { margin: 0; }
.links-heading p, .verified-connections > p { margin: 5px 0 0; color: var(--muted); font-size: .84rem; }
.add-link-menu { position: relative; }
.add-link-menu summary { list-style: none; cursor: pointer; }
.add-link-menu summary::-webkit-details-marker { display: none; }
.add-link-menu > div { position: absolute; z-index: 10; top: calc(100% + 8px); right: 0; width: 190px; padding: 7px; display: grid; border: 1px solid var(--line-soft); border-radius: 14px; background: var(--paper); box-shadow: 0 14px 35px rgba(0,0,0,.14); }
.add-link-menu > div button { padding: 9px 10px; border: 0; border-radius: 9px; background: none; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.add-link-menu > div button:hover { background: var(--surface); }
.links-form { padding: 22px; }
.link-editor-list { display: grid; gap: 12px; }
.link-editor-row { padding: 16px; border: 1px solid var(--line-soft); border-radius: 16px; background: var(--surface-raised); }
.link-editor-row.is-dragging { opacity: .55; }
.link-row-top { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 12px; align-items: start; }
.link-row-fields { display: grid; grid-template-columns: minmax(120px, .7fr) minmax(180px, 1.3fr); gap: 10px; }
.link-row-fields label { gap: 4px; font-size: .68rem; }
.link-row-fields input { padding: 9px 10px; border-radius: 9px; font-size: .86rem; }
.link-row-actions { margin-top: 12px; padding-left: 54px; display: flex; align-items: center; gap: 18px; color: var(--muted); font-size: .78rem; }
.link-row-actions label { display: flex; align-items: center; gap: 6px; font-weight: 600; }
.link-row-actions input { width: auto; }
.link-row-actions > span { margin-left: auto; display: flex; gap: 5px; }
.link-drag-handle { cursor: grab !important; }
.link-drag-handle:active { cursor: grabbing !important; }
.link-count { margin: 14px 0 0; color: var(--muted); font-size: .78rem; }
.account-save > span { color: var(--muted); font-size: .78rem; }
.verified-connections { margin-top: 18px; }
.verified-connections ul { margin: 16px 0 0; padding: 0; display: grid; gap: 8px; list-style: none; }
.verified-connections li { padding: 11px 0; display: flex; justify-content: space-between; border-top: 1px solid var(--line-soft); }
.verified-connections small { color: #1f6b32; }

/* Public Persona themes */
.public-persona { --persona-bg: #fff; --persona-card: #fbfbfd; --persona-ink: #1d1d1f; --persona-muted: #6e6e73; --persona-line: rgba(0,0,0,.14); --persona-accent: #1d1d1f; min-height: calc(100vh - 96px); margin: -48px -28px -100px; padding: 48px 28px 100px; background: var(--persona-bg); color: var(--persona-ink); }
.public-persona.persona-preset-editorial { --persona-bg: #f4eddf; --persona-card: #fffaf0; --persona-ink: #34291f; --persona-muted: #74685d; --persona-line: rgba(52,41,31,.22); }
.public-persona.persona-preset-poster { --persona-bg: #315fc4; --persona-card: #315fc4; --persona-ink: #fff; --persona-muted: #dce6ff; --persona-line: rgba(255,255,255,.38); }
.public-persona.persona-preset-night { --persona-bg: #171719; --persona-card: #202023; --persona-ink: #f7f7f4; --persona-muted: #b9b9bd; --persona-line: rgba(255,255,255,.2); }
.public-persona.persona-type-serif { font-family: Georgia, "Times New Roman", serif; }
.public-persona.persona-type-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.public-persona.persona-accent-violet { --persona-accent: #7c3aed; }
.public-persona.persona-accent-cobalt { --persona-accent: #2456b8; }
.public-persona.persona-accent-moss { --persona-accent: #356347; }
.public-persona.persona-accent-clay { --persona-accent: #a94f3d; }
.public-persona.persona-preset-poster.persona-accent-violet { --persona-accent: #f8e3ff; }
.public-persona.persona-preset-poster.persona-accent-cobalt { --persona-accent: #fff; }
.public-persona.persona-preset-poster.persona-accent-moss { --persona-accent: #c7f4d2; }
.public-persona.persona-preset-poster.persona-accent-clay { --persona-accent: #ffe3de; }
.public-persona.persona-preset-night.persona-accent-violet { --persona-accent: #c9afff; }
.public-persona.persona-preset-night.persona-accent-cobalt { --persona-accent: #a9c9ff; }
.public-persona.persona-preset-night.persona-accent-moss { --persona-accent: #a9dfb9; }
.public-persona.persona-preset-night.persona-accent-clay { --persona-accent: #ffb4a6; }
.public-persona.persona-preset-poster.persona-accent-graphite, .public-persona.persona-preset-night.persona-accent-graphite { --persona-accent: #fff; }
.public-persona .profile-card { position: relative; border-color: var(--persona-line); background: var(--persona-card); color: var(--persona-ink); box-shadow: 0 22px 70px rgba(0,0,0,.09); }
.public-persona .profile-card h1, .public-persona .persona-public-section h2 { color: var(--persona-ink); }
.public-persona .alias, .public-persona .profile-bio, .public-persona .interest-public-list span, .public-persona dt { color: var(--persona-muted); }
.public-persona .persona-headline { color: var(--persona-ink); }
.public-persona .verified { border: 1px solid var(--persona-accent); background: transparent; color: var(--persona-accent); font-family: inherit; cursor: pointer; }
.public-persona .profile-photo { background: color-mix(in srgb, var(--persona-ink) 10%, var(--persona-card)); color: var(--persona-muted); }
.public-persona.persona-portrait-framed .profile-photo { border-radius: 20px; box-shadow: 9px 9px 0 var(--persona-accent); }
.public-persona.persona-portrait-hero .profile-photo { width: min(100%, 590px); height: 280px; border-radius: 20px; }
.public-persona .proof { border-color: var(--persona-line); }
.public-persona .proof div + div { border-color: var(--persona-line); }
.public-persona .known-for-list span { background: color-mix(in srgb, var(--persona-accent) 12%, transparent); color: var(--persona-ink); }
.public-persona .current-work-list a, .public-persona .current-work-list > div, .public-persona .public-links a { border-color: var(--persona-line); color: var(--persona-ink); }
.public-persona .public-links a { align-items: center; gap: 12px; }
.public-persona .public-links .link-mark { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid var(--persona-accent); border-radius: 9px; background: transparent; color: var(--persona-accent); font-size: .72rem; font-weight: 800; }
.public-persona .public-links .link-label { flex: 1; text-align: left; }
.public-persona.persona-links-pills .public-links { display: flex; flex-wrap: wrap; }
.public-persona.persona-links-pills .public-links a { flex: 1 1 210px; border-radius: 999px; }
.public-persona.persona-links-cards .public-links { grid-template-columns: repeat(2, 1fr); }
.public-persona.persona-links-cards .public-links a { min-height: 110px; align-content: space-between; flex-wrap: wrap; }
.public-persona .public-links a.is-featured { min-height: 108px; padding: 22px; border-color: var(--persona-accent); background: color-mix(in srgb, var(--persona-accent) 12%, transparent); font-size: 1.08rem; }
.public-persona .ask-box { background: color-mix(in srgb, var(--persona-accent) 10%, transparent); }
.profile-share { position: fixed; z-index: 20; top: 18px; right: 18px; padding: 8px 12px; border: 1px solid var(--persona-line); border-radius: 999px; background: var(--persona-card); color: var(--persona-ink); box-shadow: 0 5px 18px rgba(0,0,0,.12); font: inherit; font-size: .78rem; font-weight: 700; cursor: pointer; }
.profile-dialog { width: min(440px, calc(100% - 32px)); padding: 28px; border: 0; border-radius: 22px; box-shadow: 0 28px 90px rgba(0,0,0,.28); }
.profile-dialog::backdrop { background: rgba(0,0,0,.44); backdrop-filter: blur(4px); }
.profile-dialog h2 { margin: 0 0 12px; font-size: 1.7rem; }
.profile-dialog p { color: var(--muted); }
.dialog-close { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; border: 0; border-radius: 50%; background: var(--surface); font-size: 1.2rem; cursor: pointer; }
.dialog-proof { margin: 20px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.profile-qr { width: 220px; height: 220px; margin: 20px auto; display: block; border: 10px solid white; border-radius: 14px; }
.share-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.share-status { min-height: 1.4em; margin-bottom: 0; text-align: center; font-size: .82rem; }

@media (max-width: 900px) {
  .persona-editor-shell { grid-template-columns: 1fr; }
  .persona-live-preview { position: static; }
  .preview-persona { min-height: 480px; }
}

@media (max-width: 640px) {
  .persona-editor-controls .settings-form, .links-form { padding: 18px; }
  .fine-tune-grid, .link-row-fields { grid-template-columns: 1fr; }
  .persona-save-bar, .persona-visibility-card, .links-heading { align-items: stretch; flex-direction: column; }
  .preset-grid { gap: 8px; }
  .preset-sample { height: 92px; }
  .link-row-top { grid-template-columns: 38px minmax(0, 1fr); }
  .link-row-top > .text-action { grid-column: 2; justify-self: start; }
  .link-row-actions { padding-left: 0; flex-wrap: wrap; }
  .public-persona { margin: -48px -20px -100px; padding-inline: 12px; }
  .public-persona .profile-card { padding: 64px 20px 30px; }
  .public-persona.persona-links-cards .public-links { grid-template-columns: 1fr; }
}