#memory-caption {
  left: 40px; bottom: max(44px, env(safe-area-inset-bottom));
  width: min(280px, 28vw); max-width: none; z-index: 4;
  opacity: 0; visibility: hidden; transform: translateY(12px);
  pointer-events: none; transition: none;
}
#memory-caption[data-state="open"][aria-hidden="false"] {
  opacity: 1; visibility: visible; transform: translateY(0);
  pointer-events: auto;
  transition: opacity .8s ease, transform 1.1s cubic-bezier(.16,1,.3,1);
}
#memory-author {
  position: relative; pointer-events: auto; cursor: pointer;
  touch-action: manipulation; -webkit-user-drag: none;
}
#memory-caption[aria-hidden="true"] #memory-author { pointer-events: none; }
#memory-timestamp { display: block; margin-bottom: 14px; color: var(--red60); font-size: var(--label-sm); }
#memory-title {
  margin: 0; max-width: 275px; color: var(--red100);
  font: italic 400 clamp(27px, 2.6vw, 37px)/1.01 var(--serif); letter-spacing: -.025em;
  text-wrap: balance; overflow-wrap: anywhere;
}
#memory-caption .person-link { margin-top: 26px; }

#profile-page { --sidebar: clamp(250px, 29vw, 390px); background: transparent; overflow: clip; }
.profile-sidebar {
  position: absolute; top: 132px; bottom: 36px; left: 40px;
  width: calc(var(--sidebar) - 75px); display: flex; flex-direction: column;
  pointer-events: auto; z-index: 2;
}
.profile-lately { margin-top: clamp(58px, 12vh, 136px); }
.profile-lately > .eyebrow { color: var(--red60); margin: 0 0 17px; font: 400 var(--label-sm)/1.5 var(--mono); letter-spacing: .12em; }
#profile-summary { font: 400 clamp(27px, 2.7vw, 38px)/.99 var(--serif); letter-spacing: -.035em; color: var(--red60); text-wrap: pretty; }
#profile-summary i { color: var(--red100); }
#profile-count { margin-top: 23px; font: 400 9px/1.7 var(--mono); letter-spacing: .09em; color: var(--red60); }
.profile-view-controls { margin-top: auto; padding-top: 32px; }
.profile-layout-picker { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; margin: 0; }
.profile-layout-picker .icon-button {
  display: inline-flex; align-items: center; justify-content: center;
  width: max-content; height: 48px; min-height: 48px; min-width: 48px; padding: 0 24px 4px;
  border: 1px solid var(--red20); border-radius: 999px;
  background: transparent; color: var(--red100);
  font: italic 400 var(--button-text-size)/1.2 var(--serif); letter-spacing: var(--button-text-spacing); text-transform: none;
  transition: background .3s, border-color .3s, color .3s, transform .3s;
}
.profile-layout-picker .icon-button:hover { background: rgb(230 30 34 / 13%); }
.profile-layout-picker .icon-button:active { transform: scale(.96); }
.profile-layout-picker .icon-button[aria-pressed="true"] { background: var(--red100); border-color: var(--red100); color: var(--black); }
.profile-layout-picker .icon-button:focus-visible { background: rgb(230 30 34 / 25%); border-color: var(--red100); }
.profile-layout-picker .icon-button[aria-pressed="true"]:focus-visible { background: var(--red60); color: var(--black); }
@media (prefers-reduced-motion: reduce) {
  .profile-layout-picker .icon-button { transition: none; }
  .profile-layout-picker .icon-button:active { transform: none; }
}
.profile-explorer {
  position: absolute; left: var(--sidebar); right: 30px; top: 105px; bottom: 58px;
  overflow: clip; touch-action: none; pointer-events: auto; user-select: none; cursor: grab;
}
.profile-explorer.is-dragging, .profile-explorer.is-dragging a { cursor: grabbing; }
.profile-items { position: absolute; inset: 0; pointer-events: none; }
.profile-item {
  position: absolute; display: block; border-radius: 50%; margin: 0; padding: 0;
  color: var(--red100); touch-action: none; user-select: none; background: none;
  will-change: transform; -webkit-user-drag: none;
}
.profile-item:focus-visible { background: transparent; }
.profile-orb-fallback {
  display: block; position: absolute; width: var(--orb-size); height: var(--orb-size);
  left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 50%; overflow: hidden;
  background: radial-gradient(circle at 35% 24%, #283230, #070a09 66%, var(--orb-tint, #25403a));
}
.profile-orb-fallback::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(circle at 65% 21%, #a0cfc359, transparent 12%), radial-gradient(circle at 42% 34%, transparent 57%, #a0cfc320 79%, #a0cfc359 99%); }
.profile-orb-fallback img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); }
.profile-orb-fallback img[hidden] { display: none; }
/* Enhanced orbs own the only entrance. The DOM preview is failure-only. */
.profile-orb-fallback { visibility: hidden; }
body[data-orb-renderer="failed"] .profile-item[data-preview-state="ready"] .profile-orb-fallback { visibility: visible; animation:profile-preview-in .65s ease both; }
@keyframes profile-preview-in {
  from { opacity:0; transform:translate(-50%,-50%) scale(.18); }
  to { opacity:1; transform:translate(-50%,-50%) scale(1); }
}
@media (prefers-reduced-motion:reduce) {
  body[data-orb-renderer="failed"] .profile-item .profile-orb-fallback { animation:none; }
}
body[data-orb-renderer="failed"] #world { display: none; }
.profile-item[data-preview-state="missing"] .profile-item-copy,
.profile-item[data-preview-state="failed"] .profile-item-copy { opacity: 1; }
body[data-orb-renderer="failed"] .profile-item-copy { opacity: 1; }
.profile-item-copy {
  position: absolute; left: 50%; top: calc(100% + 13px); transform: translate(-50%, 5px);
  width: 200px; text-align: center; pointer-events: none; opacity: 0;
  transition: opacity .25s, transform .4s;
}
.profile-item-title { display: block; font: italic 400 16px/1.06 var(--serif); color: var(--red100); text-wrap: balance; }
.profile-item-meta { display: block; margin-top: 9px; font: 400 8px/1.7 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--red60); }
.profile-item:not(.is-list) .profile-item-meta { display: none; }
.profile-item:hover .profile-item-copy, .profile-item:focus-visible .profile-item-copy { opacity: 1; transform: translate(-50%, 0); }
.profile-explorer.is-dragging .profile-item:not(.is-list) .profile-item-copy { opacity: 0; }
.profile-item.is-list { border-radius: 9px; }
.profile-item.is-list .profile-orb-fallback { left: 40px; }
.profile-item.is-list .profile-item-copy { top: 50%; left: 95px; width: calc(100% - 115px); text-align: left; opacity: 1; transform: translateY(-50%); }
.profile-item.is-list .profile-item-title { max-width: 590px; font-size: clamp(19px, 1.7vw, 25px); line-height: 1.08; text-wrap: pretty; }
.profile-item.is-list .profile-item-meta { margin-top: 0; margin-bottom: 7px; }
.profile-item.is-list:focus-visible { background: rgb(230 30 34 / 7%); }
.profile-item.is-list:hover .profile-item-title { color: var(--red100); }
.profile-empty { position: absolute; left: 50%; top: 48%; transform: translate(-50%, -50%); width: 85%; text-align: center; color: var(--red60); font: 400 29px/1.2 var(--serif); }
.profile-empty i { display: block; margin-top: 10px; }
.profile-explore-hint { position: absolute; left: var(--sidebar); right: 165px; bottom: 30px; text-align: center; color: var(--red60); font-size: 8px; pointer-events: none; }
body.menu-open :is(.profile-sidebar, .memory-caption, .profile-explore-hint) { opacity: .05 !important; }

