/* Shared interaction timing across MIDNIGHT. No layout transitions. */
:root{--motion-fast:160ms;--motion-normal:240ms;--motion-ease:cubic-bezier(.2,.7,.2,1)}
button,[role="button"],a,summary{transition:background-color var(--motion-fast) ease,color var(--motion-fast) ease,border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease,opacity var(--motion-fast) ease}
input,textarea,select{transition:border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease,background-color var(--motion-fast) ease}
:where(input,textarea,select):focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#aab0bb) 14%,transparent)}
:where(button,[role="button"],a,summary):focus-visible{outline:2px solid var(--accent,#aab0bb);outline-offset:3px}
button:disabled,[aria-disabled="true"]{transition:opacity var(--motion-fast) ease}
:where(.post-card,.profile-post-card,.whisper-card,.room-card,.search-person,.connection-person,.notification-item){transition:border-color var(--motion-normal) ease,background-color var(--motion-normal) ease,box-shadow var(--motion-normal) ease}
.notification-unread-dot{transition:opacity var(--motion-normal) ease,background-color var(--motion-normal) ease}
:where(.modal-backdrop,.settings-backdrop,dialog)::backdrop{background:#0009}
:where(.post-media-open,.whisper-image-open,.profile-media-open){overflow:hidden}
:where(.post-media-open,.whisper-image-open,.profile-media-open)>img{transition:scale 300ms var(--motion-ease)}
:where(.nav-item,.room-category,.filter-button,.profile-titles-toggle,.profile-medals-toggle,.cycle-badges-toggle){transition:background-color 200ms ease,border-color 200ms ease,color 200ms ease,box-shadow 200ms ease}
@media(hover:hover) and (pointer:fine){
 :where(.room-card,.search-person,.connection-person,.notification-item):hover{border-color:color-mix(in srgb,var(--muted,#777d8e) 55%,var(--line,#242836));box-shadow:0 4px 16px #00000012}
 :where(.post-media-open,.whisper-image-open,.profile-media-open):hover>img{scale:1.025}
}
/* Decorative loading bars keep the actual loading text available. */
:where(.profile-loading,.notifications-loading,.rooms-loading,.messages-loading,.people-loading){position:relative;isolation:isolate;overflow:hidden;min-height:70px;padding:24px}
:where(.profile-loading,.notifications-loading,.rooms-loading,.messages-loading,.people-loading)::after{content:"";position:absolute;bottom:8px;left:20%;right:20%;height:3px;border-radius:3px;background:linear-gradient(90deg,transparent,var(--muted,#777d8e),transparent);background-size:200% 100%;opacity:.35;animation:site-loading-sheen 1.8s ease-in-out infinite;pointer-events:none}
@keyframes site-loading-sheen{0%{background-position:200% 0}100%{background-position:-200% 0}}
html[data-reduced-motion=true] :is(button,a,summary,input,textarea,select,.post-card,.room-card,.notification-item){transition:none!important}
html[data-reduced-motion=true] :is(.post-media-open,.whisper-image-open,.profile-media-open)>img{transition:none;scale:1}
html[data-reduced-motion=true] :is(.profile-loading,.notifications-loading,.rooms-loading,.messages-loading,.people-loading)::after{animation:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}:is(.post-media-open,.whisper-image-open,.profile-media-open)>img{scale:1}}

.seo-public-link{text-align:center;padding:20px;color:var(--muted);font-size:13px}
