body[data-current="activity"] > .site-header { position: sticky; top: 0; }
.activity-page { padding-top: 52px; padding-bottom: 64px; }
.activity-panel { width: min(100%,var(--measure)); margin: 0 auto; }
.activity-title { margin: 0 0 24px; color: var(--ink); font-size: var(--type-section); font-weight: 500; }
.activity-feed { display: grid; gap: 28px; }
.activity-post { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 14px; }
.activity-avatar.image-load-frame { width: 40px; height: 40px; overflow: hidden; border-radius: 50%; }
.activity-avatar > .image-load-preview { height: 100%; }
.activity-avatar.image-load-frame > img.image-load-full { object-fit: cover; }
.activity-post__body { position: relative; min-width: 0; padding-bottom: 26px; border-bottom: 1px solid var(--line); }
.activity-post:last-child .activity-post__body { border-bottom: 0; }
.activity-post__head { min-height: 26px; display: flex; align-items: center; }
.activity-author { color: var(--ink); font: 500 14px/1.7 var(--sans); }
.activity-copy { margin: 6px 0 14px; white-space: pre-line; font-size: var(--type-body-reading); line-height: var(--leading-reading); }
.activity-images { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; width: min(100%,360px); }
.activity-image { display: block; min-width: 0; width: 100%; aspect-ratio: 1; padding: 0; border: 0; border-radius: 4px; background: var(--paper-2); overflow: hidden; cursor: zoom-in; }
.activity-image > .image-load-frame { display: block; width: 100%; height: 100%; }
.activity-image > .image-load-frame > img.image-load-full { width: 100%; height: 100%; object-fit: cover; }
.activity-image .image-load-preview { width: 100%; height: 100%; }
.activity-images--1 { grid-template-columns: 1fr; width: min(100%,220px); }
.activity-images--1 img { object-position: 50% 35%; }
.activity-images--2,.activity-images--4 { grid-template-columns: repeat(2,minmax(0,1fr)); width: min(100%,300px); }
.activity-post__foot { margin-top: 12px; color: var(--muted); font: 11px/1.7 var(--sans); font-variant-numeric: tabular-nums; }
.activity-lightbox { width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; color: #f5f4ef; background: rgb(0 0 0 / .96); }
.activity-lightbox::backdrop { background: #000; }
.activity-lightbox[open] { display: flex; align-items: center; justify-content: center; }
.activity-lightbox figure { display: flex; flex-direction: column; width: min(100% - 120px,1200px); height: 100%; margin: 0; padding: 58px 0 26px; }
.activity-lightbox [data-activity-full-image] { flex: 1; min-height: 0; }
.activity-lightbox img { width: 100%; height: 100%; object-fit: contain; }
.activity-lightbox figcaption { padding-top: 16px; color: #c3c3bf; text-align: center; font: 12px/1.7 var(--sans); }
.activity-lightbox button { width: 48px; height: 48px; flex-shrink: 0; border: 0; color: #f5f4ef; background: transparent; font: 24px/1 var(--sans); }
.activity-lightbox-close { position: absolute; top: 12px; right: 16px; }
.activity-image:hover { opacity: .9; }
.activity-page :is(button,a):focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.activity-lightbox button:focus-visible { outline-color: #fff; outline-offset: -4px; }
@media (max-width:600px) {
  .activity-post { gap: 12px; }
  .activity-lightbox figure { width: calc(100% - 88px); padding-top: 64px; }
  .activity-lightbox button { width: 44px; height: 44px; }
}

.activity-post { grid-template-columns: 40px minmax(0,1fr) 48px; column-gap: 14px; scroll-margin-top: 32px; }
.activity-post__head { height: 40px; min-height: 40px; }
.activity-author { font-size: 15px; font-weight: 600; }
.activity-copy { margin-top: 10px; }
.activity-actions { display: flex; flex-direction: column; position: absolute; top: 50%; right: -62px; transform: translateY(-50%); margin: 0; padding: 5px 1px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); }
.activity-actions button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 52px; width: 44px; padding: 7px 0; border: 0; border-radius: 24px; background: transparent; color: var(--muted); font: 10px/1.2 var(--sans); }
.activity-actions svg { width: 18px; height: 18px; }
.activity-actions button:hover { color: var(--ink); background: var(--paper-2); }
.activity-actions button[aria-pressed="true"] { color: #c85b50; }
.activity-actions button[aria-pressed="true"] svg { fill: currentColor; }
.activity-post__foot { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.activity-post__foot input { width: min(100%,240px); background: var(--paper); border: 1px solid var(--line); font: 11px/1.7 var(--sans); }
.activity-comments-sheet { width: min(calc(100% - 48px),820px); max-height: min(80dvh,720px); margin: auto; padding: 24px; border: 1px solid var(--line); border-radius: 18px; color: var(--text); background: var(--paper); box-shadow: 0 24px 100px rgb(0 0 0 / .2); }
.activity-comments-sheet::backdrop { background: rgb(0 0 0 / .35); backdrop-filter: blur(4px); }
.activity-comments-sheet[open] { display: flex; flex-direction: column; }
.activity-sheet-head { display: flex; justify-content: flex-end; align-items: flex-start; gap: 16px; flex-shrink: 0; }
.activity-sheet-head button { font-size: 25px; margin: -8px -8px 0 0; }
.activity-comments-list { flex: 1; overflow-y: auto; min-height: 0; overscroll-behavior: contain; padding-right: 10px; scrollbar-width: thin; }
.activity-comment { padding: 18px 0; border-bottom: 1px solid var(--line); }
.activity-comment header { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; font: 13px/1.7 var(--sans); }
.activity-comment strong { color: var(--ink); font-weight: 500; }
.activity-comment time { color: var(--muted); font-size: 10px; }
.activity-comment p { margin: 7px 0 0; font-size: 14px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.activity-comments-empty { margin: 0; padding: 36px 0; text-align: center; color: var(--muted); font-size: 14px; }
.activity-comment-form { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; min-width: 0; }
.activity-comment-form :is(input,textarea) { width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--paper-2); color: var(--text); font: 14px/1.7 var(--serif); }
.activity-comment-form textarea { resize: none; min-height: 120px; flex: 1; }
.activity-comment-form > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.activity-comment-form [role="status"] { color: var(--muted); font: 11px/1.6 var(--sans); }
.activity-comment-form button { min-height: 44px; padding: 10px 20px; border: 0; border-radius: 999px; background: var(--selected-bg); color: var(--selected-fg); font: 13px/1.6 var(--sans); }
.activity-comments-sheet :is(button,input,textarea):focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
@media (max-width:600px) {
  .activity-post { grid-template-columns: 36px minmax(0,1fr) 44px; column-gap: 10px; }
  .activity-avatar.image-load-frame { width: 36px; height: 36px; }
  .activity-post__head { height: 36px; min-height: 36px; }
  .activity-actions { padding-inline: 0; }
  .activity-actions button { width: 42px; }
  .activity-comments-sheet { padding: 20px; }
}

.activity-sheet-head { margin-bottom: 14px; }
.activity-sheet-columns { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: 28px; height: min(52dvh,380px); min-height: 0; }
.activity-comments-column { display: flex; flex-direction: column; min-height: 0; min-width: 0; padding-right: 24px; border-right: 1px solid var(--line); }
.activity-comments-list:empty { display: none; }
.activity-comment:first-child { padding-top: 0; }
.activity-comment:last-child { border-bottom: 0; }
.activity-comments-empty { display: grid; place-items: center; flex: 1; padding: 24px 8px; line-height: 1.8; }
.activity-comment-form > div { flex-wrap: wrap; margin-top: auto; }
.activity-comment-form button { margin-left: auto; flex-shrink: 0; }
.activity-comment-form button svg { display: none; }
@media (max-width:600px) {
  .activity-post { grid-template-columns: 36px minmax(0,1fr); }
  .activity-actions { position: static; transform: none; flex-direction: row; width: fit-content; margin: 10px auto 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
  .activity-actions button { flex-direction: row; gap: 6px; width: 58px; min-height: 44px; padding: 8px; }
  .activity-post__foot { margin-top: 10px; }
  .activity-comments-sheet { position: fixed; inset: auto 0 0; width: 100%; max-width: none; height: min(78dvh,640px); max-height: 90dvh; margin: 0; padding: 16px 20px max(16px,env(safe-area-inset-bottom)); border-radius: 20px 20px 0 0; overflow: hidden; }
  .activity-comments-sheet[open] { animation: activity-sheet-rise 200ms ease-out; }
  .activity-sheet-head { margin-bottom: 10px; }
  .activity-sheet-columns { display: flex; flex: 1; flex-direction: column; height: auto; gap: 14px; min-height: 0; }
  .activity-comments-column { flex: 1; height: auto; padding: 0 0 12px; border-right: 0; border-bottom: 1px solid var(--line); }
  .activity-comment-form { display: grid; grid-template-columns: 80px minmax(0,1fr); gap: 12px; flex-shrink: 0; }
  .activity-comment-form input { grid-column: 1; grid-row: 1; align-self: start; margin-top: 2px; padding: 8px 0; border: 0; border-bottom: 1px solid var(--line-strong); border-radius: 0; background: transparent; }
  .activity-comment-form textarea { grid-column: 2; grid-row: 1; min-height: 88px; height: 88px; padding: 8px 12px 40px; }
  .activity-comment-form > div { grid-column: 2; grid-row: 1; position: relative; pointer-events: none; margin: 0; }
  .activity-comment-form button { position: absolute; bottom: 2px; right: 2px; display: grid; place-items: center; width: 40px; min-height: 40px; padding: 8px; border-radius: 6px; background: transparent; color: var(--ink); pointer-events: auto; }
  .activity-comment-form button span { display: none; }
  .activity-comment-form button svg { display: block; width: 20px; height: 20px; }
  .activity-comment-form [role="status"] { position: absolute; top: calc(100% + 4px); left: 0; }
  .activity-comment-form:has([role="status"]:not(:empty)) { margin-bottom: 22px; }
  .activity-actions button { border-radius: 0; }
  .activity-actions button:hover { background: transparent; }
  .activity-comment-form [role="status"]:empty { display: none; }
}
@keyframes activity-sheet-rise { from { transform: translateY(100%); } to { transform: translateY(0); } }
@media (prefers-reduced-motion:reduce) { .activity-comments-sheet[open] { animation: none; } }

.activity-post__head { flex-direction: column; align-items: flex-start; justify-content: center; gap: 1px; }
.activity-author { font-size: 13px; }
.activity-post-date { color: var(--muted); font: 10px/1.6 var(--sans); font-variant-numeric: tabular-nums; }
.activity-post__foot:has([role="status"]:empty) { display: none; }
.activity-comment-identity { display: grid; gap: 10px; min-width: 0; margin: 0; padding: 0; border: 0; }
@media (max-width:600px) {
  .activity-actions { justify-content: space-between; width: 100%; margin: 10px 0 0; }
  .activity-actions button { width: auto; min-width: 44px; }
  .activity-actions button:first-child { justify-content: flex-start; padding-left: 0; }
  .activity-actions button:last-child { justify-content: flex-end; padding-right: 0; }
  .activity-comment-identity { grid-column: 1; grid-row: 1; align-self: start; gap: 4px; }
  .activity-comment-form input { margin: 0; grid-column: auto; grid-row: auto; font-size: 12px; }
  .activity-comment-form textarea { height: 96px; min-height: 96px; }
}

.activity-copy-opening,.activity-copy-paragraph { display: block; }
.activity-copy-paragraph { margin-top: .5em; }
.activity-action-label { display: none; }
@media (max-width:600px) {
  .activity-post { position: relative; display: block; }
  .activity-post > .activity-avatar { position: absolute; top: 0; left: 0; }
  .activity-post__head { margin-left: 48px; }
  .activity-copy { margin: 16px 0; white-space: normal; overflow-wrap: anywhere; letter-spacing: 0; }

  .activity-images { max-width: 100%; }
  .activity-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; width: 100%; margin-top: 8px; }
  .activity-actions button,
  .activity-actions button:first-child,
  .activity-actions button:last-child { justify-content: center; width: 100%; min-height: 44px; padding: 10px 4px; gap: 5px; font-size: 12px; line-height: 1.4; }
  .activity-action-label { display: inline; }
  .activity-actions svg { flex-shrink: 0; width: 17px; height: 17px; }
  .activity-actions [data-like-count],.activity-actions [data-comment-count] { font-size: 11px; font-variant-numeric: tabular-nums; }
  .activity-post__body { padding-bottom: 18px; }
}


.activity-lightbox video { display: block; width: 100%; height: 100%; object-fit: contain; background: #000; }
.activity-lightbox:has(video) figure { width: min(calc(100% - 48px),1200px); }
@media (max-width:600px) {
  .activity-video { width: min(100%,300px); }
  .activity-lightbox:has(video) figure { width: 100%; padding: 60px 12px 24px; }
}


.activity-pagination { display:flex;justify-content:space-between;margin-top:24px;color:var(--muted);font:13px/1.7 var(--sans); }
.activity-comment-form > .activity-verification { display:block;grid-column:1 / -1;grid-row:2;position:static;pointer-events:auto; }
@media(max-width:600px){.activity-comment-form:has(.activity-verification:not([hidden])) {padding-bottom:0;}.activity-verification {overflow:auto;}}