@media (min-width: 751px) and (max-height: 650px) {
  .profile-sidebar { top: 112px; bottom: 25px; }
  .profile-lately { margin-top: 42px; }
  #profile-summary { font-size: 29px; }
  .profile-view-controls { padding-top: 20px; }
  #profile-count { margin-top: 15px; }
}
@media (max-width: 750px) {
  #memory-caption { left: 23px; bottom: max(78px, calc(env(safe-area-inset-bottom) + 58px)); width: min(270px, 72vw); }
  #memory-caption[data-state="closed"], #memory-caption[data-state="opening"] { top: 96px; bottom: auto; width: min(260px, 75vw); }
  #memory-title { font-size: 28px; }
  #memory-caption[data-state="closed"] #memory-title { font-size: 23px; }
  #memory-timestamp { font-size: 8px; margin-bottom: 9px; }
  #memory-caption .person-link { margin-top: 17px; }
  #memory-caption[data-state="closed"] .person-link { margin-top: 11px; }
  #profile-page { --sidebar: 0px; }
  .profile-sidebar { top: 97px; left: 24px; right: 24px; bottom: auto; width: auto; display: grid; grid-template-columns: 1fr; gap: 24px; pointer-events: none; }
  .profile-person { gap: 12px; }
  .profile-lately { margin: 0; max-width: 310px; }
  .profile-lately > .eyebrow { margin-bottom: 10px; font-size: 8px; }
  #profile-summary { font-size: 27px; max-width: 320px; }
  #profile-count { display: none; }
  .profile-explorer { left: 8px; right: 8px; top: 300px; bottom: 104px; }
  .profile-view-controls { position: fixed; left: 24px; bottom: max(21px, env(safe-area-inset-bottom)); padding: 0; pointer-events: auto; }
  .profile-layout-picker { gap: 7px; }
  .profile-layout-picker .icon-button { height: 48px; min-height: 48px; padding-inline: 15px; }
  .profile-explore-hint { left: 20px; right: 20px; bottom: 86px; font-size: 7px; }
  .profile-item.is-list .profile-item-copy { left: 91px; width: calc(100% - 98px); }
  .profile-item.is-list .profile-item-title { font-size: 20px; }
  .profile-item-meta { font-size: 7px; }
  .profile-item:not(.is-list) .profile-item-copy { width: 155px; }
}
@media (max-width: 750px) and (max-height: 720px) {
  .profile-sidebar { top: 91px; gap: 18px; }
  .profile-lately { margin-left: 1px; }
  #profile-summary { font-size: 23px; max-width: 290px; }
  .profile-lately > .eyebrow { margin-bottom: 7px; }
  .profile-explorer { top: 258px; bottom: 99px; }
  #memory-caption[data-state="closed"] .person-orb { width: 38px; height: 38px; }
  #memory-caption[data-state="closed"] #memory-title { font-size: 21px; }
  #memory-caption[data-state="closed"] .person-location { font-size: 7px; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .profile-sidebar { top: 90px; left: 24px; width: 210px; bottom: 18px; display: flex; gap: 0; }
  .profile-lately { margin-top: 23px; }
  #profile-summary { font-size: 23px; }
  #profile-count { display: none; }
  .profile-view-controls { position: static; margin-top: auto; padding-top: 14px; }
  .profile-view-controls > .eyebrow:first-child { display: none; }
  .profile-explorer { left: 255px; top: 90px; bottom: 64px; }
  .profile-explore-hint { display: none; }
  #memory-caption { bottom: 28px; width: 210px; }
  #memory-title { font-size: 25px; }
  #memory-caption .person-link { margin-top: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  #memory-caption,
  #memory-caption[data-state="open"][aria-hidden="false"],
  .person-orb, .profile-item-copy { transition: none; }
}
/* Long backend summaries stay within the identity column. */
#profile-summary { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 7; overflow: hidden; }
@media (max-width: 750px) { #profile-summary { -webkit-line-clamp: 3; } }
@media (max-width: 750px) and (max-height: 570px) and (orientation: portrait) {
  .profile-sidebar { display: block; }
  .profile-lately { display: none; }
  .profile-explorer { top: 159px; bottom: 96px; }
  #memory-caption[data-state="closed"] { top: 83px; }
  #memory-caption[data-state="closed"] .person-link { margin-top: 6px; }
}