/* Full activity reading reuses the feed's identity and the article reading type. */
html:has(.activity-detail-page), body:has(.activity-detail-page) { scrollbar-width: none; }
html:has(.activity-detail-page)::-webkit-scrollbar, body:has(.activity-detail-page)::-webkit-scrollbar { display: none; }
.activity-detail-page { --activity-media-glass-bg: rgb(10 12 15 / .88); --activity-media-glass-blur: 18px; --activity-media-glass-solid: #0a0c0f; --activity-media-toolbar-ink: rgb(255 255 255 / .75); --activity-media-toolbar-bg: #171716; }
.page-main.activity-detail-page { --page: var(--max); --measure: var(--max); --activity-media-width: 300px; --activity-media-height: min(380px,52svh); width: min(calc(100% - 48px),var(--page)); padding-top: 28px; padding-bottom: 64px; }
.activity-detail-page .activity-detail-navigation { display: flex; flex-shrink: 0; margin: 0; }
.activity-detail-navigation a { color: var(--muted); font: 10px/1.3 var(--sans); }
@media (hover:hover) { .activity-detail-navigation a:hover { color: var(--ink); background: var(--paper-2); } }
.activity-detail-page .activity-detail { position: relative; display: block; width: 100%; margin: 0; padding: 0; }
.activity-detail .activity-post__body { padding: 0; }
.activity-detail .activity-detail-header { display: grid; grid-template-columns: 40px minmax(0,1fr); align-items: center; gap: 12px; min-height: 40px; margin: 0 0 28px -8px; padding: 0; }
.activity-detail-header > .activity-avatar { position: relative; width: 40px; height: 40px; overflow: hidden; border: 1px solid var(--line); border-radius: 50%; object-fit: cover; background: var(--paper-2); }
.activity-detail-identity { display: grid; gap: 1px; min-width: 0; }
.activity-detail-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; }
.activity-detail .activity-author { font-size: 13px; }
.activity-detail .activity-post-date { font-size: 11px; }
.activity-detail-copy { margin: 0; color: var(--text); font-size: calc(var(--type-body-reading) - 1px); line-height: calc(var(--leading-reading) - .1); }
.activity-detail-copy > p { margin: 0 0 .5em; text-align: start; text-indent: 0; }
.activity-detail-copy :is(p,h2,blockquote,li) { white-space: pre-wrap; tab-size: 2em; }
.activity-detail-copy > :last-child { margin-bottom: 0; }
.activity-detail .activity-images { width: 100%; margin: 0 auto; border-radius: 10px; }
.activity-detail .activity-video { width: 100%; margin: 0; border-radius: 10px; }
.activity-detail .activity-detail-bottom-actions { display: flex; margin-top: 24px; }
.activity-detail .activity-action-buttons { width: 100%; gap: 14px; }
.activity-detail .activity-actions button { padding-inline: 0; }
.activity-detail-main, .activity-detail-media { min-width: 0; }
.activity-detail-media { width: min(100%,var(--activity-media-width)); }
.activity-detail-media--single { width: min(100%,var(--activity-media-width),calc(var(--activity-media-height) * var(--media-ratio))); }
.activity-gallery-count, .activity-gallery-dots, .activity-comment-prompt { display: none; }
.activity-detail-comments { margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--line); }
.activity-detail-comments.activity-chat .activity-comment p { font-size: 16px; }
.activity-detail-comments > h2 { margin: 0 0 12px; font: 500 15px/1.7 var(--sans); }
.activity-detail-comments > [data-detail-comment-status] { margin: 16px 0; font: 13px/1.7 var(--sans); }
.activity-detail-comments > [data-detail-comment-retry] { padding: 8px 0; border: 0; background: transparent; color: var(--link-blue); font: 13px/1.5 var(--sans); }
.activity-detail-comments .activity-comment-thread + .activity-comment-thread { margin-top: 12px; }
@media (max-width:760px) {
  .page-main.activity-detail-page { --detail-mobile-gutter: 24px; --activity-media-width: 100%; --activity-media-height: min(580px,68svh); padding-top: 4px; padding-bottom: calc(80px + env(safe-area-inset-bottom,0px)); }
  .activity-detail .activity-post__body { display: flex; flex-direction: column; }
  .activity-detail .activity-detail-header { grid-template-columns: 32px minmax(0,1fr); gap: 10px; min-height: 32px; width: calc(100% + 2 * var(--detail-mobile-gutter)); margin: 0 calc(-1 * var(--detail-mobile-gutter)); padding: 4px 12px; background: var(--paper-2); }
  .activity-detail-header > .activity-avatar { width: 32px; min-width: 32px; max-width: 32px; height: 32px; }
  .activity-detail .activity-author { font-size: 12px; }
  .activity-detail .activity-post-date { font-size: 10px; }
  .activity-detail .activity-detail-main { display: contents; }
  .activity-detail .activity-detail-bottom-actions { position: fixed; z-index: 10; inset: auto 0 0; margin: 0; padding: 6px var(--detail-mobile-gutter) calc(6px + env(safe-area-inset-bottom,0px)); transform: translateY(calc(-1 * var(--detail-keyboard-lift,0px))); border-top: 1px solid var(--line); background: var(--paper); }
  .activity-detail .activity-action-buttons { gap: 12px; }
  .activity-detail .activity-actions [data-activity-comment] { order: -1; flex: 1; justify-content: flex-start; gap: 6px; min-height: 34px; padding: 5px 12px; border-radius: 24px; background: var(--paper-2); }
  .activity-detail .activity-comment-prompt { display: inline; font-size: 13px; }
  .activity-detail [data-activity-comment] .activity-action-label { display: none; }
  .activity-detail--media .activity-detail-media { position: relative; order: -2; width: calc(100% + 2 * var(--detail-mobile-gutter)); max-width: none; margin: 0 calc(-1 * var(--detail-mobile-gutter)) 24px; background: var(--activity-media-glass-bg); -webkit-backdrop-filter: blur(var(--activity-media-glass-blur)); backdrop-filter: blur(var(--activity-media-glass-blur)); }
  .activity-detail .activity-images { border-radius: 0; background: transparent; }
  .activity-detail .activity-image { background: transparent; }
  .activity-detail .activity-images--1, .activity-detail .activity-video-stage { max-height: min(580px,68svh); }
  .activity-detail .activity-video { border-radius: 0; background: transparent; }
  .activity-detail .activity-video-stage { background: transparent; }
  .activity-detail .activity-video-toolbar { color: var(--activity-media-toolbar-ink); background: var(--activity-media-toolbar-bg); }
  .activity-detail .activity-video-preview { background: transparent; }
  .activity-detail .activity-video-toolbar :is(button,span) { color: inherit; }
  .activity-detail .activity-video-stage > video { object-fit: contain; }
  .activity-detail-media--gallery .activity-images { display: flex; gap: 0; aspect-ratio: var(--media-ratio); max-height: min(580px,68svh); overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none; }
  .activity-detail-media--gallery .activity-images::-webkit-scrollbar { display: none; }
  .activity-detail-media--gallery .activity-image { flex: 0 0 100%; height: 100%; scroll-snap-align: start; scroll-snap-stop: always; }
  .activity-detail-media--gallery .activity-image > .image-load-frame > img.image-load-full { object-fit: contain; }
  .activity-detail .activity-gallery-count { position: absolute; z-index: 1; top: 12px; right: 12px; display: block; padding: 3px 9px; border-radius: 20px; background: rgb(0 0 0 / .48); color: #fff; font: 12px/1.6 var(--sans); font-variant-numeric: tabular-nums; pointer-events: none; }
  .activity-detail .activity-gallery-dots { position: absolute; z-index: 1; top: var(--activity-gallery-dots-top,calc(100% - 24px)); left: 0; right: 0; display: flex; align-items: center; justify-content: center; gap: 6px; height: 16px; min-height: 0; margin: 0; filter: drop-shadow(0 1px 2px rgb(0 0 0 / .6)); pointer-events: none; }
  .activity-gallery-dots > span { width: 5px; height: 5px; border-radius: 50%; background: #fff; opacity: .35; }
  .activity-gallery-dots > .is-active { background: #fff; opacity: 1; }
  .activity-detail--media .activity-detail-main { width: 100%; }
}
@media (max-width:600px) {
  .page-main.activity-detail-page { --detail-mobile-gutter: 20px; width: calc(100% - 40px); }

}


/* Reuse the sheet composer directly in the detail action bar. */
.activity-detail .activity-detail-composer { order: -1; flex: 1 1 auto; min-width: 0; }
.activity-detail-composer .activity-chat-dock { position: static; padding: 0; transform: none; }
.activity-detail-composer .guestbook-entry-bar { width: 100%; gap: 6px; }
.activity-detail-composer .guestbook-launcher { min-height: 32px; padding: 4px 8px 4px 12px; border-radius: 20px; box-shadow: none; background: var(--paper-2); }
.activity-detail-composer .activity-comment-replying { font-size: 11px; }
.activity-detail .activity-detail-composer .guestbook-add { display: none; }
.activity-detail .activity-detail-composer:focus-within .guestbook-add { display: grid; min-width: 28px; flex-basis: 28px; width: 28px; height: 32px; min-height: 32px; padding: 0; }
.activity-detail-composer:not(:focus-within) .guestbook-inline-send:disabled { display: none; }
.activity-detail .activity-detail-composer .guestbook-launcher textarea::placeholder { font-size: 12px; }
.activity-detail .activity-actions :is(.activity-detail-navigation a,[data-activity-like]) { display: flex; flex-direction: column; align-items: center; justify-content: center; flex-shrink: 0; gap: 3px; width: 40px; min-width: 40px; min-height: 38px; padding: 0; border-radius: 8px; }
.activity-detail .activity-actions :is(.activity-detail-navigation a,[data-activity-like]) > svg { width: 20px; height: 20px; }
.activity-action-caption { display: flex; align-items: center; gap: 3px; font: 10px/1.3 var(--sans); }
.activity-detail .activity-actions .activity-action-caption [data-like-count] { font-size: inherit; }
.activity-comments-sheet.activity-chat.activity-detail-compose-sheet { border: 0; background: transparent; box-shadow: none; }
.activity-detail-compose-sheet > .activity-sheet-head, .activity-detail-compose-sheet .activity-comments-column, .activity-detail-compose-sheet .guestbook-soft-edge { display: none; }
.activity-detail-compose-sheet .activity-chat-details { z-index: 1; }

@media (max-width:760px) {
  body:has(.activity-detail-page:not(.activity-detail-page--readonly)) > .reading-dock { bottom: calc(var(--detail-actions-height,calc(52px + env(safe-area-inset-bottom,0px))) + var(--detail-actions-lift,0px) + 12px); }
}

@media (max-width:760px) and (prefers-reduced-transparency:reduce) {
  .activity-detail .activity-detail-media { background: var(--activity-media-glass-solid); -webkit-backdrop-filter: none; backdrop-filter: none; }
}

@media (max-width:760px) {
  :root[data-theme="white"] .activity-detail-page { --activity-media-glass-bg: rgb(255 255 255 / .92); --activity-media-glass-solid: #fff; --activity-media-toolbar-ink: var(--muted); --activity-media-toolbar-bg: transparent; }
  .page-main.activity-detail-page--readonly { padding-bottom: calc(64px + env(safe-area-inset-bottom,0px)); }
  .activity-detail-page--readonly .activity-detail-bottom-actions { display: contents; }
  .activity-detail-page--readonly .activity-detail-bottom-actions > .activity-action-buttons { display: contents; }
  .activity-detail-navigation--floating { position: fixed; left: max(16px,env(safe-area-inset-left,0px)); bottom: calc(20px + env(safe-area-inset-bottom,0px)); z-index: 180; }
  .activity-detail-navigation--floating a { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border-radius: 50%; color: var(--reading-control-ink); touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
  .activity-detail-navigation--floating svg { width: 18px; height: 18px; stroke-width: 1.8; }
  .activity-detail-navigation--floating a > span { display: none; }
}
@media (max-width:760px) and (prefers-color-scheme:light) {
  :root:not([data-theme]) .activity-detail-page { --activity-media-glass-bg: rgb(255 255 255 / .92); --activity-media-glass-solid: #fff; --activity-media-toolbar-ink: var(--muted); --activity-media-toolbar-bg: transparent; }
}