.profile-view {
  max-width: 1120px;
}

.profile-view > .section-head {
  margin-bottom: 20px;
}

.profile-view > .section-head h2 {
  margin-top: 7px;
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.1;
}

.profile-view .profile-card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas:
    "hero hero"
    "snapshot snapshot"
    "details details"
    "offer need"
    "portfolio portfolio"
    "interests interests";
  gap: 0 16px;
  margin: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.profile-view .profile-hero {
  grid-area: hero;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  margin: 0;
  padding: 26px 30px 30px;
  overflow: hidden;
  border: 1px solid #d2e5fb;
  border-radius: 18px;
  background: linear-gradient(125deg, #f7fbff 0%, #e1efff 54%, #b9d9ff 100%);
  box-shadow: 0 16px 32px rgba(51, 111, 190, 0.09), inset 0 1px 0 #fff;
}

.profile-hero-top,
.profile-identity,
.profile-hero-actions {
  display: flex;
  align-items: center;
  gap: 18px;
}

.profile-hero-top {
  justify-content: space-between;
  gap: 12px;
}

.profile-eyebrow {
  color: #315ba4;
  font-size: 12px;
  font-weight: 780;
}

.profile-active-pill {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 999px;
  color: #196d55;
  background: rgba(255, 255, 255, 0.62);
  box-shadow: 0 4px 12px rgba(35, 92, 145, 0.06);
  font-size: 12px;
  font-weight: 800;
  backdrop-filter: blur(14px);
}

.profile-active-pill i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2eaa82;
  box-shadow: 0 0 0 4px rgba(46, 170, 130, 0.14);
}

.profile-view .profile-card .profile-photo {
  width: 112px;
  height: 112px;
  flex: none;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 4px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  color: #2457b9;
  background: #fff;
  box-shadow: 0 12px 25px rgba(39, 88, 158, 0.14);
  font-size: 27px;
  font-weight: 800;
}

.profile-view .profile-card .profile-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profile-view .profile-title {
  min-width: 0;
}

.profile-view .profile-title h3 {
  margin: 0;
  color: #10203b;
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.08;
  overflow-wrap: anywhere;
}

