:root {
  --forum-bg: #020914;
  --forum-surface: rgba(4, 17, 34, .9);
  --forum-surface-strong: rgba(5, 21, 42, .97);
  --forum-surface-soft: rgba(7, 27, 51, .7);
  --forum-border: rgba(72, 126, 176, .22);
  --forum-border-bright: rgba(34, 211, 238, .48);
  --forum-text: #e8f2ff;
  --forum-muted: #7f93af;
  --forum-blue: #1677ff;
  --forum-cyan: #22d3ee;
  --forum-green: #35d987;
  --forum-red: #fb5f80;
  --forum-violet: #9b5cff;
  --forum-ease-out: cubic-bezier(.23, 1, .32, 1);
  --forum-ease-in-out: cubic-bezier(.77, 0, .175, 1);
}

body[data-route="forum"] {
  background:
    radial-gradient(circle at 68% 18%, rgba(18, 101, 198, .09), transparent 32rem),
    linear-gradient(180deg, #020812, #03101e 62%, #020a15);
}

body[data-route="forum"] main {
  max-width: none;
  padding: 20px clamp(16px, 3vw, 68px) 54px;
}

.forum-community-root,
.forum-community-root * {
  box-sizing: border-box;
}

.forum-community-root {
  width: min(1600px, 100%);
  min-height: 480px;
  margin: 0 auto;
  color: var(--forum-text);
}

.forum-community-root svg,
.admin-forum-root svg,
.forum-modal-layer svg {
  width: 1.1em;
  height: 1.1em;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.forum-page,
.forum-topic-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  align-items: start;
  gap: 16px;
}

.forum-main-column,
.forum-side-column {
  min-width: 0;
}

.forum-main-column {
  display: grid;
  gap: 12px;
}

.forum-side-column {
  display: grid;
  gap: 12px;
}

.forum-community-root .card,
.forum-side-card,
.forum-admin-shell,
.forum-admin-content,
.forum-modal-dialog {
  border: 1px solid var(--forum-border);
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(5, 20, 39, .96), rgba(3, 15, 30, .92));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .018), 0 14px 34px rgba(0, 5, 12, .14);
}

.forum-eyebrow {
  margin: 0;
  color: var(--forum-cyan);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .13em;
}

.forum-hero {
  position: relative;
  min-height: 156px;
  overflow: hidden;
  padding: 22px 34px;
  isolation: isolate;
}

.forum-hero::before,
.forum-category-hero::before,
.forum-topic-header::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: '';
  background:
    linear-gradient(90deg, rgba(2, 12, 25, .99) 0%, rgba(3, 17, 33, .94) 46%, rgba(4, 25, 52, .55) 72%, rgba(3, 17, 34, .94) 100%),
    url('/public/assets/home-overview-phoenix-hero-v1.webp?v=20260806forum2') right 42% / 58% auto no-repeat;
}

.forum-hero::after,
.forum-category-hero::after,
.forum-topic-header::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: '';
  background:
    radial-gradient(circle at 79% 26%, rgba(0, 145, 255, .21), transparent 18%),
    linear-gradient(90deg, transparent 58%, rgba(34, 211, 238, .04));
  pointer-events: none;
}

