:root {
  --bg: #fff7fb;
  --panel: #fff;
  --panel-soft: #fffafd;
  --text: #2b1f26;
  --muted: #77636d;
  --line: #ead3dc;
  --brand: #b23467;
  --brand2: #7a2546;
  --danger: #b00020;
  --ok: #20815a;
  --warn: #fff2be;
  --shadow: 0 10px 30px rgba(94,31,58,.12);
}

.theme-dark {
  --bg: #161018;
  --panel: #211720;
  --panel-soft: #2a1d28;
  --text: #f7eaf0;
  --muted: #bba8b1;
  --line: #3b2b36;
  --brand: #f07aa8;
  --brand2: #ffb0cc;
  --danger: #ff6b7e;
  --ok: #7be4b8;
  --warn: #4b3713;
  --shadow: 0 10px 30px rgba(0,0,0,.32);
}
* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:
    radial-gradient(circle at 18% 8%, rgba(245, 185, 210, .38), transparent 32rem),
    radial-gradient(circle at 86% 16%, rgba(255, 225, 238, .65), transparent 28rem),
    linear-gradient(180deg, var(--bg), color-mix(in srgb, var(--bg), #fff 42%));
  color: var(--text);
  line-height: 1.55;
}
a { color: var(--brand2); text-decoration-thickness: .08em; text-underline-offset: .16em; }
a:hover { color: var(--brand); }
.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .55rem 1rem;
  min-height: 3.15rem;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.theme-dark .topbar { background: rgba(22,16,24,.88); }
.brand {
  font-weight: 900;
  color: var(--text);
  text-decoration: none;
  letter-spacing: .01em;
  white-space: nowrap;
}
.brand-re { color: var(--brand); font-weight: 950; }
.topbar nav { display: flex; gap: .45rem; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
.topbar a { color: var(--text); text-decoration: none; padding: .32rem .2rem; }
.topbar a:hover { color: var(--brand); }
.logout-form { display: inline-flex; align-items: center; margin: 0; }
.logout-form button {
  margin: 0;
}
.icon-logout {
  width: 2.35rem;
  min-width: 2.35rem;
  height: 2.35rem;
  min-height: 2.35rem;
  display: inline-grid;
  place-items: center;
  padding: .45rem;
  border-radius: 999px;
  background: var(--panel-soft);
  border: 1px solid var(--line);
}
.icon-logout img { width: 1.08rem; height: 1.08rem; display: block; }
.nav-badge, .count-badge, .unread-badge {
  display: inline-grid;
  place-items: center;
  min-width: 1.25rem;
  height: 1.25rem;
  line-height: 1;
  border-radius: 999px;
  background: var(--brand);
  color: #fff;
  font-size: .78rem;
  padding: .3rem .35rem;
  vertical-align: middle;
}
.container { width: 100%; max-width: 1120px; margin: 0 auto; padding: 1.3rem; flex: 1; }
.footer { text-align: center; color: var(--muted); padding: 1rem; margin-top: auto; border-top: 1px solid var(--line); font-size: .86rem; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.two-col { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1rem; }
.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: var(--shadow);
  padding: 1rem;
  margin-bottom: 1rem;
}
.card h1, .card h2, .card h3 { margin-top: 0; line-height: 1.18; }
.page-intro {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  min-width: 0;
}
.page-intro > div:first-child { min-width: 0; }
.page-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .5rem;
  flex-wrap: wrap;
  margin-left: auto;
  min-width: 0;
}
.page-actions .page-nav { margin-left: .75rem; }
.hero { padding: 1.4rem; }
.lead { font-size: 1.12rem; max-width: 820px; }
.public-nav { display: flex; }
.topbar nav a.public-register-link,
.topbar .public-register-link {
  color: #fff;
  padding: .28rem .7rem;
  width: auto;
}
.topbar nav a.public-register-link:hover,
.topbar .public-register-link:hover { color: #fff; }
.public-home {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
  gap: 1rem;
  align-items: stretch;
  min-height: calc(100vh - 10rem);
}
.public-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .68fr);
  gap: 1.5rem;
  align-items: center;
  padding: clamp(1.25rem, 3vw, 3rem);
  overflow: hidden;
  background:
    radial-gradient(circle at 78% 42%, rgba(255, 208, 228, .9), transparent 18rem),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,250,253,.88));
  border-color: color-mix(in srgb, var(--line), #fff 20%);
  box-shadow: 0 24px 70px rgba(111, 39, 72, .16);
}
.public-hero-copy {
  min-width: 0;
  position: relative;
  z-index: 1;
}
.public-hero h1 {
  font-size: clamp(2.2rem, 5vw, 4.1rem);
  margin: 0 0 .65rem;
}
.public-hero .lead {
  max-width: 34rem;
  font-size: clamp(1.05rem, 2vw, 1.28rem);
}
.public-trust {
  color: var(--muted);
  font-weight: 800;
  margin: 1rem 0 1.35rem;
}
.public-primary-cta {
  min-height: 2.85rem;
  padding-inline: 1.15rem;
  box-shadow: 0 12px 30px rgba(178, 52, 103, .22);
}
.public-logo-halo {
  justify-self: center;
  position: relative;
  width: min(62vw, 240px);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background:
    radial-gradient(circle, rgba(255,255,255,.96) 0 44%, rgba(255,235,244,.78) 45% 62%, rgba(255,210,229,.38) 63% 100%);
  box-shadow: 0 22px 70px rgba(178, 52, 103, .2);
}
.public-logo-halo::before,
.public-logo-halo::after {
  content: '';
  position: absolute;
  border-radius: 999px;
  background: rgba(178, 52, 103, .1);
  filter: blur(2px);
}
.public-logo-halo::before { width: 2rem; height: 2rem; left: 8%; top: 22%; }
.public-logo-halo::after { width: 1.25rem; height: 1.25rem; right: 12%; bottom: 20%; }
.public-logo-halo img {
  width: 68%;
  height: 68%;
  object-fit: contain;
  filter: drop-shadow(0 12px 22px rgba(104, 28, 61, .18));
}
.public-login-card {
  align-self: center;
  padding: 1.2rem;
}
.public-login-card h2,
.register-card h1,
.auth-card h1 {
  margin-bottom: .7rem;
}
.auth-card form {
  display: grid;
  gap: .45rem;
}
.auth-card label {
  margin: .25rem 0;
}
.auth-links {
  display: grid;
  gap: .35rem;
  margin: .85rem 0 0;
  color: var(--muted);
  font-size: .94rem;
}
.register-card {
  max-width: 560px;
  margin-inline: auto;
}
.rules-card {
  max-width: 760px;
  margin-inline: auto;
}
.muted { color: var(--muted); }
.small { font-size: .88rem; }
.ok { color: var(--ok); }
.notice, .flash {
  border: 1px solid #e8c768;
  background: var(--warn);
  border-radius: 14px;
  padding: .8rem 1rem;
  margin: .7rem 0;
}
.notice.soft { background: color-mix(in srgb, var(--warn), transparent 30%); }
.badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .1rem .55rem;
  background: var(--bg);
  font-size: .86rem;
  color: var(--muted);
}
.status-open { color: #fff; background: var(--brand); border-color: var(--brand); }
.muted-badge { color: var(--muted); }
button, .button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  min-height: 2.5rem;
  border: 1px solid var(--brand);
  border-radius: 12px;
  padding: .5rem .85rem;
  background: var(--brand);
  color: #fff;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  font: inherit;
}
button:hover, .button:hover { filter: brightness(1.05); color: #fff; }
button.secondary, .button.secondary {
  background: var(--panel-soft);
  border-color: var(--line);
  color: var(--text);
}
button.danger, .button.danger { background: var(--danger); border-color: var(--danger); }
button.compact, .button.compact { min-height: 2rem; padding: .28rem .55rem; border-radius: 10px; font-size: .9rem; }
button:disabled, .button.disabled { opacity: .55; cursor: not-allowed; }
input.is-invalid, input[aria-invalid="true"], textarea[aria-invalid="true"], select[aria-invalid="true"] { border-color: #c0392b; box-shadow: 0 0 0 2px rgba(192,57,43,.12); }
.field-error { display: block; margin-top: .25rem; color: #a83225; font-size: .88rem; font-weight: 600; }
.field-error[hidden] { display: none; }
form.is-submitting button[type="submit"],
form.is-submitting button:not([type]),
form.is-submitting input[type="submit"] { position: relative; }
form.is-submitting button[type="submit"]::before,
form.is-submitting button:not([type])::before {
  animation: submitSpin .75s linear infinite;
  border: 2px solid currentColor;
  border-radius: 999px;
  border-right-color: transparent;
  content: '';
  display: inline-block;
  height: .85rem;
  margin-right: .4rem;
  width: .85rem;
}
@keyframes submitSpin { to { transform: rotate(360deg); } }
.inline { display: inline-flex; gap: .4rem; align-items: center; }
.form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .8rem; align-items: start; }
label { display: grid; gap: .25rem; font-weight: 800; margin: .55rem 0; }
input, textarea, select {
  width: 100%;
  color: var(--text);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: .7rem .8rem;
  font: inherit;
  font-weight: 500;
}

.choice-list { display: grid; gap: .45rem; }
.choice-list.compact { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; }
.choice-list label { display: inline-flex; align-items: center; gap: .45rem; margin: .25rem 0; font-weight: 800; min-width: 0; }
.choice-list input[type="radio"],
.choice-list input[type="checkbox"] { width: auto; min-width: 0; margin: 0; flex: 0 0 auto; }

input:disabled, textarea:disabled, select:disabled {
  opacity: .65;
  background: repeating-linear-gradient(-45deg, var(--panel-soft), var(--panel-soft) 6px, color-mix(in srgb,var(--line),transparent 65%) 6px, color-mix(in srgb,var(--line),transparent 65%) 12px);
  cursor: not-allowed;
}
.field-help { color: var(--muted); font-weight: 500; font-size: .9rem; }
.form-actions { display: flex; gap: .7rem; flex-wrap: wrap; align-items: center; margin-top: .8rem; }
.form-actions.aligned { align-items: end; }
.check-grid { display: grid; gap: .45rem; margin: .6rem 0; }
.check-row { display: flex; align-items: center; gap: .55rem; font-weight: 700; margin: .35rem 0; }
.check-row.compact-check { margin: 0; }
.check-row input[type="checkbox"] { width: auto; flex: 0 0 auto; }
.notification-settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .8rem; }
.notification-settings-grid section { border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); padding: .8rem; min-width: 0; }
.notification-settings-grid h2 { font-size: 1.05rem; margin: 0 0 .45rem; }
.tabs, .settings-nav { display: flex; flex-wrap: wrap; gap: .45rem; margin: .8rem 0 1rem; }
.tabs a, .settings-nav a {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .45rem .75rem;
  text-decoration: none;
  background: var(--panel-soft);
  color: var(--text);
}
.tabs a.active, .settings-nav a.active { background: var(--brand); color: #fff; border-color: var(--brand); }
.settings-warning { display: inline-grid; place-items: center; min-width: 1rem; height: 1rem; margin-left: .25rem; border-radius: 999px; background: var(--danger); color: #fff; font-size: .72rem; font-weight: 900; line-height: 1; }
.avatar-sm { width: 44px; height: 44px; border-radius: 12px; object-fit: cover; background: var(--bg); }
.avatar.big {
  width: 124px;
  height: 124px;
  border-radius: 30px;
  border: 5px solid var(--panel);
  box-shadow: var(--shadow);
  object-fit: cover;
  background: var(--bg);
}
.author-line { display: flex; gap: .7rem; align-items: center; margin: .6rem 0; }
.user-pill { display: inline-flex; align-items: center; gap: .25rem; color: var(--text); text-decoration: none; font-weight: 850; }
.verified {
  display: inline-grid;
  place-items: center;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  background: var(--brand);
  color: #fff;
  font-size: .78rem;
  font-weight: 900;
}
.big-verified { width: 1.35rem; height: 1.35rem; font-size: .95rem; }
.staff-badge, .profile-staff-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.35rem;
  border-radius: 999px;
  background: var(--brand2);
  color: #fff;
  padding: .12rem .48rem;
  font-size: .74rem;
  font-weight: 900;
  line-height: 1;
}
.profile-staff-badge { min-height: 1.55rem; padding: .18rem .55rem; font-size: .82rem; }
.compact-staff { min-height: 1.15rem; font-size: .68rem; padding: .08rem .4rem; }
.readonly-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 1.15rem; margin-left: .35rem; padding: .08rem .4rem; border-radius: 999px; font-size: .68rem; font-weight: 900; line-height: 1; color: #fff; background: color-mix(in srgb, var(--warn, #d98a00) 72%, var(--brand2)); vertical-align: middle; }
.profile-readonly-badge { min-height: 1.35rem; padding: .12rem .48rem; font-size: .74rem; }
.corner-badge { background: color-mix(in srgb, #c47f00 78%, var(--brand2)); }
.prison-badge { background: color-mix(in srgb, #2e2d35 84%, var(--danger)); }
.profile-mini-list { display: grid; gap: .5rem; }
.profile-mini-card {
  display: grid;
  gap: .15rem;
  min-width: 0;
  padding: .65rem .75rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel-soft);
  text-decoration: none;
}
.profile-mini-card strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text);
}
.profile-mini-card span { color: var(--muted); font-size: .88rem; }
.profile-external-link { display: flex; align-items: center; gap: .4rem; }
.profile-external-link img { width: 1.1rem; height: 1.1rem; object-fit: contain; }

.profile-presentation-link { min-width: 0; margin: .65rem 0; }
.profile-presentation-link h3 { margin: 0 0 .2rem; font-size: .95rem; }
.profile-presentation-link a { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-content-modal { width: min(760px, 100%); min-width: 0; }
.modal-sort-row { display: flex; flex-wrap: wrap; gap: .4rem; margin: .45rem 0 .8rem; }
.modal-sort-row .active { background: var(--brand); color: #fff; border-color: var(--brand); }
.profile-content-modal-list { display: grid; gap: .55rem; min-width: 0; max-width: 100%; }
.profile-content-modal-row { border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); padding: .7rem; display: grid; gap: .35rem; min-width: 0; max-width: 100%; overflow: hidden; }
.profile-content-modal-row > a { display: block; min-width: 0; max-width: 100%; overflow: hidden; }
.profile-content-modal-row strong { display: block; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-content-participants { display: flex; align-items: center; gap: .55rem; color: var(--muted); font-size: .9rem; min-height: 34px; min-width: 0; max-width: 100%; }
.profile-relations { display: grid; gap: .25rem; margin-bottom: .65rem; }
.profile-relations h3 { font-size: 1rem; margin: 0; }
.profile-relations p { margin: 0; display: flex; align-items: center; gap: .35rem; }
.profile-relation-row { display: flex; align-items: center; gap: .35rem; min-width: 0; }
.profile-relation-row > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-relation-row form { margin: 0; flex: 0 0 auto; }
.relation-accept { background: var(--ok); border-color: var(--ok); color: #fff; min-width: 2.2rem; }
.relation-decline { min-width: 2.2rem; }
.notification-relation-requests { display: grid; gap: .45rem; margin-bottom: .8rem; }
.notification-relation-requests h2 { font-size: 1.05rem; margin: .4rem 0; }
.online-dot { display: inline-block; width: .75rem; height: .75rem; background: var(--ok); border-radius: 50%; box-shadow: 0 0 0 3px color-mix(in srgb,var(--ok),transparent 75%); vertical-align: middle; }
.profile-card { position: relative; overflow: visible; padding: 0; }
.profile-cover { height: 245px; border-radius: 18px 18px 0 0; overflow: hidden; background: linear-gradient(135deg, color-mix(in srgb,var(--brand),transparent 68%), color-mix(in srgb,var(--brand2),transparent 70%)); }
.profile-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.profile-cover.empty { background: radial-gradient(circle at top left, color-mix(in srgb,var(--brand),transparent 55%), transparent 36%), linear-gradient(135deg, color-mix(in srgb,var(--brand),transparent 76%), color-mix(in srgb,var(--brand2),transparent 70%)); }
.profile-identity {
  display: flex;
  gap: 1rem;
  align-items: center;
  margin: -62px 1.1rem 1rem;
  position: relative;
  z-index: 3;
  max-width: calc(100% - 2.2rem);
}
.profile-title {
  min-width: 0;
  padding: .9rem 1.05rem;
  border-radius: 18px;
  background: color-mix(in srgb, var(--panel), transparent 7%);
  box-shadow: 0 10px 32px rgba(0,0,0,.10);
  backdrop-filter: blur(10px);
  border: 1px solid color-mix(in srgb,var(--line),transparent 30%);
}
.profile-title h1 { display: flex; gap: .38rem; align-items: center; flex-wrap: wrap; margin: 0 0 .15rem; }
.profile-title p { margin: .2rem 0; }
.profile-avatar-wrap { position: relative; display: inline-grid; place-items: center; flex: 0 0 auto; }
.profile-avatar-wrap.is-prison::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 28px;
  background: repeating-linear-gradient(90deg, rgba(22,22,26,.72) 0 7px, transparent 7px 20px);
  pointer-events: none;
}
.profile-actions-bar {
  position: absolute;
  right: 1rem;
  top: 260px;
  z-index: 4;
  display: flex;
  align-items: center;
  gap: .55rem;
  max-width: calc(100% - 2rem);
}
.profile-actions-bar.owner { top: 260px; }
.profile-main-actions { display: flex; gap: .45rem; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.profile-action { min-width: 108px; height: 2.35rem; padding-inline: .72rem; white-space: nowrap; }
.profile-notice { position: absolute; right: 0; top: 3.1rem; width: min(360px, 80vw); }
.profile-more { position: relative; margin: 0; border: 0!important; background: transparent!important; padding: 0!important; }
.profile-more > summary {
  list-style: none;
  width: 2.35rem;
  height: 2.35rem;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  font-size: 1.1rem;
  font-weight: 900;
  box-shadow: var(--shadow);
  cursor: pointer;
}
.profile-more > summary::-webkit-details-marker { display: none; }
.profile-more > div {
  position: absolute;
  right: 0;
  top: 2.75rem;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow);
  padding: .75rem;
  min-width: 230px;
  z-index: 12;
}
.profile-more form { margin: .4rem 0; }
.profile-more button, .profile-more .button { width: 100%; justify-content: center; }
.profile-more hr { border: 0; border-top: 1px solid var(--line); margin: .65rem 0; }
.moderation-actions { display: grid; gap: .45rem; }
.corner-duration-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; margin: .65rem 0; }
.corner-duration-grid label { display: flex; align-items: center; gap: .35rem; border: 1px solid var(--line); border-radius: 12px; padding: .55rem; background: var(--panel-soft); }
.profile-stats { display: flex; gap: .5rem; flex-wrap: wrap; margin: .1rem 1.1rem 1rem; }
.profile-stats a, .profile-stats span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .25rem .7rem;
  background: var(--bg);
  color: var(--text);
  text-decoration: none;
}
.muted-count { color: var(--muted)!important; }
.profile-blocks { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: 1rem; margin: 0 1.1rem 1.1rem; }
.profile-description { max-height: 44rem; overflow: auto; overflow-wrap: anywhere; white-space: normal; }
.profile-blocks h2 { margin-bottom: .45rem; }
.icon { display: inline-block; width: 1.6rem; }
.profile-content-grid h2 { display: flex; align-items: center; gap: .35rem; justify-content: space-between; }
.profile-content-grid h2 a { color: var(--text); text-decoration: none; }
.profile-description-input { min-height: 13rem; }
.signature-input { min-height: 3.4rem; max-height: 4.7rem; }
.forum-signature { border-top: 1px dashed var(--line); margin-top: .9rem; padding-top: .55rem; color: var(--muted); font-size: .9rem; line-height: 1.45; overflow-wrap: anywhere; }
.label-title { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.inline-edit-link { color: var(--brand); font-weight: 800; text-decoration: none; }
.fetlife-slug-field { display: flex; align-items: center; gap: .35rem; min-width: 0; }
.fetlife-slug-field span { flex: 0 0 auto; color: var(--muted); font-weight: 700; }
.fetlife-slug-field input { flex: 0 1 15rem; min-width: 8rem; }
.account-email-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .7rem; align-items: end; }
.account-email-form label { margin: 0; }
.account-email-form .field-help { grid-column: 1 / -1; margin-top: -.25rem; }
.account-email-side { display: grid; gap: .4rem; justify-items: end; align-self: end; }
.account-email-side button { min-height: 42px; }
.account-email-state { white-space: nowrap; font-size: .88rem; }
.relation-settings-card { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.relation-settings-card > div { min-width: 0; display: flex; align-items: center; gap: .5rem; flex-wrap: nowrap; }
.relation-settings-card strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.relation-settings-card span { flex: 0 0 auto; white-space: nowrap; }
.relation-settings-card form { margin: 0; align-self: center; }
.plain-icon-button { min-width: 1.8rem; min-height: 1.8rem; padding: 0; border: 0; background: transparent; color: var(--muted); font-weight: 900; }
.plain-icon-button:hover { color: var(--danger); background: color-mix(in srgb, var(--danger), transparent 92%); }
.relation-search-results { display: grid; gap: .45rem; max-height: 18rem; overflow-y: auto; overflow-x: hidden; }
.relation-pick-row { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .6rem; text-align: left; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); color: var(--text); padding: .55rem; cursor: pointer; }
.relation-pick-row:hover, .relation-pick-row.selected { border-color: var(--brand); box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand), transparent 80%); color: var(--brand); }
.relation-pick-row > span { min-width: 0; display: grid; gap: .08rem; }
.relation-pick-row strong, .relation-pick-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.image-forms { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; align-items: start; }
.image-upload-card { border: 1px solid var(--line); background: var(--panel-soft); border-radius: 16px; padding: 1rem; display: grid; gap: .8rem; min-width: 0; }
.profile-image-upload-form, .profile-gallery-picker { display: grid; gap: .65rem; min-width: 0; }
.profile-gallery-modal { width: min(760px, 100%); overflow-x: hidden; }
.profile-gallery-picker { max-width: 100%; overflow-x: hidden; }
.profile-gallery-choice-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(130px, 100%), 1fr)); gap: .7rem; max-height: min(56vh, 480px); overflow-y: auto; overflow-x: hidden; padding-right: .15rem; }
.profile-gallery-choice { border: 1px solid var(--line); border-radius: 12px; padding: .45rem; background: var(--panel-soft); display: grid; gap: .35rem; cursor: pointer; min-width: 0; }
.profile-gallery-choice:has(input:checked) { border-color: var(--brand); box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand), transparent 78%); }
.profile-gallery-choice input { position: relative; opacity: 0; pointer-events: none; }
.profile-gallery-choice img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 8px; background: var(--bg); }
.profile-gallery-choice span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .88rem; color: var(--muted); }
.file-picker { border: 1px dashed var(--line); border-radius: 14px; padding: .8rem; background: var(--panel); cursor: pointer; }
.file-picker input { margin-top: .4rem; }
.image-rights-inline { font-size: .92rem; }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: .7rem; }
.compact-gallery { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }
.gallery-grid-large { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.thumb { display: block; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--bg); aspect-ratio: 1/1; text-decoration: none; color: var(--text); position: relative; }
.thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gallery-thumb span { position: absolute; left: .35rem; right: .35rem; bottom: .35rem; background: rgba(0,0,0,.52); color: #fff; border-radius: 8px; padding: .2rem .35rem; font-size: .8rem; }
.image-preview { margin: .6rem 0; max-width: 260px; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--bg); }
.image-preview img { display: block; width: 100%; height: auto; }
.current-image-preview { max-width: 320px; }
.cropper-wrap { margin: .7rem 0; }
.cropper-stage { position: relative; width: min(720px, 90vw); height: min(66vh, 620px); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #111; touch-action: none; display: flex; align-items: center; justify-content: center; }
.cropper-stage img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; user-select: none; }
.crop-box { position: absolute; border: 2px solid white; box-shadow: 0 0 0 9999px rgba(0,0,0,.45); cursor: move; border-radius: 8px; touch-action: none; }
.resize-handle { position: absolute; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 2px solid var(--brand); }
.resize-handle.nw { left: -8px; top: -8px; cursor: nwse-resize; }
.resize-handle.ne { right: -8px; top: -8px; cursor: nesw-resize; }
.resize-handle.sw { left: -8px; bottom: -8px; cursor: nesw-resize; }
.resize-handle.se { right: -8px; bottom: -8px; cursor: nwse-resize; }
.story-editor h1 { margin-bottom: .4rem; }
.story-textarea { min-height: 58vh; font-size: 1.04rem; line-height: 1.72; }
.chapter-order-field[hidden] { display: none!important; }
.autosave-line, .reading-line { font-size: .9rem; color: var(--muted); display: inline-flex; align-items: center; }
.publish-row { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; margin-top: .8rem; }
.story-editor details, .card details { border: 1px solid var(--line); border-radius: 14px; padding: .7rem; margin: .7rem 0; background: color-mix(in srgb,var(--panel),var(--bg) 35%); }
.story-editor summary, .card summary { cursor: pointer; font-weight: 750; }
.editor-toolbar { display: flex; gap: .35rem; flex-wrap: wrap; margin: .45rem 0 .7rem; }
.editor-toolbar button { background: var(--bg); color: var(--text); border: 1px solid var(--line); min-height: 2rem; padding: .28rem .55rem; }
.editor-help { color: var(--muted); font-size: .9rem; margin: .35rem 0 .7rem; }
.story-cover { margin: -1rem -1rem 1rem; border-radius: 18px 18px 0 0; overflow: hidden; max-height: 430px; }
.story-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.story-cover-preview { max-width: 100%; border-radius: 14px; border: 1px solid var(--line); display: block; margin: .6rem 0; }
.story-body, .post-body { overflow-wrap: anywhere; }
.story-body p, .post-body p { margin: .7rem 0; }
.story-body blockquote, .post-body blockquote {
  border-left: 4px solid var(--brand);
  padding: .4rem .8rem;
  margin: .7rem 0;
  color: var(--muted);
  background: var(--bg);
  border-radius: 0 10px 10px 0;
  overflow-wrap: anywhere;
}
.accent-text { color: var(--brand2); font-weight: 750; }
.mention { font-weight: 850; text-decoration: none; background: color-mix(in srgb,var(--brand),transparent 88%); padding: .05rem .25rem; border-radius: 999px; }
.attachment-strip, .attachment-grid { display: flex; gap: .65rem; flex-wrap: wrap; margin: 1rem 0; }
.attachment-strip .thumb, .attachment-grid .thumb { width: 118px; max-width: 32vw; flex: 0 0 auto; }
.attachment-item { width: 145px; }
.attachment-actions { display: grid; gap: .3rem; margin-top: .35rem; }
.attachment-item button, .attachment-item .button { width: 100%; }
.chapter-nav { display: flex; justify-content: space-between; align-items: center; gap: .7rem; }
.chapter-nav .next { margin-left: auto; }
.title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.title-row h1, .title-row h2 { margin-bottom: .2rem; }
.reaction-row { display: flex; align-items: center; gap: .25rem; flex-wrap: wrap; min-height: 1.8rem; margin-top: .8rem; }
.reaction-row:empty { display: none; }
.reaction-row form { display: inline-flex; margin: 0; }
.reaction-chip, .reaction-choice { min-height: 1.75rem; padding: .12rem .45rem; border-radius: 999px; background: var(--bg); border: 1px solid var(--line); color: var(--text); font-size: .92rem; }
.reaction-picker { position: relative; border: 0!important; background: transparent!important; padding: 0!important; margin: 0!important; }
.reaction-picker summary { list-style: none; display: inline-grid; place-items: center; width: 1.75rem; height: 1.75rem; border: 1px solid var(--line); border-radius: 999px; background: var(--bg); cursor: pointer; font-weight: 900; }
.reaction-picker summary::-webkit-details-marker { display: none; }
.reaction-picker div { position: absolute; z-index: 20; display: flex; gap: .25rem; flex-wrap: wrap; min-width: 250px; left: 0; top: 2.05rem; background: var(--panel); border: 1px solid var(--line); box-shadow: var(--shadow); border-radius: 14px; padding: .45rem; }
.reaction-row.reacted { animation: reactPulse .28s ease-out; }
@keyframes reactPulse { 0%{transform:scale(1)} 45%{transform:scale(1.05)} 100%{transform:scale(1)} }
.quote-button { margin-top: .35rem; }
.message, .topic { border-bottom: 1px solid var(--line); padding: .85rem 0; }
.message:last-child, .topic:last-child { border-bottom: 0; }
.quick-dock { position: fixed; right: 1rem; bottom: 1rem; z-index: 30; }
.quick-dock-toggle { border-radius: 999px; box-shadow: var(--shadow); }
.quick-dock-panel { display: none; position: absolute; right: 0; bottom: 3.2rem; min-width: 220px; background: var(--panel); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); padding: .5rem; }
.quick-dock.open .quick-dock-panel { display: grid; gap: .25rem; }
.quick-dock-panel a { padding: .55rem .65rem; border-radius: 12px; color: var(--text); text-decoration: none; }
.quick-dock-panel a:hover { background: var(--bg); }
.media-viewer.viewer-shell { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 1rem; align-items: start; max-width: 1280px; }
.viewer-main { display: grid; gap: .8rem; place-items: center; }
.viewer-img { width: 100%; max-width: 900px; max-height: 78vh; object-fit: contain; border-radius: 16px; box-shadow: var(--shadow); background: #111; }
.viewer-meta { min-width: 0; }
.viewer-side { border-top: 1px solid var(--line); margin-top: 1rem; padding-top: .8rem; }
.viewer-nav { display: flex; justify-content: space-between; gap: .6rem; flex-wrap: wrap; align-items: center; width: 100%; }
.media-caption { font-size: 1.04rem; font-weight: 700; }
.modal-backdrop.active, .dialog-modal:target, .dialog-modal.active {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  padding: 1rem;
}
.dialog-modal { display: none; }
.modal-scrim { position: fixed; inset: 0; background: transparent; backdrop-filter: blur(12px); }
.modal-card {
  width: min(620px, 100%);
  max-height: 84vh;
  overflow: auto;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: var(--shadow);
  padding: 1rem;
  position: relative;
  z-index: 2;
}
.cropper-card { width: min(820px, 96vw); }
.modal-close { position: absolute; right: 1rem; top: .8rem; font-size: 1.8rem; text-decoration: none; color: var(--text); background: transparent; border: 0; min-height: auto; padding: 0; }
.relation-modal { width: min(680px, 100%); }
.relation-list { display: grid; gap: .55rem; }
.relation-row { display: flex; justify-content: space-between; align-items: center; gap: .7rem; border: 1px solid var(--line); border-radius: 14px; padding: .55rem; background: var(--bg); }
.relation-person { display: flex; align-items: center; gap: .65rem; color: var(--text); text-decoration: none; min-width: 0; }
.relation-person small { color: var(--muted); font-weight: 500; }
.blurred-underlay { filter: blur(2px); opacity: .5; }
.mention-box { z-index: 60; background: var(--panel); border: 1px solid var(--line); box-shadow: var(--shadow); border-radius: 14px; padding: .35rem; display: grid; gap: .2rem; max-width: 320px; }
.mention-box button { justify-content: flex-start; background: transparent; color: var(--text); border: 0; }
.mention-box img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.home-item { display: grid; grid-template-columns: minmax(0, 1fr) 180px; gap: 1rem; align-items: start; }
.home-copy { min-width: 0; overflow-wrap: anywhere; }
.feed-image { display: block; border-radius: 16px; overflow: hidden; border: 1px solid var(--line); max-height: 220px; }
.feed-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gallery-page .title-row { align-items: center; }
.button-row { display: flex; gap: .55rem; flex-wrap: wrap; }
ul { padding-left: 1.2rem; }
@media (max-width: 820px) {
  .topbar { align-items: center; flex-wrap: wrap; }
  .topbar nav { font-size: .95rem; justify-content: flex-start; width: 100%; }
  .topbar nav.public-nav { width: auto; justify-content: flex-end; }
  .container { padding: .8rem; }
  .public-home { grid-template-columns: 1fr; min-height: auto; }
  .public-hero { grid-template-columns: 1fr; text-align: center; gap: 1rem; }
  .public-logo-halo { grid-row: 1; width: min(58vw, 220px); }
  .public-hero-copy { grid-row: 2; }
  .public-primary-cta { width: 100%; }
  .public-login-card { align-self: stretch; }
  .two-col, .profile-blocks, .media-viewer.viewer-shell { grid-template-columns: 1fr; }
  .profile-cover { height: 170px; }
  .profile-actions-bar, .profile-actions-bar.owner { position: static; margin: .8rem; justify-content: flex-start; flex-wrap: wrap; align-items: center; }
  .profile-main-actions { justify-content: flex-start; flex: 1 1 auto; width: auto; min-width: 0; }
  .profile-action { flex: 0 1 auto; min-width: 0; padding-inline: .65rem; }
  .profile-more { margin-left: 0; flex: 0 0 auto; }
  .profile-identity { align-items: center; margin: .4rem .8rem .8rem; }
  .avatar.big { width: 86px; height: 86px; border-radius: 22px; border-width: 4px; }
  .profile-title { padding: .65rem .75rem; box-shadow: none; }
  .profile-stats, .profile-blocks { margin: .8rem; }
  .story-textarea { min-height: 48vh; }
  .quick-dock { right: .75rem; bottom: .75rem; }
  .viewer-nav { justify-content: center; }
  .attachment-strip .thumb, .attachment-grid .thumb { max-width: 44vw; }
  .home-item { grid-template-columns: 1fr; }
  .feed-image { max-height: 280px; }
  .title-row { display: flex; flex-wrap: wrap; }
  .button-row .button { width: 100%; }
}
@media (max-width: 460px) {
  .profile-identity { display: grid; grid-template-columns: 92px minmax(0,1fr); gap: .7rem; }
  .profile-title h1 { font-size: 1.55rem; }
  .profile-title .muted { font-size: .94rem; }
  .card { border-radius: 16px; padding: .8rem; }
  .profile-card { padding: 0; }
  .gallery-grid-large { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

.restriction-body {
  min-height: 100vh;
  background: #161219;
}
.restriction-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: clamp(1rem, 4vw, 3rem);
  background-position: center;
  background-size: cover;
}
.corner-restriction .restriction-page { background-image: linear-gradient(rgba(28,16,20,.08), rgba(28,16,20,.26)), url('/static/au-coin.jpg'); }
.prison-restriction .restriction-page { background-image: linear-gradient(rgba(8,8,12,.08), rgba(8,8,12,.28)), url('/static/prison.jpg'); }
.restriction-card {
  position: relative;
  width: min(720px, 100%);
  max-height: calc(100vh - 2rem);
  overflow: auto;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 22px;
  padding: clamp(1rem, 4vw, 2rem);
  background: color-mix(in srgb, var(--panel) 5%, transparent);
  box-shadow: 0 26px 80px rgba(0,0,0,.35);
  backdrop-filter: blur(12px);
  text-shadow: 0 1px 20px rgba(255,255,255,.45);
}
.restriction-card .restriction-logout { position: absolute; top: .75rem; right: .75rem; }
.restriction-kicker {
  margin: 0 0 .35rem;
  color: var(--brand2);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.restriction-card h1 { margin-top: 0; }
.restriction-timer {
  margin: 1rem 0;
  font-size: clamp(2.4rem, 12vw, 5rem);
  line-height: 1;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
}
.prison-ticket {
  display: grid;
  gap: .35rem;
  max-height: min(46vh, 420px);
  overflow: auto;
  margin: 1rem 0;
  padding-right: .25rem;
}
.prison-message {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: .7rem;
  background: var(--panel-soft);
}
.prison-reply-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .5rem;
  align-items: end;
}
.prison-reply-form [data-form-inline-error] { grid-column: 1 / -1; margin: 0; }
.prison-ticket-closed { display: grid; gap: .55rem; }
.prison-reply-form textarea {
  min-height: 2.6rem;
  max-height: 9rem;
}
@media (max-width: 620px) {
  .restriction-page { place-items: end center; padding: .75rem; }
  .restriction-card { border-radius: 18px; max-height: calc(100vh - 1.5rem); }
  .prison-reply-form { grid-template-columns: 1fr; }
  .corner-duration-grid { grid-template-columns: 1fr; }
}

.logout-form { display: inline-flex; align-items: center; margin: 0; }
.relation-name { display: inline-flex; align-items: center; gap: .28rem; min-width: 0; white-space: nowrap; }
.relation-person > span { gap: .12rem; }
.relation-row form { margin: 0; }
.modal-backdrop.active { background: transparent; }
.modal-card h1, .modal-card h2 { padding-right: 2.4rem; }
.modal-close { line-height: 1; display: grid; place-items: center; width: 2rem; height: 2rem; top: .75rem; }
.cropper-card { display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; overflow: hidden; }
.cropper-card h2 { margin-bottom: .6rem; }
.cropper-card .cropper-stage { margin: 0 auto; }
.cropper-card .form-actions { margin-top: .4rem; }
.image-preview { margin: .7rem 0; }
.image-preview img { max-width: 220px; max-height: 160px; border-radius: 14px; border: 1px solid var(--line); object-fit: cover; }
.native-rich-hidden { position: absolute!important; left: -10000px!important; width: 1px!important; height: 1px!important; opacity: 0!important; }
.visual-editor-shell { margin: .35rem 0 .55rem; }
.visual-editor { min-height: 16rem; padding: .95rem; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); line-height: 1.7; outline: none; overflow-wrap: anywhere; font-weight: 400; }
.story-editor .visual-editor { min-height: 56vh; font-size: 1.04rem; }
.visual-editor:focus { border-color: var(--brand); box-shadow: 0 0 0 4px color-mix(in srgb,var(--brand),transparent 84%); }
.visual-editor p { margin: .65rem 0; }
.visual-editor blockquote { border-left: 4px solid var(--brand); margin: .75rem 0; padding: .45rem .85rem; color: var(--muted); background: var(--bg); border-radius: 0 10px 10px 0; }
.visual-editor ul { margin: .65rem 0; }
.mention-box { transform: translateY(-2px); }
.publish-row { gap: 1.15rem; }
.autosave-line { margin-left: .2rem; }
.reading-line { margin-left: auto; }
.chapter-order-field { max-width: 260px; }
.media-viewer-full { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 390px); gap: 1rem; max-width: min(1560px, calc(100vw - 2rem)); margin: 0 auto; align-items: stretch; min-height: calc(100vh - 9rem); }
.media-viewer-full .viewer-main { background: #120d11; border-radius: 22px; min-height: 72vh; padding: .8rem; display: grid; grid-template-rows: minmax(0, 1fr) auto; }
.media-viewer-full .viewer-img { width: 100%; height: 100%; max-width: none; max-height: calc(100vh - 12rem); object-fit: contain; box-shadow: none; }
.viewer-meta.card { margin: 0; overflow: auto; max-height: calc(100vh - 9rem); }
.viewer-author { margin-top: 0; font-weight: 700; }
.viewer-side h2 { font-size: 1.05rem; }
.gallery-section { margin-top: 1.1rem; }
.album-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: .8rem; }
.album-card { display: grid; gap: .45rem; padding: .55rem; border: 1px solid var(--line); border-radius: 18px; text-decoration: none; color: var(--text); background: var(--bg); }
.album-card img, .album-empty { width: 100%; aspect-ratio: 1.45; object-fit: cover; border-radius: 14px; display: grid; place-items: center; background: color-mix(in srgb,var(--brand),transparent 88%); color: var(--brand2); font-weight: 850; }
.album-card small { color: var(--muted); }
.gallery-grid-large { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.gallery-thumb { aspect-ratio: 1; }
.gallery-thumb img { width: 100%; height: 100%; object-fit: cover; }
.messages-shell { display: grid; grid-template-columns: 300px minmax(0,1fr) 220px; gap: 1rem; align-items: stretch; min-height: calc(100vh - 8rem); }
.messages-sidebar, .message-conversation, .online-sidebar { background: var(--panel); border: 1px solid var(--line); border-radius: 20px; padding: .8rem; box-shadow: var(--shadow); }
.messages-sidebar { overflow: auto; }
.sidebar-title { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.sidebar-title h1 { font-size: 1.45rem; margin: 0; }
.message-sidebar-section { margin-top: 1rem; }
.message-sidebar-section h3 { margin: 0 0 .45rem; font-size: 1rem; }
.message-list-item, .online-mini { display: flex; align-items: center; gap: .55rem; padding: .55rem; border-radius: 14px; color: var(--text); text-decoration: none; }
.message-list-item:hover, .message-list-item.active, .online-mini:hover { background: var(--bg); }
.message-list-item img, .online-mini img { width: 38px; height: 38px; border-radius: 12px; object-fit: cover; }
.message-list-item > span, .online-mini > span:last-child { min-width: 0; flex: 1 1 auto; }
.message-list-item strong, .online-mini strong { display: flex; align-items: center; gap: .25rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-wrap: wrap; }
.message-list-main { min-width: 0; display: grid; gap: .1rem; }
.message-list-title { min-width: 0; display: flex; align-items: center; gap: .28rem; flex-wrap: wrap; }
.message-list-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.message-list-badges { display: inline-flex; align-items: center; gap: .2rem; flex: 0 0 auto; }
.message-list-item small { color: var(--muted); }
.conversation-preview { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .55rem; }
.conversation-preview span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conversation-preview time { color: var(--muted); white-space: nowrap; }
.message-request-card { border: 1px solid var(--line); border-radius: 14px; padding: .55rem; margin-bottom: .5rem; background: var(--bg); }
.message-conversation { display: grid; grid-template-rows: auto minmax(0,1fr) auto; min-width: 0; }
.message-conversation.empty { display: grid; place-items: center; text-align: center; }
.message-conversation-head { border-bottom: 1px solid var(--line); padding-bottom: .55rem; margin-bottom: .55rem; }
.message-conversation-head h1 { margin: 0; }
.message-thread { overflow: auto; padding-right: .25rem; }
.message-conversation form[data-full-message-form] { gap: .5rem; margin-top: .6rem; }
.message-conversation form[data-full-message-form] input { flex: 1; }
.quick-dock-panel { width: 320px; max-width: calc(100vw - 2rem); padding: 0; overflow: hidden; }
.quick-menu { display: grid; }
.quick-menu-head { display: flex; align-items: center; justify-content: space-between; padding: .75rem; border-bottom: 1px solid var(--line); }
.quick-options { position: relative; }
.quick-options summary { list-style: none; cursor: pointer; font-weight: 900; }
.quick-options > label { position: absolute; right: 0; top: 1.8rem; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); padding: .5rem; min-width: 210px; z-index: 3; }
.quick-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: .45rem; gap: .35rem; }
.quick-tabs button { background: var(--bg); color: var(--text); border: 1px solid var(--line); min-height: 2.1rem; }
.quick-tabs button.active { background: var(--brand); color: white; border-color: var(--brand); }
.quick-tab { display: none; max-height: 360px; overflow: auto; padding: .45rem; }
.quick-tab.active { display: grid; gap: .35rem; }
.quick-tab button { display: flex; align-items: center; gap: .55rem; text-align: left; justify-content: flex-start; background: transparent; color: var(--text); border: 0; padding: .55rem; border-radius: 12px; }
.quick-tab button:hover { background: var(--bg); }
.quick-tab img { width: 34px; height: 34px; object-fit: cover; border-radius: 10px; }
.quick-tab small { color: var(--muted); }
.quick-room-avatar { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in srgb,var(--brand),transparent 82%); color: var(--brand2); font-weight: 900; }
.discord-line { display: grid; grid-template-columns: 38px minmax(0,1fr); gap: .55rem; padding: .38rem 0; border-bottom: 0; }
.discord-line > img { width: 38px; height: 38px; border-radius: 12px; object-fit: cover; }
.discord-line p { margin: 0 0 .15rem; display: flex; gap: .45rem; align-items: baseline; flex-wrap: wrap; }
.discord-line time { color: var(--muted); font-size: .83rem; }
.chat-gif { max-width: 180px; border-radius: 12px; margin-top: .35rem; }
.quick-empty { padding: .8rem; }
.forum-card .count-badge, .forum-shortcut .count-badge { vertical-align: middle; align-self: center; }
.forum-last { display: flex; align-items: center; justify-content: space-between; gap: .7rem; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: .6rem; margin-top: .75rem; }
.topic-meta-block { display: grid; gap: .5rem; align-content: start; }
.topic-meta-row { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
@media (max-width: 900px) {
  .messages-shell { grid-template-columns: 1fr; }
  .online-sidebar { order: 3; }
  .media-viewer-full { grid-template-columns: 1fr; }
  .viewer-meta.card { max-height: none; }
  .reading-line { margin-left: 0; }
}
@media (max-width: 520px) {
  .profile-actions-bar { display: flex; }
  .profile-main-actions { width: auto; }
  .profile-main-actions form.inline { flex: 0 1 auto; }
  .profile-actions-bar .profile-action { min-width: 0; font-size: .92rem; }
  .media-viewer-full .viewer-main { min-height: 58vh; }
  .messages-sidebar, .message-conversation, .online-sidebar { border-radius: 16px; }
}
@media (max-width: 760px) {
  .quick-dock { display: none !important; }
}

.modal-card .modal-head,
.modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .75rem;
}
.modal-head h1,
.modal-head h2 { margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.modal-head .modal-close { position: static; flex: 0 0 auto; }
.relation-row form[data-social-action] { margin-left: auto; }
.image-preview img { max-width: 280px; max-height: 180px; object-fit: contain; border-radius: 12px; border: 1px solid var(--line); }
.cropper-modal .modal-card { max-height: min(92vh, 820px); overflow: auto; }
.gallery-title-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.gallery-title-line h1 { margin: 0; }
.album-admin-actions { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: .7rem; }
.gallery-grid-large img, .compact-gallery img, .album-card img { object-fit: cover; }
.pagination { display: flex; justify-content: space-between; gap: .8rem; margin-top: 1rem; }
.page-nav {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: .25rem;
  margin-left: auto;
  font-size: .92rem;
}
.page-nav-btn {
  width: 2rem;
  height: 2rem;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
  color: var(--text);
  text-decoration: none;
  font-weight: 800;
}
.page-nav-btn.disabled {
  opacity: .35;
  pointer-events: none;
}
.page-nav-jump {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  margin: 0 .25rem;
  color: var(--muted);
}
.page-nav-jump label { margin: 0; font-size: .82rem; }
.page-nav-jump input {
  width: 3.7rem;
  min-height: 2rem;
  padding: .25rem .4rem;
  text-align: center;
}
.compact-page-intro {
  padding: 0;
  margin-bottom: .75rem;
}
.compact-page-intro h2 { margin: 0; }
.bottom-page-actions {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin: 1rem 0;
}
.profile-content-modal-list,
.relation-modal .relation-list,
.reaction-list-modal .reaction-list {
  max-height: min(62vh, 620px);
  overflow-y: auto;
  padding-right: .25rem;
}
@media (max-width: 720px) {
  .page-intro { flex-direction: column; }
  .page-actions { width: 100%; justify-content: center; margin-left: 0; }
  .page-actions .page-nav { margin-left: 0; }
  .page-nav { width: 100%; justify-content: center; flex-wrap: wrap; margin-left: 0; }
  .page-nav-jump { order: 5; width: 100%; justify-content: center; }
  .bottom-page-actions { justify-content: center; flex-wrap: wrap; }
  .bottom-page-actions .button { min-width: 0; }
}
.viewer-side .reaction-row { margin-bottom: .7rem; }
.media-comments-box {
  display: flex;
  flex-direction: column;
  max-height: 48vh;
  overflow: auto;
  gap: .75rem;
}
.viewer-author .user-pill { color: var(--brand2); text-decoration: underline; text-underline-offset: .16em; }
.reaction-chip { min-height: 1.85rem; padding: .18rem .5rem; font-size: .92rem; }
.reaction-picker summary { min-width: 1.85rem; min-height: 1.85rem; }
.reaction-list-modal { max-width: 520px; }
.slash-menu {
  position: absolute;
  z-index: 85;
  display: grid;
  min-width: 190px;
  padding: .35rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
  box-shadow: var(--shadow);
}
.slash-menu button { justify-content: flex-start; background: transparent; color: var(--text); border: 0; border-radius: 10px; }
.chapter-manager {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: .75rem;
  background: var(--panel-soft);
  margin: .7rem 0;
}
.chapter-manager-head { display: flex; justify-content: space-between; gap: .8rem; flex-wrap: wrap; }
.chapter-position-controls { display: flex; align-items: center; gap: .55rem; margin-top: .55rem; flex-wrap: wrap; }
.publish-row { gap: 1rem; }
.autosave-line { margin-left: .4rem; }
.story-editor textarea.story-textarea + .visual-editor-shell .visual-editor,
.story-editor .visual-editor { min-height: 28rem; }
.topic .topic-meta-block,
.topic .topic-meta-row { margin-top: .25rem; }
.forum-card .count-badge { vertical-align: middle; }
.forum-last {
  border-top: 1px solid var(--line);
  margin-top: .9rem;
  padding-top: .75rem;
  display: grid;
  gap: .15rem;
}
.forum-last > span:first-child { color: var(--muted); font-size: .86rem; }
.quick-menu { min-height: 300px; }
.online-state { display: inline-flex; align-items: center; gap: .35rem; }
.online-state::before { content: ''; width: .65rem; height: .65rem; border-radius: 50%; background: var(--ok); }
.online-state.idle::before { background: #d38b28; }
.online-state.dnd::before { background: #c0392b; }
.online-state.invisible::before { background: #ddd; border: 1px solid var(--muted); }
@media (max-width: 720px) {
  .gallery-title-line { align-items: flex-start; }
  .quick-dock-panel { width: calc(100vw - 1.5rem); }
}
.relation-row { display: flex; align-items: center; gap: .75rem; }
.relation-person { display: grid; grid-template-columns: 44px minmax(0,1fr); align-items: center; gap: .65rem; min-width: 0; color: var(--text); text-decoration: none; }
.relation-person > span { display: grid; min-width: 0; }
.relation-row .staff-badge.compact-staff { min-width: auto; max-width: 96px; }
.viewer-nav .button.secondary:first-child { min-width: auto; padding-inline: .8rem; }
.viewer-side h2 { margin-bottom: .45rem; }
.viewer-side .reaction-row { margin: .25rem 0 .6rem; }
.media-comments-box { min-height: 9rem; }
.reaction-picker div, .mention-box, .slash-menu, .quick-options > label, .profile-more > div { z-index: 9999; }
.reaction-tabs { display: flex; gap: .35rem; flex-wrap: wrap; margin-bottom: .75rem; }
.reaction-tabs button { min-height: 2.1rem; padding: .3rem .7rem; background: var(--panel-soft); color: var(--text); border-color: var(--line); border-radius: 999px; }
.reaction-tabs button.active { background: var(--brand); border-color: var(--brand); color: #fff; }
.reaction-tab-panel { display: none; }
.reaction-tab-panel.active { display: grid; gap: .5rem; }
.spoiler { background: var(--text); color: transparent; border-radius: .35rem; padding: 0 .18rem; cursor: pointer; }
.spoiler.revealed, .spoiler:focus { color: var(--panel); }
.text-big { font-size: 1.22em; font-weight: 780; }
.text-small { font-size: .85em; color: var(--muted); }
.visual-editor:empty::before { content: attr(data-placeholder); color: var(--muted); pointer-events: none; }
.visual-editor a { color: var(--brand2); text-decoration: underline; text-underline-offset: .16em; }
.home-item { display: grid; grid-template-columns: minmax(0,1fr) 260px; gap: 1rem; align-items: start; overflow: hidden; }
.home-author-line { display: flex; align-items: flex-start; gap: .65rem; grid-column: 1 / -1; }
.home-copy { min-width: 0; }
.home-copy h2 { margin: 0 0 .35rem; }
.home-copy h2 a { color: var(--brand2); }
.feed-image { display: block; grid-column: 2; grid-row: 2 / span 2; max-width: 100%; border-radius: 14px; overflow: hidden; border: 1px solid var(--line); background: var(--bg); align-self: start; }
.feed-image img { width: 100%; height: 180px; object-fit: cover; display: block; }
.home-item p { overflow-wrap: anywhere; }
.forum-grid { align-items: stretch; }
.forum-card { display: flex; flex-direction: column; min-height: 13rem; }
.forum-card h2, .forum-shortcut h2 { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.forum-card-la-fessee-sur-les-hommes h2 { font-size: 1.4em; }
.forum-card p { overflow-wrap: anywhere; }
.forum-last { background: var(--panel-soft); border-radius: 12px; padding: .65rem; border: 1px solid var(--line); margin-top: auto; min-height: 4.6rem; align-content: center; }
.topic { overflow-wrap: anywhere; }
.topic h2 { margin-bottom: .25rem; }

.topic h2 { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.topic h2 a { min-width: 0; overflow-wrap: anywhere; }
.profile-content-modal-row strong,
.profile-gallery-choice span,
.modal-head h1,
.modal-head h2 { max-width: 100%; }

.topic h2 .archive-status-icon,
.title-row h1 .archive-status-icon {
  width: 1.05em;
  height: 1.05em;
  object-fit: contain;
  vertical-align: -0.16em;
  opacity: .78;
}
.forum-topic-list .topic {
  display: grid;
  gap: .35rem;
}
.forum-topic-meta-line {
  min-height: 2.35rem;
  display: flex;
  align-items: center;
  gap: .9rem;
  flex-wrap: wrap;
}
.forum-topic-author-line {
  justify-content: space-between;
}
.forum-topic-author-line .author-line {
  margin: 0;
  min-width: min(18rem, 100%);
}
.forum-topic-author-line > span {
  margin-left: auto;
  white-space: nowrap;
}
.forum-topic-participant-line {
  justify-content: space-between;
  padding-left: .1rem;
  display: grid;
  grid-template-columns: minmax(10rem, auto) minmax(12rem, 1fr);
}
.topic-participant-summary,
.topic-last-summary {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 2.1rem;
}
.topic-last-summary {
  margin-left: auto;
  text-align: right;
  justify-content: flex-end;
  min-width: 0;
  flex-wrap: wrap;
}
.topic-last-summary > span { min-width: 0; }
.topic-last-summary > span:last-child { overflow-wrap: anywhere; }
.topic-last-summary.empty { visibility: hidden; }
.story-list .topic > .topic-meta-block + p.muted.small { margin-top: 0; }
.story-list .forum-topic-participant-line { margin-top: .35rem; }
.event-status-badge { background: color-mix(in srgb, var(--brand2), transparent 78%); color: var(--brand2); }
.event-fields { border: 1px solid var(--line); border-radius: 12px; padding: .75rem; background: var(--panel-soft); }
.event-fields summary { cursor: pointer; font-weight: 800; }
.event-panel { display: grid; gap: .85rem; }
.event-counter-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .55rem; }
.event-counter-grid span { border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); padding: .65rem; min-width: 0; }
.event-requirements { display: flex; flex-wrap: wrap; gap: .35rem; }
.event-requirement-chip { background: color-mix(in srgb, var(--brand), transparent 84%); color: var(--brand); }
.event-my-participation { border: 1px solid var(--line); border-radius: 12px; padding: .75rem; background: var(--panel-soft); display: grid; gap: .45rem; }
.event-my-participation h3 { margin: 0; font-size: 1rem; }
.event-publication-banner { margin: .65rem 0 .35rem; background: color-mix(in srgb, var(--brand), #fff 88%); border-color: color-mix(in srgb, var(--brand), transparent 65%); color: var(--text); }
.event-participation-form { display: grid; gap: .65rem; }
.event-admin-panel { border-top: 1px solid var(--line); padding-top: .8rem; display: grid; gap: .55rem; }
.event-admin-panel h3 { margin: 0; font-size: 1rem; }
.event-admin-list { display: grid; gap: .5rem; }
.event-admin-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .6rem; align-items: start; border: 1px solid var(--line); border-radius: 12px; padding: .55rem; background: var(--panel-soft); }
.event-admin-main { min-width: 0; display: grid; gap: .25rem; }
.event-admin-preview { margin-top: .2rem; }
.event-admin-preview summary { cursor: pointer; font-weight: 700; }
.event-admin-preview .rich-content { margin-top: .45rem; }
.event-admin-actions { display: flex; align-items: center; justify-content: flex-end; gap: .35rem; flex-wrap: wrap; }
.event-admin-actions form { margin: 0; display: inline-flex; align-items: center; gap: .25rem; }
.event-admin-actions input { max-width: 11rem; min-height: 2rem; padding: .25rem .45rem; }
.anonymous-feed-card .home-copy p { margin-bottom: 0; }
.anonymous-home-line strong { color: var(--text); }
.chat-line, .message { overflow-wrap: anywhere; }
.chat-line div, .message div { min-width: 0; }
.message-conversation form[data-full-message-form] { align-items: flex-end; }
.message-conversation form[data-full-message-form] input[name="body"] { min-width: 0; }
.quick-window-body { overflow-y: auto; overflow-x: hidden; }
.quick-window { overflow: hidden; }
.quick-dock-panel { min-height: 360px; max-height: min(72vh, 620px); }
.quick-tab { max-height: 430px; }
@media (max-width: 720px) {
  .home-item { grid-template-columns: 1fr; }
  .feed-image { grid-column: auto; grid-row: auto; }
  .feed-image img { height: auto; max-height: 260px; object-fit: contain; }
  .viewer-nav { display: flex; overflow-x: auto; flex-wrap: nowrap; }
  .viewer-nav .button { width: auto; flex: 0 0 auto; }
  .reaction-picker div { right: 0; left: auto; }
}
.editor-toolbar { display: none!important; }
.quote-button { float: right; margin-top: -.3rem; }
.message::after { content:''; display:block; clear:both; }

.participant-stack {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}
.participant-stack a,
.participant-stack span {
  display: inline-grid;
  border-radius: 999px;
  border: 2px solid var(--panel);
  overflow: hidden;
  background: var(--panel-soft);
}
.participant-stack a + a,
.participant-stack a + span,
.participant-stack span + a,
.participant-stack span + span { margin-left: -.55rem; }
.participant-stack img {
  width: 2rem;
  height: 2rem;
  object-fit: cover;
}
.topic-participants {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}
.topic-last-participant .author-line { margin-top: .35rem; }
.anonymous-list-author {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  font-weight: 800;
  color: var(--text);
}
.anonymous-author .avatar-sm { background: var(--panel-soft); }
.anonymous-pill { color: var(--text); text-decoration: none; }
.anonymous-explain { margin-top: 0; }
.compact-badge { font-size: .72rem; padding: .12rem .35rem; vertical-align: middle; }

.relation-row { align-items: center; }
.relation-person { min-width: 0; display: grid; grid-template-columns: 44px minmax(0,1fr); align-items: center; gap: .65rem; }
.relation-person > span { min-width: 0; display: grid; gap: .12rem; }
.relation-name { display: inline-flex; align-items: center; gap: .28rem; min-width: 0; white-space: nowrap; flex-wrap: nowrap; }
.relation-name strong { overflow: hidden; text-overflow: ellipsis; }
.relation-name .staff-badge { width: auto; max-width: 6.5rem; }
.modal-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.modal-head h1, .modal-head h2 { margin: 0; }
.modal-close { flex: 0 0 auto; }

.home-item, .feed-card { display: grid; gap: .85rem; }
.home-author-line { display: grid; grid-template-columns: 44px minmax(0,1fr); align-items: center; gap: .65rem; }
.home-author-line .user-pill { display: inline-flex; }
.home-copy { min-width: 0; }
.home-copy h2 { margin: .1rem 0 .35rem; font-size: 1.25rem; }
.home-copy p { overflow-wrap: anywhere; }
.feed-image { grid-column: auto!important; grid-row: auto!important; width: fit-content; max-width: 100%; max-height: none; }
.feed-image img { width: auto; max-width: min(460px, 100%); height: auto; max-height: 260px; object-fit: contain; background: var(--bg); }
.feed-meta-line { display: flex; gap: .4rem; align-items: baseline; flex-wrap: wrap; }

.viewer-nav { display: grid; grid-template-columns: 1fr auto 1fr; gap: .6rem; align-items: center; margin-top: .8rem; }
.viewer-nav .prev { justify-self: start; }
.viewer-nav .return { justify-self: center; }
.viewer-nav .next { justify-self: end; }
.viewer-nav .button { white-space: nowrap; }
.media-comments { max-height: 38vh; overflow-y: auto; padding-right: .25rem; }
.media-comment-form textarea, .compact-comment-editor { min-height: 4.6rem; }
.viewer-side h2 + .reaction-row { margin-top: .15rem; }
.viewer-side .reaction-title { margin-bottom: .25rem; }

.floating-editor-toolbar { display: none; position: absolute; transform: translateX(-50%); z-index: 10000; background: var(--panel); border: 1px solid var(--line); box-shadow: var(--shadow); border-radius: 12px; padding: .22rem; gap: .1rem; align-items: center; white-space: nowrap; max-width: calc(100vw - 1rem); overflow-x: auto; }
.floating-editor-toolbar.active { display: flex; }
.floating-editor-toolbar button { min-height: 2rem; min-width: 2rem; padding: .2rem .35rem; border-radius: 9px; background: transparent; color: var(--text); border-color: transparent; }
.floating-editor-toolbar button:hover { background: var(--bg); color: var(--brand2); }
.floating-editor-toolbar.mobile-selection-toolbar {
  position: absolute;
  transform: translateX(-50%);
  justify-content: flex-start;
  max-width: calc(100vw - 1rem);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x;
  overscroll-behavior-x: contain;
  max-height: calc((var(--visual-viewport-height, 100vh)) - 1rem);
}
.floating-editor-toolbar,
.floating-editor-toolbar *,
.slash-menu,
.slash-menu * {
  -webkit-user-select: none;
  user-select: none;
}
.slash-menu.editor-command-menu {
  max-height: min(52vh, 22rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
}
.visual-editor h2 { font-size: 1.55rem; margin: .8rem 0 .45rem; }
.visual-editor h3 { font-size: 1.25rem; margin: .7rem 0 .4rem; }
.visual-editor ol { margin: .65rem 0; }
.text-big { font-size: 1.25em; font-weight: 750; }
.text-small { font-size: .86em; color: var(--muted); }
.spoiler { background: color-mix(in srgb, var(--text), transparent 20%); color: transparent; border-radius: .35rem; padding: 0 .18rem; cursor: pointer; }
.spoiler.revealed, .spoiler:focus { background: color-mix(in srgb, var(--brand), transparent 82%); color: var(--text); }
.slash-menu { position: absolute; z-index: 10001; }

.message-thread { overflow-y: auto; overflow-x: hidden; }
.discord-line { grid-template-columns: 42px minmax(0,1fr); }
.discord-line > div { min-width: 0; overflow-wrap: anywhere; }
.discord-line.same-author { margin-top: .08rem; }
.discord-line.same-author > span { width: 42px; }
.inline-time { opacity: 0; font-size: .78rem; color: var(--muted); margin-right: .35rem; }
.discord-line.same-author:hover .inline-time { opacity: 1; }
.message-composer { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: .35rem; align-items: center; }
.message-composer .composer-icon { min-width: 2.35rem; padding: .25rem; background: var(--panel-soft); color: var(--text); border-color: var(--line); }
.message-composer input[name="body"] { min-width: 0; }
.sidebar-title .button { display: none; }

@media (max-width: 720px) {
  .viewer-nav { grid-template-columns: auto auto auto; overflow-x: auto; }
  .viewer-nav .button { padding-inline: .65rem; }
  .floating-editor-toolbar { max-width: calc(100vw - 1rem); }
  .floating-editor-toolbar.mobile-selection-toolbar { right: auto; }
  .feed-image img { max-width: 100%; }
}

.icon-link { min-width: 2.1rem; min-height: 2.1rem; border-radius: 999px; display: inline-grid; place-items: center; position: relative; }
.bell-icon { width: 1.08rem; height: 1.08rem; display: inline-block; border: 2px solid currentColor; border-radius: 999px 999px 8px 8px; position: relative; color: var(--brand2); }
.bell-icon::before { content: ''; position: absolute; width: .38rem; height: .22rem; left: 50%; top: -.34rem; transform: translateX(-50%); border: 2px solid currentColor; border-bottom: 0; border-radius: 999px 999px 0 0; }
.bell-icon::after { content: ''; position: absolute; width: .28rem; height: .28rem; left: 50%; bottom: -.42rem; transform: translateX(-50%); background: currentColor; border-radius: 50%; }
.nav-toggle { display: none; min-height: 2.2rem; padding: .25rem .6rem; background: var(--panel-soft); color: var(--text); border-color: var(--line); }
.nav-toggle:hover { color: var(--text); }
.relation-row .relation-person, .social-modal-list .relation-person { min-width: 0; }
.relation-name { display: inline-flex; align-items: center; gap: .28rem; flex-wrap: nowrap; max-width: 100%; }
.relation-name strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.relation-name .verified, .relation-name .staff-badge { flex: 0 0 auto; }
.modal-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.modal-head h1, .modal-head h2 { margin: 0; }
.gallery-title-line { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.gallery-title-line h1 { margin: 0; }
.media-viewer-full .viewer-side { display: flex; flex-direction: column; min-height: 0; }
.media-viewer-full .comments-panel { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.media-comments-scroll { flex: 1; overflow: auto; padding-right: .2rem; min-height: 8rem; max-height: 34vh; }
.media-comment-form { margin-top: auto; border-top: 1px solid var(--line); padding-top: .65rem; }
.media-comment-form label { margin: 0; }
.media-comment-form .visual-editor { min-height: 5.25rem; }
.viewer-actions { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: .5rem; margin-top: .65rem; }
.viewer-actions .prev { justify-self: start; }
.viewer-actions .back { justify-self: center; }
.viewer-actions .next { justify-self: end; }
.image-settings-card details { border: 1px solid var(--line); border-radius: 14px; padding: .65rem .8rem; background: var(--panel-soft); }
.image-settings-card summary { cursor: pointer; font-weight: 800; }
.image-settings-card .danger-zone { display: flex; justify-content: flex-end; margin-top: .75rem; }
.reaction-picker { position: relative; }
.reaction-picker > div, .slash-menu, .mention-box { z-index: 2147483000 !important; }
.reaction-tabs { display: flex; gap: .35rem; flex-wrap: wrap; margin: .4rem 0 .8rem; }
.reaction-tabs button.active { background: var(--brand); color: #fff; }
.visual-editor:empty::before, .visual-editor[data-empty="true"]::before { content: attr(data-placeholder); color: var(--muted); pointer-events: none; }
.visual-editor .editor-link { color: var(--brand2); text-decoration: underline; }
.visual-editor blockquote:empty::before { content: 'Citation…'; color: var(--muted); }
.visual-editor .spoiler { cursor: pointer; }
.floating-editor-toolbar button[data-cmd="insertUnorderedList"] { font-size: 0; }
.floating-editor-toolbar button[data-cmd="insertUnorderedList"]::before { content: '☷'; font-size: 1rem; }
.floating-editor-toolbar button[data-wrap-class="accent-text"] { font-size: 0; }
.floating-editor-toolbar button[data-wrap-class="accent-text"]::before { content: '◈'; font-size: 1rem; color: var(--brand); }
.chapter-table-manager { margin-top: .9rem; }
.chapter-table-manager table { width: 100%; border-collapse: collapse; }
.chapter-table-manager th, .chapter-table-manager td { border-bottom: 1px solid var(--line); padding: .45rem .35rem; text-align: left; }
.chapter-table-manager .chapter-actions { display: flex; gap: .25rem; justify-content: flex-end; }
.home-intro h1 { margin-bottom: .15rem; }
.feed-card { grid-template-columns: 1fr 220px; align-items: start; }
.feed-card .home-author-line { grid-column: 1 / -1; display: flex; align-items: center; gap: .55rem; }
.feed-card .home-copy { min-width: 0; overflow-wrap: anywhere; }
.feed-card .home-copy p { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.feed-card .feed-image { align-self: start; width: 220px; max-width: 100%; }
.feed-card .feed-image img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 14px; border: 1px solid var(--line); }
.story-series-line { color: var(--muted); font-size: .9rem; margin: .35rem 0; }
.post-body, .topic, .message, .rich-content { overflow-wrap: anywhere; word-break: break-word; }
.message-list-item .unread-badge { margin-left: auto; flex: 0 0 auto; min-width: 1.35rem; }
.quick-tab .unread-badge { margin-left: auto; flex: 0 0 auto; }
.quick-window-head .quick-window-unread {
  flex: 0 0 auto;
  margin-left: auto;
}
.quick-window-head .quick-window-unread[hidden],
.quick-unread[hidden] { display: none !important; }
.quick-window.minimized .quick-window-unread {
  position: absolute;
  top: -.25rem;
  right: -.25rem;
  margin: 0;
  z-index: 3;
}
.quick-dock-toggle { position: relative; }
.quick-dock-toggle .quick-unread {
  position: absolute;
  top: -.35rem;
  right: -.35rem;
}
.quick-dock { bottom: .8rem; right: .8rem; }
.quick-dock-toggle { min-width: 3rem; padding: .55rem .75rem; }
.quick-icon { font-size: 1.1rem; }
.quick-dock.open .quick-dock-toggle .quick-label { display: inline; }
.notification-link .nav-badge, .notifications-link .nav-badge { position: absolute; top: -.25rem; right: -.35rem; }
@media (max-width: 760px) {
  .topbar { align-items: center; }
  .nav-toggle { display: inline-flex; }
  .topbar:has(.public-nav) .nav-toggle { display: none; }
  .topbar nav { display: none; position: absolute; top: calc(100% + 1px); left: .75rem; right: .75rem; background: var(--panel); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); padding: .65rem; align-items: stretch; flex-direction: column; z-index: 200; }
  .topbar nav.public-nav { display: flex; position: static; width: auto; padding: 0; background: transparent; border: 0; box-shadow: none; flex-direction: row; }
  .topbar.nav-open nav { display: flex; }
  .topbar nav a, .topbar nav form, .logout-form button { width: 100%; justify-content: flex-start; }
  .topbar nav.public-nav a.public-register-link { width: auto; color: #fff; justify-content: center; }
  .feed-card { grid-template-columns: 1fr; }
  .feed-card .feed-image { width: 100%; }
  .viewer-actions { display: flex; flex-wrap: nowrap; overflow-x: auto; }
  .viewer-actions > * { flex: 0 0 auto; }
}
.quick-windows { position: fixed; right: 5.15rem; bottom: 0; left: auto; display: flex; flex-direction: row-reverse; align-items: flex-end; gap: .65rem; z-index: 31; pointer-events: none; }
.quick-window { width: 340px; max-width: calc(100vw - 6rem); max-height: 560px; display: flex; flex-direction: column; pointer-events: auto; background: var(--panel); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; }
.quick-window-head { flex: 0 0 auto; display: flex; align-items: center; gap: .55rem; padding: .55rem .65rem; border-bottom: 1px solid var(--line); cursor: pointer; }
.quick-window-head img, .quick-window-head .quick-room-avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.quick-window-head > div { min-width: 0; flex: 1; }
.quick-window-head strong, .quick-window-head small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.quick-window-head button { min-height: 1.8rem; min-width: 1.8rem; padding: 0; border-radius: 999px; }
.quick-window-body { flex: 1; overflow: auto; padding: .65rem; min-height: 220px; }
.quick-window-form { flex: 0 0 auto; padding: .55rem; border-top: 1px solid var(--line); }
.quick-window-form input, .quick-window-form textarea { min-height: 2.25rem; padding: .45rem .55rem; }
.quick-window-body form[data-quick-request-form] {
  display: grid;
  gap: .65rem;
  align-content: start;
}
.quick-window-body form[data-quick-request-form] label {
  display: grid;
  gap: .35rem;
  font-weight: 800;
}
.quick-window-body form[data-quick-request-form] textarea {
  min-height: 7.5rem;
  line-height: 1.45;
  resize: vertical;
}
.quick-window-body form[data-quick-request-form] button {
  justify-self: start;
}
@media (max-width: 760px) {
  .quick-window-body form[data-quick-request-form] textarea { min-height: 8.5rem; }
}

.quick-window.minimized { width: 54px; height: 54px; border-radius: 999px; overflow: visible; }
.quick-window.minimized .quick-window-body, .quick-window.minimized .quick-window-form, .quick-window.minimized .quick-window-head div, .quick-window.minimized .quick-min, .quick-window.minimized .quick-close { display: none; }
.quick-window.header-minimized { height: auto; }
.quick-window.header-minimized .quick-window-body, .quick-window.header-minimized .quick-window-form { display: none; }
.quick-menu { width: 100%; }
.quick-menu-head, .quick-tabs { display: grid; grid-template-columns: minmax(4.5rem, .85fr) minmax(7.4rem, 1.45fr) minmax(4.6rem, .9fr); align-items: center; gap: .35rem; padding: .55rem; border-bottom: 1px solid var(--line); }
.quick-tabs button { min-width: 0; position: relative; min-height: 2rem; padding: .25rem .35rem; background: var(--panel-soft); color: var(--text); border-color: var(--line); font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; justify-content: center; display: inline-flex; align-items: center; gap: .22rem; }
.quick-tabs button .unread-badge { position: static; transform: none; min-width: 1rem; height: 1rem; padding: 0 .24rem; line-height: 1; font-size: .66rem; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.quick-tabs:has(button:only-child) { grid-template-columns: 1fr; }
.quick-tabs button.active { background: var(--brand); color: #fff; }
.quick-tab { display: none; max-height: 320px; overflow: auto; padding: .4rem; }
.quick-tab.active { display: grid; gap: .25rem; }
.quick-tab button { width: 100%; display: flex; justify-content: flex-start; gap: .55rem; background: transparent; color: var(--text); border-color: transparent; text-align: left; }
.quick-tab button:hover { background: var(--bg); }
.quick-tab button img, .room-dot { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; display: inline-grid; place-items: center; background: var(--panel-soft); color: var(--brand2); }
.quick-tab button span:last-child { min-width: 0; }
.quick-tab button strong, .quick-tab button small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.quick-tab .message-list-item { min-width: 0; }
.quick-tab .message-list-avatar, .quick-tab .presence-wrap img { width: 38px; height: 38px; border-radius: 12px; object-fit: cover; }
.quick-tab .message-list-title, .quick-tab .presence-name-line { text-align: left; }
@media (max-width: 760px) {
  .quick-windows { left: .75rem; right: .75rem; bottom: 4.3rem; flex-direction: column-reverse; align-items: stretch; }
  .quick-window { width: 100%; max-width: 100%; }
}

.nav-notification-link { display: inline-flex; align-items: center; gap: .35rem; position: relative; }
.nav-notification-link .bell-icon { flex: 0 0 auto; }
.member-search { display: grid; grid-template-columns: minmax(180px,1fr) 150px 150px auto; gap: .55rem; align-items: end; margin: 1rem 0; }
.member-directory { display: grid; gap: .5rem; }
.relation-row { min-width: 0; }
.relation-person { flex: 1 1 auto; min-width: 0; }
.relation-name strong { display: inline-block; min-width: 0; max-width: min(18rem, 42vw); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.relation-name .verified, .relation-name .staff-badge { flex: 0 0 auto; align-self: center; }
.social-modal-list .staff-badge, .relation-list .staff-badge { width: auto; max-width: none; }

.modal-card { max-height: min(86vh, 760px); overflow: auto; }
.modal-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.modal-head h1,.modal-head h2 { margin:0; }

.visual-editor { font-weight: 400; position: relative; }
.visual-editor[data-empty="true"] { min-height: 8rem; }
.visual-editor[data-empty="true"]::before { content: attr(data-placeholder); color: var(--muted); position: absolute; left: .95rem; top: .8rem; right: .95rem; pointer-events: none; }
.visual-editor blockquote { white-space: pre-wrap; }
.visual-editor a { color: var(--brand2); text-decoration: underline; }
.visual-editor .text-big { font-size: 1.32rem; font-weight: 850; }
.visual-editor .text-small { font-size: .86rem; color: var(--muted); }
.floating-editor-toolbar { gap: .08rem; }
.floating-editor-toolbar button { flex: 0 0 auto; }
.floating-editor-toolbar button[disabled] { opacity: .35; }

.viewer-actions { grid-template-columns: 1fr auto 1fr; }
.viewer-actions .prev { justify-self:start; min-width:0; }
.viewer-actions .back { justify-self:center; }
.viewer-actions .next { justify-self:end; }
.viewer-side, .viewer-meta { min-height: 0; }
.viewer-side .media-comments-box { display:flex; flex-direction:column; min-height: 300px; max-height: 48vh; }
.media-comments-scroll { flex:1; min-height: 0; overflow:auto; }
.media-settings-actions { display:grid; grid-template-columns:auto auto 1fr auto; align-items:center; }
.media-settings-actions .danger { justify-self:end; }
.hidden-danger-zone { display:none; }
.form-feedback { color: var(--ok); margin:.35rem 0 0; }

.chapter-table-manager { width:100%; margin: .9rem 0; padding:.8rem; border:1px solid var(--line); border-radius:16px; background:var(--panel-soft); }
.chapter-manager-head { display:flex; justify-content:space-between; align-items:baseline; gap:.75rem; flex-wrap:wrap; margin-bottom:.5rem; }
.chapter-table-manager table { width:100%; border-collapse:separate; border-spacing:0 .35rem; }
.chapter-table-manager tr { background:var(--panel); }
.chapter-table-manager td { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:.55rem; }
.chapter-table-manager td:first-child { border-left:1px solid var(--line); border-radius:12px 0 0 12px; }
.chapter-table-manager td:last-child { border-right:1px solid var(--line); border-radius:0 12px 12px 0; }
.chapter-table-manager tr.current { outline:2px solid color-mix(in srgb,var(--brand),transparent 55%); outline-offset:2px; }
.chapter-actions .compact:disabled { opacity:.25; }

.home-intro p { margin-bottom:0; }
.feed-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(160px,220px); gap:.8rem; }
.feed-card .home-author-line { grid-column:1 / -1; }
.feed-card .home-copy h2 { margin:.15rem 0 .35rem; }
.feed-card .home-copy h2.media-feed-title { display:none; }
.feed-meta-line { display:flex; flex-wrap:wrap; gap:.25rem .45rem; align-items:baseline; }
.feed-image img { object-fit:cover; }
.rich-content, .home-copy p, .topic p { overflow-wrap:anywhere; word-break:break-word; }

.messages-shell { height: calc(100vh - 10rem); min-height: 620px; overflow:hidden; }
.messages-sidebar, .online-sidebar { overflow:auto; }
.message-conversation { min-height:0; overflow:hidden; }
.message-thread { min-height:0; overflow-y:auto; overflow-x:hidden; }
.message-composer { padding:.5rem; border-top:1px solid var(--line); }
.message-composer input[name="body"] { min-height:2.25rem; }
.message-composer button:last-child { min-width:2.6rem; padding:.35rem .55rem; }
.composer-inline { display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; gap:.3rem; align-items:center; }
.composer-inline .composer-icon { min-width:2rem; min-height:2rem; padding:.2rem; }
.discord-line { overflow-wrap:anywhere; word-break:break-word; }
@media (max-width: 760px) {
  .nav-notification-link { min-height:2.35rem; }
  .member-search { grid-template-columns:1fr; }
  .modal-card { width: min(94vw, 620px); }
  .relation-row { align-items:flex-start; }
  .media-settings-actions { grid-template-columns:1fr; }
  .media-settings-actions .danger { justify-self:stretch; }
  .viewer-actions { display:grid; grid-template-columns:1fr auto 1fr; }
  .viewer-actions .button { white-space:nowrap; padding-inline:.55rem; }
  .feed-card { grid-template-columns:1fr; }
  .messages-shell { height:auto; min-height:0; overflow:visible; }
  .message-conversation { min-height:70vh; }
  .quick-dock-panel { position:fixed; right:.75rem; left:.75rem; bottom:4.3rem; width:auto; }
}

.nav-notification-link { gap: .25rem; }
.nav-notification-link .bell-icon { width: 1rem; height: 1rem; }
@media (max-width: 760px) {
  .topbar { align-items: center; }
  .logout-form button { justify-content: center; }
  .profile-actions.owner { justify-content: flex-end; }
}
.relation-row .relation-person { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: .65rem; align-items: center; }
.viewer-actions { grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); width: 100%; }
.viewer-actions .prev { justify-self: start; max-width: 10.5rem; overflow: hidden; text-overflow: ellipsis; }
.viewer-actions .back { justify-self: center; }
.viewer-actions .next { justify-self: end; }
.media-viewer-full .viewer-meta.card { display: flex; flex-direction: column; }
.viewer-side { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.media-comments-box { flex: 1; min-height: 14rem; display: flex; flex-direction: column; }
.media-comments-scroll { flex: 1 1 auto; min-height: 0; max-height: none; overflow-y: auto; }
.media-comment-form { border-top: 1px solid var(--line); padding-top: .6rem; margin-top: .6rem; }
.media-comment-form .visual-editor, .media-comment-form textarea { min-height: 2.65rem; max-height: 5.5rem; }
.reaction-members-popover { position: fixed; z-index: 2147483640; display: grid; grid-template-columns: repeat(5, 2.1rem); gap: .18rem; padding: .45rem; background: var(--panel); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); }
.reaction-members-popover button { min-width: 2rem; min-height: 2rem; padding: .1rem; background: transparent; color: var(--text); border-color: transparent; font-size: 1.1rem; }
.reaction-members-popover button:hover { background: var(--bg); }
.visual-editor { font-weight: 400; }
.visual-editor h2, .visual-editor h3, .visual-editor strong, .visual-editor b { font-weight: 850; }
.visual-editor[data-empty="true"]::before { display: block; }
.message-conversation { display: flex; flex-direction: column; }
.message-thread { flex: 1 1 auto; }
.message-composer { flex: 0 0 auto; }
.message-composer input[name="body"] { min-width: 0; }
.quick-window { max-height: min(480px, calc(100vh - 6rem)); }

.visual-editor { font-weight: 400; }
.visual-editor[data-empty="true"] { position: relative; }
.visual-editor[data-empty="true"]::before { content: attr(data-placeholder); display: block; color: var(--muted); position: absolute; left: .95rem; top: .9rem; right: .95rem; pointer-events: none; font-weight: 400; }
.visual-editor .spoiler { background: color-mix(in srgb, var(--text), transparent 76%); color: transparent; border-radius: 5px; padding: 0 .15em; }
.visual-editor .spoiler.revealed, .rich-content .spoiler.revealed { color: inherit; background: color-mix(in srgb, var(--brand), transparent 86%); }
.media-comment-form .visual-editor { min-height: 2.75rem; }
@media (max-width: 760px) {
}

.nav-notification-link { padding-inline: .15rem; }
@media (max-width: 760px) {
  .profile-actions.owner { width: 100%; display: flex; justify-content: flex-end; }
}
.visual-editor-shell { position: relative; }
.editor-toolbar-scroll { display:flex; flex-wrap:nowrap; white-space:nowrap; max-width: calc(100vw - 1rem); overflow-x:auto; scrollbar-width: none; }
.editor-toolbar-scroll button { min-width: 2rem; padding: .25rem .38rem; }
.editor-command-menu, .editor-mention-menu, .editor-emoji-picker { position: absolute; z-index: 2147483647; background: var(--panel); border:1px solid var(--line); box-shadow: var(--shadow); border-radius: 16px; }
.editor-command-menu { min-width: 220px; padding: .35rem; display:flex; flex-direction:column; gap:.15rem; }
.editor-command-menu button { width:100%; justify-content:flex-start; background:transparent; border-color:transparent; color:var(--text); }
.editor-command-menu button:hover { background:var(--bg); }
.editor-mention-menu { min-width: 230px; padding: .35rem; }
.editor-mention-menu button { width:100%; display:flex; gap:.45rem; align-items:center; justify-content:flex-start; background:transparent; border-color:transparent; color:var(--text); }
.editor-mention-menu img { width:26px; height:26px; border-radius:8px; object-fit:cover; }
.editor-emoji-picker { width:min(470px, calc(100vw - 1rem)); height:min(540px, 80vh); display:grid; grid-template-columns:46px minmax(0,1fr); overflow:hidden; padding:0; }
.editor-emoji-picker aside { display:flex; flex-direction:column; gap:.1rem; padding:.35rem; border-right:1px solid var(--line); background:var(--panel-soft); overflow-y:auto; }
.editor-emoji-picker aside button { min-width:2rem; min-height:2rem; padding:.1rem; justify-content:center; background:transparent; border-color:transparent; }
.editor-emoji-picker main { overflow-y:auto; overflow-x:hidden; padding:.45rem; }
.editor-emoji-picker .emoji-search { position:sticky; top:0; z-index:2; width:100%; margin:0 0 .45rem; background:var(--panel); }
.editor-emoji-picker h4 { margin:.6rem 0 .25rem; padding-top:.45rem; border-top:1px solid var(--line); color:var(--muted); font-size:.82rem; }
.editor-emoji-picker section:first-of-type h4 { border-top:0; padding-top:0; }
.editor-emoji-picker section > div { display:grid; grid-template-columns: repeat(8, minmax(0,1fr)); gap:.12rem; }
.editor-emoji-picker [data-emoji-option] { min-width:2.05rem; min-height:2.05rem; padding:.1rem; justify-content:center; font-size:1.15rem; background:transparent; border-color:transparent; }
.editor-emoji-picker [data-emoji-option]:hover { background:var(--bg); }
.rich-content h2, .visual-editor h2 { font-size:1.55rem; line-height:1.2; margin:.8rem 0 .35rem; }
.rich-content .text-big, .visual-editor .text-big { font-size:1.22rem; font-weight:750; }
.rich-content .text-small, .visual-editor .text-small { font-size:.88rem; color:var(--muted); }
.rich-content blockquote, .visual-editor blockquote { border-left:4px solid var(--brand); margin:.7rem 0; padding:.35rem .75rem; background:var(--panel-soft); border-radius:0 10px 10px 0; }
.rich-content .spoiler, .visual-editor .spoiler { background: color-mix(in srgb, var(--text), transparent 76%); color: transparent; border-radius: 5px; padding: 0 .15em; cursor: pointer; }
.rich-content .spoiler.revealed, .visual-editor .spoiler.revealed { color: inherit; background: color-mix(in srgb, var(--brand), transparent 86%); }
.reaction-picker > div, .reaction-members-popover { z-index:2147483647 !important; }
.quick-dock { bottom: .75rem; right: .75rem; }
.quick-window.minimized { border-radius:999px; overflow:hidden; }
@media (max-width: 760px) {
  .editor-emoji-picker { grid-template-columns:40px minmax(0,1fr); height:min(460px, 78vh); }
  .editor-emoji-picker section > div { grid-template-columns: repeat(6, minmax(0,1fr)); }
  .viewer-actions .button { font-size:.88rem; padding-inline:.5rem; }
}

.nav-notification-link { min-width: auto; }
@media (max-width: 760px) {
}
.visual-editor[data-empty="true"]::before { position: static !important; display: block !important; padding: .05rem 0; }
.floating-editor-toolbar:not(.active) { display: none !important; }
.floating-editor-toolbar.active { display: inline-flex !important; }
.presence-wrap { position: relative; display: inline-block; flex: 0 0 auto; }
.presence-wrap img { display:block; }
.presence-dot { position:absolute; right:-2px; bottom:-2px; width:.72rem; height:.72rem; border-radius:50%; border:2px solid var(--panel); background:#ddd; }
.presence-dot.inline { position: static; display: inline-block; width: .72rem; height: .72rem; border-color: transparent; flex: 0 0 auto; }
.presence-dot.online { background:#25a36f; }
.presence-dot.idle { background:#e8a23a; }
.presence-dot.dnd { background:#d64545; }
.presence-dot.offline { background:#f4f4f4; }
.online-mini { display:flex; gap:.55rem; align-items:center; text-decoration:none; color:var(--text); margin:.45rem 0; }
.presence-control { position: relative; min-width: 0; width: 100%; }
.presence-control :hover { color: var(--brand); }
.presence-toggle { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .45rem; padding: .5rem .6rem; background: var(--panel-soft); border: 1px solid var(--line); color: var(--text); text-align: left; }
.presence-toggle .presence-wrap img { width: 38px; height: 38px; border-radius: 12px; object-fit: cover; display: block; }
.presence-toggle span:nth-child(2) { display: flex; flex-direction: row; flex-wrap: wrap; min-width: 0; width: 100%; line-height: 1.15; }
.presence-toggle small { color: var(--muted); }
.presence-menu { position: fixed; z-index: 10000; padding: .25rem; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); box-shadow: var(--shadow); }
.presence-menu form { margin: 0; }
.presence-menu button { width: 100%; justify-content: flex-start; background: transparent; color: var(--text); border: 0; padding: .45rem .55rem; }
.presence-menu button:hover, .presence-menu button:focus-visible { background: var(--panel-soft); }
.presence-control.compact .presence-toggle { min-height: 2.35rem; }
.presence-self-row { grid-template-columns: minmax(0, 1fr); }
.presence-self-row .presence-control { grid-column: 1 / -1; }
.presence-name-line { display: flex; align-items: center; gap: .25rem; flex-wrap: wrap; min-width: 0; }
.presence-name { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.presence-identity-badges, .presence-status-badges { display: inline-flex; align-items: center; gap: .2rem; flex: 0 0 auto; }
.notification-row.compact { display:flex; align-items:center; gap:.7rem; padding:.55rem 0; border-bottom:1px solid var(--line); }
.notification-main { display:flex; align-items:baseline; gap:.5rem; min-width:0; flex:1; }
.notification-main > a, .notification-main > span { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
.notification-main > .muted.small { flex: 0 0 auto; white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.feed-card .home-copy h2:empty { display:none; }
.feed-card .home-copy p { -webkit-line-clamp: 3; }
.media-comment-form .visual-editor { min-height: 2.35rem !important; max-height: 4.5rem !important; }
.discord-line.same-author img + div, .discord-line.same-author > span + div { margin-top:-.25rem; }
.inline-time { color:var(--muted); font-size:.78rem; margin-right:.35rem; }
@media (max-width:760px){
  .notification-row.compact, .notification-main { align-items:flex-start; }
  .notification-main { flex-direction:column; gap:.15rem; }
  .forum-topic-participant-line {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .topic-last-summary {
    margin-left: 0;
    text-align: left;
    justify-content: flex-start;
  }
  .topic-last-summary > span:first-child {
    flex-basis: 100%;
  }
}

.chat-extra-input { margin-top: 6px; width: 100%; font-size: .9rem; }
.composer-inline .chat-extra-input, .message-composer .chat-extra-input { flex-basis: 100%; }

.chat-attach-menu {
  position: fixed;
  z-index: 9999;
  display: grid;
  gap: .35rem;
  padding: .45rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--card);
  box-shadow: 0 18px 40px rgba(49, 24, 44, .18);
}
.chat-attach-menu button {
  width: 100%;
  justify-content: flex-start;
  text-align: left;
  border-radius: 10px;
}
.quick-menu { width: min(360px, calc(100vw - 86px)); min-height: 300px; max-height: min(560px, calc(100vh - 110px)); display: flex; flex-direction: column; }
.quick-tab { overflow-y: auto; align-content: start; }
.quick-tab.active { display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch; }
.quick-tab [data-quick-open] { flex: 0 0 auto; }
.quick-window { z-index: 90; }
.quick-window-body { overflow-y: auto; overflow-x: hidden; }
.discord-line, .chat-line { overflow-wrap: anywhere; word-break: break-word; }
.member-directory .relation-item:first-child { outline: 2px solid color-mix(in srgb, var(--accent) 35%, transparent); }
.topbar nav a { display: inline-flex; align-items: center; gap: .32rem; white-space: nowrap; }
.nav-icon { display: inline-grid; place-items: center; width: 1.05rem; height: 1.05rem; font-size: .92rem; opacity: .78; flex: 0 0 auto; }
.nav-notification-link .bell-icon { width: .82rem; height: .82rem; border: 2px solid currentColor; border-radius: 50% 50% 45% 45%; position: relative; opacity: .8; }
.nav-notification-link .bell-icon::after { content: ''; position: absolute; width: .32rem; height: .16rem; border-radius: 99px; background: currentColor; left: 50%; transform: translateX(-50%); bottom: -.28rem; }
@media (max-width: 860px) {
  .topbar nav a { min-width: 0; }
  .topbar nav a span:last-child { overflow: hidden; text-overflow: ellipsis; }
}
.relation-person > span { display: flex; flex-direction: column; gap: .18rem; }
.relation-name { display: inline-flex; align-items: center; gap: .28rem; white-space: nowrap; line-height: 1.15; }
.relation-person small { display: block; margin-top: .14rem; line-height: 1.25; }
.viewer-side, .media-viewer-side { display: flex; flex-direction: column; min-height: min(72vh, 720px); }
.media-comments, [data-media-comments] { flex: 1 1 auto; overflow-y: auto; min-height: 9rem; }
.media-comment-form { margin-top: auto; padding-top: .55rem; border-top: 1px solid var(--line); }
.media-comment-form .visual-editor, .media-comment-form textarea, .media-comment-form input[name="body"] { min-height: 2.4rem; max-height: 5.2rem; }
.media-settings-actions { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.media-settings-actions .danger { margin-left: auto; }
.quick-menu { width: min(360px, calc(100vw - 5.5rem)); min-height: 320px; max-height: min(560px, calc(100vh - 6rem)); }
.quick-tab.active { display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch; overflow-y: auto; }
.quick-tab [data-quick-open] { flex: 0 0 auto; }
.composer-inline, .message-composer { align-items: center; }
.composer-inline input[type="file"], .message-composer input[type="file"] { display: none; }
.chat-line, .discord-line { overflow-wrap: anywhere; word-break: break-word; }
.chat-gif { max-width: min(18rem, 100%); max-height: 18rem; object-fit: contain; border-radius: 12px; margin-top: .3rem; }
.chapter-table-manager table { width: 100%; }
.chapter-table-manager tr.current { background: color-mix(in srgb, var(--brand), transparent 91%); }
.chapter-table-manager td:first-child {color: var(--muted); font-weight: 700; }
.chapter-table-manager td:nth-child(2) { width: auto; }
.topbar nav {
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  gap: .42rem;
}
.topbar nav::-webkit-scrollbar { display: none; }
.topbar nav a { white-space: nowrap; }
.nav-icon { display: none; }
.nav-notification-link .bell-icon { display: none; }
@media (min-width: 761px) and (max-width: 1040px) {
  .topbar { gap: .65rem; }
  .brand { font-size: .98rem; }
  .topbar nav { font-size: .91rem; }
  .topbar a { padding-inline: .08rem; }
  .logout-form button { padding-inline: .58rem; }
}
.media-viewer-full .viewer-meta.card {
  max-height: 100%;
}
.viewer-side {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.media-comments-box {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.media-comments-scroll {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
}
.media-comment-form {
  margin-top: auto;
  flex: 0 0 auto;
  background: var(--panel);
}
.quick-window .composer-inline .composer-send,
.message-composer .composer-send {
  min-width: 2.35rem;
  width: 2.35rem;
  padding-inline: 0;
  display: inline-grid;
  place-items: center;
}
.discord-line p {
  display: flex;
  align-items: baseline;
  gap: .45rem;
  margin: 0 0 .1rem;
}
.discord-line p time { margin-left: 0; font-size: .76rem; color: var(--muted); }
.discord-line.same-author .inline-time { display: inline-block; width: 3.6rem; text-align: right; opacity: .65; }
@media (max-width:760px) {
  .media-viewer-full .viewer-meta.card { height: auto; max-height: none; overflow: visible; }
}

.media-viewer-full .viewer-side,
.viewer-side.media-viewer-side,
.viewer-side {
  min-height: min(72vh, 720px);
}
.viewer-side .media-comments-box,
.media-comments-box {
  max-height: none;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.media-comments-list,
[data-media-comments] {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
.viewer-side form[data-enhanced-media-comment] {
  margin-top: auto;
  flex: 0 0 auto;
}
.quick-window .composer-inline {
  display: flex;
  align-items: center;
  gap: .35rem;
}
.quick-window .composer-inline input[name="body"],
.message-composer input[name="body"] { flex: 1 1 auto; min-width: 0; }
.quick-window .composer-inline .composer-send,
.message-composer .composer-send,
.message-composer button:last-child {
  min-height: 2.2rem;
  height: 2.2rem;
  width: 2.35rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.chat-line.discord-line {
  grid-template-columns: 44px minmax(0, 1fr);
  gap: .45rem .65rem;
}
.chat-side {
  display: grid;
  justify-items: center;
  align-content: start;
  gap: .2rem;
  color: var(--muted);
  font-size: .72rem;
  min-width: 0;
}
.chat-side img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; }
.chat-side.same { padding-top: .15rem; }
.discord-line > div { min-width: 0; overflow-wrap: anywhere; }
.discord-line p { margin: 0 0 .15rem; }
.discord-line time.inline-time,
.chat-side time { color: var(--muted); font-size: .72rem; white-space: nowrap; }
@media (max-width: 760px) {
  .viewer-side, .media-viewer-side { min-height: auto; }
  .media-comments-box { min-height: 12rem; }
}

.media-comment-compact {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: .5rem;
  padding: .45rem 0;
  border-bottom: 1px solid var(--line-soft, rgba(127,127,127,.16));
}
.media-comment-avatar img {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  object-fit: cover;
}
.media-comment-body { min-width: 0; overflow-wrap: anywhere; }
.media-comment-body p { margin: 0 0 .12rem; font-size: .92rem; }
.media-comment-body .rich-text, .media-comment-body > div { font-size: .94rem; }
.discord-line {
  grid-template-columns: 42px minmax(0, 1fr);
}
.chat-side time {
  opacity: 0;
  transition: opacity .14s ease;
  font-size: .68rem;
  line-height: 1;
}
.discord-line:hover .chat-side time,
.discord-line:focus-within .chat-side time {
  opacity: .78;
}
.message-head-time {
  margin-left: .45rem;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 400;
}
.discord-line.same-author .chat-side { padding-top: .1rem; }
@media (max-width: 760px) {
  .media-viewer-full .viewer-meta.card { height: auto; }
  .quick-window:not(.minimized):not(.header-minimized) { width: min(340px, calc(100vw - 1.5rem)); }
}

.media-viewer-full .viewer-meta.card { display: flex; flex-direction: column; }
.media-viewer-full .viewer-side { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.media-comments-box { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: .55rem; }
.media-comments-scroll, .media-comments, [data-media-comments] { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.compact-media-comment-form { flex: 0 0 auto; margin-top: auto; display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: .45rem; align-items: center; padding-top: .55rem; border-top: 1px solid var(--line); }
.compact-media-comment-form input[name="body"] { min-height: 2.35rem; height: 2.35rem; padding: .45rem .65rem; }
.compact-media-comment-form .composer-icon, .compact-media-comment-form .composer-send { height: 2.35rem; min-height: 2.35rem; width: 2.35rem; min-width: 2.35rem; padding: 0; display: inline-grid; place-items: center; border-radius: 999px; }
.media-comment-compact { grid-template-columns: 30px minmax(0,1fr); gap: .42rem; padding: .32rem 0; }
.media-comment-avatar img { width: 30px; height: 30px; }
.media-comment-body p { margin-bottom: .05rem; line-height: 1.2; }
.media-comment-body > div { line-height: 1.35; }
.media-settings-actions { justify-content: space-between; align-items: center; }
.media-settings-actions .form-feedback { color: var(--muted); font-size: .9rem; }
.media-settings-card [data-auto-media-settings] .danger { margin-left: auto; }
.composer-icon, .message-composer .composer-icon, .quick-window .composer-inline .composer-icon { color: var(--brand2); border-color: color-mix(in srgb, var(--brand2) 45%, var(--line)); background: color-mix(in srgb, var(--brand2) 9%, transparent); }
.composer-icon:hover, .message-composer .composer-icon:hover, .quick-window .composer-inline .composer-icon:hover { background: color-mix(in srgb, var(--brand2) 16%, transparent); }
.message-composer .composer-send, .quick-window .composer-inline .composer-send { border-radius: 999px; }
.discord-line { grid-template-columns: 42px minmax(0, 1fr); }
.chat-side time { opacity: 0; }
.discord-line:hover .chat-side time, .discord-line:focus-within .chat-side time { opacity: .8; }
.message-head-time { float: right; margin-left: .5rem; }

.media-viewer-full .viewer-side,
.viewer-side.media-viewer-side,
.viewer-side {
  display: flex;
  flex-direction: column;
  min-height: min(76vh, 760px);
}
.media-comments-box,
.viewer-side .media-comments-box {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.media-comments-scroll,
.media-comments,
[data-media-comments] {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.compact-media-comment-form,
.media-comment-form {
  flex: 0 0 auto;
  margin-top: auto;
}
.media-settings-card input:not([type="hidden"]),
.media-settings-card select,
.media-settings-card textarea,
.media-settings-card button {
  opacity: 1;
  pointer-events: auto;
}
.media-settings-card .soft-disabled { opacity: .55; }
.emoji-picker-panel {
  position: fixed;
  z-index: 2147483647;
  display: grid;
  grid-template-columns: 48px minmax(0,1fr);
  overflow: hidden;
  background: var(--panel);
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow);
}
.emoji-picker-panel .emoji-cats {
  display: flex;
  flex-direction: column;
  gap: .12rem;
  padding: .35rem;
  overflow-y: auto;
  overflow-x: hidden;
  border-right: 1px solid var(--line);
  background: var(--panel-soft);
}
.emoji-picker-panel .emoji-cats button {
  width: 2.1rem;
  min-height: 2.1rem;
  padding: 0;
  justify-content: center;
  background: transparent;
  border-color: transparent;
  color: var(--text);
}
.emoji-picker-panel .emoji-main {
  min-width: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: .55rem;
  scroll-behavior: smooth;
}
.emoji-picker-panel .emoji-search {
  position: sticky;
  top: 0;
  z-index: 2;
  width: 100%;
  margin: 0 0 .55rem;
  background: var(--panel);
}
.emoji-picker-panel h4 {
  margin: .7rem 0 .28rem;
  padding-top: .5rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: .82rem;
}
.emoji-picker-panel section:first-of-type h4 { border-top: 0; margin-top: 0; padding-top: 0; }
.emoji-picker-panel .emoji-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0,1fr));
  gap: .12rem;
  width: 100%;
}
.emoji-picker-panel [data-emoji-option] {
  min-width: 0;
  min-height: 2.1rem;
  padding: .1rem;
  justify-content: center;
  font-size: 1.2rem;
  background: transparent;
  border-color: transparent;
  color: var(--text);
}
.emoji-picker-panel .emoji-filtered-out { display: none !important; }
.emoji-picker-panel [data-emoji-option]:hover { background: var(--bg); }
.quick-window:not(.minimized) {
  position: static;
  width: min(340px, calc(100vw - 6.5rem));
}
.quick-window.minimized {
  width: 54px;
  height: 54px;
  border-radius: 999px;
  overflow: hidden;
}
.quick-window .composer-inline,
.message-composer {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto auto;
  align-items: center;
  gap: .35rem;
}
.quick-window .composer-inline .composer-icon,
.quick-window .composer-inline .composer-send,
.message-composer .composer-icon,
.message-composer .composer-send {
  width: 2.25rem;
  height: 2.25rem;
  min-width: 2.25rem;
  min-height: 2.25rem;
  padding: 0;
  display: inline-grid;
  place-items: center;
}
.discord-line { grid-template-columns: 42px minmax(0,1fr); }
.discord-line > div { min-width: 0; }
.chat-side {
  display: grid;
  justify-items: center;
  align-content: start;
  gap: .15rem;
}
.chat-side time {
  font-size: .68rem;
  line-height: 1;
  opacity: 0;
  white-space: nowrap;
}
.discord-line:hover .chat-side time,
.discord-line:focus-within .chat-side time { opacity: .75; }
.message-head-time { font-size: .78rem; color: var(--muted); }
@media (max-width: 720px) {
  .media-viewer-full .viewer-meta.card,
  .media-viewer-full .viewer-side,
  .viewer-side.media-viewer-side,
  .viewer-side { min-height: auto; }
  .quick-windows { right: .75rem; left: .75rem; bottom: 4.35rem; flex-direction: column-reverse; align-items: stretch; }
  .quick-window:not(.minimized) { width: 100%; }
  .emoji-picker-panel { left: 8px; right: 8px; width: auto; grid-template-columns: 42px minmax(0,1fr); }
  .emoji-picker-panel .emoji-grid { grid-template-columns: repeat(6, minmax(0,1fr)); }
}

.mobile-nav-safe-area { display: contents; }
@media (max-width: 760px) {
  body.nav-menu-open { overflow: hidden; }
  .topbar { padding-inline: .8rem; }
  .brand { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .nav-toggle { border-radius: 999px; min-width: 2.7rem; min-height: 2.7rem; font-size: 1.18rem; }
  .topbar nav {
    top: calc(100% + .35rem);
    left: .65rem;
    right: .65rem;
    max-height: min(72vh, 34rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: .55rem;
  }
  .topbar.nav-open nav { display: grid; gap: .35rem; }
  .topbar nav a,
  .topbar nav form,
  .logout-form button {
    min-height: 2.75rem;
    border-radius: 12px;
  }
  .topbar nav .logout-form { width: auto; }
  .topbar nav .icon-logout {
    width: 2.75rem;
    min-width: 2.75rem;
    padding: .6rem;
    border-radius: 12px;
  }
  .topbar nav a:focus-visible,
  .logout-form button:focus-visible,
  .nav-toggle:focus-visible { outline: 3px solid color-mix(in srgb, var(--brand), transparent 55%); outline-offset: 2px; }
}

@media (max-width: 540px) {
  .quick-dock {
    left: .75rem;
    right: .75rem;
    bottom: calc(.75rem + env(safe-area-inset-bottom, 0px));
    pointer-events: none;
    display: flex;
    justify-content: flex-end;
  }
  .quick-dock > * { pointer-events: auto; }
  .quick-dock.open .quick-dock-panel {
    position: fixed;
    left: .75rem;
    right: .75rem;
    bottom: calc(4.4rem + env(safe-area-inset-bottom, 0px));
    width: auto;
    max-height: min(70vh, 32rem);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }
  .quick-windows {
    left: .75rem;
    right: .75rem;
    bottom: calc(4.4rem + env(safe-area-inset-bottom, 0px));
  }
  .quick-window:not(.minimized) {
    width: 100%;
    max-height: min(72vh, 34rem);
  }
}

.user-mention {
  border-radius: 999px;
  padding: 0 .18rem;
  font-weight: 700;
  text-decoration: none;
}
.mention-menu {
  min-width: 220px;
  max-width: min(320px, calc(100vw - 24px));
  padding: .35rem;
}
.mention-menu button {
  align-items: center;
  display: flex;
  gap: .55rem;
  justify-content: flex-start;
  width: 100%;
}
.mention-menu button.active,
.mention-menu button:focus-visible {
  background: color-mix(in srgb, var(--brand), transparent 88%);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand), transparent 55%);
  outline: 0;
}
.mention-menu img {
  border-radius: 999px;
  height: 28px;
  object-fit: cover;
  width: 28px;
}
.mention-menu small {
  display: block;
  font-size: .75rem;
  opacity: .75;
}

.tiptap-editor-shell { position: relative; }
.tiptap-inline-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: .12rem;
  align-items: center;
  padding: .25rem .3rem;
  margin-bottom: .25rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 92%, var(--bg));
}
.tiptap-inline-toolbar button {
  min-height: 2rem;
  min-width: 2rem;
  padding: .2rem .4rem;
  border-radius: 9px;
  background: transparent;
  color: var(--text);
  border-color: transparent;
}
.tiptap-inline-toolbar button:hover,
.tiptap-inline-toolbar button:focus-visible {
  background: var(--bg);
  color: var(--brand2);
}
.compact-composer-shell .tiptap-inline-toolbar {
  padding: .18rem;
  gap: .06rem;
  margin-bottom: .18rem;
  overflow-x: auto;
  flex-wrap: nowrap;
}
.compact-composer-shell .tiptap-inline-toolbar button {
  min-height: 1.8rem;
  min-width: 1.8rem;
  padding: .12rem .25rem;
}


/* Tiptap default editor polish: clean surface, real multiline editing, selection-only toolbar. */
.tiptap-editor-shell.visual-editor-shell {
  margin: .35rem 0 .55rem;
}
.tiptap-editor.visual-editor {
  background: var(--panel-soft);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: none;
  outline: 0;
  padding: 0;
}
.tiptap-editor.visual-editor:focus,
.tiptap-editor.visual-editor:focus-within {
  border-color: var(--brand2);
  box-shadow: none;
  outline: 0;
}
.tiptap-editor .ProseMirror {
  position: relative;
  min-height: 8rem;
  padding: .95rem;
  line-height: 1.65;
  font-weight: 400;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  outline: 0;
}
.story-editor .tiptap-editor .ProseMirror {
  min-height: 28rem;
}
.compact-composer-shell .tiptap-editor .ProseMirror {
  min-height: 2.75rem;
  max-height: 8rem;
  overflow-y: auto;
  padding: .7rem .85rem;
}
.tiptap-editor .ProseMirror p {
  margin: .4rem 0;
}
.tiptap-editor .ProseMirror p:first-child {
  margin-top: 0;
}
.tiptap-editor .ProseMirror p:last-child {
  margin-bottom: 0;
}
.tiptap-editor .ProseMirror.is-editor-empty::before {
  color: var(--muted);
  content: attr(data-placeholder);
  position: absolute;
  left: .95rem;
  right: .95rem;
  top: .95rem;
  height: 1.65em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
}
.tiptap-editor .ProseMirror.is-editor-empty:focus::before {
  opacity: .72;
}
.compact-composer-shell .tiptap-editor .ProseMirror.is-editor-empty::before {
  left: .85rem;
  right: .85rem;
  top: .7rem;
}
.floating-editor-toolbar[data-editor-adapter-toolbar="tiptap"].tiptap-caret-toolbar {
  display: none !important;
}
.tiptap-inline-toolbar {
  display: none !important;
}
.rich-content .rich-empty-line { min-height: 1.2em; margin: .35rem 0; }


/* Forum reply actions */
.message { position: relative; }
.quote-button { position: absolute; top: .75rem; right: .75rem; margin-top: 0 !important; float: none !important; }
.message .post-body { padding-right: 5.5rem; }
.post-edit-note { color: var(--muted); font-size: .86rem; margin-top: .35rem; }
.post-actions { display: flex; justify-content: flex-end; gap: .45rem; margin-top: .5rem; }


.message { position: relative; }
.message-actions { display: flex; gap: .4rem; justify-content: flex-end; align-items: center; flex-wrap: wrap; margin-top: .75rem; }
.message > .message-actions:first-child, .message-actions.top-right { position: absolute; top: .75rem; right: .75rem; margin-top: 0; }
.post-edit-note { margin: .35rem 0; color: var(--muted); font-size: .9rem; }
.edit-history-modal { width: min(920px, calc(100vw - 2rem)); }
.edit-history-list { display: grid; gap: .9rem; }
.edit-history-entry { border-top: 1px solid var(--line); padding-top: .8rem; }
.edit-history-entry:first-child { border-top: 0; padding-top: 0; }
.edit-history-entry h2 { font-size: 1rem; margin: .65rem 0 .25rem; }
.edit-diff {
  background: var(--panel-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  line-height: 1.65;
  max-height: 18rem;
  overflow-y: auto;
  overflow-x: hidden;
  padding: .75rem;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.edit-diff ins,
.edit-diff del {
  overflow-wrap: anywhere;
  word-break: break-word;
  border-radius: 4px;
  padding: .03rem .08rem;
  text-decoration: none;
}
.edit-diff ins { background: color-mix(in srgb, var(--ok) 24%, transparent); }
.edit-diff del { background: color-mix(in srgb, var(--danger) 18%, transparent); }
.attached-image-fields { margin: 1rem 0; }
.attached-image-fields > summary { cursor: pointer; font-weight: 700; }

/* Composer/action polish */
.message-actions.top-right { display: inline-flex; align-items: flex-start; gap: .45rem; flex-wrap: nowrap; }
.message-actions.top-right .quote-button,
.message-actions.top-right .button { position: static; inset: auto; margin: 0; width: auto; white-space: nowrap; align-self: flex-start; }
.message .post-body { padding-right: 9.5rem; }
.form-inline-error { margin: .5rem 0; }
.attached-image-fields .image-rights-inline { margin-top: .6rem; }
.message-actions.top-right {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  flex-wrap: nowrap;
}
.message-actions.top-right .quote-button,
.message-actions.top-right .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 0;
  height: auto;
  line-height: 1.2;
  white-space: nowrap;
}
.check-row.is-disabled,
.gallery-dependent label.is-disabled {
  opacity: .55;
  cursor: not-allowed;
}

/* Chat and messages final layout overrides. */
.message-conversation-head {
  display: flex;
  align-items: center;
  gap: .65rem;
}
.message-conversation-head .muted { margin: 0; }
.room-avatar,
.quick-room-avatar {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  object-fit: cover;
  flex: 0 0 auto;
}
.message-composer {
  display: block;
  width: 100%;
  padding: .35rem 0 0;
  border-top: 1px solid var(--line);
}
.message-composer .composer-inline,
.quick-window .composer-inline {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr) 2.25rem 2.25rem;
  align-items: center;
  gap: .35rem;
  width: 100%;
}
.message-composer .tiptap-editor-shell,
.quick-window .tiptap-editor-shell {
  min-width: 0;
  width: 100%;
}
.message-composer .tiptap-editor .ProseMirror,
.quick-window .tiptap-editor .ProseMirror {
  box-sizing: border-box;
  min-height: 2.25rem;
  height: 2.25rem;
  max-height: 5.25rem;
  padding: .35rem .6rem;
  line-height: 1.35;
}
.message-composer .visual-editor,
.quick-window .visual-editor,
.message-composer .tiptap-editor,
.quick-window .tiptap-editor {
  min-height: 2.25rem;
}
.message-composer .composer-icon,
.message-composer .composer-send,
.quick-window .composer-icon,
.quick-window .composer-send {
  width: 2.25rem;
  height: 2.25rem;
  min-width: 2.25rem;
  min-height: 2.25rem;
}
.message-composer textarea.compact-message-input,
.quick-window textarea.compact-message-input {
  box-sizing: border-box;
  width: 100%;
  height: 2.25rem;
  min-height: 2.25rem;
  max-height: 2.25rem;
  padding: .45rem .6rem;
  line-height: 1.25;
  resize: none;
  overflow: hidden;
  font-weight: 500;
}
.quick-window-form { padding: .42rem .5rem; }
.chat-message-main {
  position: relative;
  min-width: 0;
}
.chat-message-content {
  display: grid;
  justify-items: start;
  gap: .22rem;
}
.chat-message-content:empty { display: none; }
.unread-separator {
  display: grid;
  grid-template-columns: minmax(1rem, 1fr) auto minmax(1rem, 1fr);
  align-items: center;
  gap: .5rem;
  color: var(--danger);
  font-size: .78rem;
  font-weight: 900;
  margin: .7rem 0 .55rem;
}
.unread-separator::before,
.unread-separator::after {
  content: '';
  height: 1px;
  background: currentColor;
}
.unread-separator span {
  white-space: nowrap;
}
.persistent-site-notice {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: .35rem;
  padding: .45rem max(1rem, calc((100vw - 1180px) / 2));
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--warning, #d98a00) 12%, var(--panel));
}
.persistent-site-notice p { margin: .05rem 0; }
.persistent-site-notice small { color: var(--muted); }
.site-notice-carousel { align-items: center; text-align: center; justify-content: center; }
.site-notice-carousel > div:first-child { flex: 1 1 auto; display: grid; justify-items: center; overflow: hidden; min-height: 1.45rem; }
.site-notice-slide { grid-area: 1 / 1; visibility: hidden; max-width: min(860px, 100%); animation: noticeSlideIn .26s ease both; }
.site-notice-slide.active { visibility: visible; }
.site-notice-slide.leaving { visibility: visible; animation: noticeSlideOut .24s ease both; }
.site-notice-slide strong:empty { display: none; }
.site-notice-slide p { margin: .15rem 0 0; }
.site-notice-dots { display: inline-flex; gap: .35rem; align-items: center; justify-content: center; flex: 0 0 100%; width: 100%; margin-top: .1rem; }
.site-notice-dots button { width: .55rem; height: .55rem; min-height: 0; padding: 0; border-radius: 999px; border: 0; background: color-mix(in srgb, var(--text), transparent 70%); }
.site-notice-dots button.active { background: var(--brand); }
@keyframes noticeSlideIn {
  from { opacity: 0; transform: translateX(18px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes noticeSlideOut {
  from { opacity: 1; transform: translateX(0); }
  to { opacity: 0; transform: translateX(-18px); }
}
.persistent-notice-progress { width: min(360px, 100%); height: .45rem; overflow: hidden; border-radius: 999px; background: color-mix(in srgb, var(--line) 70%, transparent); }
.persistent-notice-progress span { display: block; height: 100%; border-radius: inherit; background: var(--brand); }
.persistent-site-notice > div { min-width: 0; flex: 1 1 auto; }
.persistent-site-notice .button { flex: 0 0 auto; white-space: nowrap; }
@media (max-width: 640px) {
  .persistent-site-notice {
    align-items: stretch;
    flex-direction: column;
    gap: .35rem;
    padding: .55rem 1rem;
  }
  .persistent-site-notice .button { width: 100%; }
  .persistent-notice-progress { width: 100%; }
}
.new-member-badge { width: 1.15em !important; height: 1.15em !important;; object-fit: contain; vertical-align: -.18em; margin-left: .25rem; }
.locked-actions button:disabled, .locked-inline { opacity: .75; cursor: not-allowed; }
.ticket-attachment { display: inline-block; margin-top: .6rem; }
.ticket-attachment img { max-width: min(280px, 100%); border-radius: 8px; border: 1px solid var(--line); display: block; }
.locked-media-preview { position: relative; overflow: hidden; }
.locked-media-preview img { filter: blur(14px); transform: scale(1.04); }
.locked-media-preview span { position: absolute; inset: auto .45rem .45rem; padding: .25rem .45rem; border-radius: 999px; font-size: .72rem; color: #fff; background: rgba(0,0,0,.48); text-align: center; }
.online-mini-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .35rem; }
.online-mini-row .online-mini { min-width: 0; }
.icon-button { width: 2rem; height: 2rem; display: inline-grid; place-items: center; border: 1px solid var(--line); border-radius: 999px; background: var(--panel-soft); color: var(--text); text-decoration: none; font-weight: 800; }
.icon-button[disabled] { opacity: .5; cursor: not-allowed; }
.pending-conversation-actions { border-top: 1px solid var(--line); padding: .65rem; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.pending-conversation-actions p { margin: 0; flex: 1 1 100%; }
.profile-edit-title { align-items: flex-start; margin-bottom: .8rem; }
.profile-verify-action { background: var(--brand); color: #fff; border-color: var(--brand); margin-left: auto; }
.message-policy-grid, .verification-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: .75rem; align-items: stretch; width: 100%; }
.settings-messages-card { overflow: hidden; box-sizing: border-box; max-width: 100%; contain: inline-size; }
.settings-messages-card *, .settings-messages-card *::before, .settings-messages-card *::after { box-sizing: border-box; }
.message-policy-card, .verification-option { border: 1px solid var(--line); border-radius: 12px; padding: .8rem; background: var(--panel-soft); display: grid; grid-template-rows: auto auto 1fr auto; gap: .55rem; align-content: stretch; min-width: 0; max-width: 100%; overflow: clip; }
.message-policy-card.active { border-color: var(--brand); box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand), transparent 78%); }
.message-policy-card input[type="radio"] { position: relative; opacity: 0; pointer-events: none; }
.message-policy-card strong, .verification-option h3 { margin: 0; }
.message-policy-card > span { color: var(--muted); font-size: .92rem; }
.message-policy-matrix { display: grid; gap: .25rem; font-size: .9rem; align-content: start; min-width: 0; }
.message-policy-matrix span { min-width: 0; overflow-wrap: anywhere; }
.message-policy-card button, .verification-option button { align-self: end; width: 100%; }
.settings-messages-card form, .settings-messages-card [data-message-policy-panel], .settings-messages-card, .message-policy-grid, .custom-policy-selects { min-width: 0; max-width: 100%; }
.settings-messages-card { overflow: clip; }
.custom-policy-selects label, .custom-policy-selects select { min-width: 0; max-width: 100%; }
.custom-policy-selects { display: grid; gap: .45rem; align-content: start; }
.custom-policy-selects label { margin: 0; }
.custom-policy-selects select { width: 100%; min-width: 0; }
.message-policy-card button { min-height: 2.35rem; }
.attached-poll-fields { border: 1px solid var(--line); border-radius: 12px; padding: .65rem .8rem; background: var(--panel-soft); }
.attached-poll-fields summary { cursor: pointer; font-weight: 700; }
.poll-card { margin: .9rem 0; padding: .85rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); }
.poll-card h3 { margin: 0; font-size: 1.05rem; }
.poll-card header { margin-bottom: .55rem; }
.poll-meta { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; margin: .65rem 0 0; }
.poll-meta a { color: inherit; }
.poll-voter-stack { margin-right: .1rem; }
.poll-choice { display: flex; align-items: center; gap: .5rem; margin: .45rem 0; padding: .55rem; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); }
.poll-choice input[type="radio"], .poll-choice input[type="checkbox"] { flex: 0 0 auto; width: auto; min-width: 0; margin: 0; }
.poll-choice span { flex: 1 1 auto; min-width: 0; }
.poll-result { margin: .55rem 0; }
.poll-result > div:first-child { display: flex; justify-content: space-between; gap: .75rem; }
.poll-bar { height: .55rem; border-radius: 999px; overflow: hidden; background: color-mix(in srgb, var(--line), transparent 20%); }
.poll-bar span { display: block; height: 100%; border-radius: inherit; background: var(--brand); }
.poll-voter-tab { min-width: 3rem; width: auto; white-space: nowrap; }
.poll-voter-answer { padding: .55rem .65rem; margin-bottom: .55rem; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-soft); }
.poll-voter-answer p { margin: .2rem 0 0; }
.deleted-message { opacity: .62; filter: grayscale(.25); }
.deleted-label { display: inline-flex; margin: .45rem 0 0; padding: .18rem .5rem; border-radius: 999px; background: color-mix(in srgb, var(--danger) 16%, transparent); color: var(--danger); font-size: .82rem; font-weight: 700; }
.admin-shift-menu { position: relative; display: none; }
body.shift-admin-actions .admin-shift-menu { display: inline-block; }
.admin-shift-menu summary { list-style: none; width: 2rem; height: 2rem; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 999px; background: var(--panel-soft); cursor: pointer; font-weight: 900; }
.admin-shift-menu summary::-webkit-details-marker { display: none; }
.admin-shift-menu > div { position: absolute; right: 0; top: calc(100% + .35rem); z-index: 30; min-width: min(280px, 80vw); padding: .45rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); box-shadow: var(--shadow); display: grid; gap: .35rem; }
.admin-shift-menu a, .admin-shift-menu button { width: 100%; justify-content: flex-start; text-align: left; }
.admin-shift-menu form { margin: 0; display: grid; gap: .35rem; }
.admin-menu-field { margin: 0; font-size: .85rem; }
.admin-notice-item { padding: .85rem 0; border-top: 1px solid var(--line); }
.admin-notice-item:first-of-type { border-top: 0; }
@media (max-width: 760px) {
  .message-policy-grid, .verification-options { grid-template-columns: minmax(0, 1fr); }
  .message-policy-card, .verification-option { grid-template-rows: auto; }
  .message-policy-matrix { grid-template-columns: minmax(0, 1fr); }
}
.verification-modal { max-width: 820px; }
.verification-option p { min-height: 5.4rem; }
.verification-admin-actions { margin-top: .7rem; display: flex; gap: .5rem; flex-wrap: wrap; }
.chat-reactions { margin-top: .2rem; }
.chat-line .reaction-row {
  margin-top: .15rem;
  min-height: 1.55rem;
}
.chat-line .reaction-picker {
  opacity: 0;
  position: static;
  transform: none;
  transition: opacity .12s ease;
  z-index: 2;
}
.chat-line .reaction-row:not(:has(.reaction-chip)) .reaction-picker {
  position: absolute;
  right: .35rem;
  top: 50%;
  transform: translateY(-50%);
}
.chat-line:hover .reaction-picker,
.chat-line:focus-within .reaction-picker,
.chat-line .reaction-chip {
  opacity: 1;
}
.chat-line .reaction-picker summary {
  width: 1.55rem;
  height: 1.55rem;
  min-width: 1.55rem;
  min-height: 1.55rem;
  font-size: 0;
}
.chat-line .reaction-picker summary::before {
  content: none;
}
.reaction-picker summary img {
  width: 1rem;
  height: 1rem;
  display: block;
}
.chat-line .reaction-chip,
.chat-line .reaction-choice {
  min-height: 1.55rem;
  padding: .08rem .4rem;
}
.quick-window-head .quick-open-full {
  min-width: 1.8rem;
  width: 1.8rem;
  min-height: 1.8rem;
  height: 1.8rem;
  padding: 0;
  border-radius: 999px;
}
.quick-window.minimized { cursor: pointer; }
.quick-window.minimized .quick-open-full { display: none; }
.quick-window.minimized {
  overflow: visible;
}
.quick-window.minimized .quick-window-head {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 3px;
  border: 0;
  display: grid;
  place-items: center;
}
.quick-window.minimized .quick-window-head img,
.quick-window.minimized .quick-window-head .quick-room-avatar,
.quick-window.minimized .quick-window-head .room-avatar {
  width: 100%;
  height: 100%;
  border-radius: 999px;
  object-fit: cover;
}

.chat-message-body {
  display: block;
}
.chat-reactions {
  display: flex;
  align-items: center;
  margin-left: 0;
}
.chat-reactions .reaction-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .18rem;
  margin: 0;
  min-height: 1.55rem;
}
.chat-reactions .reaction-row:empty { display: none; }
.chat-reactions .reaction-row:not(:has(.reaction-chip)) {
  min-height: 0;
  margin: 0;
}
.chat-reactions .reaction-row form { display: inline-flex; }
.quick-minimized-more {
  position: fixed;
  right: .9rem;
  bottom: 21.5rem;
  z-index: 68;
}
.quick-minimized-more[hidden] { display: none !important; }
.quick-minimized-more-toggle {
  width: 54px;
  height: 54px;
  min-width: 54px;
  min-height: 54px;
  padding: 0;
  border-radius: 999px;
  box-shadow: var(--shadow);
}
.quick-minimized-menu {
  display: none;
  position: absolute;
  right: 0;
  bottom: calc(100% + .4rem);
  width: 230px;
  max-height: 18rem;
  overflow: auto;
  padding: .35rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
  box-shadow: var(--shadow);
}
.quick-minimized-more:hover .quick-minimized-menu,
.quick-minimized-more:focus-within .quick-minimized-menu {
  display: grid;
  gap: .25rem;
}
.quick-minimized-menu button {
  justify-content: flex-start;
  width: 100%;
  background: transparent;
  color: var(--text);
  border-color: transparent;
}
@media (max-width: 540px) {
  .quick-minimized-more {
    right: .75rem;
    bottom: calc(21.35rem + env(safe-area-inset-bottom, 0px));
  }
  .quick-dock.open .quick-dock-panel {
    left: .75rem;
    right: .75rem;
    bottom: calc(4.4rem + env(safe-area-inset-bottom, 0px));
    width: auto;
  }
}
.quick-window.quick-home-window:not(.minimized) {
  height: min(560px, calc(100vh - 2rem));
}
.quick-window:not(.minimized):not(.header-minimized) {
  height: min(560px, calc(100vh - 2rem));
}
.quick-window-head {
  gap: .45rem;
  min-height: 2.85rem;
  padding: .38rem .55rem;
}
.quick-window-head img,
.quick-window-head .quick-room-avatar,
.quick-window-head .room-avatar {
  width: 30px;
  height: 30px;
  flex-basis: 30px;
  border-radius: 10px;
}
.quick-window-head small {
  font-size: .76rem;
  line-height: 1.15;
}
.quick-window-head strong {
  line-height: 1.15;
}
.quick-window .quick-menu,
.quick-window .quick-tab {
  min-width: 0;
  max-width: 100%;
}
.quick-tab button {
  min-width: 0;
  align-items: center;
}
.quick-tab button .room-avatar,
.message-list-item .room-avatar {
  width: 50px;
  height: 50px;
  flex: 0 0 50px;
  border-radius: 14px;
  object-fit: cover;
}
.message-conversation-head .room-avatar {
  width: 50px;
  height: 50px;
  flex: 0 0 50px;
  border-radius: 16px;
}
.message-list-item:has(.room-avatar) {
  min-height: 66px;
  align-items: center;
}
.message-list-item:has(.room-avatar) small,
.quick-tab button .room-avatar + span small {
  white-space: normal;
  line-height: 1.25;
}
.quick-tab .message-list-item .unread-badge,
.message-list-item .unread-badge {
  min-width: 1.35rem;
  flex: 0 0 auto;
  display: inline-grid;
}
.quick-dock .quick-dock-panel {
  display: none;
}
@media (max-width: 720px) {
  .account-email-form {
    grid-template-columns: 1fr;
  }
  .account-email-side {
    justify-items: stretch;
  }
  .fetlife-slug-field {
    flex-wrap: wrap;
  }
  .fetlife-slug-field input {
    flex: 1 1 100%;
  }
  .profile-gallery-choice-grid {
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  }
  .quick-window.quick-home-window:not(.minimized) {
    width: 100%;
    height: min(560px, calc(100vh - 6rem));
    max-height: min(560px, calc(100vh - 6rem));
  }
  .message-list-item:has(.room-avatar) { min-height: 66px; }
}


.thread-loader,
.media-comments-loader {
  display: flex;
  justify-content: center;
  padding: .45rem 0 .65rem;
  min-width: 0;
}
.thread-loader button,
.media-comments-loader button {
  max-width: 100%;
  white-space: normal;
}

/* Progressive media comments: keep the viewer side stable and scroll only the list. */
.media-viewer-full .viewer-meta.card .viewer-side {
  min-height: 0;
}
.media-viewer-full .viewer-meta.card .media-comments-box {
  min-height: 16rem;
  overflow: hidden;
}
.media-viewer-full .viewer-meta.card .media-comments-scroll {
  display: block;
  height: min(38vh, 440px);
  min-height: 10rem;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  padding-right: .2rem;
}
.media-viewer-full .viewer-meta.card [data-media-comments] {
  display: grid;
  gap: .35rem;
  min-height: 0;
  overflow: visible;
}
@media (max-width: 900px) {
  .media-viewer-full .viewer-meta.card .media-comments-box {
    max-height: none;
  }
  .media-viewer-full .viewer-meta.card .media-comments-scroll {
    height: min(45vh, 420px);
    max-height: min(45vh, 420px);
  }
}

/* Admin conversation inspector */
.admin-convs-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.admin-convs-global-search {
  min-width: min(360px, 100%);
  margin: 0;
}

.admin-convs-shell {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(240px, 340px) minmax(0, 1fr);
  gap: 1rem;
  align-items: stretch;
  height: min(72vh, 820px);
  min-height: 520px;
}

.admin-convs-users,
.admin-convs-list,
.admin-convs-thread {
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.admin-convs-users > div,
.admin-convs-list > div,
.admin-convs-message-thread {
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}

.admin-convs-user-row,
.admin-convs-conversation-row {
  width: 100%;
  border: 1px solid var(--line);
  background: var(--panel-soft);
  color: inherit;
  border-radius: 14px;
  padding: .6rem;
  margin: 0 0 .45rem;
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  text-align: left;
  cursor: pointer;
  min-width: 0;
}

.admin-convs-user-row:hover,
.admin-convs-conversation-row:hover,
.admin-convs-user-row.active,
.admin-convs-conversation-row.active {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.admin-convs-user-row > span,
.admin-convs-conversation-row > span {
  min-width: 0;
  display: grid;
  gap: .12rem;
}

.admin-convs-user-row strong,
.admin-convs-conversation-row strong,
.admin-convs-user-row small,
.admin-convs-conversation-row small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-convs-thread-head {
  flex: 0 0 auto;
  border-bottom: 1px solid var(--line);
  margin: -.25rem 0 .65rem;
  padding-bottom: .65rem;
}

.admin-convs-thread > [data-admin-convs-thread] {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
}

.admin-convs-message-thread {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: .55rem;
  padding-right: .2rem;
}

.admin-convs-message {
  margin: 0;
}

.admin-convs-message mark,
.admin-convs-conversation-row mark {
  background: rgba(255, 213, 79, .55);
  color: inherit;
  border-radius: .25rem;
  padding: 0 .12rem;
}

@media (max-width: 1100px) {
  .admin-convs-shell {
    grid-template-columns: minmax(220px, 300px) minmax(0, 1fr);
    height: auto;
  }

  .admin-convs-thread {
    grid-column: 1 / -1;
    min-height: 520px;
  }
}

@media (max-width: 760px) {
  .admin-convs-header {
    display: grid;
  }

  .admin-convs-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-convs-users,
  .admin-convs-list,
  .admin-convs-thread {
    min-height: 360px;
  }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.member-directory-meta { display: flex; gap: .55rem; flex-wrap: wrap; align-items: center; color: var(--muted); font-size: .94rem; margin: .35rem 0 .75rem; }
.member-search .check-row { align-self: end; min-height: 2.5rem; }
.footer a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.reaction-chip.reaction-chip-own {
  background: color-mix(in srgb, var(--brand), white 82%);
  border-color: color-mix(in srgb, var(--brand), transparent 35%);
  color: var(--brand2);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand), transparent 75%);
}
.theme-dark .reaction-chip.reaction-chip-own {
  background: color-mix(in srgb, var(--brand), transparent 74%);
  color: var(--text);
}
.quick-member-search { padding: .35rem .1rem .55rem; }
.quick-member-search input { width: 100%; min-height: 2.25rem; }
[data-tooltip] { position: relative; }
[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  right: 0;
  bottom: calc(100% + .45rem);
  width: max-content;
  max-width: min(260px, calc(100vw - 2rem));
  padding: .38rem .55rem;
  border-radius: 10px;
  background: var(--text);
  color: var(--panel);
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.25;
  box-shadow: var(--shadow);
  opacity: 0;
  transform: translateY(4px);
  pointer-events: none;
  transition: opacity .14s ease, transform .14s ease;
  z-index: 90;
}
[data-tooltip]:hover::after,
[data-tooltip]:focus-visible::after { opacity: 1; transform: translateY(0); }
.quick-window.minimized .quick-window-head { cursor: pointer; }
.quick-minimized-single { font-weight: 900; }
.chat-gif { cursor: zoom-in; }
.chat-image-lightbox {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  padding: min(4vw, 2rem);
  background: rgba(16, 10, 16, .86);
}
.chat-image-lightbox[hidden] { display: none !important; }
.chat-image-lightbox img {
  max-width: min(96vw, 1200px);
  max-height: 92vh;
  object-fit: contain;
  border-radius: 16px;
  box-shadow: var(--shadow);
  background: #111;
}
.chat-image-lightbox-actions {
  position: absolute;
  top: .85rem;
  right: .85rem;
  display: flex;
  align-items: center;
  gap: .5rem;
  z-index: 2;
}
.chat-image-lightbox-actions > button {
  position: static;
  min-height: 2.7rem;
  width: auto;
  box-shadow: var(--shadow);
}
.chat-image-lightbox .chat-image-close {
  width: 2.7rem;
  height: 2.7rem;
  border-radius: 999px;
  padding: 0;
  font-size: 1.45rem;
}
.chat-image-lightbox .chat-image-moderation-menu > div { z-index: 3; }

/* Follow-up: annuaire, recherche messages et infobulles quick chat */
.member-directory-card .page-intro.member-directory-head {
  align-items: flex-start;
}
.member-search {
  grid-template-columns: minmax(240px, 1fr) minmax(130px, 150px) minmax(130px, 150px) minmax(150px, 180px);
  align-items: center;
}
.member-search .member-search-row {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}
.member-search .check-row {
  min-height: 2.5rem;
  align-self: center;
}
.member-search .member-search-row button {
  min-width: min(180px, 100%);
}
.message-member-search {
  padding: .15rem 0 .65rem;
}
.message-member-search input {
  width: 100%;
  min-height: 2.35rem;
}
.quick-windows,
.quick-dock,
.quick-dock-panel,
.quick-minimized-more {
  z-index: 2147483500;
}
.quick-window.minimized[data-tooltip]::after {
  right: calc(100% + .55rem);
  bottom: 50%;
  transform: translate(4px, 50%);
  z-index: 2147483647;
}
.quick-window.minimized[data-tooltip]:hover::after,
.quick-window.minimized[data-tooltip]:focus-visible::after {
  transform: translate(0, 50%);
}
.quick-minimized-more [data-tooltip]::after,
.quick-minimized-more[data-tooltip]::after {
  right: calc(100% + .55rem);
  bottom: 50%;
  transform: translate(4px, 50%);
  z-index: 2147483647;
}
.quick-minimized-more [data-tooltip]:hover::after,
.quick-minimized-more [data-tooltip]:focus-visible::after,
.quick-minimized-more[data-tooltip]:hover::after,
.quick-minimized-more[data-tooltip]:focus-visible::after {
  transform: translate(0, 50%);
}
@media (max-width: 760px) {
  .member-directory-card .page-intro.member-directory-head {
    display: grid;
    gap: .75rem;
  }
  .member-directory-card .page-nav {
    width: 100%;
    justify-content: center;
  }
  .member-search {
    grid-template-columns: 1fr;
  }
  .member-search .member-search-row {
    display: grid;
    grid-template-columns: 1fr;
  }
  .member-search .member-search-row button {
    width: 100%;
  }
  .quick-window.minimized[data-tooltip]::after,
  .quick-minimized-more [data-tooltip]::after,
  .quick-minimized-more[data-tooltip]::after {
    right: auto;
    left: 0;
    bottom: calc(100% + .45rem);
    transform: translateY(4px);
  }
  .quick-window.minimized[data-tooltip]:hover::after,
  .quick-window.minimized[data-tooltip]:focus-visible::after,
  .quick-minimized-more [data-tooltip]:hover::after,
  .quick-minimized-more [data-tooltip]:focus-visible::after,
  .quick-minimized-more[data-tooltip]:hover::after,
  .quick-minimized-more[data-tooltip]:focus-visible::after {
    transform: translateY(0);
  }
}

/* Follow-up: message sidebar search keeps the self control readable and the quick-chat tooltips above every chat layer. */
.online-sidebar .presence-control.compact {
  margin: 0 0 .65rem;
}
.online-sidebar .presence-control.compact .presence-toggle {
  width: 100%;
  justify-content: flex-start;
  gap: .65rem;
  padding: .55rem .65rem;
}
.online-sidebar .presence-control.compact .presence-name-line {
  align-items: center;
  flex-wrap: wrap;
  row-gap: .12rem;
}
.quick-window.minimized,
.quick-minimized-more {
  z-index: 2147483646 !important;
  overflow: visible !important;
}
.quick-window.minimized:hover,
.quick-window.minimized:focus-within,
.quick-minimized-more:hover,
.quick-minimized-more:focus-within {
  z-index: 2147483647 !important;
}
.quick-window.minimized[data-tooltip]::after,
.quick-minimized-more [data-tooltip]::after,
.quick-minimized-more[data-tooltip]::after {
  position: absolute;
  right: calc(100% + .6rem);
  bottom: 50%;
  transform: translate(4px, 50%);
  z-index: 2147483647 !important;
}
.quick-window.minimized[data-tooltip]:hover::after,
.quick-window.minimized[data-tooltip]:focus-visible::after,
.quick-minimized-more [data-tooltip]:hover::after,
.quick-minimized-more [data-tooltip]:focus-visible::after,
.quick-minimized-more[data-tooltip]:hover::after,
.quick-minimized-more[data-tooltip]:focus-visible::after {
  transform: translate(0, 50%);
}

/* Follow-up: shared compact presence rows and fixed mobile message viewport. */
.online-mini-row,
.quick-member-result-row,
.presence-self-row {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.quick-member-result-row {
  grid-template-columns: minmax(0, 1fr) auto;
}
.quick-member-result-row .online-mini.quick-list-item {
  width: 100%;
  min-width: 0;
}
.presence-self-row .presence-control,
.quick-member-search .presence-control,
.online-sidebar .presence-control.compact {
  width: 100%;
  max-width: 100%;
}
.presence-control.compact .presence-toggle,
.presence-self-row .presence-toggle {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  grid-template-columns: auto minmax(0, 1fr) auto;
}
.presence-name-line {
  display: grid;
  grid-template-columns: minmax(0, max-content) auto auto;
  justify-content: start;
  align-items: center;
  column-gap: .22rem;
  row-gap: .08rem;
  max-width: 100%;
}
.presence-name {
  display: block;
}
.presence-identity-badges,
.presence-status-badges {
  align-self: center;
  white-space: nowrap;
}
.presence-identity-badges .verified,
.message-list-badges .verified {
  line-height: 1;
  flex: 0 0 auto;
}
.presence-identity-badges .new-member-badge,
.message-list-badges .new-member-badge {
  display: inline-block;
  vertical-align: middle;
  margin-left: .08rem;
}
.quick-tab .presence-name-line,
.online-sidebar .presence-name-line {
  width: 100%;
}
@media (max-width: 760px) {
  .message-conversation:not(.empty) {
    height: min(76svh, 760px);
    min-height: 520px;
    max-height: calc(100svh - 1.5rem);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
  }
  .message-conversation:not(.empty) .message-thread {
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }
  .message-conversation:not(.empty) .message-composer {
    position: sticky;
    bottom: 0;
    background: var(--panel);
  }
}
@media (max-width: 420px) {
  .presence-name-line {
    grid-template-columns: minmax(0, 1fr) auto auto;
  }
}

.typing-indicator {
  box-sizing: border-box;
  min-height: 0;
  max-height: 0;
  opacity: 0;
  transform: translateY(6px);
  overflow: hidden;
  padding: 0 .45rem;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.25;
  transition: max-height .22s ease, opacity .18s ease, transform .22s ease, padding .22s ease;
}
.typing-indicator.is-visible {
  max-height: 2rem;
  opacity: 1;
  transform: translateY(0);
  padding: 0 .45rem .3rem;
}
.typing-dots { display: inline-flex; gap: .16rem; margin-left: .18rem; vertical-align: middle; }
.typing-dots i { width: .28rem; height: .28rem; border-radius: 999px; background: currentColor; opacity: .45; animation: typing-bounce 1s infinite ease-in-out; }
.typing-dots i:nth-child(2) { animation-delay: .14s; }
.typing-dots i:nth-child(3) { animation-delay: .28s; }
@keyframes typing-bounce { 0%, 80%, 100% { transform: translateY(0); opacity: .35; } 40% { transform: translateY(-.16rem); opacity: .85; } }
@media (prefers-reduced-motion: reduce) { .typing-indicator, .typing-dots i { transition: none; animation: none; } }

.forum-sort-toggle {
  flex: 0 0 auto;
  white-space: nowrap;
}
@media (max-width: 720px) {
  .page-actions:has(.forum-sort-toggle) {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .45rem;
    flex-wrap: wrap;
  }
  .page-actions:has(.forum-sort-toggle) .button {
    min-height: 2.15rem;
    padding-inline: .6rem;
  }
}
.event-story-preview {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.58);
  margin: .75rem 0;
}
.event-story-preview h4,
.event-story-preview .rich-content,
.event-story-preview .attachment-strip {
  margin-left: 1rem;
  margin-right: 1rem;
}
.event-story-preview .event-participation-cover {
  margin: 0 0 1rem;
  border-radius: 18px 18px 0 0;
  height: clamp(150px, 28vw, 280px);
  max-height: none;
}
.event-story-preview .attachment-strip {
  margin-bottom: 1rem;
}
.image-preview[data-preview-for="cover_image"] img {
  aspect-ratio: 40 / 13;
  object-fit: cover;
}

.error-page {
  max-width: 760px;
  margin: 2rem auto;
}
.error-page h1 {
  margin-bottom: .5rem;
}
.error-page .form-actions {
  margin-top: 1rem;
  justify-content: flex-start;
}

/* Home/nav redesign step 1: clearer desktop nav, aligned badges, and safe mobile burger menu. */
.topbar nav .nav-link,
.topbar nav .nav-link-with-badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-width: 0;
}
.topbar nav .nav-link > span:first-child,
.topbar nav .nav-link-with-badge > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.topbar nav .nav-badge {
  position: static;
  flex: 0 0 auto;
  margin-left: .1rem;
  transform: none;
}
.notification-link .nav-badge,
.notifications-link .nav-badge,
.nav-notification-link .nav-badge,
.tickets-link .nav-badge {
  position: static;
  top: auto;
  right: auto;
}
.nav-logout-label { display: none; }
.nav-logout-button {
  gap: .45rem;
  justify-content: center;
}
@media (max-width: 760px) {
  .topbar nav:not(.public-nav) {
    display: none;
    position: absolute;
    top: calc(100% + .45rem);
    left: .65rem;
    right: .65rem;
    width: auto;
    max-width: calc(100vw - 1.3rem);
    max-height: min(78vh, 36rem);
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: .25rem;
    padding: .65rem;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: color-mix(in srgb, var(--panel), var(--bg) 18%);
    box-shadow: 0 18px 45px rgba(94,31,58,.2);
    z-index: 220;
    scrollbar-width: thin;
  }
  .topbar.nav-open nav:not(.public-nav) { display: flex; }
  .topbar nav:not(.public-nav) .nav-link,
  .topbar nav:not(.public-nav) .nav-link-with-badge,
  .topbar nav:not(.public-nav) .nav-logout-button {
    width: 100%;
    min-height: 2.85rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    padding: .7rem .75rem;
    border-radius: 13px;
    color: var(--text);
    background: transparent;
  }
  .topbar nav:not(.public-nav) .nav-link:hover,
  .topbar nav:not(.public-nav) .nav-link-with-badge:hover,
  .topbar nav:not(.public-nav) .nav-logout-button:hover {
    background: color-mix(in srgb, var(--brand), transparent 92%);
    color: var(--brand2);
  }
  .topbar nav:not(.public-nav) .nav-badge { margin-left: auto; }
  .topbar nav:not(.public-nav) .logout-form,
  .topbar nav:not(.public-nav) .nav-logout-form {
    width: 100%;
    margin-top: .35rem;
    padding-top: .45rem;
    border-top: 1px solid var(--line);
  }
  .topbar nav:not(.public-nav) .icon-logout,
  .topbar nav:not(.public-nav) .nav-logout-button {
    min-width: 0;
    width: 100%;
    height: auto;
    min-height: 2.85rem;
    border-radius: 13px;
    padding: .7rem .75rem;
    background: var(--panel-soft);
    justify-content: flex-start;
  }
  .topbar nav:not(.public-nav) .nav-logout-label { display: inline; font-weight: 700; }
  .topbar nav:not(.public-nav) .icon-logout img { flex: 0 0 auto; }
  .topbar nav:not(.public-nav) .nav-link > span:first-child,
  .topbar nav:not(.public-nav) .nav-link-with-badge > span:first-child {
    white-space: nowrap;
  }
}


.home-feed-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.home-feed-toolbar h1 { margin-bottom: .25rem; }
.home-feed-tabs {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .45rem;
}
.home-feed-tab,
.home-feed-filter-placeholder,
.feed-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.8rem;
  padding: .28rem .7rem;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--panel-soft);
  color: var(--text);
  font-size: .86rem;
  font-weight: 800;
  line-height: 1.1;
}
.home-feed-tab.active,
.event-chip {
  background: color-mix(in srgb, var(--brand2), transparent 84%);
  border-color: color-mix(in srgb, var(--brand2), transparent 58%);
  color: var(--brand2);
}
.home-feed-tab.disabled,
.home-feed-filter-placeholder {
  color: var(--muted);
}
.home-event-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  border-color: color-mix(in srgb, var(--brand2), transparent 52%);
  background: linear-gradient(135deg, color-mix(in srgb, var(--brand2), transparent 92%), var(--panel));
}
.home-event-hero h2 { margin: .45rem 0 .3rem; }
.home-event-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  justify-content: flex-end;
}
.feed-card {
  overflow: visible;
  border-color: color-mix(in srgb, var(--line), var(--brand2) 8%);
}
.feed-card .home-author-line {
  min-width: 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
}
.feed-author-main {
  display: inline-flex;
  align-items: flex-start;
  gap: .55rem;
  min-width: 0;
}
.feed-card .feed-meta-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .25rem .35rem;
  min-width: 0;
}
.feed-card .user-pill {
  display: inline-flex;
  align-items: center;
  gap: .18rem;
  flex-wrap: wrap;
  min-width: 0;
  max-width: 100%;
}
.feed-card .home-copy h2 {
  margin-top: .18rem;
}
.feed-status-line,
.feed-card-footer {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .4rem .55rem;
  min-width: 0;
}
.feed-status-line { margin: .05rem 0 .35rem; justify-content: flex-end; flex: 0 1 auto; }
.feed-card-footer {
  margin-top: .75rem;
  color: var(--muted);
  font-size: .9rem;
  overflow: visible;
  padding: .15rem .2rem .2rem 0;
}
.feed-participants,
.feed-reactions,
.feed-poll-summary {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .28rem;
  min-width: 0;
}
.feed-reactions span {
  display: inline-flex;
  align-items: center;
  min-height: 1.45rem;
  padding: .1rem .45rem;
  border-radius: 999px;
  background: var(--panel-soft);
  border: 1px solid var(--line);
  color: var(--text);
  font-weight: 800;
}
.feed-card .participant-stack { margin-right: .15rem; }
.feed-card .participant-stack img { width: 1.55rem; height: 1.55rem; }
.feed-card .archive-status-icon { width: 1rem; height: 1rem; }
.feed-card .home-copy p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.feed-card .feed-image img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

@media (max-width: 720px) {
  .home-feed-toolbar,
  .home-event-hero {
    grid-template-columns: 1fr;
    display: grid;
  }
  .home-feed-tabs,
  .home-event-actions {
    justify-content: flex-start;
  }
  .home-feed-tabs > * {
    flex: 1 1 auto;
  }
  .feed-card .feed-meta-line {
    align-items: flex-start;
  }
  .feed-card .home-author-line,
  .feed-author-main {
    align-items: flex-start;
  }
  .feed-card .feed-status-line {
    justify-content: flex-start;
    width: 100%;
  }
  .feed-card .home-copy p {
    -webkit-line-clamp: 3;
  }
}

.home-feed-shell {
  position: relative;
  display: grid;
  gap: 1rem;
}

.home-feed-list {
  display: grid;
  gap: 1rem;
}

.home-feed-loader,
.home-feed-end {
  display: flex;
  justify-content: center;
  padding: .35rem 0 1rem;
}

.home-feed-end {
  font-weight: 700;
}

.home-feed-new {
  position: sticky;
  top: calc(var(--nav-height, 56px) + .65rem);
  z-index: 30;
  justify-self: center;
  border: 0;
  border-radius: 999px;
  padding: .55rem 1rem;
  background: var(--panel);
  color: var(--brand2);
  border: 1px solid color-mix(in srgb, var(--brand2), transparent 62%);
  font-weight: 800;
  box-shadow: 0 10px 24px rgba(124, 34, 78, .22);
  cursor: pointer;
}

.home-feed-new[hidden] {
  display: none;
}

.home-feed-new:hover,
.home-feed-new:focus-visible {
  background: color-mix(in srgb, var(--brand2), var(--panel) 88%);
  color: var(--brand2);
  border-color: var(--brand2);
}

.home-feed-filter-menu {
  position: relative;
  display: inline-block;
}
.home-feed-filter-menu > summary {
  list-style: none;
}
.home-feed-filter-menu > summary::-webkit-details-marker {
  display: none;
}
.home-feed-filter-trigger {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  cursor: pointer;
}
.home-feed-filter-panel {
  position: absolute;
  top: calc(100% + .55rem);
  right: 0;
  z-index: 80;
  width: min(560px, calc(100vw - 2rem));
  max-height: min(72vh, 720px);
  overflow: auto;
  display: grid;
  gap: .9rem;
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--panel);
  box-shadow: var(--shadow);
  box-sizing: border-box;
}
.home-feed-filter-panel fieldset {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .8rem;
  margin: 0;
}
.home-feed-filter-panel legend {
  padding: 0 .35rem;
  font-weight: 700;
}
.home-feed-filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: .45rem .8rem;
}
.home-feed-sort-grid {
  grid-template-columns: 1fr;
}
.home-feed-filter-actions {
  display: flex;
  justify-content: flex-end;
  gap: .6rem;
  flex-wrap: wrap;
}
.home-feed-tab,
.home-feed-filter-trigger {
  color: inherit;
  text-decoration: none;
}
@media (max-width: 720px) {
  .home-feed-filter-menu {
    width: 100%;
  }
  .home-feed-filter-trigger {
    justify-content: center;
    width: 100%;
  }
  .home-feed-filter-panel {
    position: fixed;
    left: .75rem;
    right: .75rem;
    top: 5rem;
    width: auto;
    max-height: calc(100vh - 6rem);
  }
}
.feed-card .feed-status-line:empty { display: none; }
.feed-card .participant-stack { overflow: visible; padding-right: .55rem; padding-bottom: .18rem; }

/* Media viewer refresh: larger image, clean side thread and top controls. */
.media-viewer-pro {
  position: relative;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
  gap: .85rem;
  max-width: min(1780px, calc(100vw - 1.2rem));
  min-height: calc(100vh - 6.8rem);
  padding-top: 0;
}
.media-viewer-pro .viewer-main {
  min-height: calc(100vh - 7.4rem);
  padding: .65rem;
  border-radius: 24px;
  background: #100b10;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: .6rem;
}
.media-viewer-pro .viewer-img {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: calc(100vh - 12rem);
  object-fit: contain;
  border-radius: 18px;
  box-shadow: none;
  background: #090609;
}
.viewer-top-controls {
  position: absolute;
  top: .85rem;
  right: .85rem;
  z-index: 7;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
}
.viewer-icon-button,
.viewer-moderation-menu > summary {
  width: 2.55rem;
  height: 2.55rem;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  color: var(--text);
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  text-decoration: none;
  font-weight: 900;
  cursor: pointer;
}
.viewer-close { font-size: 1.45rem; line-height: 1; }
.viewer-moderation-menu { position: relative; }
.viewer-moderation-menu > summary::-webkit-details-marker { display: none; }
.viewer-moderation-menu > div {
  right: 0;
  top: calc(100% + .45rem);
  min-width: min(280px, 84vw);
}
.viewer-under-image {
  display: grid;
  gap: .55rem;
  align-items: center;
  min-width: 0;
}
.viewer-reactions-under-image {
  display: flex;
  justify-content: center;
  min-width: 0;
}
.viewer-reactions-under-image .reaction-row {
  margin: 0;
  justify-content: center;
  max-width: 100%;
  overflow-x: auto;
  padding: .15rem .2rem;
}
.viewer-reactions-under-image .reaction-picker > button,
.viewer-reactions-under-image .reaction-picker > .button,
.viewer-reactions-under-image .reaction-picker button {
  min-width: 2.35rem;
  min-height: 2.15rem;
  color: var(--brand2);
  background: var(--panel);
  border-color: var(--line);
}
.media-viewer-pro .viewer-actions {
  margin: 0;
  width: 100%;
}
.media-viewer-pro .viewer-side.card {
  margin: 0;
  max-height: calc(100vh - 6.8rem);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.viewer-meta-block {
  flex: 0 0 auto;
  display: grid;
  gap: .35rem;
  padding-bottom: .65rem;
  border-bottom: 1px solid var(--line);
  margin-bottom: .65rem;
}
.viewer-meta-block:only-child {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}
.viewer-meta-block .viewer-author { margin: 0; }
.viewer-meta-block .media-caption { margin: .15rem 0 0; }
.viewer-meta-block .viewer-source { margin: 0; }
.media-viewer-pro .viewer-side h2 { margin: 0 0 .4rem; }
.media-viewer-pro .comments-panel,
.media-viewer-pro .media-comments-box {
  flex: 1;
  min-height: 0;
  max-height: none;
  display: flex;
  flex-direction: column;
}
.media-viewer-pro .media-comments-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding-right: .15rem;
}
.media-viewer-pro .compact-media-comment-form {
  flex: 0 0 auto;
  margin-top: .65rem;
}
.image-settings-card {
  width: min(760px, calc(100vw - 1.5rem));
}
.chat-image-lightbox {
  z-index: 2147483647 !important;
}
.chat-image-lightbox button {
  z-index: 1;
}
@media (max-width: 900px) {
  .media-viewer-pro {
    grid-template-columns: 1fr;
    max-width: calc(100vw - .8rem);
    min-height: auto;
  }
  .media-viewer-pro .viewer-main {
    min-height: 58vh;
  }
  .media-viewer-pro .viewer-img {
    max-height: 70vh;
  }
  .media-viewer-pro .viewer-side.card {
    max-height: none;
    overflow: visible;
  }
  .media-viewer-pro .media-comments-box {
    min-height: 320px;
    max-height: 62vh;
  }
  .viewer-top-controls {
    top: .55rem;
    right: .55rem;
  }
}
@media (max-width: 560px) {
  .media-viewer-pro .viewer-main {
    padding: .35rem;
    border-radius: 18px;
  }
  .viewer-icon-button,
  .viewer-moderation-menu > summary {
    width: 2.35rem;
    height: 2.35rem;
  }
  .media-viewer-pro .viewer-actions {
    grid-template-columns: auto auto auto;
    overflow-x: auto;
  }
}

/* Fullscreen media viewer: align the site-wide viewer with the chat lightbox. */
.media-viewer-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483500;
  display: grid;
  place-items: stretch;
  padding: clamp(.5rem, 1.6vw, 1.25rem);
  background: rgba(14, 8, 14, .94);
  overflow: auto;
  color: #fff;
}
.media-viewer-overlay .media-viewer-lightbox {
  width: 100%;
  height: min(100%, calc(100vh - clamp(1rem, 3.2vw, 2.5rem)));
  min-height: 0;
  max-width: none;
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
  gap: clamp(.65rem, 1.2vw, 1rem);
  align-items: stretch;
}
.media-viewer-overlay .viewer-main {
  min-height: 0;
  height: 100%;
  background: #0f0b0f;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px;
  padding: clamp(.55rem, 1.2vw, 1rem);
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  place-items: stretch;
}
.media-viewer-overlay .viewer-img {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  min-height: 0;
  object-fit: contain;
  border-radius: 16px;
  box-shadow: none;
  background: #111;
}
.media-viewer-overlay .viewer-top-controls {
  position: fixed;
  top: clamp(.7rem, 1.4vw, 1.1rem);
  right: clamp(.7rem, 1.4vw, 1.1rem);
  z-index: 2147483502;
}
.media-viewer-overlay .viewer-icon-button,
.media-viewer-overlay .viewer-moderation-menu > summary {
  color: #fff;
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.2);
  backdrop-filter: blur(8px);
}
.media-viewer-overlay .viewer-icon-button:hover,
.media-viewer-overlay .viewer-moderation-menu > summary:hover {
  background: rgba(255,255,255,.2);
}
.media-viewer-overlay .viewer-side.card {
  min-height: 0;
  max-height: none;
  height: 100%;
  margin: 0;
  overflow: hidden;
  background: var(--panel);
  color: var(--text);
  border-radius: 22px;
  display: flex;
  flex-direction: column;
}
.media-viewer-overlay .viewer-side .media-comments-box {
  min-height: 0;
  max-height: none;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.media-viewer-overlay .viewer-side .media-comments-scroll {
  min-height: 0;
  max-height: none;
  flex: 1;
  overflow: auto;
}
.media-viewer-overlay .viewer-under-image {
  width: 100%;
  color: #fff;
}
.media-viewer-overlay .viewer-reactions-under-image {
  display: flex;
  justify-content: center;
  margin: .55rem auto .2rem;
  max-width: min(860px, 100%);
}
.media-viewer-overlay .viewer-reactions-under-image .reaction-row {
  justify-content: center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  padding: .32rem .45rem;
}
.media-viewer-overlay .viewer-actions {
  width: min(900px, 100%);
  margin: .55rem auto 0;
}
.media-viewer-overlay .viewer-actions .button.secondary {
  color: #fff;
  background: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.18);
}
.media-viewer-overlay .viewer-actions .button.secondary:hover {
  background: rgba(255,255,255,.18);
}
.media-viewer-overlay .viewer-moderation-menu.admin-shift-menu > div {
  z-index: 2147483503;
}
.dialog-modal:target,
.dialog-modal.active {
  z-index: 2147483600;
}

@media (max-width: 900px) {
  .media-viewer-overlay {
    padding: .45rem;
    place-items: start stretch;
  }
  .media-viewer-overlay .media-viewer-lightbox {
    height: auto;
    min-height: calc(100vh - .9rem);
    grid-template-columns: 1fr;
    grid-template-rows: minmax(58vh, 1fr) auto;
  }
  .media-viewer-overlay .viewer-main {
    min-height: 58vh;
  }
  .media-viewer-overlay .viewer-side.card {
    height: auto;
    max-height: none;
    overflow: visible;
  }
  .media-viewer-overlay .viewer-side .media-comments-box {
    max-height: 52vh;
  }
  .media-viewer-overlay .viewer-actions {
    grid-template-columns: auto auto auto;
    overflow-x: auto;
    justify-content: center;
  }
}

/* Follow-up media viewer fixes */
.media-viewer-overlay .viewer-top-controls {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
}
.media-viewer-overlay .viewer-icon-button,
.media-viewer-overlay .viewer-moderation-menu > summary.viewer-icon-button {
  display: inline-grid;
  place-items: center;
  width: 2.7rem;
  height: 2.7rem;
  min-width: 2.7rem;
  min-height: 2.7rem;
  padding: 0;
  border-radius: 999px;
  font-size: 1.35rem;
  line-height: 1;
  text-decoration: none;
  color: #fff;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: 0 18px 50px rgba(0,0,0,.38);
  backdrop-filter: blur(8px);
  cursor: pointer;
}
.media-viewer-overlay .viewer-moderation-menu > summary.viewer-icon-button::-webkit-details-marker { display: none; }
.media-viewer-overlay .viewer-moderation-menu > summary.viewer-icon-button::marker { content: ''; }
.media-viewer-overlay .viewer-icon-button:hover,
.media-viewer-overlay .viewer-moderation-menu > summary.viewer-icon-button:hover {
  background: rgba(255,255,255,.25);
  color: #fff;
}
.media-viewer-overlay .viewer-reactions-under-image .reaction-row {
  border-radius: 18px;
  padding: .42rem .55rem;
  overflow: visible;
  max-width: 100%;
}
.media-viewer-overlay .viewer-reactions-under-image .reaction-chip,
.media-viewer-overlay .viewer-reactions-under-image .reaction-picker > summary {
  flex: 0 0 auto;
}
.media-viewer-overlay .viewer-side .viewer-reactions { display: none; }
.image-settings-card .plain-caption-field,
.image-settings-card textarea[name="caption"] {
  font-weight: 400;
}
.album-grid {
  grid-template-columns: repeat(auto-fill, minmax(190px, 240px));
  justify-content: start;
}
@media (max-width: 560px) {
  .album-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}

/* Follow-up 3: viewer controls and empty side panel fixes */
.media-viewer-overlay.no-side-panel .media-viewer-lightbox {
  grid-template-columns: minmax(0, 1fr);
}
.media-viewer-overlay .chat-like-lightbox-button,
.media-viewer-overlay .viewer-moderation-menu > summary.chat-like-lightbox-button {
  width: 2.7rem;
  height: 2.7rem;
  min-width: 2.7rem;
  min-height: 2.7rem;
  padding: 0;
  border-radius: 999px;
  border: 0;
  color: #fff;
  background: var(--brand);
  box-shadow: var(--shadow);
  font-size: 1.45rem;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  display: inline-grid;
  place-items: center;
}
.media-viewer-overlay .chat-like-lightbox-button:hover,
.media-viewer-overlay .viewer-moderation-menu > summary.chat-like-lightbox-button:hover {
  color: #fff;
  background: var(--brand);
}
.media-viewer-overlay .viewer-moderation-button {
  background: #2f2430;
}
.media-viewer-overlay .viewer-moderation-button:hover {
  background: #161016;
}
.media-viewer-overlay .viewer-moderation-menu[open] > summary.chat-like-lightbox-button {
  background: #161016;
}
.media-viewer-overlay .viewer-moderation-menu.admin-shift-menu > div {
  right: 0;
  left: auto;
  top: calc(100% + .45rem);
}
.media-viewer-overlay .viewer-meta-block .media-caption,
.media-viewer-overlay .media-caption {
  font-weight: 400;
}
.image-settings-card label,
.image-settings-card .plain-caption-field,
.image-settings-card textarea[name="caption"] {
  font-weight: 400;
}
@media (max-width: 900px) {
  .media-viewer-overlay.no-side-panel .media-viewer-lightbox {
    grid-template-rows: minmax(58vh, 1fr);
  }
}

.password-input-wrap { position: relative; display: block; width: 100%; }
.password-input-wrap input { padding-right: 3rem; }
label:has(> [data-password-toggle]) { position: relative; }
label:has(> [data-password-toggle]) input { padding-right: 3rem; }
.password-toggle { position: absolute; right: .35rem; top: 50%; transform: translateY(-50%); width: 2.2rem; height: 2.2rem; min-height: 0; display: grid; place-items: center; padding: 0; border-radius: 999px; border: 1px solid transparent; background: transparent; color: var(--muted); box-shadow: none; }
.password-toggle:hover, .password-toggle:focus-visible, .password-toggle.is-active { background: var(--panel-soft); color: var(--brand); border-color: var(--line); }

.admin-profile-modal { max-width: 880px; }
.admin-profile-modal form { display: grid; gap: .9rem; }
.admin-profile-flags { border: 1px solid var(--line); border-radius: 12px; padding: .75rem; }
.admin-profile-flags legend { padding: 0 .35rem; color: var(--muted); }

@media (max-width: 640px) {
  .message > .message-actions:first-child,
  .message-actions.top-right {
    position: static;
    justify-content: flex-start;
    margin: 0 0 .45rem 0;
    padding-left: 0;
    flex-wrap: wrap;
  }
  .message .post-body {
    padding-right: 0;
  }
  .message-actions.top-right .quote-button,
  .message-actions.top-right .button {
    font-size: .9rem;
    padding: .28rem .55rem;
  }
}
.relation-actions form[data-social-action].is-loading button {
  opacity: .65;
  pointer-events: none;
}

/* Home feed: keep author identity and activity metadata on distinct rows. */
.feed-card .home-author-line {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
  grid-column: 1 / -1;
  min-width: 0;
}
.feed-card .feed-author-main {
  display: flex;
  align-items: center;
  gap: .5rem;
  min-width: 0;
  flex: 1 1 auto;
  flex-wrap: wrap;
}
.feed-card .feed-author-main .avatar-sm {
  flex: 0 0 auto;
}
.feed-card .feed-author-main .user-pill {
  display: inline-flex;
  align-items: center;
  gap: .22rem;
  min-width: 0;
  max-width: 100%;
  flex-wrap: wrap;
}
.feed-card .feed-status-line {
  margin-left: auto;
  display: flex;
  justify-content: flex-end;
  gap: .35rem;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 45%;
  flex-wrap: wrap;
}
.feed-card > .feed-meta-line {
  grid-column: 1 / -1;
  display: flex;
  align-items: baseline;
  gap: .4rem;
  flex-wrap: wrap;
  min-width: 0;
}
.feed-card > .feed-meta-line a,
.feed-card > .feed-meta-line span {
  overflow-wrap: anywhere;
}
@media (max-width: 640px) {
  .feed-card .home-author-line {
    align-items: flex-start;
  }
  .feed-card .feed-status-line {
    max-width: 50%;
  }
}

/* Home feed follow-up: give author identity more room than activity chips. */
.feed-card .home-author-line {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(8.5rem, 3fr);
  align-items: flex-start;
  gap: .75rem;
}
.feed-card .feed-author-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: .5rem;
  min-width: 0;
}
.feed-card .feed-author-main > a:first-child {
  grid-column: 1;
  grid-row: 1;
}
.feed-card .feed-author-main .user-pill {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  align-items: center;
  gap: .22rem .3rem;
  flex-wrap: wrap;
  min-width: 0;
  max-width: 100%;
}
.feed-card .feed-author-main .user-pill > span:not(:first-child),
.feed-card .feed-author-main .user-pill .status-badge,
.feed-card .feed-author-main .user-pill .verified-badge,
.feed-card .feed-author-main .user-pill .admin-badge,
.feed-card .feed-author-main .user-pill .moderator-badge {
  flex: 0 0 auto;
}
.feed-card .feed-status-line {
  justify-self: end;
  max-width: none;
  width: auto;
  margin-left: 0;
}
.feed-card .feed-meta-detail {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  color: var(--muted);
  font-size: .92rem;
  min-width: 0;
}
@media (max-width: 640px) {
  .feed-card .home-author-line {
    grid-template-columns: minmax(0, 7fr) minmax(4.8rem, 3fr);
    gap: .45rem;
  }
  .feed-card .feed-author-main {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .feed-card .feed-status-line {
    justify-self: end;
    justify-content: flex-end;
    max-width: 100%;
    text-align: right;
  }
  .anonymous-feed-card .feed-status-line {
    display: none;
  }
}

.feed-poll-summary { display:inline-flex; align-items:center; gap:.35rem; flex-wrap:wrap; color:var(--muted); }
.feed-poll-chip { white-space: nowrap; }

.reaction-chip,
.reaction-choice,
.feed-reaction-chip,
.feed-reactions {
  -webkit-user-select: none;
  user-select: none;
}
.feed-reaction-chip {
  cursor: pointer;
}

/* Media viewer: comments need the full bottom-right area, so quick chat is disabled there. */
.media-viewer-overlay ~ .quick-dock,
body:has(.media-viewer-overlay) .quick-dock {
  display: none !important;
}

/* Reaction member modal must always sit above quick chat windows and minimized bubbles. */
.modal-backdrop.active.reaction-list-backdrop,
.modal-backdrop.active:has(.reaction-list-modal) {
  z-index: 2147483647 !important;
}
.reaction-list-backdrop .modal-card,
.modal-backdrop.active:has(.reaction-list-modal) .modal-card {
  z-index: 2147483647 !important;
}


/* Public chat message actions */
.chat-message-context-menu {
  position: fixed;
  z-index: 2147483646;
  min-width: 190px;
  max-width: min(300px, calc(100vw - 20px));
  display: grid;
  gap: .2rem;
  padding: .35rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  box-shadow: var(--shadow);
}
.chat-message-context-menu button { width: 100%; justify-content: flex-start; text-align: left; }
.chat-message-context-separator { height: 1px; margin: .15rem .25rem; background: var(--line); }
.chat-image-lightbox-actions .admin-shift-menu button {
  position: static;
  width: 100%;
  height: auto;
  border-radius: 10px;
  padding: .55rem .7rem;
  font-size: inherit;
  box-shadow: none;
}
.chat-image-lightbox .chat-image-moderation-menu[hidden] { display: none !important; }

.chat-message-inline-editor {
  display: grid;
  gap: .45rem;
  width: min(100%, 720px);
  margin: .1rem 0 .25rem;
}
.chat-message-inline-editor textarea {
  width: 100%;
  min-height: 5.5rem;
  resize: vertical;
  margin: 0;
}
.chat-message-inline-actions {
  display: flex;
  gap: .4rem;
  flex-wrap: wrap;
}
.chat-message-inline-actions button { min-height: 2.35rem; }
.chat-message-edited {
  display: inline-block;
  margin-left: .35rem;
  color: var(--muted);
  font-size: .72rem;
  font-style: italic;
  vertical-align: baseline;
}
.chat-message-editing .chat-message-content > img.chat-gif { opacity: .82; }