.profile-view .profile-title p {
  margin: 6px 0 13px;
  color: #436080;
  font-size: 16px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.profile-identity-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.profile-identity-meta span {
  padding: 7px 10px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 999px;
  color: #315781;
  background: rgba(255, 255, 255, 0.53);
  font-size: 11px;
  font-weight: 750;
}

.profile-view .profile-featured-awards {
  margin-top: 9px;
}

.profile-hero-actions {
  flex-wrap: wrap;
  gap: 12px 18px;
}

.profile-view .profile-hero-actions .primary-button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin: 0;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 13px;
  color: #fff;
  background: linear-gradient(125deg, #2557d4, #5c81e9);
  box-shadow: 0 10px 20px rgba(40, 88, 192, 0.19), inset 0 1px 0 rgba(255, 255, 255, 0.25);
  font-size: 13px;
}

.profile-hero-actions .primary-button svg {
  width: 16px;
  height: 16px;
}

.profile-hero-actions > span {
  color: #526987;
  font-size: 12px;
}

.profile-view .profile-snapshot {
  grid-area: snapshot;
  width: auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0 0;
  border: 0;
  background: transparent;
}

.hide-profile-stats .profile-view .profile-snapshot {
  display: none;
}

.profile-view .profile-snapshot > div {
  min-width: 0;
  min-height: 92px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 16px 20px;
  border: 1px solid #dce7f5;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 8px 20px rgba(34, 81, 148, 0.04);
  text-align: left;
}

.profile-view .profile-snapshot > div + div {
  border-left: 1px solid #dce7f5;
}

.profile-view .profile-snapshot strong {
  color: #214eae;
  font-family: inherit;
  font-size: 27px;
  line-height: 1;
}

.profile-view .profile-snapshot span {
  display: block;
  min-height: 0;
  margin-top: 7px;
  color: #64748b;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.25;
  text-align: left;
}

.profile-completeness i {
  width: 100%;
  height: 4px;
  display: block;
  margin-top: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: linear-gradient(to right, #3375e5 0 var(--profile-progress), #e4edf9 var(--profile-progress) 100%);
}

.profile-details-head {
  grid-area: details;
  margin: 32px 0 16px;
}

.profile-details-head h3 {
  margin: 8px 0 0;
  color: #142238;
  font-size: 25px;
  line-height: 1.2;
}

.profile-view .profile-story {
  min-width: 0;
  min-height: 165px;
  margin: 0;
  padding: 22px;
  border: 1px solid #dce7f5;
  border-radius: 14px;
  background: #fff;
}

.profile-view .profile-story-offer { grid-area: offer; }
.profile-view .profile-story-need { grid-area: need; }

.profile-view .profile-portfolio {
  grid-area: portfolio;
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
  padding: 16px 22px;
  margin-top: 16px;
  border: 1px solid #dce7f5;
  border-radius: 14px;
  background: #fff;
}

.profile-view .profile-portfolio > span,
.profile-view .profile-portfolio a { display: inline-flex; align-items: center; gap: 8px; }
.profile-view .profile-portfolio > span { font-size: 12px; font-weight: 820; color: #2558ba; }
.profile-view .profile-portfolio a { min-width: 0; color: #2558ba; overflow-wrap: anywhere; }
.profile-view .profile-portfolio svg { width: 17px; height: 17px; flex: none; }
.portfolio-link { display: inline-flex; align-items: center; gap: 8px; margin: 14px 0; color: #2558ba; font-weight: 700; }
.portfolio-link svg { width: 18px; height: 18px; }

.profile-view .profile-story > span {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #2558ba;
  font-size: 12px;
  font-weight: 820;
}

.profile-view .profile-story-need > span { color: #18846d; }

.profile-view .profile-story > span svg {
  width: 18px;
  height: 18px;
}

.profile-view .profile-story p {
  margin: 17px 0 0;
  color: #27354b;
  font-size: 15px;
  line-height: 1.55;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.profile-view .profile-interests {
  grid-area: interests;
  margin: 16px 0 0;
  padding: 22px;
  border: 1px solid #dce7f5;
  border-radius: 14px;
  background: #fff;
}

.profile-view .profile-interests > span {
  color: #324d6f;
  font-size: 12px;
  font-weight: 820;
}

.profile-view .profile-tags span {
  min-height: 30px;
  border-color: #dce8fa;
  border-radius: 999px;
  color: #315781;
  background: #f3f8ff;
  font-size: 11px;
}

.profile-view .profile-awards-section {
  margin-top: 34px;
  padding: 0 0 30px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.profile-view .profile-awards-head {
  align-items: center;
  padding-bottom: 16px;
  border: 0;
}

.profile-view .profile-awards-head h3 {
  margin-top: 7px;
  font-size: 25px;
}

.profile-view .profile-awards-head p {
  margin-top: 6px;
  font-size: 12px;
}

.profile-view .profile-awards-head > strong {
  border-color: #d8e5f5;
  border-radius: 999px;
  color: #315781;
  background: #fff;
  font-family: inherit;
}

.profile-view .profile-awards-gallery {
  gap: 10px;
  margin: 0;
  background: transparent;
}

.profile-awards-more {
  grid-column: 1 / -1;
}

.profile-awards-more > summary {
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 2px;
  border: 1px solid #d8e5f5;
  border-radius: 13px;
  color: #2859b5;
  background: rgba(255, 255, 255, 0.83);
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  list-style: none;
}

.profile-awards-more > summary::-webkit-details-marker { display: none; }
.profile-awards-more > summary:focus-visible { outline: 3px solid #99baff; outline-offset: 2px; }
.profile-awards-more > summary span { color: #8295b5; }

.profile-awards-more-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.profile-view .award-card,
.profile-view .award-card:first-child {
  min-height: 166px;
  grid-column: auto;
  grid-template-columns: 20px 76px minmax(0, 1fr);
  grid-template-rows: 1fr auto;
  gap: 10px;
  padding: 18px;
  border: 1px solid #dce7f5;
  border-radius: 14px;
  background: #fff;
  box-shadow: none;
}

.profile-view .award-card.is-locked {
  background: #f8fafd;
}

.profile-view .award-card:first-child .award-card-copy > strong {
  font-size: 21px;
}

.profile-view .award-card:first-child .award-card-state {
  grid-column: 2 / 4;
}

.profile-view .award-card:first-child .award-card-action {
  grid-column: 3;
  grid-row: 2;
  align-self: auto;
  padding: 0;
  border: 0;
}

@media (max-width: 700px) {
  .profile-view .profile-card {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "hero" "snapshot" "details" "offer" "need" "portfolio" "interests";
  }

  .profile-view .profile-hero {
    gap: 18px;
    padding: 20px;
  }

  .profile-view .profile-portfolio { align-items: flex-start; flex-direction: column; gap: 8px; padding: 19px; }

  .profile-hero-top {
    align-items: flex-start;
  }

  .profile-eyebrow { max-width: 15ch; }

  .profile-view .profile-card .profile-photo {
    width: 80px;
    height: 80px;
    font-size: 20px;
  }

  .profile-identity { gap: 13px; align-items: flex-start; }

  .profile-view .profile-title h3 { font-size: 24px; }
  .profile-view .profile-title p { margin: 5px 0 10px; font-size: 13px; }
  .profile-identity-meta { gap: 5px; }
  .profile-identity-meta span { padding: 5px 7px; font-size: 10px; }

.profile-view .profile-hero-actions .primary-button { width: 100%; }
  .profile-hero-actions > span { display: none; }

  .profile-view .profile-snapshot { gap: 7px; }
  .profile-view .profile-snapshot > div { min-height: 80px; padding: 12px 9px; }
  .profile-view .profile-snapshot strong { font-size: 23px; }
  .profile-view .profile-snapshot span { font-size: 10px; }

  .profile-details-head { margin-top: 28px; }
  .profile-details-head h3 { font-size: 22px; }
  .profile-view .profile-story { min-height: 0; margin-top: 9px; padding: 19px; }
  .profile-view .profile-interests { margin-top: 9px; padding: 19px; }
  .profile-view .profile-awards-section { margin-top: 30px; }
  .profile-view .profile-awards-gallery { grid-template-columns: minmax(0, 1fr); }
  .profile-awards-more-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 370px) {
  .profile-view .profile-hero { padding: 18px 15px; }
  .profile-view .profile-card .profile-photo { width: 70px; height: 70px; }
  .profile-identity { gap: 10px; }
  .profile-active-pill { padding: 8px; font-size: 10px; }
}

.profile-view .profile-hero-actions{flex-wrap:wrap}.profile-preview-button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 17px;border:1px solid #aac6ea;border-radius:13px;background:#ffffffbb;color:#2459ad;font:inherit;font-size:13px;font-weight:800;cursor:pointer;box-shadow:inset 0 1px 0 #fff}.profile-preview-button svg{width:17px;height:17px}.profile-preview-button:hover{border-color:#5b91d9;background:#fff}.profile-preview-button:focus-visible{outline:2px solid #2459ad;outline-offset:3px}
.own-profile-preview-dialog{width:min(460px,calc(100vw - 24px));max-height:min(800px,calc(100dvh - 28px));padding:0;border:1px solid var(--line);border-radius:14px;background:var(--surface,#fff);color:var(--ink);box-shadow:0 22px 80px #101d3466;overflow:auto}.own-profile-preview-dialog::backdrop{background:#0f1d35a6;backdrop-filter:blur(6px)}.own-profile-preview-shell{padding:18px}.own-profile-preview-shell>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:7px}.own-profile-preview-shell>header h2{margin:2px 0 0;font-size:22px}.own-profile-preview-shell>header button{display:grid;place-items:center;flex:none;width:34px;height:34px;border:1px solid var(--line);border-radius:7px;background:var(--surface-2,#f5f7fb);color:var(--ink);cursor:pointer}.own-profile-preview-shell>header button svg{width:18px;height:18px}.own-profile-preview-note{margin:0 0 14px;color:var(--muted);font-size:12px;line-height:1.4}.profile-preview-loading{padding:24px 0;color:var(--muted);text-align:center}
.own-profile-preview-dialog .mobile-home-person{display:block;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:var(--surface,#fff);box-shadow:none}.own-profile-preview-dialog .mobile-home-swipe-surface{background:var(--surface,#fff)}.own-profile-preview-dialog .mobile-home-person-main{position:relative;display:flex;align-items:center;gap:13px;width:100%;min-height:124px;padding:18px;border:0;background:#e8f0f8;color:var(--ink);text-align:left;opacity:1}.own-profile-preview-dialog .mobile-home-avatar{display:grid;place-items:center;flex:0 0 78px;width:78px;height:84px;overflow:hidden;border-radius:8px;background:#c9ddec;color:#275983;font-size:23px;font-weight:800}.own-profile-preview-dialog .mobile-home-avatar img{width:100%;height:100%;object-fit:cover}.own-profile-preview-dialog .mobile-home-person-copy{display:grid;gap:5px;min-width:0}.own-profile-preview-dialog .mobile-home-person-copy strong{font-size:19px;line-height:1.15;color:var(--ink);overflow-wrap:anywhere}.own-profile-preview-dialog .mobile-home-person-copy small,.own-profile-preview-dialog .person-location{margin:0;color:var(--muted);font-size:11px;line-height:1.3}.own-profile-preview-dialog .mobile-home-arrow,.own-profile-preview-dialog .mobile-swipe-cue{display:none}.own-profile-preview-dialog .mobile-home-person.has-portrait .mobile-home-person-main{min-height:230px;align-items:end;isolation:isolate;background:#233547}.own-profile-preview-dialog .has-portrait .mobile-home-avatar{position:absolute;inset:0;z-index:-2;width:100%;height:100%;border-radius:0}.own-profile-preview-dialog .has-portrait .mobile-home-person-main::after{content:"";position:absolute;inset:36% 0 0;z-index:-1;background:linear-gradient(transparent,#102034dd)}.own-profile-preview-dialog .has-portrait .mobile-home-person-copy strong{color:#fff}.own-profile-preview-dialog .has-portrait .mobile-home-person-copy small,.own-profile-preview-dialog .has-portrait .person-location{color:#e8f1fb}.own-profile-preview-dialog .person-request{padding:5px 18px 9px}.own-profile-preview-dialog .person-request-row{padding:11px 0}.own-profile-preview-dialog .person-request-row p{font-size:14px;font-weight:450;line-height:1.42}.own-profile-preview-dialog .mobile-home-card-actions{display:grid;grid-template-columns:1fr 1.2fr;gap:8px;padding:12px 18px 18px;background:var(--surface,#fff)}.own-profile-preview-dialog .mobile-home-card-actions button{min-height:42px;display:flex;align-items:center;justify-content:center;gap:5px;border:0;border-radius:8px;background:#eef2f5;color:#6e7d88;font:inherit;font-size:12px;font-weight:700;opacity:1}.own-profile-preview-dialog .mobile-home-card-actions button+button{background:#3982c0;color:#fff}.own-profile-preview-dialog .mobile-home-card-actions svg{width:16px;height:16px}.own-profile-preview-dialog .mobile-shop-spotlight{padding:7px 18px}.own-profile-preview-dialog .is-self-preview{pointer-events:none}
:root[data-theme="dark"] .profile-preview-button{border-color:#5677a2;background:#263d5b;color:#dcecff}:root[data-theme="dark"] .own-profile-preview-dialog .mobile-home-person-main{background:#2d4257}:root[data-theme="dark"] .own-profile-preview-dialog .mobile-home-card-actions button:first-child{background:#334354;color:#e0e9f0}
@media(max-width:680px){.profile-view .profile-hero-actions .profile-preview-button{width:100%}.own-profile-preview-shell{padding:14px}.own-profile-preview-dialog{max-height:calc(100dvh - 16px)}}