.forum-hero-art {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.forum-hero-art i {
  position: absolute;
  top: -34px;
  right: 15%;
  width: 290px;
  height: 160px;
  border: 1px solid rgba(55, 149, 239, .12);
  transform: rotate(-10deg) skewX(-22deg);
  background: linear-gradient(140deg, transparent, rgba(29, 115, 226, .06));
}

.forum-hero-copy {
  position: relative;
  z-index: 1;
  max-width: 760px;
}

.forum-hero h1 {
  margin: 5px 0 2px;
  color: #f2f7ff;
  font-size: clamp(27px, 2.2vw, 38px);
  line-height: 1.1;
  letter-spacing: -.035em;
}

.forum-hero-copy > p:last-child {
  margin: 0;
  color: #8da0b9;
  font-size: 13px;
}

.forum-search {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
}

.forum-search label {
  display: flex;
  min-width: 0;
  height: 44px;
  flex: 1;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  border: 1px solid rgba(77, 119, 161, .25);
  border-radius: 8px;
  color: #238cdf;
  background: rgba(2, 12, 25, .84);
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.forum-search label:focus-within {
  border-color: rgba(34, 211, 238, .56);
  box-shadow: 0 0 0 3px rgba(34, 211, 238, .07);
}

.forum-search input {
  width: 100%;
  min-width: 0;
  border: 0 !important;
  outline: 0;
  color: #d9e8fa !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 12px;
}

.forum-search input::placeholder {
  color: #65778f;
}

.forum-search kbd {
  display: inline-flex;
  min-width: 33px;
  height: 20px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(95, 123, 156, .15);
  border-radius: 4px;
  color: #7186a1;
  background: rgba(66, 94, 125, .12);
  font: 700 9px/1 system-ui, sans-serif;
}

.forum-category-tabs {
  display: flex;
  gap: 8px;
  padding: 7px 10px;
  overflow-x: auto;
  border: 1px solid var(--forum-border);
  border-radius: 9px;
  background: rgba(3, 15, 30, .84);
  scrollbar-width: none;
}

.forum-category-tabs::-webkit-scrollbar { display: none; }

.forum-category-tabs button,
.forum-filter-tabs a,
.forum-topic-buttons button,
.forum-moderation-card button,
.forum-admin-tabs button,
.forum-admin-actions button,
.forum-admin-actions a,
.forum-admin-category-card footer button,
.forum-admin-member-grid button,
.forum-admin-ban-list button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  color: #9db0c9;
  background: transparent;
  font: inherit;
  cursor: pointer;
  text-decoration: none;
  transition: transform 140ms var(--forum-ease-out), color 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.forum-category-tabs button {
  min-width: max-content;
  height: 38px;
  padding: 0 18px;
  border-color: rgba(66, 104, 145, .2);
  border-radius: 7px;
  font-size: 11px;
  font-weight: 700;
}

.forum-category-tabs button.active {
  border-color: rgba(34, 211, 238, .64);
  color: #2ae0fa;
  background: linear-gradient(180deg, rgba(17, 112, 171, .22), rgba(9, 59, 95, .12));
  box-shadow: inset 0 0 18px rgba(34, 211, 238, .05);
}

.forum-category-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.forum-category-card {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 164px;
  grid-template-rows: auto auto 1fr;
  padding: 15px 16px 12px;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  opacity: 0;
  transform: translateY(6px);
  animation: forum-card-in 240ms var(--forum-ease-out) forwards;
  animation-delay: var(--forum-stagger, 0ms);
}

.forum-category-card[hidden] { display: none !important; }

@keyframes forum-card-in {
  to { opacity: 1; transform: translateY(0); }
}

.forum-category-top {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 14px;
  align-items: start;
  gap: 10px;
}

.forum-category-icon {
  --forum-category: #22d3ee;
  display: inline-grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--forum-category) 40%, transparent);
  border-radius: 50%;
  color: var(--forum-category);
  background: color-mix(in srgb, var(--forum-category) 10%, #04101e 90%);
  box-shadow: inset 0 0 20px color-mix(in srgb, var(--forum-category) 7%, transparent), 0 0 20px color-mix(in srgb, var(--forum-category) 5%, transparent);
}

.forum-category-icon svg { width: 23px; height: 23px; stroke-width: 1.8; }
.forum-category-icon.is-large { width: 64px; height: 64px; }
.forum-category-icon.is-large svg { width: 31px; height: 31px; }

.forum-category-top h3 {
  margin: 3px 0 4px;
  color: #e5effb;
  font-size: 13px;
  line-height: 1.2;
}

.forum-category-top p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: #8294ab;
  font-size: 10px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.forum-card-arrow {
  margin-top: 8px;
  color: #8195ae;
}

.forum-category-counts {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 12px 0 10px;
  color: #9cb1ca;
  font-size: 10px;
}

.forum-category-counts strong { color: #bccce0; font-size: 12px; }
.forum-category-counts i { width: 2px; height: 2px; border-radius: 50%; background: #526983; }

.forum-category-last {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 9px;
  padding-top: 9px;
  border-top: 1px solid rgba(84, 117, 151, .12);
}

.forum-category-last > span:not(.forum-category-empty) {
  display: grid;
  min-width: 0;
  gap: 1px;
}

.forum-category-last small,
.forum-category-last em {
  overflow: hidden;
  color: #687c96;
  font-size: 9px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.forum-category-last small b { color: #6c9dd3; font-weight: 600; }
.forum-category-last strong { overflow: hidden; color: #aebfd3; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }

.forum-category-empty {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #5d718c;
  font-size: 9px;
}

.forum-side-card {
  min-width: 0;
  padding: 13px 14px;
}

.forum-side-card > h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  color: #e1ebf8;
  font-size: 12px;
}

.forum-side-card > h2 svg { color: #8fa9c8; }
.forum-side-title { display: flex; align-items: center; gap: 10px; }

.forum-side-title > svg {
  width: 40px;
  height: 40px;
  padding: 10px;
  border: 1px solid rgba(89, 127, 166, .28);
  border-radius: 7px;
  color: #a9c2dd;
  background: rgba(48, 81, 116, .19);
}

.forum-side-title span { display: grid; gap: 2px; }
.forum-side-title strong { color: #e8f1fd; font-size: 12px; }
.forum-side-title small { color: #7a8ca4; font-size: 9px; line-height: 1.45; }

.forum-primary-button,
.forum-secondary-button,
.forum-danger-button {
  display: inline-flex !important;
  min-height: 38px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border-radius: 6px !important;
  padding: 0 16px !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  transition: transform 140ms var(--forum-ease-out), filter 180ms ease, box-shadow 180ms ease !important;
}

.forum-primary-button {
  border: 1px solid rgba(61, 135, 255, .88) !important;
  color: #fff !important;
  background: linear-gradient(180deg, #1681ff, #075bea) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24), 0 8px 20px rgba(7, 92, 238, .22) !important;
}

.forum-secondary-button {
  border: 1px solid rgba(103, 137, 171, .28) !important;
  color: #b9c9db !important;
  background: rgba(20, 43, 67, .62) !important;
}

.forum-danger-button {
  border: 1px solid rgba(251, 95, 128, .5) !important;
  color: #fff !important;
  background: linear-gradient(180deg, #ed4267, #b91e45) !important;
}

.forum-primary-button:disabled,
.forum-secondary-button:disabled,
.forum-danger-button:disabled {
  opacity: .45;
  cursor: not-allowed;
  filter: grayscale(.4);
}

.forum-create-card .forum-primary-button { width: 100%; margin-top: 12px; }

.forum-side-list {
  display: grid;
}

.forum-compact-topic {
  display: grid;
  min-width: 0;
  grid-template-columns: 21px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid rgba(82, 115, 150, .1);
  color: inherit;
  text-decoration: none;
}

.forum-compact-topic:last-child { border-bottom: 0; }
.forum-compact-topic > b { display: grid; width: 19px; height: 19px; place-items: center; border: 1px solid rgba(98, 128, 160, .24); border-radius: 50%; color: #8196af; font-size: 9px; }
.forum-compact-topic > span { display: grid; min-width: 0; gap: 2px; }
.forum-compact-topic strong { overflow: hidden; color: #b9c8dc; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.forum-compact-topic small { overflow: hidden; color: #647993; font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }
.forum-compact-topic small em { color: var(--topic-color, var(--forum-cyan)); font-style: normal; }

.forum-recent-list > a {
  display: grid;
  min-width: 0;
  grid-template-columns: 27px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid rgba(82, 115, 150, .1);
  color: inherit;
  text-decoration: none;
}

.forum-recent-list > a:last-child { border-bottom: 0; }
.forum-recent-list > a > span { display: grid; min-width: 0; gap: 2px; }
.forum-recent-list strong { overflow: hidden; color: #b9c8dc; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.forum-recent-list small { color: #62768e; font-size: 8px; }
.forum-recent-list em { max-width: 78px; overflow: hidden; color: #3a8bc1; font-size: 7.5px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }

.forum-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.forum-stat {
  display: grid;
  place-items: center;
  gap: 3px;
  border-right: 1px solid rgba(87, 122, 156, .13);
  color: #7790ab;
}

.forum-stat:last-child { border-right: 0; }
.forum-stat svg { width: 15px; height: 15px; }
.forum-stat strong { color: #d5e2f2; font-size: 15px; }
.forum-stat small { font-size: 7px; }
.forum-stat.is-active svg { color: var(--forum-green); filter: drop-shadow(0 0 6px rgba(53, 217, 135, .45)); }

.forum-avatar {
  --forum-avatar-size: 42px;
  position: relative;
  display: inline-grid;
  width: var(--forum-avatar-size);
  height: var(--forum-avatar-size);
  flex: 0 0 auto;
  place-items: center;
  isolation: isolate;
}

.forum-avatar-xxs { --forum-avatar-size: 24px; }
.forum-avatar-xs { --forum-avatar-size: 29px; }
.forum-avatar-sm { --forum-avatar-size: 35px; }
.forum-avatar-md { --forum-avatar-size: 44px; }
.forum-avatar-lg { --forum-avatar-size: 59px; }

.forum-avatar-core {
  position: relative;
  z-index: 1;
  display: grid;
  width: 82%;
  height: 82%;
  overflow: hidden;
  place-items: center;
  border: 1px solid rgba(82, 146, 200, .72);
  border-radius: 50%;
  color: #d9e9fb;
  background: linear-gradient(145deg, #173653, #08182a);
  box-shadow: 0 0 0 2px rgba(4, 14, 26, .85);
}

.forum-avatar-core img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.forum-avatar-core b { font-size: calc(var(--forum-avatar-size) * .23); }

.forum-avatar-frame {
  position: absolute;
  z-index: 2;
  inset: -9%;
  background: var(--forum-frame-image) center / contain no-repeat;
  pointer-events: none;
  filter: drop-shadow(0 0 5px rgba(56, 155, 255, .24));
}

.forum-avatar > em {
  position: absolute;
  z-index: 3;
  right: 4%;
  bottom: 5%;
  width: max(5px, 13%);
  height: max(5px, 13%);
  border: 1.5px solid #061321;
  border-radius: 50%;
  background: var(--forum-green);
  box-shadow: 0 0 7px rgba(53, 217, 135, .65);
}

.forum-breadcrumb {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  padding: 0 3px;
  overflow: hidden;
  color: #657c98;
  font-size: 9px;
  white-space: nowrap;
}

.forum-breadcrumb a { color: #3d94cf; text-decoration: none; }
.forum-breadcrumb strong { overflow: hidden; color: #9cb1c8; text-overflow: ellipsis; }
.forum-breadcrumb svg { width: 9px; height: 9px; color: #5b6e84; }

.forum-category-hero {
  position: relative;
  min-height: 174px;
  overflow: hidden;
  padding: 17px 20px 12px;
  isolation: isolate;
}

.forum-category-hero::before {
  background:
    linear-gradient(90deg, rgba(2, 13, 26, .98) 0%, rgba(3, 19, 37, .92) 50%, rgba(3, 20, 40, .45) 100%),
    url('/public/assets/home-overview-phoenix-hero-v1.webp?v=20260806forum2') right 43% / 58% auto no-repeat;
}

.forum-category-heading {
  display: flex;
  align-items: center;
  gap: 18px;
}

.forum-category-heading h1 { margin: 0 0 4px; color: #eef5ff; font-size: 20px; letter-spacing: -.02em; }
.forum-category-heading p { max-width: 600px; margin: 0 0 7px; color: #879bb4; font-size: 10px; line-height: 1.45; }
.forum-category-heading > div > span { display: flex; align-items: center; gap: 7px; color: #8094ae; font-size: 9px; }
.forum-category-heading > div > span svg { width: 11px; height: 11px; }
.forum-category-heading > div > span i { width: 3px; height: 3px; border-radius: 50%; background: #526983; }
.forum-category-heading > div > span b { color: #8fe4ad; }

.forum-category-search { margin-top: 12px; }
.forum-category-search label { height: 40px; }
.forum-category-search .forum-primary-button { min-width: 240px; }

.forum-filter-button {
  display: inline-flex;
  height: 38px;
  align-items: center;
  gap: 7px;
  padding: 0 16px;
  border: 1px solid rgba(81, 122, 163, .32);
  border-radius: 7px;
  color: #b8c6d8;
  background: rgba(4, 15, 28, .74);
  cursor: pointer;
  font-size: 10px;
}

.forum-topic-table { overflow: hidden; }
.forum-topic-toolbar { display: flex; min-height: 46px; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 11px; border-bottom: 1px solid var(--forum-border); background: rgba(2, 13, 26, .66); }
.forum-filter-tabs { display: flex; gap: 5px; overflow-x: auto; scrollbar-width: none; }
.forum-filter-tabs a { min-width: max-content; height: 30px; padding: 0 13px; border-color: rgba(83, 118, 153, .14); border-radius: 6px; font-size: 9px; font-weight: 700; }
.forum-filter-tabs a.active { border-color: rgba(34, 211, 238, .5); color: #36d9f5; background: rgba(16, 110, 159, .16); }
.forum-filter-tabs a i { width: 5px; height: 5px; border-radius: 50%; background: var(--forum-cyan); box-shadow: 0 0 8px var(--forum-cyan); }
.forum-topic-toolbar > label { color: #71849c; font-size: 9px; white-space: nowrap; }
.forum-topic-toolbar select { border: 0; outline: 0; color: #9fb2ca; background: #07182b; font-size: 9px; }

.forum-topic-table-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 78px 68px 220px;
  min-height: 30px;
  align-items: center;
  padding: 0 34px 0 56px;
  border-bottom: 1px solid rgba(76, 112, 149, .16);
  color: #677b94;
  font-size: 8px;
}

.forum-topic-list { display: grid; }

.forum-topic-row {
  display: grid;
  min-width: 0;
  min-height: 58px;
  grid-template-columns: 22px 38px minmax(0, 1fr) 78px 68px 220px 12px;
  align-items: center;
  gap: 9px;
  padding: 6px 12px;
  border-bottom: 1px solid rgba(74, 106, 139, .14);
  color: inherit;
  text-decoration: none;
  transition: background-color 180ms ease, transform 180ms var(--forum-ease-out);
}

.forum-topic-row:last-child { border-bottom: 0; }
.forum-topic-state { display: grid; place-items: center; color: #8ba2bd; }
.forum-topic-state i { width: 7px; height: 7px; border-radius: 50%; background: #149ee5; box-shadow: 0 0 10px rgba(20, 158, 229, .7); }
.forum-topic-state svg { width: 13px; height: 13px; }
.forum-topic-copy { display: grid; min-width: 0; gap: 3px; }
.forum-topic-copy > strong { display: flex; min-width: 0; align-items: center; gap: 7px; overflow: hidden; color: #d9e4f2; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.forum-topic-copy > small { display: flex; align-items: center; gap: 6px; color: #6e829b; font-size: 8.5px; }
.forum-topic-copy > small i { width: 3px; height: 3px; border-radius: 50%; background: #536981; }
.forum-topic-badges { display: inline-flex; align-items: center; gap: 4px; }

.forum-badge {
  display: inline-flex;
  height: 17px;
  align-items: center;
  padding: 0 7px;
  border: 1px solid rgba(56, 137, 224, .55);
  border-radius: 999px;
  color: #54a5ff;
  background: rgba(19, 91, 172, .11);
  font-size: 7px;
  font-weight: 700;
  line-height: 1;
}

.forum-badge.is-important { border-color: rgba(251, 95, 128, .48); color: #fb7185; background: rgba(133, 24, 52, .13); }
.forum-badge.is-resolved { border-color: rgba(53, 217, 135, .46); color: #4ade80; background: rgba(20, 105, 66, .12); }
.forum-badge.is-closed { border-color: rgba(139, 154, 177, .4); color: #9eacc0; background: rgba(73, 86, 109, .13); }

.forum-topic-metric { display: grid; place-items: center; gap: 2px; }
.forum-topic-metric strong { color: #d9e5f5; font-size: 12px; }
.forum-topic-metric small { color: #6a7d95; font-size: 8px; }
.forum-topic-last { display: flex; min-width: 0; align-items: center; gap: 7px; }
.forum-topic-last > span { display: grid; min-width: 0; gap: 2px; }
.forum-topic-last strong { overflow: hidden; color: #659ed0; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.forum-topic-last small { color: #74869e; font-size: 8px; }
.forum-row-arrow { color: #72869e; }

.forum-category-about { display: grid; justify-items: center; text-align: center; }
.forum-category-about h2 { margin: 10px 0 5px; }
.forum-category-about > p { margin: 0; color: #8195ad; font-size: 9.5px; line-height: 1.45; }
.forum-about-stats { display: grid; width: 100%; grid-template-columns: repeat(3, 1fr); margin: 13px 0; }
.forum-about-stats span { display: grid; gap: 2px; border-right: 1px solid rgba(85, 117, 150, .14); }
.forum-about-stats span:last-child { border-right: 0; }
.forum-about-stats strong { color: #e7eff9; font-size: 14px; }
.forum-about-stats small { color: #71859e; font-size: 8px; }
.forum-category-about .forum-primary-button { width: 100%; }

.forum-contributor-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 6px; }
.forum-contributor-grid > span { display: grid; min-width: 0; justify-items: center; gap: 3px; }
.forum-contributor-grid small { width: 100%; overflow: hidden; color: #8198b2; font-size: 7px; text-align: center; text-overflow: ellipsis; white-space: nowrap; }

.forum-definition-list { display: grid; gap: 5px; margin: 0; }
.forum-definition-list div { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.forum-definition-list dt { color: #71859d; font-size: 8.5px; }
.forum-definition-list dd { margin: 0; color: #cad7e7; font-size: 9px; font-weight: 700; text-align: right; }

.forum-topic-page { display: grid; gap: 12px; }
.forum-topic-header { position: relative; display: grid; min-height: 112px; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 18px; padding: 14px 16px; overflow: hidden; isolation: isolate; }
.forum-topic-header::before { background: linear-gradient(90deg, rgba(2, 13, 26, .98), rgba(3, 19, 37, .9) 58%, rgba(3, 20, 40, .45)), url('/public/assets/home-overview-phoenix-hero-v1.webp?v=20260806forum2') right center / 52% auto no-repeat; }
.forum-topic-header h1 { display: flex; align-items: center; gap: 8px; margin: 0 0 7px; color: #eef5ff; font-size: 19px; letter-spacing: -.02em; }
.forum-topic-header h1 svg { color: #8ca1ba; }
.forum-topic-header p { margin: 0 0 9px; }
.forum-topic-header > div:first-of-type > span { display: flex; align-items: center; gap: 8px; color: #778ba4; font-size: 8.5px; }
.forum-topic-header > div:first-of-type > span svg { width: 11px; height: 11px; }
.forum-topic-header > div:first-of-type > span b { color: #488fca; }
.forum-topic-buttons { display: flex; max-width: 310px; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.forum-topic-buttons > button:not(.forum-primary-button) { min-height: 34px; padding: 0 12px; border-color: rgba(89, 122, 157, .25); border-radius: 6px; color: #9dafc5; background: rgba(6, 21, 39, .68); font-size: 8.5px; }

.forum-post-list { display: grid; gap: 7px; }
.forum-post { display: grid; min-width: 0; grid-template-columns: 176px minmax(0, 1fr); overflow: hidden; border: 1px solid var(--forum-border); border-radius: 8px; background: linear-gradient(90deg, rgba(5, 21, 39, .98), rgba(4, 19, 37, .94)); }
.forum-post.is-staff { border-color: rgba(244, 69, 133, .72); box-shadow: inset 0 0 26px rgba(205, 41, 102, .035); }
.forum-post.is-deleted { opacity: .72; }
.forum-post-author { display: grid; align-content: start; justify-items: center; gap: 3px; padding: 12px 8px; border-right: 1px solid rgba(67, 109, 151, .22); background: rgba(3, 16, 31, .62); text-align: center; }
.forum-post-author > strong { max-width: 100%; overflow: hidden; color: #8e70e8; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.forum-post.is-staff .forum-post-author > strong { color: #f2629a; }
.forum-grade { display: inline-flex; align-items: center; gap: 4px; padding: 2px 6px; border: 1px solid rgba(89, 116, 148, .25); border-radius: 3px; color: #9aabc0; font-size: 7px; }
.forum-grade.is-staff { border-color: rgba(244, 69, 133, .38); color: #f15f96; }
.forum-grade svg { width: 8px; height: 8px; }
.forum-post-author > small { color: #70849e; font-size: 8px; }
.forum-post-author > small b { color: #a7bbd2; }
.forum-post-content { display: grid; min-width: 0; grid-template-rows: auto 1fr auto; padding: 9px 12px 7px; }
.forum-post-content > header { display: flex; min-height: 19px; align-items: start; justify-content: space-between; gap: 10px; color: #71869f; font-size: 8px; }
.forum-post-content > header em { display: inline-flex; align-items: center; gap: 5px; color: #46d689; font-size: 8px; font-style: normal; }
.forum-post.is-staff .forum-post-content > header em { color: #f35d96; }
.forum-post-body { color: #b2c2d5; font-size: 9.5px; line-height: 1.6; overflow-wrap: anywhere; }
.forum-mention { color: #3bbcff; font-weight: 700; }
.forum-edit-note { display: flex; align-items: center; gap: 5px; margin: 9px 0 0; color: #687e99; font-size: 7.5px; }
.forum-edit-note svg { width: 9px; height: 9px; }
.forum-edit-note b { color: #43a8e8; }
.forum-post-content > footer { display: flex; min-height: 22px; align-items: end; gap: 12px; color: #4d98d0; }
.forum-post-content > footer > button { display: inline-flex; align-items: center; gap: 5px; padding: 0; border: 0; color: #458fc8; background: transparent; cursor: pointer; font-size: 8px; }
.forum-post-content > footer > button svg { width: 10px; height: 10px; }
.forum-post-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.forum-post-actions button { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; color: #8398b1; background: transparent; cursor: pointer; font-size: 8px; }
.forum-post-actions button.is-danger { color: #e85e7e; }
.forum-deleted-message { display: flex; align-items: center; gap: 8px; color: #788ba1; font-size: 9px; font-style: italic; }
.forum-deleted-message b { color: #ea6688; }

.forum-reply-composer { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 10px; padding: 10px; }
.forum-reply-composer > .forum-avatar { margin: 4px auto 0; }
.forum-reply-composer form { display: grid; min-width: 0; overflow: hidden; border: 1px solid rgba(70, 110, 151, .22); border-radius: 7px; background: rgba(2, 13, 26, .65); }
.forum-editor-toolbar { display: flex; min-height: 32px; align-items: center; gap: 16px; padding: 0 13px; border-bottom: 1px solid rgba(70, 104, 139, .15); color: #8598b0; font-size: 10px; }
.forum-reply-composer textarea { width: 100%; min-height: 68px; resize: vertical; border: 0 !important; outline: 0; padding: 10px 13px; color: #c4d1e1 !important; background: transparent !important; box-shadow: none !important; font: inherit; font-size: 9px; }
.forum-reply-composer form > footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 10px; }
.forum-reply-composer form > footer small { display: flex; align-items: center; gap: 5px; color: #657b95; font-size: 8px; }

.forum-topic-category-card { display: grid; justify-items: center; text-align: center; }
.forum-topic-category-card h2 { margin: 9px 0 4px; }
.forum-topic-category-card > p { margin: 0; color: #7a8ea6; font-size: 9px; line-height: 1.45; }
.forum-topic-category-card > a { display: flex; width: 100%; align-items: center; justify-content: center; gap: 6px; margin-top: 10px; padding-top: 9px; border-top: 1px solid rgba(78, 111, 145, .14); color: #3aa3df; font-size: 8.5px; text-decoration: none; }

.forum-moderation-card { display: grid; gap: 6px; }
.forum-moderation-card button { min-height: 32px; justify-content: flex-start; padding: 0 10px; border-color: rgba(79, 115, 151, .2); border-radius: 5px; color: #a0b3ca; background: rgba(8, 26, 46, .5); font-size: 8.5px; }
.forum-moderation-card button.is-danger { border-color: rgba(251, 95, 128, .25); color: #f1728f; background: rgba(105, 22, 46, .1); }

.forum-search-results { overflow: hidden; }
.forum-search-results > header { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 13px 16px; border-bottom: 1px solid var(--forum-border); }
.forum-search-results h2 { margin: 2px 0 0; font-size: 14px; }
.forum-search-results > header a { color: #42bde8; font-size: 9px; text-decoration: none; }
.forum-search-results .forum-topic-row { grid-template-columns: 22px 38px minmax(0, 1fr) 78px 68px 220px 12px; }

.forum-empty {
  display: grid;
  min-height: 110px;
  place-items: center;
  align-content: center;
  gap: 4px;
  padding: 18px;
  color: #586e88;
  text-align: center;
}

.forum-empty svg { width: 22px; height: 22px; color: #417da6; }
.forum-empty strong { color: #9db0c6; font-size: 10px; }
.forum-empty p { margin: 0; font-size: 8.5px; }

.forum-loading,
.forum-error,
.forum-blocked {
  display: grid;
  width: min(640px, 100%);
  min-height: 310px;
  margin: 60px auto;
  place-items: center;
  align-content: center;
  gap: 9px;
  padding: 35px;
  text-align: center;
}

.forum-loading i { width: 30px; height: 30px; border: 2px solid rgba(34, 211, 238, .17); border-top-color: var(--forum-cyan); border-radius: 50%; animation: forum-spin 780ms linear infinite; }
@keyframes forum-spin { to { transform: rotate(360deg); } }
.forum-loading strong { color: #dbe8f7; font-size: 14px; }
.forum-loading span { color: #6f849e; font-size: 9px; }
.forum-error > svg,
.forum-blocked > svg { width: 48px; height: 48px; color: var(--forum-red); }
.forum-error h1,
.forum-blocked h1 { margin: 0; color: #e9f2fc; font-size: 22px; }
.forum-error p,
.forum-blocked p { max-width: 480px; margin: 0; color: #8397af; font-size: 11px; line-height: 1.55; }
.forum-blocked small { color: #f28aa1; font-size: 9px; }
.forum-error .forum-primary-button,
.forum-blocked .forum-primary-button { margin-top: 8px; }

.forum-author-mini { display: inline-flex; min-width: 0; align-items: center; gap: 7px; }
.forum-author-mini > span:last-child { display: grid; min-width: 0; }
.forum-author-mini strong { overflow: hidden; color: #c9d8ea; font-size: 9px; text-overflow: ellipsis; }
.forum-author-mini small { color: #70859e; font-size: 7px; }

.forum-modal-layer {
  position: fixed;
  z-index: 10010;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
}

.forum-modal-layer[hidden] { display: none !important; }
.forum-modal-backdrop { position: absolute; inset: 0; border: 0; background: rgba(0, 5, 13, .82); backdrop-filter: blur(8px); }
.forum-modal-dialog { position: relative; width: min(680px, 100%); max-height: min(820px, calc(100dvh - 32px)); overflow: auto; background: linear-gradient(145deg, #081b31, #041323 65%, #06192c); box-shadow: 0 28px 90px rgba(0, 0, 0, .58); animation: forum-modal-in 220ms var(--forum-ease-out) both; }
@keyframes forum-modal-in { from { opacity: 0; transform: translateY(8px) scale(.98); } }
.forum-modal-dialog > header { position: sticky; z-index: 2; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 15px 18px; border-bottom: 1px solid var(--forum-border); background: rgba(5, 20, 37, .96); backdrop-filter: blur(12px); }
.forum-modal-dialog > header h2 { margin: 3px 0 0; color: #eaf3fe; font-size: 17px; }
.forum-modal-dialog > header > button { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(91, 128, 165, .24); border-radius: 6px; color: #9db1c8; background: rgba(13, 37, 59, .52); cursor: pointer; font-size: 20px; }
.forum-modal-dialog form { display: grid; gap: 13px; padding: 18px; }
.forum-modal-dialog label { display: grid; gap: 6px; color: #9cb0c6; font-size: 9px; font-weight: 700; }
.forum-modal-dialog input,
.forum-modal-dialog select,
.forum-modal-dialog textarea { width: 100%; border: 1px solid rgba(86, 126, 165, .26) !important; border-radius: 6px; outline: 0; padding: 10px 11px; color: #d7e3f1 !important; background: rgba(2, 14, 27, .82) !important; box-shadow: none !important; font: inherit; font-size: 10px; transition: border-color 180ms ease, box-shadow 180ms ease; }
.forum-modal-dialog input:focus,
.forum-modal-dialog select:focus,
.forum-modal-dialog textarea:focus { border-color: rgba(34, 211, 238, .5) !important; box-shadow: 0 0 0 3px rgba(34, 211, 238, .06) !important; }
.forum-modal-dialog textarea { min-height: 150px; resize: vertical; line-height: 1.55; }
.forum-modal-dialog label small { color: #657a94; font-size: 8px; font-weight: 400; }
.forum-modal-dialog form > footer { display: flex; justify-content: flex-end; gap: 8px; padding-top: 4px; }
.forum-modal-message { margin: 0; padding: 9px 11px; border: 1px solid rgba(251, 95, 128, .26); border-radius: 6px; color: #fb8ba2; background: rgba(116, 24, 49, .11); font-size: 9px; }
body.forum-modal-open { overflow: hidden; }

.forum-modal-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.forum-modal-grid .is-wide { grid-column: 1 / -1; }
.forum-modal-toggles { display: flex; flex-wrap: wrap; gap: 8px; }
.forum-modal-toggles label { display: inline-flex; min-height: 34px; grid-template-columns: auto 1fr; align-items: center; gap: 7px; padding: 0 10px; border: 1px solid rgba(83, 120, 158, .2); border-radius: 6px; background: rgba(8, 27, 47, .58); }
.forum-modal-toggles input { width: 14px; height: 14px; padding: 0; accent-color: var(--forum-cyan); }

.admin-forum-root { min-height: 360px; }
.forum-admin-shell { display: grid; gap: 13px; padding: 14px; }
.forum-admin-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.forum-admin-stat { display: flex; min-width: 0; align-items: center; gap: 11px; padding: 13px; border: 1px solid rgba(75, 111, 148, .2); border-radius: 8px; background: linear-gradient(145deg, rgba(8, 31, 55, .8), rgba(5, 21, 40, .7)); }
.forum-admin-stat > svg { width: 31px; height: 31px; padding: 7px; border: 1px solid rgba(34, 211, 238, .22); border-radius: 7px; color: var(--forum-cyan); background: rgba(34, 211, 238, .06); }
.forum-admin-stat > span { display: grid; min-width: 0; }
.forum-admin-stat small { color: #71859d; font-size: 8px; text-transform: uppercase; letter-spacing: .06em; }
.forum-admin-stat strong { color: #e7f0fa; font-size: 19px; }

.forum-admin-tabs { display: flex; gap: 6px; padding: 5px; overflow-x: auto; border: 1px solid rgba(76, 111, 148, .2); border-radius: 8px; background: rgba(3, 16, 30, .62); scrollbar-width: none; }
.forum-admin-tabs button { min-width: max-content; min-height: 34px; padding: 0 14px; border-radius: 6px; font-size: 9px; font-weight: 700; }
.forum-admin-tabs button.active { border-color: rgba(34, 211, 238, .44); color: #35daf4; background: rgba(21, 111, 160, .14); }
.forum-admin-content { min-height: 300px; padding: 14px; }
.forum-admin-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.forum-admin-section-head h3 { margin: 0 0 3px; color: #e6effa; font-size: 15px; }
.forum-admin-section-head p { margin: 0; color: #73879f; font-size: 9px; }

.forum-admin-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.forum-admin-category-card { display: grid; min-width: 0; gap: 9px; padding: 12px; border: 1px solid rgba(74, 111, 149, .22); border-radius: 8px; background: rgba(5, 23, 42, .7); }
.forum-admin-category-card.is-hidden { opacity: .6; }
.forum-admin-category-card > header { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 8px; }
.forum-admin-category-card .forum-category-icon { width: 42px; height: 42px; }
.forum-admin-category-card header > span { display: grid; min-width: 0; }
.forum-admin-category-card header strong { overflow: hidden; color: #dce8f6; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.forum-admin-category-card header small { color: #627791; font-size: 7.5px; }
.forum-admin-category-card header em { padding: 3px 6px; border: 1px solid rgba(53, 217, 135, .25); border-radius: 999px; color: #4ade80; background: rgba(33, 113, 73, .1); font-size: 7px; font-style: normal; }
.forum-admin-category-card.is-hidden header em { border-color: rgba(137, 151, 173, .24); color: #929fb2; background: rgba(77, 88, 106, .1); }
.forum-admin-category-card > p { min-height: 29px; margin: 0; color: #788da5; font-size: 8.5px; line-height: 1.45; }
.forum-admin-category-card dl { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; }
.forum-admin-category-card dl div { display: grid; justify-items: center; border-right: 1px solid rgba(82, 116, 150, .14); }
.forum-admin-category-card dl div:last-child { border-right: 0; }
.forum-admin-category-card dt { color: #687c95; font-size: 7px; }
.forum-admin-category-card dd { margin: 0; color: #c7d6e7; font-size: 10px; font-weight: 700; }
.forum-admin-category-card footer { display: flex; gap: 6px; padding-top: 8px; border-top: 1px solid rgba(78, 113, 148, .13); }
.forum-admin-category-card footer button { min-height: 30px; flex: 1; padding: 0 9px; border-color: rgba(77, 114, 151, .22); border-radius: 5px; background: rgba(8, 28, 49, .55); font-size: 8px; }
.forum-admin-category-card footer button.is-danger { flex: 0 0 auto; border-color: rgba(251, 95, 128, .2); color: #f1718d; }

.forum-admin-table { overflow: hidden; border: 1px solid rgba(74, 110, 146, .2); border-radius: 8px; }
.forum-admin-table-head,
.forum-admin-table > article { display: grid; grid-template-columns: minmax(230px, 1.5fr) minmax(120px, .7fr) minmax(110px, .6fr) minmax(120px, .6fr) 180px; align-items: center; gap: 10px; padding: 8px 10px; }
.forum-admin-table-head { min-height: 32px; color: #657992; background: rgba(2, 14, 27, .75); font-size: 7.5px; text-transform: uppercase; letter-spacing: .05em; }
.forum-admin-table > article { min-height: 51px; border-top: 1px solid rgba(73, 107, 143, .13); color: #8da1b9; font-size: 8px; }
.forum-admin-topic-title { display: flex; min-width: 0; align-items: center; gap: 8px; }
.forum-admin-topic-title > span { display: grid; min-width: 0; }
.forum-admin-topic-title strong { overflow: hidden; color: #cbd9e9; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.forum-admin-topic-title small { color: #647891; font-size: 7px; }
.forum-admin-actions { display: flex; justify-content: flex-end; gap: 5px; }
.forum-admin-actions button,
.forum-admin-actions a { min-height: 27px; padding: 0 8px; border-color: rgba(77, 114, 151, .22); border-radius: 5px; color: #93a7be; background: rgba(8, 28, 49, .55); font-size: 7.5px; }
.forum-admin-actions .is-danger { color: #f1718d; }

.forum-admin-search { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; padding: 8px; border: 1px solid rgba(73, 110, 147, .2); border-radius: 8px; background: rgba(3, 17, 31, .64); }
.forum-admin-search > svg { margin-left: 5px; color: #6d84a0; }
.forum-admin-search input { min-width: 0; flex: 1; border: 0 !important; outline: 0; color: #cedbea !important; background: transparent !important; box-shadow: none !important; font-size: 9px; }

.forum-admin-member-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.forum-admin-member-grid article,
.forum-admin-ban-list article { display: flex; min-width: 0; align-items: center; gap: 10px; padding: 10px; border: 1px solid rgba(75, 111, 148, .2); border-radius: 8px; background: rgba(5, 23, 42, .68); }
.forum-admin-member-grid article > span,
.forum-admin-ban-list article > span { display: grid; min-width: 0; flex: 1; }
.forum-admin-member-grid strong,
.forum-admin-ban-list strong { overflow: hidden; color: #d5e2f1; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.forum-admin-member-grid small,
.forum-admin-ban-list small { overflow: hidden; color: #657a94; font-size: 7.5px; text-overflow: ellipsis; white-space: nowrap; }
.forum-admin-member-grid em { color: #8197b0; font-size: 7.5px; font-style: normal; }
.forum-admin-member-grid button,
.forum-admin-ban-list button { min-height: 30px; padding: 0 9px; border-color: rgba(251, 95, 128, .26); border-radius: 5px; color: #f47a95; background: rgba(110, 25, 50, .1); font-size: 8px; }
.forum-admin-member-grid .forum-unban-button,
.forum-admin-ban-list .forum-unban-button { border-color: rgba(53, 217, 135, .26); color: #5cde94; background: rgba(25, 103, 64, .1); }
.forum-admin-ban-list { display: grid; gap: 8px; }
.forum-admin-ban-list p { margin: 2px 0; color: #899db5; font-size: 8.5px; }

.forum-admin-audit { display: grid; }
.forum-admin-audit article { display: flex; align-items: center; gap: 10px; padding: 9px; border-bottom: 1px solid rgba(75, 108, 141, .13); }
.forum-admin-audit article > svg { width: 25px; height: 25px; padding: 5px; border: 1px solid rgba(34, 211, 238, .18); border-radius: 50%; color: #3fbddd; }
.forum-admin-audit article > span { display: grid; color: #9db0c6; font-size: 8.5px; }
.forum-admin-audit strong { color: #3eb9ec; }
.forum-admin-audit small { color: #637992; font-size: 7.5px; }

@media (hover: hover) and (pointer: fine) {
  .forum-category-card:hover { border-color: rgba(34, 211, 238, .35); transform: translateY(-2px); background: linear-gradient(145deg, rgba(7, 27, 50, .98), rgba(4, 19, 37, .95)); }
  .forum-category-card:hover .forum-card-arrow { color: var(--forum-cyan); transform: translateX(2px); }
  .forum-topic-row:hover { background: rgba(17, 62, 99, .15); transform: translateX(2px); }
  .forum-compact-topic:hover strong,
  .forum-recent-list > a:hover strong { color: #e0e9f5; }
  .forum-primary-button:hover { filter: brightness(1.1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 10px 24px rgba(7, 92, 238, .3) !important; }
  .forum-category-tabs button:hover,
  .forum-filter-tabs a:hover,
  .forum-topic-buttons button:hover,
  .forum-moderation-card button:hover,
  .forum-admin-tabs button:hover { color: #d5e4f6; border-color: rgba(88, 135, 180, .38); }
}

.forum-primary-button:active,
.forum-secondary-button:active,
.forum-danger-button:active,
.forum-category-tabs button:active,
.forum-filter-tabs a:active,
.forum-topic-buttons button:active,
.forum-moderation-card button:active,
.forum-admin-tabs button:active,
.forum-admin-actions button:active,
.forum-admin-category-card footer button:active,
.forum-admin-member-grid button:active,
.forum-admin-ban-list button:active {
  transform: scale(.97);
}

@media (max-width: 1320px) {
  .forum-category-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .forum-admin-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forum-topic-table-head { grid-template-columns: minmax(0, 1fr) 70px 62px 180px; }
  .forum-topic-row { grid-template-columns: 20px 36px minmax(0, 1fr) 70px 62px 180px 10px; }
}

@media (max-width: 1120px) {
  body[data-route="forum"] main { padding-inline: 14px; }
  .forum-page,
  .forum-topic-layout { grid-template-columns: 1fr; }
  .forum-side-column { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forum-create-card,
  .forum-category-about,
  .forum-topic-category-card { grid-column: 1 / -1; }
  .forum-create-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; }
  .forum-create-card .forum-primary-button { width: auto; margin-top: 0; }
  .forum-category-about { grid-template-columns: auto 1fr; justify-items: start; gap: 10px 15px; text-align: left; }
  .forum-category-about .forum-category-icon { grid-row: 1 / 3; }
  .forum-category-about h2 { align-self: end; margin: 0; }
  .forum-category-about > p { align-self: start; }
  .forum-about-stats,
  .forum-category-about .forum-primary-button { grid-column: 1 / -1; }
  .forum-topic-category-card { grid-template-columns: auto 1fr; justify-items: start; text-align: left; }
  .forum-topic-category-card .forum-category-icon { grid-row: 1 / 3; }
  .forum-topic-category-card h2 { align-self: end; margin: 0; }
  .forum-topic-category-card > p { align-self: start; }
  .forum-topic-category-card > a { grid-column: 1 / -1; }
}

@media (max-width: 860px) {
  .forum-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forum-topic-table-head { display: none; }
  .forum-topic-row { grid-template-columns: 20px 37px minmax(0, 1fr) 78px 12px; padding-block: 8px; }
  .forum-topic-row .forum-topic-metric:nth-of-type(2),
  .forum-topic-last { display: none; }
  .forum-topic-copy > strong { white-space: normal; }
  .forum-topic-header { grid-template-columns: 1fr; }
  .forum-topic-buttons { max-width: none; justify-content: flex-start; }
  .forum-category-search { flex-wrap: wrap; }
  .forum-category-search label { flex-basis: 100%; }
  .forum-category-search .forum-primary-button { min-width: 0; flex: 1; }
  .forum-admin-table { overflow-x: auto; }
  .forum-admin-table-head,
  .forum-admin-table > article { min-width: 890px; }
  .forum-admin-member-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  body[data-route="forum"] main { padding: 10px 9px 76px; }
  .forum-main-column,
  .forum-side-column { gap: 9px; }
  .forum-hero { min-height: 178px; padding: 18px 16px; }
  .forum-hero::before { background: linear-gradient(90deg, rgba(2, 12, 25, .98), rgba(3, 17, 33, .84)), url('/public/assets/home-overview-phoenix-hero-v1.webp?v=20260806forum2') 74% center / cover no-repeat; }
  .forum-hero-copy > p:last-child { max-width: 84%; font-size: 10px; }
  .forum-search label { height: 42px; padding-inline: 11px; }
  .forum-search kbd { display: none; }
  .forum-category-tabs { padding: 5px; }
  .forum-category-tabs button { height: 34px; padding: 0 12px; }
  .forum-category-grid { grid-template-columns: 1fr; gap: 8px; }
  .forum-category-card { min-height: 146px; }
  .forum-side-column { grid-template-columns: 1fr; }
  .forum-create-card { display: grid; grid-template-columns: 1fr; }
  .forum-create-card .forum-primary-button { width: 100%; margin-top: 7px; }
  .forum-category-hero { padding: 14px 12px 11px; }
  .forum-category-heading { align-items: flex-start; gap: 10px; }
  .forum-category-heading .forum-category-icon { width: 51px; height: 51px; }
  .forum-category-heading h1 { font-size: 17px; }
  .forum-category-heading > div > span { flex-wrap: wrap; }
  .forum-category-search .forum-filter-button { flex: 0 0 auto; }
  .forum-category-search .forum-primary-button { min-width: 0; }
  .forum-topic-toolbar { display: grid; gap: 7px; }
  .forum-topic-toolbar > label { display: none; }
  .forum-filter-tabs { width: 100%; }
  .forum-topic-row { grid-template-columns: 16px 34px minmax(0, 1fr) 50px 10px; gap: 6px; padding-inline: 8px; }
  .forum-topic-metric strong { font-size: 10px; }
  .forum-topic-copy > strong { font-size: 10px; }
  .forum-topic-copy > small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .forum-topic-header { padding: 12px; }
  .forum-topic-header h1 { align-items: flex-start; font-size: 16px; line-height: 1.3; }
  .forum-topic-header > div:first-of-type > span { flex-wrap: wrap; }
  .forum-topic-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forum-topic-buttons > button { width: 100%; }
  .forum-post { grid-template-columns: 82px minmax(0, 1fr); }
  .forum-post-author { padding: 10px 4px; }
  .forum-post-author .forum-avatar-lg { --forum-avatar-size: 46px; }
  .forum-post-author > strong { font-size: 8px; }
  .forum-post-author > small { font-size: 6.8px; }
  .forum-grade { max-width: 74px; overflow: hidden; font-size: 6.2px; text-overflow: ellipsis; white-space: nowrap; }
  .forum-post-content { padding-inline: 8px; }
  .forum-post-content > header { display: grid; }
  .forum-post-body { font-size: 9px; line-height: 1.55; }
  .forum-post-content > footer { flex-wrap: wrap; gap: 8px; }
  .forum-post-actions { width: 100%; margin: 3px 0 0; }
  .forum-reply-composer { grid-template-columns: 1fr; }
  .forum-reply-composer > .forum-avatar { display: none; }
  .forum-editor-toolbar { gap: 12px; overflow: hidden; }
  .forum-reply-composer form > footer { align-items: stretch; flex-direction: column; }
  .forum-reply-composer .forum-primary-button { width: 100%; }
  .forum-modal-layer { padding: 8px; }
  .forum-modal-dialog { max-height: calc(100dvh - 16px); border-radius: 9px; }
  .forum-modal-dialog form { padding: 13px; }
  .forum-modal-grid { grid-template-columns: 1fr; }
  .forum-modal-grid .is-wide { grid-column: auto; }
  .forum-modal-dialog form > footer { display: grid; grid-template-columns: 1fr 1fr; }
  .forum-admin-shell { padding: 9px; }
  .forum-admin-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forum-admin-stat { padding: 10px; }
  .forum-admin-content { padding: 10px; }
  .forum-admin-section-head { align-items: stretch; flex-direction: column; }
  .forum-admin-section-head .forum-primary-button { width: 100%; }
  .forum-admin-category-grid { grid-template-columns: 1fr; }
  .forum-admin-search { flex-wrap: wrap; }
  .forum-admin-search .forum-primary-button { width: 100%; }
  .forum-admin-member-grid article,
  .forum-admin-ban-list article { align-items: flex-start; flex-wrap: wrap; }
  .forum-admin-member-grid button,
  .forum-admin-ban-list button { width: 100%; }
}

@media (max-width: 420px) {
  .forum-topic-row { grid-template-columns: 14px 31px minmax(0, 1fr) 10px; }
  .forum-topic-row .forum-topic-metric { display: none; }
  .forum-topic-buttons { grid-template-columns: 1fr; }
  .forum-post { grid-template-columns: 70px minmax(0, 1fr); }
  .forum-post-author .forum-avatar-lg { --forum-avatar-size: 40px; }
  .forum-category-about { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .forum-category-about .forum-category-icon { grid-row: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .forum-category-card,
  .forum-modal-dialog { animation: none !important; opacity: 1; transform: none; }
  .forum-loading i { animation-duration: 1.4s; }
  .forum-category-card,
  .forum-topic-row,
  .forum-primary-button,
  .forum-secondary-button,
  .forum-danger-button { transition: color 120ms ease, border-color 120ms ease, background-color 120ms ease !important; }
}
.forum-badge.is-guide {
  border-color: rgba(34, 211, 238, .42);
  color: #67e8f9;
  background: linear-gradient(135deg, rgba(8, 145, 178, .18), rgba(37, 99, 235, .14));
  box-shadow: 0 0 16px rgba(34, 211, 238, .1);
}

.forum-level-guide {
  --guide-cyan: #22d3ee;
  --guide-blue: #3b82f6;
  --guide-gold: #fbbf24;
  display: grid;
  min-width: 0;
  gap: 12px;
  margin: 2px 0 5px;
}

.forum-guide-intro,
.forum-guide-section {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(72, 132, 184, .25);
  border-radius: 11px;
  background: linear-gradient(145deg, rgba(5, 24, 44, .98), rgba(3, 17, 34, .98));
  box-shadow: 0 18px 60px rgba(0, 8, 22, .22);
}

.forum-guide-intro {
  display: flex;
  min-height: 142px;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 24px;
  isolation: isolate;
}

.forum-guide-intro::before {
  position: absolute;
  z-index: -2;
  inset: 0;
  background:
    radial-gradient(circle at 85% 20%, rgba(34, 211, 238, .2), transparent 26%),
    radial-gradient(circle at 66% 130%, rgba(59, 130, 246, .3), transparent 42%),
    linear-gradient(110deg, rgba(3, 20, 38, .98) 0 58%, rgba(4, 42, 72, .7));
  content: "";
}

.forum-guide-intro::after {
  position: absolute;
  z-index: -1;
  width: 290px;
  height: 290px;
  top: -185px;
  right: 25px;
  border: 1px solid rgba(103, 232, 249, .15);
  border-radius: 50%;
  box-shadow: 0 0 0 34px rgba(59, 130, 246, .04), 0 0 0 72px rgba(34, 211, 238, .025);
  content: "";
  animation: forumGuideHalo 9s linear infinite;
}

.forum-guide-intro h2 {
  max-width: 610px;
  margin: 3px 0 8px;
  color: #f4f8ff;
  font-size: clamp(20px, 2vw, 29px);
  line-height: 1.08;
  letter-spacing: -.035em;
}

.forum-guide-intro > div > p:last-child {
  max-width: 650px;
  margin: 0;
  color: #93a8c0;
  font-size: 10px;
  line-height: 1.65;
}

.forum-guide-live {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  border: 1px solid rgba(74, 222, 128, .24);
  border-radius: 999px;
  color: #a7f3d0;
  background: rgba(6, 78, 59, .14);
  font-size: 8px;
  white-space: nowrap;
}

.forum-guide-live i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4ade80;
  box-shadow: 0 0 12px #4ade80;
  animation: forumGuidePulse 2s ease-in-out infinite;
}

.forum-guide-nav {
  display: flex;
  min-width: 0;
  gap: 6px;
  padding: 6px;
  overflow-x: auto;
  border: 1px solid rgba(65, 114, 158, .18);
  border-radius: 9px;
  background: rgba(2, 14, 29, .86);
  scrollbar-width: none;
}

.forum-guide-nav::-webkit-scrollbar { display: none; }

.forum-guide-nav :is(a, button) {
  display: inline-flex;
  min-height: 34px;
  flex: 1 0 auto;
  appearance: none;
  cursor: pointer;
  font: inherit;
  background: transparent;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: #8096ae;
  font-size: 8.5px;
  font-weight: 700;
  text-decoration: none;
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.forum-guide-nav :is(a, button):hover {
  border-color: rgba(34, 211, 238, .24);
  color: #d9f9ff;
  background: rgba(14, 116, 144, .13);
  transform: translateY(-1px);
}

.forum-guide-section {
  display: grid;
  gap: 16px;
  padding: 22px;
  scroll-margin-top: 132px;
}

.forum-guide-section::after {
  position: absolute;
  width: 190px;
  height: 190px;
  right: -100px;
  bottom: -120px;
  border-radius: 50%;
  background: rgba(14, 165, 233, .04);
  filter: blur(2px);
  content: "";
  pointer-events: none;
}

.forum-guide-section-heading {
  display: flex;
  align-items: center;
  gap: 11px;
}

.forum-guide-section-heading > span {
  display: grid;
  width: 43px;
  height: 43px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(34, 211, 238, .28);
  border-radius: 11px;
  color: #67e8f9;
  background: linear-gradient(145deg, rgba(8, 145, 178, .18), rgba(30, 64, 175, .12));
  box-shadow: inset 0 0 20px rgba(34, 211, 238, .05);
  font-size: 12px;
  font-weight: 900;
}

.forum-guide-section-heading p,
.forum-guide-catchup > div:first-child > p,
.forum-guide-shop-live > div:first-child > p {
  margin: 0 0 3px;
  color: #22d3ee;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .13em;
}

.forum-guide-section-heading h3 {
  margin: 0;
  color: #edf5ff;
  font-size: 17px;
  letter-spacing: -.02em;
}

.forum-guide-lead {
  margin: -5px 0 0;
  color: #8da1b9;
  font-size: 9.5px;
  line-height: 1.65;
}

.forum-guide-lead b { color: #d9e7f6; }

.forum-guide-flow {
  display: grid;
  grid-template-columns: repeat(7, auto);
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px;
  border: 1px solid rgba(52, 113, 162, .2);
  border-radius: 9px;
  background: rgba(2, 13, 27, .7);
}

.forum-guide-flow span {
  display: inline-flex;
  min-height: 35px;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border: 1px solid rgba(72, 122, 164, .19);
  border-radius: 6px;
  color: #a9bbcf;
  background: rgba(8, 30, 51, .72);
  font-size: 8px;
  white-space: nowrap;
}

.forum-guide-flow svg { width: 13px; height: 13px; color: #38bdf8; }
.forum-guide-flow > b { color: #385a77; font-size: 11px; }

.forum-guide-callout,
.forum-guide-warning {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 13px 15px;
  border: 1px solid rgba(34, 211, 238, .2);
  border-left: 3px solid #22d3ee;
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(8, 145, 178, .12), rgba(5, 24, 44, .35));
}

.forum-guide-callout strong { flex: 0 0 auto; color: #bdf8ff; font-size: 9px; }
.forum-guide-callout p,
.forum-guide-warning p { margin: 0; color: #9bafc5; font-size: 9px; line-height: 1.6; }
.forum-guide-warning { border-color: rgba(251, 146, 60, .24); border-left-color: #fb923c; background: rgba(124, 45, 18, .1); }
.forum-guide-warning > svg { width: 18px; height: 18px; flex: 0 0 auto; color: #fb923c; }
.forum-guide-warning strong { color: #fed7aa; }

.forum-guide-milestones,
.forum-guide-multiplier-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.forum-guide-milestones article,
.forum-guide-multiplier-grid article {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid rgba(71, 119, 159, .19);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(8, 30, 53, .72), rgba(4, 20, 38, .7));
}

.forum-guide-milestones small,
.forum-guide-multiplier-grid small { color: #6fd9ef; font-size: 7px; font-weight: 900; letter-spacing: .08em; }
.forum-guide-milestones strong { color: #f5f9ff; font-size: 16px; }
.forum-guide-milestones span { color: #748aa3; font-size: 8px; }
.forum-guide-multiplier-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.forum-guide-multiplier-grid strong { color: #fbbf24; font-size: 21px; line-height: 1; }
.forum-guide-multiplier-grid p { margin: 2px 0 0; color: #71869f; font-size: 8px; line-height: 1.45; }

.forum-guide-formula {
  border: 1px solid rgba(77, 120, 159, .2);
  border-radius: 8px;
  background: rgba(2, 14, 28, .58);
}

.forum-guide-formula summary {
  padding: 11px 13px;
  color: #a9bbce;
  cursor: pointer;
  font-size: 8.5px;
  font-weight: 800;
}

.forum-guide-formula code {
  display: block;
  margin: 0 13px;
  padding: 10px;
  overflow-x: auto;
  border: 1px solid rgba(34, 211, 238, .16);
  border-radius: 6px;
  color: #67e8f9;
  background: #020c18;
  font-size: 8px;
  white-space: nowrap;
}

.forum-guide-formula p { margin: 9px 13px 12px; color: #71869d; font-size: 8px; line-height: 1.5; }

.forum-guide-shot {
  position: relative;
  display: grid;
  gap: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(74, 133, 181, .26);
  border-radius: 9px;
  background: #020b17;
}

.forum-guide-shot img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 620px;
  object-fit: contain;
  background: #020b17;
}

.forum-guide-shot figcaption {
  padding: 11px 13px;
  color: #8da1b7;
  background: rgba(5, 21, 39, .95);
  font-size: 8.5px;
  line-height: 1.55;
}

.forum-guide-shot figcaption b { color: #d4e5f5; }

.forum-guide-shot-label {
  position: absolute;
  z-index: 2;
  display: inline-flex;
  top: 10px;
  left: 10px;
  align-items: center;
  gap: 5px;
  padding: 6px 8px;
  border: 1px solid rgba(103, 232, 249, .25);
  border-radius: 999px;
  color: #cffafe;
  background: rgba(2, 16, 31, .84);
  backdrop-filter: blur(10px);
  font-size: 7px;
}

.forum-guide-shot-label svg { width: 10px; height: 10px; }

.forum-guide-gain-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.forum-guide-gain-grid article {
  display: grid;
  min-width: 0;
  grid-template-columns: 35px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 10px;
  border: 1px solid rgba(68, 119, 158, .18);
  border-radius: 8px;
  background: rgba(7, 28, 49, .67);
}

.forum-guide-gain-grid article > span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 8px;
  color: #38bdf8;
  background: rgba(14, 116, 144, .13);
}

.forum-guide-gain-grid svg { width: 15px; height: 15px; }
.forum-guide-gain-grid div { display: grid; min-width: 0; gap: 2px; }
.forum-guide-gain-grid strong { overflow: hidden; color: #d7e5f4; font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }
.forum-guide-gain-grid small { overflow: hidden; color: #6f849b; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.forum-guide-gain-grid b { color: #4ade80; font-size: 10px; white-space: nowrap; }

.forum-guide-example {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 13px;
  border: 1px dashed rgba(74, 222, 128, .24);
  border-radius: 8px;
  background: rgba(20, 83, 45, .08);
}

.forum-guide-example > span { flex: 0 0 auto; color: #4ade80; font-size: 7px; font-weight: 900; letter-spacing: .09em; }
.forum-guide-example p { margin: 0; color: #8fa5bb; font-size: 8.5px; line-height: 1.55; }
.forum-guide-example b { color: #bbf7d0; }

.forum-guide-duo,
.forum-guide-status-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.forum-guide-duo article,
.forum-guide-status-grid article {
  padding: 13px;
  border: 1px solid rgba(66, 112, 151, .18);
  border-radius: 8px;
  background: rgba(5, 23, 42, .72);
}

.forum-guide-duo h4,
.forum-guide-status-grid h4,
.forum-guide-catchup h4,
.forum-guide-shop-live h4,
.forum-guide-tutorial h4,
.forum-guide-booster h4 {
  margin: 0 0 6px;
  color: #d9e7f5;
  font-size: 9px;
}

.forum-guide-duo h4,
.forum-guide-status-grid h4 { display: flex; align-items: center; gap: 6px; }
.forum-guide-duo h4 svg,
.forum-guide-status-grid h4 svg { width: 13px; height: 13px; color: #38bdf8; }
.forum-guide-duo p,
.forum-guide-status-grid p { margin: 0; color: #8095ac; font-size: 8px; line-height: 1.58; }

.forum-guide-equation {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 12px;
  overflow-x: auto;
  border: 1px solid rgba(251, 191, 36, .18);
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(120, 53, 15, .09), rgba(4, 20, 38, .68));
  scrollbar-width: none;
}

.forum-guide-equation::-webkit-scrollbar { display: none; }
.forum-guide-equation span { flex: 0 0 auto; padding: 7px 8px; border-radius: 5px; color: #d5e2ef; background: rgba(9, 35, 59, .85); font-size: 7.5px; }
.forum-guide-equation b { color: #fbbf24; }

.forum-guide-status-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.forum-guide-status-grid article.is-active { border-color: rgba(74, 222, 128, .35); box-shadow: inset 0 0 20px rgba(74, 222, 128, .025); }
.forum-guide-status-grid article.is-active h4 { color: #86efac; }

.forum-guide-catchup {
  display: grid;
  grid-template-columns: minmax(210px, .9fr) minmax(0, 1.5fr);
  align-items: center;
  gap: 15px;
  padding: 15px;
  border: 1px solid rgba(168, 85, 247, .22);
  border-radius: 9px;
  background: linear-gradient(120deg, rgba(76, 29, 149, .14), rgba(5, 23, 42, .65));
}

.forum-guide-catchup > div:first-child > span { color: #8195ad; font-size: 8px; line-height: 1.55; }

.forum-guide-catchup-scale {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.forum-guide-catchup-scale span {
  display: grid;
  min-height: 57px;
  place-items: center;
  align-content: center;
  gap: 4px;
  border: 1px solid rgba(168, 85, 247, .17);
  border-radius: 7px;
  background: rgba(37, 20, 67, .45);
}

.forum-guide-catchup-scale small { color: #9381aa; font-size: 6.8px; }
.forum-guide-catchup-scale strong { color: #d8b4fe; font-size: 14px; }

.forum-guide-tutorial { display: grid; gap: 10px; }

.forum-guide-tutorial > article {
  display: grid;
  min-width: 0;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 12px;
  padding: 13px;
  border: 1px solid rgba(69, 120, 162, .19);
  border-radius: 9px;
  background: rgba(4, 20, 38, .64);
}

.forum-guide-tutorial > article > span {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid rgba(34, 211, 238, .3);
  border-radius: 50%;
  color: #67e8f9;
  background: rgba(8, 145, 178, .12);
  font-size: 12px;
  font-weight: 900;
}

.forum-guide-tutorial > article > div > p { margin: 0 0 10px; color: #8398af; font-size: 8.5px; line-height: 1.5; }

.forum-guide-shop-live {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(34, 211, 238, .18);
  border-radius: 9px;
  background: rgba(4, 24, 43, .68);
}

.forum-guide-shop-live > div:last-child { display: grid; gap: 7px; }
.forum-guide-shop-live > div:last-child > p { margin: 0; color: #7f94aa; font-size: 8px; }

.forum-guide-booster {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 9px;
  border: 1px solid rgba(59, 130, 246, .2);
  border-radius: 8px;
  background: rgba(7, 32, 56, .78);
}

.forum-guide-booster-visual {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  overflow: hidden;
  border-radius: 9px;
  color: #60a5fa;
  background: rgba(30, 64, 175, .16);
}

.forum-guide-booster-visual img { width: 100%; height: 100%; object-fit: cover; }
.forum-guide-booster-visual svg { width: 21px; height: 21px; }
.forum-guide-booster p { margin: 0 0 2px; color: #38bdf8; font-size: 6.5px; font-weight: 900; text-transform: uppercase; }
.forum-guide-booster h4 { margin-bottom: 3px; }
.forum-guide-booster div > span { display: block; color: #bfdbfe; font-size: 8px; }
.forum-guide-booster small { color: #697f98; font-size: 7px; }

.forum-guide-rules {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.forum-guide-rules li {
  position: relative;
  padding: 10px 10px 10px 28px;
  border: 1px solid rgba(73, 118, 156, .16);
  border-radius: 7px;
  color: #899db3;
  background: rgba(4, 19, 36, .58);
  font-size: 8px;
  line-height: 1.5;
}

.forum-guide-rules li::before {
  position: absolute;
  display: grid;
  width: 14px;
  height: 14px;
  top: 10px;
  left: 9px;
  place-items: center;
  border-radius: 50%;
  color: #042819;
  background: #4ade80;
  content: "?";
  font-size: 8px;
  font-weight: 900;
}

.forum-guide-faq { display: grid; gap: 7px; }

.forum-guide-faq details {
  border: 1px solid rgba(70, 117, 157, .18);
  border-radius: 8px;
  background: rgba(4, 20, 38, .62);
}

.forum-guide-faq summary {
  padding: 12px 13px;
  color: #c8d8e8;
  cursor: pointer;
  font-size: 9px;
  font-weight: 750;
}

.forum-guide-faq details[open] { border-color: rgba(34, 211, 238, .24); background: rgba(5, 30, 52, .72); }
.forum-guide-faq p { margin: -2px 13px 13px; color: #8297ae; font-size: 8.5px; line-height: 1.6; }

.forum-guide-signature {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 5px;
  color: #667d96;
  font-size: 8px;
}

.forum-guide-signature strong { color: #67e8f9; font-size: 10px; letter-spacing: .06em; }

@keyframes forumGuideHalo { to { transform: rotate(360deg); } }
@keyframes forumGuidePulse { 50% { opacity: .45; transform: scale(.82); } }

@media (max-width: 980px) {
  .forum-guide-flow { grid-template-columns: 1fr auto 1fr; }
  .forum-guide-flow span:nth-of-type(3),
  .forum-guide-flow span:nth-of-type(4),
  .forum-guide-flow b:nth-of-type(2),
  .forum-guide-flow b:nth-of-type(3) { display: none; }
  .forum-guide-gain-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forum-guide-multiplier-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  .forum-guide-intro { min-height: 174px; align-items: flex-start; flex-direction: column; padding: 17px; }
  .forum-guide-intro h2 { font-size: 22px; }
  .forum-guide-live { white-space: normal; }
  .forum-guide-section { gap: 13px; padding: 15px 12px; scroll-margin-top: 96px; }
  .forum-guide-section-heading { align-items: flex-start; }
  .forum-guide-section-heading > span { width: 38px; height: 38px; border-radius: 9px; }
  .forum-guide-section-heading h3 { font-size: 14px; }
  .forum-guide-flow { grid-template-columns: 1fr; justify-content: stretch; }
  .forum-guide-flow span { justify-content: center; white-space: normal; text-align: center; }
  .forum-guide-flow b { display: grid; place-items: center; transform: rotate(90deg); }
  .forum-guide-flow span:nth-of-type(3),
  .forum-guide-flow span:nth-of-type(4),
  .forum-guide-flow b:nth-of-type(2),
  .forum-guide-flow b:nth-of-type(3) { display: none; }
  .forum-guide-callout,
  .forum-guide-example { align-items: flex-start; flex-direction: column; }
  .forum-guide-milestones,
  .forum-guide-gain-grid,
  .forum-guide-duo,
  .forum-guide-status-grid,
  .forum-guide-rules { grid-template-columns: 1fr; }
  .forum-guide-multiplier-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forum-guide-catchup { grid-template-columns: 1fr; }
  .forum-guide-catchup-scale { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .forum-guide-shop-live { grid-template-columns: 1fr; }
  .forum-guide-shot-label { position: static; justify-self: start; margin: 8px 8px 0; }
  .forum-guide-shot img { max-height: none; }
  .forum-guide-equation { padding: 9px; }
}

@media (max-width: 420px) {
  .forum-guide-nav :is(a, button) { min-height: 32px; padding-inline: 10px; font-size: 7.5px; }
  .forum-guide-multiplier-grid { grid-template-columns: 1fr; }
  .forum-guide-gain-grid article { grid-template-columns: 32px minmax(0, 1fr) auto; }
  .forum-guide-tutorial > article { grid-template-columns: 30px minmax(0, 1fr); padding: 10px 8px; }
  .forum-guide-tutorial > article > span { width: 29px; height: 29px; font-size: 10px; }
  .forum-guide-formula code { font-size: 7px; }
}

@media (prefers-reduced-motion: reduce) {
  .forum-guide-intro::after,
  .forum-guide-live i { animation: none !important; }
}

/* Existing recruitment and de-ban workflows, mounted inside their Forum categories. */
.forum-legacy-view {
  display: grid;
  gap: 14px;
  width: 100%;
  min-width: 0;
}

.forum-legacy-intro {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  min-height: 116px;
  padding: 20px 24px;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--forum-category) 32%, rgba(52, 103, 148, .32));
  background:
    radial-gradient(circle at 82% 20%, color-mix(in srgb, var(--forum-category) 15%, transparent), transparent 32%),
    linear-gradient(135deg, rgba(5, 22, 40, .98), rgba(2, 12, 24, .97));
}

.forum-legacy-intro::after {
  position: absolute;
  width: 250px;
  height: 250px;
  right: -100px;
  border: 1px solid color-mix(in srgb, var(--forum-category) 20%, transparent);
  border-radius: 50%;
  content: '';
  pointer-events: none;
}

.forum-legacy-intro > div { position: relative; z-index: 1; min-width: 0; }
.forum-legacy-intro h1 { margin: 2px 0 4px; color: #f0f7ff; font-size: clamp(20px, 2.1vw, 30px); letter-spacing: -.03em; }
.forum-legacy-intro p { margin: 0; color: #98adc2; line-height: 1.55; }
.forum-legacy-intro div > span { display: block; margin-top: 7px; color: #6f879f; font-size: 10px; }
.forum-legacy-intro > a {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid rgba(72, 132, 181, .27);
  border-radius: 8px;
  color: #9ec3e4;
  background: rgba(5, 24, 43, .74);
  font-size: 10px;
  font-weight: 750;
  text-decoration: none;
  transition: border-color 160ms ease, color 160ms ease, background-color 160ms ease, transform 120ms ease;
}
.forum-legacy-intro > a svg { width: 15px; }
.forum-legacy-intro > a:active { transform: scale(.97); }

.forum-legacy-portal {
  min-width: 0;
  width: 100%;
  --recruit-bg: #020916;
  --recruit-panel: rgba(4, 15, 29, .94);
  --recruit-line: rgba(67, 123, 180, .3);
  --recruit-cyan: #1ddaff;
  --recruit-orange: #ff941c;
  --recruit-green: #55ef9a;
  --recruit-red: #ff4f72;
  --recruit-violet: #bb62ff;
}

.forum-legacy-portal > .recruitment-page {
  display: grid;
  gap: 14px;
  width: 100%;
  max-width: none;
  margin: 0;
}

.forum-legacy-portal > .page-heading { margin-top: 0; }
.forum-legacy-portal > :is(.deban-grid, .deban-appeals-panel) { width: 100%; }
.forum-legacy-portal .recruitment-layout { width: 100%; }
.forum-legacy-error {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  padding: 11px 13px;
  border: 1px solid rgba(255, 91, 118, .3);
  border-radius: 8px;
  color: #ff91a5;
  background: rgba(78, 13, 30, .34);
}
.forum-legacy-error svg { width: 16px; }

@media (hover: hover) and (pointer: fine) {
  .forum-legacy-intro > a:hover {
    border-color: color-mix(in srgb, var(--forum-category) 42%, transparent);
    color: #d7efff;
    background: rgba(9, 38, 65, .86);
  }
}

@media (max-width: 720px) {
  .forum-legacy-intro { grid-template-columns: auto minmax(0, 1fr); padding: 16px; }
  .forum-legacy-intro > a { grid-column: 1 / -1; justify-content: center; }
  .forum-legacy-intro div > span { font-size: 9px; }
  .forum-legacy-portal > .page-heading { align-items: flex-start; }
  .forum-legacy-portal > .page-heading .page-symbol { display: none; }
}

@media (max-width: 460px) {
  .forum-legacy-view { gap: 10px; }
  .forum-legacy-intro { grid-template-columns: 1fr; gap: 10px; padding: 14px 12px; }
  .forum-legacy-intro > .forum-category-icon { width: 42px; height: 42px; }
  .forum-legacy-intro > a { grid-column: auto; }
  .forum-legacy-portal > .deban-grid { grid-template-columns: minmax(0, 1fr); }
  .forum-legacy-portal :is(.deban-panel, .deban-appeals-panel) { padding: 15px 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .forum-legacy-intro > a { transition-duration: .01ms; }
}