:root {
  --paper: #f6f5f2;
  --surface: #ffffff;
  --accent: #5b5cf0;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--paper);
  font-synthesis: none;
}

[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body { min-width: 320px; background: var(--paper); }
img { display: block; max-width: 100%; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.discovery-card { position: relative; }
.discovery-bookmark { position: absolute; z-index: 4; top: 16px; right: 16px; }
.discovery-cover { position: relative; display: block; height: 280px; background: var(--profile-accent); overflow: hidden; }
.discovery-cover::after { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 58%, rgba(0, 0, 0, .12)); content: ""; }
.discovery-cover-pattern { position: absolute; inset: -35%; background: radial-gradient(circle at 25% 25%, rgba(255,255,255,.36), transparent 22%), radial-gradient(circle at 75% 62%, rgba(255,255,255,.17), transparent 24%), linear-gradient(135deg, transparent 30%, rgba(0,0,0,.16)); transform: rotate(-7deg); }
.discovery-person { display: grid; grid-template-columns: 106px minmax(0, 1fr) auto; align-items: end; gap: 18px; color: inherit; text-decoration: none; }
.discovery-avatar { width: 106px; height: 106px; margin-top: -53px; border: 5px solid var(--surface); font-size: 30px; }
.discovery-copy { display: grid; min-width: 0; gap: 4px; padding-top: 18px; }
.discovery-copy strong, .discovery-copy > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.discovery-copy > span, .discovery-copy small { color: var(--chakra-colors-fg-muted); }
.discovery-open { display: grid; width: 40px; height: 40px; margin-bottom: 6px; place-items: center; color: var(--chakra-colors-fg-muted); }
.discovery-bio { display: -webkit-box; margin-top: 20px; overflow: hidden; line-height: 1.7; white-space: pre-wrap; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.discovery-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 22px; }
.discovery-link { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; min-width: 0; align-items: center; gap: 10px; padding: 8px; color: inherit; text-decoration: none; }
.discovery-link-thumb { display: grid; width: 46px; height: 46px; place-items: center; border-radius: var(--chakra-radii-md); background: color-mix(in srgb, var(--profile-accent) 13%, #eeeae1); color: var(--profile-accent); overflow: hidden; }
.discovery-link-thumb > img { width: 100%; height: 100%; object-fit: cover; }
.discovery-link-copy { display: grid; min-width: 0; gap: 2px; }
.discovery-link-copy > * { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.discovery-link-copy small { color: var(--chakra-colors-fg-muted); }

.brand-icon { display: grid; width: 100%; height: 100%; place-items: center; }
.brand-icon > * { grid-area: 1 / 1; }
.brand-icon > img { z-index: 1; width: 48%; height: 48%; object-fit: contain; }
.brand-icon:has(> img) > span { visibility: hidden; }

.editor-shell { width: 100%; }
.editor-layout { display: grid; grid-template-columns: minmax(0, 1fr) 390px; gap: 42px; align-items: start; }
.editor-form { display: grid; min-width: 0; gap: 20px; }
.is-sorting { user-select: none; }
.preview-column { position: sticky; top: 24px; }
.device-preview { max-height: calc(100vh - 80px); border: 8px solid #242424; border-radius: 36px; background: var(--surface); box-shadow: var(--chakra-shadows-xl); overflow: auto; scrollbar-width: none; }
.device-preview::-webkit-scrollbar { display: none; }

.profile-cover { position: relative; height: 230px; background: var(--accent); overflow: hidden; }
.profile-cover::before { position: absolute; inset: -30%; background: radial-gradient(circle at 25% 25%, rgba(255,255,255,.35), transparent 28%), linear-gradient(130deg, transparent 20%, rgba(0,0,0,.18)); content: ""; transform: rotate(-8deg); }
.cover-noise { position: absolute; inset: 0; opacity: .18; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E"); }
.profile-content { padding: 0 28px 42px; }
.profile-identity { position: relative; }
.profile-avatar { width: 112px; height: 112px; margin-top: -56px; border: 5px solid var(--surface); font-size: 34px; }
.profile-actions { position: absolute; top: 16px; right: 0; }
.profile-identity h1 { margin-top: 18px; }
.profile-headline { margin-top: 4px; font-weight: 600; }
.profile-location { margin-top: 8px; color: var(--chakra-colors-fg-muted); font-size: var(--chakra-font-sizes-sm); }
.profile-bio { max-width: 680px; margin-top: 18px; color: var(--chakra-colors-fg-muted); line-height: 1.75; white-space: pre-wrap; }
.profile-section { margin-top: 36px; }
.profile-section-title { margin-bottom: 12px; }
.profile-links, .payment-list { display: grid; gap: 10px; }
.profile-link-card { display: flex; min-height: 92px; align-items: center; gap: 14px; padding: 10px; color: inherit; text-decoration: none; }
.link-thumb { display: grid; flex: 0 0 auto; width: 70px; height: 70px; place-items: center; border-radius: var(--chakra-radii-md); background: color-mix(in srgb, var(--accent) 13%, #eeeae1); overflow: hidden; }
.link-thumb > img { width: 100%; height: 100%; object-fit: cover; }
.link-placeholder { display: grid; width: 100%; height: 100%; place-items: center; color: var(--accent); }
.link-copy { display: grid; min-width: 0; gap: 3px; }
.link-copy > * { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.link-copy small, .link-copy > span, .link-arrow, .payment-notice { color: var(--chakra-colors-fg-muted); }
.link-arrow { flex: 0 0 auto; margin-left: auto; margin-right: 8px; }
.payment-notice { margin-bottom: 12px; font-size: var(--chakra-font-sizes-sm); }

.public-profile-page { background: #eceae5; }
.public-profile { width: min(760px, calc(100% - 32px)); margin: 20px auto 64px; overflow: hidden; }
.public-profile .profile-content { padding: 0 40px 52px; }
.public-profile .profile-links { grid-template-columns: 1fr 1fr; }
.public-profile .profile-avatar { width: 132px; height: 132px; margin-top: -66px; }
.profile-fallback { width: min(720px, calc(100% - 40px)); margin: 40px auto; }
.profile-fallback ul { padding-left: 20px; }

@media (max-width: 980px) {
  .editor-layout { grid-template-columns: 1fr; }
  .preview-column { position: static; display: none; }
  .editor-shell[data-active-section="preview"] .editor-form { display: none; }
  .editor-shell[data-active-section="preview"] .preview-column { display: block; }
  .editor-shell[data-active-section="preview"] .device-preview { width: min(430px, 100%); max-height: none; margin: 0 auto; }
}

@media (max-width: 640px) {
  .discovery-cover { height: min(58vw, 230px); }
  .discovery-person { grid-template-columns: 82px minmax(0, 1fr) auto; gap: 12px; }
  .discovery-avatar { width: 82px; height: 82px; margin-top: -41px; border-width: 4px; font-size: 24px; }
  .discovery-copy { padding-top: 13px; }
  .discovery-open { width: 34px; height: 34px; }
  .discovery-bio { -webkit-line-clamp: 2; }
  .discovery-links { grid-template-columns: 1fr; }
  .discovery-link { grid-template-columns: 50px minmax(0, 1fr) auto; }
  .discovery-link-thumb { width: 50px; height: 50px; }
  .discovery-bookmark { top: 12px; right: 12px; }
  .public-profile { width: 100%; margin: 0; border-radius: 0; }
  .public-profile .profile-cover { height: 185px; }
  .public-profile .profile-content { padding: 0 18px 44px; }
  .public-profile .profile-avatar { width: 106px; height: 106px; margin-top: -53px; border-width: 4px; }
  .public-profile .profile-links { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation-duration: .01ms !important; }
}