.hub-page {
  min-height: 100vh;
  padding: 28px 0 60px;
}

.hub-boot-loading {
  min-height: 320px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  color: var(--muted);
  font-size: 13px;
}

.hub-boot-loading i {
  width: 22px;
  height: 22px;
  border: 2px solid var(--line-strong);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: hub-spin 0.8s linear infinite;
}

.hub-app {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  color: var(--ink);
}

.hub-heading {
  min-height: 124px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  border-bottom: 1px solid var(--line);
  padding: 0 0 26px;
}

.hub-heading p,
.hub-section-heading p,
.hub-side-heading p,
.hub-modal header p {
  margin: 0 0 5px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.hub-heading h1 {
  width: fit-content;
  margin: 0;
  background: var(--brand-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-size: clamp(30px, 3vw, 46px);
  line-height: 1.05;
  letter-spacing: -0.045em;
}

.hub-heading > div:first-child > span {
  display: block;
  max-width: 680px;
  margin-top: 10px;
  color: var(--muted);
  font-size: 13px;
}

.hub-heading-actions,
.hub-card-actions,
.hub-heading-actions > a,
.hub-alert-control {
  display: flex;
  align-items: center;
}

.hub-heading-actions {
  flex: 0 0 auto;
  gap: 10px;
}

.hub-icon-button,
.hub-channel-link {
  min-height: 44px;
  border: 1px solid var(--line-strong);
  background: var(--subtle);
  color: var(--ink);
}

.hub-icon-button {
  position: relative;
  width: 44px;
  display: grid;
  place-items: center;
  border-radius: 50%;
}

.hub-icon-button svg {
  width: 17px;
  height: 17px;
}

.hub-quick-bar {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hub-quick-icon img {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  object-fit: cover;
}

.hub-quick-icon:hover {
  border-color: var(--blue-line);
  box-shadow: var(--glow);
}

.hub-icon-button > span {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 19px;
  height: 19px;
  display: grid;
  place-items: center;
  border: 2px solid var(--canvas);
  border-radius: 10px;
  background: var(--blue);
  color: #001021;
  padding: 0 4px;
  font-size: 13px;
  font-weight: 900;
}

.hub-channel-link {
  gap: 9px;
  border-radius: 5px;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 700;
}

.hub-channel-link svg:first-child {
  width: 16px;
  color: var(--blue);
}

.hub-channel-link svg:last-child {
  width: 13px;
}

.hub-channel-link:hover,
.hub-icon-button:hover {
  border-color: #3b506b;
  background: #081321;
  color: #fff;
}

.hub-alert-control {
  position: relative;
}

.hub-alert-popover {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 30;
  width: min(330px, calc(100vw - 32px));
  display: grid;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--panel);
  box-shadow: var(--shadow-raised);
  padding: 10px;
  animation: hub-pop-in var(--dur-fast) var(--ease-out);
}

@keyframes hub-pop-in {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
}

.hub-alert-popover > strong {
  padding: 6px 8px 10px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.hub-alert-popover button {
  width: 100%;
  min-height: 58px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  border: 0;
  border-top: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  padding: 8px;
  text-align: left;
}

.hub-alert-popover button:hover {
  color: var(--blue);
}

.hub-alert-popover button > svg {
  width: 17px;
  color: var(--blue);
}

.hub-alert-popover button span {
  display: grid;
  gap: 2px;
}

.hub-alert-popover button b {
  font-size: 12px;
}

.hub-alert-popover button small {
  color: var(--soft);
  font-size: 12px;
}

.hub-tabs {
  height: 58px;
  display: flex;
  align-items: stretch;
  gap: 28px;
  border-bottom: 1px solid var(--line);
}

.hub-tabs button {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--soft);
  padding: 0;
  font-size: 12px;
  font-weight: 650;
}

.hub-tabs button svg {
  width: 16px;
}

.hub-tabs button:hover {
  color: var(--ink);
}

.hub-tabs button.active {
  border-bottom-color: var(--blue);
  color: var(--ink);
}

.hub-tabs button em {
  color: var(--blue);
  font-family: var(--mono);
  font-size: 12px;
  font-style: normal;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

.hub-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  align-items: start;
  gap: 30px;
  padding-top: 0;
}

.hub-app-news .hub-layout {
  padding-top: 0;
}

.hub-app-news {
  margin-top: 0;
}

.hub-main,
.hub-section {
  min-width: 0;
}

.hub-mobile-tools {
  display: none;
}

.hub-side {
  position: sticky;
  top: 28px;
  min-width: 0;
  display: grid;
  gap: 16px;
  border-left: 1px solid var(--line);
  padding-left: 24px;
}

.hub-side-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hub-side-actions .hub-channel-link {
  min-width: 0;
  flex: 1;
  justify-content: center;
}

.hub-clock-panel {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--subtle);
  overflow: hidden;
}

.hub-clock-panel > summary {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  border-bottom: 1px solid transparent;
  color: var(--soft);
  padding: 0 16px;
  font-size: 12px;
  font-weight: 750;
  list-style: none;
}

.hub-clock-panel > summary::-webkit-details-marker {
  display: none;
}

.hub-clock-panel > summary svg {
  width: 15px;
  height: 15px;
  transition: transform var(--dur-press) var(--ease-out);
}

.hub-clock-panel[open] > summary {
  border-bottom-color: var(--line);
}

.hub-clock-panel[open] > summary svg {
  transform: rotate(180deg);
}

.hub-clock-panel .hub-clock {
  border: 0;
  border-radius: 0;
  background: transparent;
}

.hub-section-heading {
  min-height: 64px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}

.hub-section-heading h2,
.hub-side-heading h2,
.hub-modal h2 {
  margin: 0;
  color: #f7faff;
  letter-spacing: -0.025em;
}

.hub-section-heading h2 {
  font-size: 24px;
}

.hub-section-heading > div > span {
  display: block;
  margin-top: 6px;
  color: var(--soft);
  font-size: 13px;
}

.hub-news-heading {
  min-height: 92px;
  align-items: center;
  border-bottom: 1px solid var(--line);
  margin-bottom: 6px;
  padding-bottom: 18px;
}

.hub-news-heading h2 {
  font-size: 30px;
  line-height: 1.12;
}

.hub-news-heading > div:first-child > span {
  font-size: 14px;
}

.hub-news-grid {
  width: 100%;
  margin: 0;
}

.hub-feed-date {
  display: flex;
  align-items: center;
  gap: 16px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 650;
  text-align: center;
}

.hub-feed-date::before,
.hub-feed-date::after {
  height: 1px;
  flex: 1;
  background: var(--line);
  content: "";
}

.hub-feed-date span {
  flex: 0 0 auto;
  padding: 8px 0;
}

.hub-news-card,
.hub-bookmark-card,
.hub-clock,
.hub-quick,
.hub-admin-card {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--subtle);
}

.hub-admin-access {
  min-height: 210px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 9px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 32px 20px;
  text-align: center;
}

.hub-admin-access strong {
  color: var(--ink);
  font-size: 17px;
}

.hub-admin-access p {
  max-width: 560px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.65;
}

.hub-admin-access a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  border-bottom: 1px solid var(--blue);
  color: var(--blue);
  padding: 0 2px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.hub-admin-access a:hover {
  color: #79c9ff;
}

.hub-news-card,
.hub-bookmark-card.is-locked { border-style: dashed; }
.hub-bookmark-card.is-locked .hub-bookmark-banner img { filter: blur(14px) saturate(0.6); }
.hub-locked-avatar svg { width: 15px; height: 15px; color: var(--soft); }

.hub-bookmark-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
}

.hub-news-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 14px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  padding: 10px 0 16px;
  overflow: visible;
}

.hub-news-card:hover,
.hub-bookmark-card:hover {
  border-color: var(--line-strong);
  transform: translateY(-1px);
}

.hub-news-card:hover {
  transform: none;
}

.hub-news-card.is-new,
.hub-bookmark-card.is-new {
  border-color: #244a6f;
}

.hub-news-avatar {
  width: 36px;
  height: 36px;
  display: grid;
  align-self: start;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: #01050c;
}

.hub-news-avatar img {
  width: 30px;
  height: 18px;
  object-fit: contain;
}

.hub-new-badge {
  margin-left: auto;
  color: #61bcff;
  padding: 0;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hub-bookmark-card > .hub-new-badge {
  position: absolute;
  z-index: 2;
  top: 10px;
  right: 10px;
  margin: 0;
}

.hub-news-media {
  width: 100%;
  max-height: 52vh;
  display: block;
  background: #01050c;
  object-fit: contain;
}

.hub-news-media.compact {
  height: clamp(160px, 9.5vw, 190px);
  max-height: none;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  object-fit: cover;
}

.hub-media-fallback {
  position: relative;
  min-height: 220px;
  display: grid;
  overflow: hidden;
  background: #01050c;
  color: #fff;
  place-items: center;
}

.hub-media-fallback.compact {
  min-height: 0;
  height: clamp(160px, 9.5vw, 190px);
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.hub-media-fallback img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.52;
}

.hub-media-fallback span {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 4px;
  background: rgba(2, 9, 18, 0.82);
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 800;
}

.hub-media-fallback span svg {
  width: 13px;
}

.hub-news-copy {
  min-width: 0;
  padding: 0;
}

.hub-card-meta {
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--soft);
  font-size: 13px;
  letter-spacing: 0;
}

.hub-card-meta > strong {
  color: var(--ink);
  font-size: 13px;
  font-weight: 750;
}

.hub-card-meta small {
  border-left: 1px solid var(--line-strong);
  padding-left: 7px;
}

.hub-news-copy h3 {
  margin: 7px 0 6px;
  color: #f7faff;
  font-size: 18px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.hub-news-copy > p {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
  overflow-wrap: anywhere;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.hub-risk-notice {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin: 0 0 16px;
  border-top: 1px solid var(--amber-line);
  border-bottom: 1px solid var(--amber-line);
  background: color-mix(in srgb, var(--amber-soft) 62%, transparent);
  color: var(--muted);
  padding: 12px 2px;
  font-size: 13px;
  line-height: 1.55;
}

.hub-risk-notice svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--amber);
}

.hub-card-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin-top: 10px;
  border-top: 1px solid var(--line);
  padding-top: 8px;
}

.hub-card-actions button,
.hub-card-actions a,
.hub-empty button,
.hub-add-button,
.hub-admin-card footer button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  padding: 0 11px;
  font-size: 12px;
  font-weight: 700;
}

.hub-card-actions button:first-child,
.hub-add-button,
.hub-admin-card footer button:last-child {
  border-color: var(--accent-primary-line);
  background: var(--accent-primary);
  color: #fff;
}

.hub-news-card .hub-card-actions button,
.hub-news-card .hub-card-actions a {
  min-height: 32px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--soft);
  padding: 0;
  font-size: 12px;
  letter-spacing: 0.035em;
}

.hub-news-card .hub-card-actions button:first-child {
  border: 0;
  background: transparent;
  color: var(--soft);
}

.hub-instant-action {
  grid-column: 2;
  justify-self: center;
}

.hub-card-actions-right {
  grid-column: 3;
  display: flex;
  align-items: center;
  justify-self: end;
  gap: 18px;
}

.hub-card-actions-right a {
  margin-left: 0;
  text-decoration: none;
}

.hub-card-actions svg,
.hub-add-button svg,
.hub-admin-card footer button svg {
  width: 13px;
  height: 13px;
  display: block;
  flex: 0 0 auto;
}

.hub-card-actions .icon-only {
  width: 44px;
  padding: 0;
}

.hub-news-card .hub-card-actions button:hover,
.hub-news-card .hub-card-actions a:hover {
  border-color: transparent;
  background: transparent;
  color: var(--blue);
}

.hub-card-actions button:hover,
.hub-card-actions a:hover,
.hub-empty button:hover,
.hub-add-button:hover,
.hub-admin-card footer button:hover {
  border-color: var(--blue);
  color: #fff;
}

.hub-inline-warning {
  margin: 14px 0 0;
  color: var(--amber);
  font-size: 12px;
}

.hub-bookmark-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  gap: 1px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--line);
  margin-bottom: 12px;
  overflow: hidden;
}

.hub-bookmark-stats button {
  min-height: 66px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 0;
  border-right: 0;
  background: var(--panel);
  color: var(--soft);
  padding: 0 16px;
  font-size: 12px;
}

.hub-bookmark-stats button:hover,
.hub-bookmark-stats button.active {
  color: #f7faff;
}

.hub-bookmark-stats button.active strong {
  color: var(--blue);
}

.hub-bookmark-stats strong {
  color: var(--ink);
  font-size: 19px;
}

.hub-bookmark-tools {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  margin-bottom: 18px;
  padding: 12px 0;
}

.hub-filter-row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  min-width: 0;
  padding-top: 10px;
}

.hub-filter-row > span {
  color: var(--soft);
  font-size: 12px;
  font-weight: 700;
}

.hub-search input {
  width: 100%;
  min-height: 42px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font-size: 13px;
}

.hub-filter-tabs {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 20px;
  overflow-x: auto;
  scrollbar-width: none;
}

.hub-filter-tabs::-webkit-scrollbar {
  display: none;
}

.hub-filter-tabs button {
  min-height: 40px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--soft);
  padding: 0 1px;
  font-size: 13px;
  font-weight: 600;
}

.hub-filter-tabs button:hover {
  color: var(--ink);
}

.hub-filter-tabs button.active {
  border-bottom-color: var(--blue);
  color: var(--ink);
}

.hub-filter-tabs button small {
  color: var(--blue);
  font-family: var(--mono);
  font-size: 12px;
}

.hub-chain-filter {
  flex-wrap: wrap;
  gap: 6px 16px;
  overflow: visible;
}

.hub-chain-label {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.hub-chain-label > img {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  display: block;
  object-fit: contain;
}

.hub-rating-filter {
  gap: 8px;
}

.hub-rating-filter-star {
  width: 30px;
  min-height: 34px;
  justify-content: center;
  color: #3d4756 !important;
}

.hub-rating-filter-star > svg {
  width: 17px;
  height: 17px;
}

.hub-rating-filter-star.filled {
  color: var(--amber) !important;
}

.hub-rating-filter-star.filled > svg {
  fill: currentColor;
}

.hub-rating-filter-star[aria-pressed="true"] {
  border-bottom-color: var(--amber);
}

.hub-raw-filter-item {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 1px;
}

.hub-raw-help {
  width: 28px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--soft);
  padding: 0;
  cursor: help;
}

.hub-raw-help:hover {
  color: var(--ink);
}

.hub-raw-help:focus-visible {
  outline: 1px solid var(--blue);
  outline-offset: 2px;
}

.hub-raw-help > svg {
  width: 13px;
  height: 13px;
}

.hub-raw-tooltip {
  position: fixed;
  z-index: 200;
  border: 1px solid var(--line-strong);
  background: #06101f;
  color: var(--muted);
  padding: 10px 12px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.55;
  pointer-events: none;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24);
}

.hub-search {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--subtle);
  margin-bottom: 2px;
}

.hub-search svg {
  width: 15px;
  justify-self: center;
  color: var(--soft);
}

.hub-search:focus-within {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.hub-bookmark-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.hub-bookmark-banner {
  position: relative;
  height: 125px;
  border-bottom: 1px solid var(--line);
  background: #030a14;
  overflow: hidden;
}

.hub-bookmark-banner > img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.hub-bookmark-banner > div {
  position: absolute;
  right: 10px;
  bottom: 10px;
  left: 10px;
  display: flex;
  justify-content: space-between;
  gap: 6px;
}

.hub-bookmark-banner > div > span,
.hub-bookmark-banner b {
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 3px;
  background: rgba(2, 9, 22, 0.82);
  color: #dce7f5;
  padding: 4px 7px;
  font-size: 12px;
  text-transform: uppercase;
  backdrop-filter: blur(5px);
}

.hub-bookmark-banner .hub-chain-label > img {
  width: 16px;
  height: 16px;
  flex-basis: 16px;
}

.hub-bookmark-banner b[data-category="NFT"] { color: #65bdff; }
.hub-bookmark-banner b[data-category="Memecoin"] { color: #e7ad50; }
.hub-bookmark-banner b[data-category="RAW"] { color: #b8a7ff; }

.hub-bookmark-copy {
  padding: 16px;
}

.hub-bookmark-identity {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.hub-bookmark-identity > span {
  position: relative;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: #081323;
  color: var(--blue);
  font-size: 13px;
  font-weight: 900;
  overflow: hidden;
}

.hub-project-avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hub-bookmark-identity > span[data-category="Memecoin"] { color: var(--amber); }
.hub-bookmark-identity > span[data-category="RAW"] { color: var(--violet); }

.hub-bookmark-identity h3 {
  margin: 0 0 2px;
  overflow: hidden;
  color: #f6f9fe;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-bookmark-identity a {
  color: var(--blue);
  font-size: 12px;
}

.hub-bookmark-handle {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 4px;
}

.hub-bookmark-handle a {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-x-verification-badge {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  color: #1d9bf0;
  line-height: 0;
}

.hub-x-verification-badge.is-gold { color: #e3b341; }
.hub-x-verification-badge.is-gray { color: #82909d; }

.hub-x-verification-badge svg {
  width: 15px;
  height: 15px;
  fill: currentColor;
  stroke: #ffffff;
  stroke-width: 2.15;
}

.hub-bookmark-identity > div:last-child {
  display: grid;
  justify-items: end;
  gap: 2px;
}

.hub-bookmark-identity > .hub-follower-snapshot {
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
  gap: 10px;
}

.hub-follower-snapshot > span {
  display: grid;
  justify-items: end;
  gap: 3px;
}

.hub-bookmark-identity small {
  color: var(--soft);
  font-size: 12px;
  text-transform: uppercase;
}

/* Early-call growth: discovery -> current with the multiple as the receipt. */
.hub-follower-snapshot strong.hub-follower-growth {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
.hub-follower-snapshot strong.hub-follower-growth svg { width: 12px; height: 12px; color: var(--soft); }
.hub-follower-snapshot strong.hub-follower-growth b {
  font-size: 12px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--green) 45%, var(--line));
  color: var(--green);
}
.hub-follower-snapshot strong.hub-follower-growth b.down {
  border-color: color-mix(in srgb, var(--red) 45%, var(--line));
  color: var(--red);
}

.hub-follower-snapshot strong {
  color: var(--ink);
  font-family: var(--mono);
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.hub-rating,
.hub-rating-picker {
  display: flex;
  gap: 2px;
}

.hub-rating {
  margin: 0;
}

.hub-rating span {
  color: #3d4756;
  font-size: 13px;
}

.hub-rating span.filled {
  color: var(--amber);
}

.hub-bookmark-card-toolbar {
  min-height: 35px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 8px 0 4px;
}

.hub-bookmark-admin-actions {
  display: flex;
  align-items: center;
  gap: 2px;
}

.hub-bookmark-admin-actions button {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 0;
  border-bottom: 1px solid transparent;
  background: transparent;
  color: var(--soft);
}

.hub-bookmark-admin-actions button:hover,
.hub-bookmark-admin-actions button:focus-visible {
  border-bottom-color: var(--blue);
  color: var(--blue);
}

.hub-bookmark-admin-actions button:last-child:hover,
.hub-bookmark-admin-actions button:last-child:focus-visible {
  border-bottom-color: var(--red);
  color: var(--red);
}

.hub-bookmark-admin-actions svg {
  width: 14px;
  height: 14px;
}

/* The poster pick keeps its accent while toggled on, unlike its neighbors. */
.hub-bookmark-admin-actions button.hub-bookmark-pick[aria-pressed="true"] {
  border-bottom-color: var(--blue);
  color: var(--blue);
}

.hub-bookmark-card[data-poster-picked] {
  box-shadow: inset 0 0 0 1px var(--blue);
}

/* Posting to the real channel earns the accent the other export-row buttons
   deliberately lack. */
.hub-raffle-export-row .hub-raffle-winners-announce {
  border-color: rgb(8 127 245 / 45%);
  color: var(--blue);
}

.hub-activity-group {
  padding: 6px 18px 16px;
}

/* Four counters on one quiet strip: hairline separators instead of boxes in a
   box, oversized mono figures doing the talking. */
.hub-activity-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hub-activity-grid > div {
  padding: 14px 8px 12px 16px;
  border-left: 1px solid var(--line);
}

.hub-activity-grid > div:first-child {
  padding-left: 2px;
  border-left: 0;
}

.hub-activity-grid strong {
  display: block;
  color: var(--ink);
  font-family: var(--mono);
  font-size: 26px;
  font-weight: 850;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.hub-activity-grid small {
  display: block;
  margin-top: 4px;
  color: var(--soft);
  font-size: 12px;
}

.hub-activity-grid > div[data-accent] strong {
  color: var(--blue);
  text-shadow: 0 0 18px rgb(8 127 245 / 35%);
}

@media (max-width: 560px) {
  .hub-activity-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hub-activity-grid > div:nth-child(odd) {
    padding-left: 2px;
    border-left: 0;
  }

  .hub-activity-grid > div:nth-child(n + 3) {
    border-top: 1px solid var(--line);
  }
}

.hub-activity-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 2px 2px 0;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  color: var(--soft);
  font-size: 12px;
}

.hub-activity-meta svg {
  width: 13px;
  height: 13px;
}

.hub-activity-label {
  margin: 16px 2px 2px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hub-activity-list,
.hub-activity-comments {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-activity-list li,
.hub-activity-comments li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 8px 2px;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}

.hub-activity-list li:last-child,
.hub-activity-comments li:last-child {
  border-bottom: 0;
}

.hub-activity-list li a,
.hub-activity-comments li a {
  flex: none;
  max-width: 46%;
  overflow: hidden;
  color: var(--ink);
  font-weight: 600;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-activity-list li a:hover,
.hub-activity-comments li a:hover {
  color: var(--blue);
}

.hub-activity-list li time,
.hub-activity-comments li time {
  color: var(--soft);
  font-size: 12px;
  white-space: nowrap;
}

.hub-activity-list li em {
  margin-left: auto;
  flex: none;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 2px 9px;
  color: var(--soft);
  font-size: 12px;
  font-style: normal;
  white-space: nowrap;
}

.hub-activity-list li em[data-outcome="winner"] {
  border-color: var(--accent-border);
  color: var(--blue);
}

.hub-activity-list li em[data-outcome="backup"] {
  border-color: rgb(240 159 39 / 45%);
  color: #b97b1c;
}

.hub-activity-list li em[data-outcome="open"] {
  color: var(--ink);
}

.hub-activity-comments li {
  align-items: center;
}

.hub-activity-avatar {
  position: relative;
  flex: none;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--accent-active-bg);
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
}

.hub-activity-avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hub-activity-comment-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.hub-activity-comment-body a {
  max-width: 100%;
}

.hub-activity-comment-body > span {
  min-width: 0;
  overflow: hidden;
  color: var(--soft);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-activity-empty {
  margin: 8px 0 0;
  color: var(--soft);
  font-size: 12px;
}

.hub-member-directory-detail .hub-activity {
  margin-top: 12px;
}

.hub-poster-tray {
  position: fixed;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 120;
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: min(92vw, 560px);
  padding: 8px 10px 8px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
  box-shadow: 0 18px 40px rgb(2 10 24 / 35%);
}

.hub-poster-tray-count {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
  white-space: nowrap;
}

.hub-poster-tray svg {
  width: 14px;
  height: 14px;
}

.hub-poster-tray button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: transparent;
  color: var(--soft);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.hub-poster-tray button.hub-poster-tray-preview {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
}

.hub-bookmark-copy > p {
  min-height: 40px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.7;
}

.hub-bookmark-copy > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-top: 1px solid var(--line);
  margin-top: 13px;
  padding-top: 12px;
}

.hub-bookmark-copy > footer time {
  color: var(--soft);
  font-size: 13px;
}

.hub-bookmark-copy > footer > div {
  display: flex;
  align-items: center;
  gap: 5px;
}

.hub-bookmark-copy footer button,
.hub-bookmark-copy footer a {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: transparent;
  color: var(--soft);
  padding: 0 9px;
  font-size: 13px;
  font-weight: 700;
}

.hub-bookmark-copy footer button {
  min-width: 36px;
}

.hub-bookmark-copy footer svg {
  width: 13px;
}

.hub-bookmark-copy footer button:hover,
.hub-bookmark-copy footer a:hover {
  border-color: #34516f;
  color: var(--blue);
}

.hub-bookmark-copy footer button.liked,
.hub-bookmark-copy footer button.liked:hover {
  border-color: var(--red-line);
  color: var(--red);
}

.hub-bookmark-copy footer button.liked svg {
  fill: currentColor;
}

.hub-bookmark-copy footer button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.hub-bookmark-heading-actions {
  display: flex;
  align-items: center;
}

.hub-bookmark-heading-actions {
  gap: 10px;
}

.hub-discussion {
  margin-top: 10px;
  border-top: 1px solid var(--line);
}

.hub-discussion-toggle {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 7px;
  border: 0;
  background: transparent;
  color: var(--soft);
  padding: 0;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
}

.hub-discussion-toggle:hover,
.hub-discussion.open .hub-discussion-toggle {
  color: var(--blue);
}

.hub-discussion-toggle svg {
  width: 14px;
}

.hub-discussion-toggle strong {
  margin-left: auto;
  font-family: var(--mono);
}

.hub-discussion-panel {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.hub-discussion-panel form textarea {
  width: 100%;
  min-height: 82px;
  resize: vertical;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  outline: 0;
  background: var(--canvas);
  color: var(--ink);
  padding: 10px 12px;
  font: inherit;
  font-size: 13px;
  line-height: 1.55;
}

.hub-discussion-panel form textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.hub-discussion-panel form > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 6px;
}

.hub-discussion-panel form small,
.hub-comments-status {
  color: var(--soft);
  font-size: 12px;
}

.hub-discussion-panel form button {
  min-height: 32px;
  border: 1px solid var(--blue);
  border-radius: 3px;
  background: var(--blue);
  color: #fff;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 800;
}

.hub-discussion-panel form button:disabled {
  opacity: 0.45;
}

.hub-discussion-panel ul {
  display: grid;
  gap: 0;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

.hub-discussion-panel li {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 9px;
  border-top: 1px solid var(--line);
  padding: 10px 0;
}

.hub-discussion-panel li > img,
.hub-discussion-panel li > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--subtle-strong);
  color: var(--blue);
  object-fit: cover;
  font-size: 12px;
  font-weight: 900;
}

.hub-discussion-panel li header {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.hub-discussion-panel li header strong {
  font-size: 12px;
}

.hub-discussion-panel li header small,
.hub-discussion-panel li header time {
  color: var(--soft);
  font-size: 12px;
}

.hub-discussion-panel li header time {
  margin-left: auto;
}

.hub-discussion-panel li p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
  white-space: pre-wrap;
}

.hub-comments-status {
  margin: 12px 0 2px;
}

.hub-member-gate {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
  padding: 72px 48px;
}

.hub-member-gate-copy {
  width: min(100%, 760px);
}

.hub-member-gate-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-bottom: 2px solid var(--blue);
  color: var(--blue);
}

.hub-member-gate-icon svg {
  width: 20px;
}

.hub-member-gate-copy > p {
  margin: 24px 0 7px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.hub-member-gate-copy h2 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(25px, 3vw, 38px);
  letter-spacing: -0.035em;
}

.hub-member-gate-copy > span:not(.hub-member-gate-icon) {
  display: block;
  margin-top: 12px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}

.hub-member-gate-copy > small {
  display: block;
  margin-top: 12px;
  color: var(--soft);
  font-size: 12px;
}

.hub-member-gate-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.hub-member-gate-actions a,
.hub-member-gate-actions button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--line-strong);
  background: transparent;
  color: var(--ink);
  padding: 0 15px;
  font: inherit;
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
}

.hub-member-gate-actions a:hover,
.hub-member-gate-actions button:hover,
.hub-member-gate-actions a:focus-visible,
.hub-member-gate-actions button:focus-visible {
  border-color: var(--blue);
  color: var(--blue);
}

.hub-member-gate-actions button:disabled {
  cursor: wait;
  opacity: 0.65;
}

.hub-member-gate-actions svg {
  width: 15px;
  height: 15px;
}

.hub-member-gate-actions .is-spinning {
  animation: hub-spin 0.8s linear infinite;
}

.hub-telegram-login {
  min-height: 50px;
  margin-top: 26px;
}

.hub-telegram-login-widget {
  min-height: 50px;
}

.hub-telegram-login-retry {
  min-height: 42px;
  border: 1px solid var(--line-strong);
  background: transparent;
  color: var(--ink);
  padding: 0 15px;
  font: inherit;
  font-size: 13px;
  font-weight: 750;
}

.hub-telegram-login-retry:hover,
.hub-telegram-login-retry:focus-visible {
  border-color: var(--blue);
  color: var(--blue);
}

.hub-account-switch-hint {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  max-width: 560px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  margin: 18px auto 4px;
  background: var(--subtle);
  padding: 12px 14px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.7;
  text-align: left;
}

.hub-account-switch-hint svg {
  flex: none;
  width: 15px;
  height: 15px;
  margin-top: 2px;
  color: var(--amber);
}

.hub-member-unavailable {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  color: var(--amber);
  font-size: 12px;
}

.hub-member-unavailable button {
  min-height: 34px;
  border: 1px solid var(--line-strong);
  background: transparent;
  color: var(--ink);
  padding: 0 12px;
}

.hub-access-ladder {
  align-self: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-access-ladder li {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  min-height: 82px;
}

.hub-access-ladder li:not(:last-child)::after {
  position: absolute;
  top: 34px;
  bottom: 0;
  left: 16px;
  width: 1px;
  background: var(--line-strong);
  content: "";
}

.hub-access-ladder li > span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  color: var(--soft);
  font-family: var(--mono);
  font-size: 12px;
}

.hub-access-ladder li.active > span {
  border-color: var(--blue);
  color: var(--blue);
}

.hub-access-ladder li.active div strong {
  color: var(--blue);
}

.hub-access-ladder li div {
  display: grid;
  align-content: start;
  gap: 4px;
  padding-top: 3px;
}

.hub-access-ladder strong {
  font-size: 13px;
}

.hub-access-ladder small {
  color: var(--soft);
  font-size: 12px;
}

.hub-add-button {
  min-height: 40px;
}

.hub-clock,
.hub-quick {
  padding: 18px;
}

.hub-side-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.hub-side-heading > svg {
  width: 17px;
  color: var(--blue);
}

.hub-side-heading p {
  margin-bottom: 2px;
  font-size: 12px;
}

.hub-side-heading h2 {
  font-size: 13px;
}

.hub-clock > strong {
  display: block;
  color: #f7faff;
  font-family: var(--mono);
  font-size: 31px;
  letter-spacing: -0.055em;
}

.hub-clock > span {
  color: var(--soft);
  font-size: 12px;
}

.hub-zone-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  border: 1px solid var(--line);
  border-radius: 4px;
  margin-top: 18px;
  overflow: hidden;
}

.hub-zone-tabs button {
  min-height: 34px;
  border: 0;
  background: var(--field-bg);
  color: var(--soft);
  font-size: 13px;
  font-weight: 800;
}

.hub-zone-tabs button.active {
  background: var(--accent-active-bg);
  color: var(--blue);
}

.hub-time-selects {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin-top: 10px;
}

.hub-time-selects label {
  display: grid;
  gap: 4px;
}

.hub-time-selects label span {
  color: var(--soft);
  font-size: 12px;
  text-transform: uppercase;
}

.hub-time-selects input {
  width: 100%;
  height: 35px;
  border: 1px solid var(--line);
  border-radius: 3px;
  outline: 0;
  background: var(--field-bg);
  color: var(--ink);
  padding: 0 7px;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  text-align: center;
}

.hub-time-selects input:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 2px var(--focus-ring);
}

.hub-converted {
  display: grid;
  gap: 3px;
  border-top: 1px solid var(--line);
  margin-top: 14px;
  padding-top: 13px;
}

.hub-converted span {
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.hub-converted b {
  font-size: 12px;
}

.hub-quick > div:last-child {
  display: grid;
}

.hub-quick a {
  min-height: 58px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 10px;
  border-top: 1px solid var(--line);
  color: var(--ink);
  text-decoration: none;
}

.hub-quick a:first-child {
  border-top: 0;
}

.hub-quick a:hover b,
.hub-quick a:focus-visible b,
.hub-quick a:hover > svg,
.hub-quick a:focus-visible > svg {
  color: var(--blue);
}

.hub-quick a:hover b,
.hub-quick a:focus-visible b {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.hub-quick img {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: contain;
}

.hub-quick a span {
  display: grid;
  gap: 1px;
}

.hub-quick b {
  font-size: 13px;
}

.hub-quick small {
  color: var(--soft);
  font-size: 13px;
}

.hub-quick a > svg {
  width: 13px;
  color: var(--soft);
}

.hub-sidebar-tools .hub-clock,
.hub-sidebar-tools .hub-quick {
  border-color: #243044;
  border-radius: 6px;
  background: #040b17;
  padding: 12px;
}

.hub-sidebar-tools .hub-side-heading {
  margin-bottom: 8px;
}

.hub-sidebar-tools .hub-clock > strong {
  font-size: 23px;
}

.hub-sidebar-tools .hub-zone-tabs {
  margin-top: 9px;
}

.hub-sidebar-tools .hub-zone-tabs button {
  min-height: 28px;
}

.hub-sidebar-tools .hub-time-selects {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  margin-top: 7px;
}

.hub-sidebar-tools .hub-time-selects input {
  height: 29px;
  padding: 0 3px;
}

.hub-sidebar-tools .hub-converted {
  margin-top: 8px;
  padding-top: 7px;
}

.hub-sidebar-tools .hub-quick a {
  min-height: 39px;
  grid-template-columns: 28px minmax(0, 1fr) 14px;
  gap: 8px;
}

.hub-sidebar-tools .hub-quick img {
  width: 24px;
  height: 24px;
}

.hub-sidebar-tools .hub-quick small {
  display: none;
}

.hub-sidebar-admin-link {
  min-width: 0;
  min-height: 40px;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 9px;
  border: 1px solid color-mix(in srgb, var(--blue) 42%, var(--line-strong));
  border-radius: 5px;
  background: color-mix(in srgb, var(--blue) 9%, var(--subtle));
  color: var(--ink);
  padding: 0 11px;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  transition: border-color var(--dur-press) var(--ease-out), background var(--dur-press) var(--ease-out), color var(--dur-press) var(--ease-out);
}

.hub-sidebar-admin-link > svg {
  width: 17px;
  height: 17px;
  color: var(--blue);
}

.hub-sidebar-admin-link > svg:last-child {
  width: 13px;
  height: 13px;
  color: var(--soft);
}

.hub-sidebar-admin-link:hover {
  border-color: var(--blue);
  background: color-mix(in srgb, var(--blue) 16%, var(--subtle));
  color: #fff;
}

.hub-sidebar-account {
  min-width: 0;
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 14px 0;
}

.hub-sidebar-account-heading,
.hub-sidebar-profile {
  min-width: 0;
  display: flex;
  align-items: center;
}

.hub-sidebar-account-heading {
  position: relative;
  gap: 9px;
  color: inherit;
  text-decoration: none;
}

.hub-sidebar-account-heading > svg {
  width: 17px;
  height: 17px;
  color: var(--blue);
}

.hub-sidebar-account-heading > span,
.hub-sidebar-profile > span {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.hub-sidebar-account-heading small,
.hub-sidebar-profile small {
  color: var(--soft);
  font-size: 12px;
}

.hub-sidebar-profile small.hub-sidebar-username.is-verified {
  color: var(--green);
  font-weight: 700;
}

.hub-sidebar-account-heading strong,
.hub-sidebar-profile strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-sidebar-account > p {
  margin: 0;
  color: var(--soft);
  font-size: 12px;
  line-height: 1.55;
}

.hub-sidebar-account-loading {
  min-height: 30px;
  display: grid;
  align-content: center;
  gap: 6px;
}

.hub-sidebar-account-loading > i {
  width: 72%;
  height: 4px;
  display: block;
  background: var(--line-strong);
}

.hub-sidebar-account-loading > i:last-child {
  width: 44%;
}

.hub-sidebar-profile {
  gap: 9px;
}

.hub-sidebar-profile > img,
.hub-sidebar-profile > svg,
.hub-sidebar-profile-link > img,
.hub-sidebar-profile-link > svg {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border-radius: 50%;
  object-fit: cover;
  color: var(--blue);
}

/* Members without a Telegram photo still get a round avatar rather than a
   bare icon, which matters most in the collapsed rail. */
.hub-sidebar-profile > svg,
.hub-sidebar-profile-link > svg {
  padding: 6px;
  border: 1px solid var(--line-strong);
  background: color-mix(in srgb, var(--accent) 14%, transparent);
}

.hub-sidebar-profile > span,
.hub-sidebar-profile-link > span {
  flex: 1;
  min-width: 0;
}

.hub-sidebar-profile > button,
.hub-sidebar-login-retry {
  border: 0;
  background: transparent;
  color: var(--soft);
}

.hub-sidebar-profile > button {
  width: 30px;
  height: 30px;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
}

.hub-sidebar-profile > button:hover,
.hub-sidebar-login-retry:hover {
  color: var(--blue);
}

.hub-sidebar-profile > button svg {
  width: 15px;
  height: 15px;
}

.hub-sidebar-login-retry {
  width: fit-content;
  border-bottom: 1px solid currentColor;
  padding: 4px 0;
  font-size: 12px;
  font-weight: 700;
}

.hub-sidebar-account .hub-telegram-login {
  min-height: 36px;
  overflow: hidden;
}

/* Logged out, the block is just this login link (no account heading above
   it), so it has to read as a button on every layout — not only in the
   mobile drawer the class name was born in. */
.hub-sidebar-mobile-login {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  /* The account section is a grid; fill its column but never stretch tall. */
  align-self: center;
  justify-self: stretch;
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  color: var(--ink);
  padding: 0 12px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.hub-sidebar-mobile-login:hover {
  border-color: var(--blue);
}

.hub-sidebar-mobile-login > svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  color: var(--blue);
}

@media (min-width: 761px) and (max-width: 1359px) {
  #hubSidebarTools .hub-sidebar-admin-link {
    width: 48px;
    height: 48px;
    grid-template-columns: 1fr;
    justify-items: center;
    padding: 0;
  }

  #hubSidebarTools .hub-sidebar-admin-link > span,
  #hubSidebarTools .hub-sidebar-admin-link > svg:last-child {
    display: none;
  }

  #hubSidebarTools .hub-sidebar-account {
    width: 52px;
    height: 48px;
    display: block;
    overflow: hidden;
    border: 0;
    padding: 0;
  }

  #hubSidebarTools .hub-sidebar-account-heading {
    width: 48px;
    height: 48px;
    justify-content: center;
    border: 1px solid var(--line-strong);
    border-radius: 6px;
    background: var(--subtle);
  }

  #hubSidebarTools .hub-sidebar-account-heading > svg {
    width: 18px;
    height: 18px;
  }

  /* The logged-out login link collapses to the same 48px icon square the
     account heading uses in this rail. */
  #hubSidebarTools .hub-sidebar-mobile-login {
    width: 48px;
    height: 48px;
    justify-content: center;
    border-radius: 6px;
    background: var(--subtle);
    padding: 0;
  }

  #hubSidebarTools .hub-sidebar-mobile-login > svg {
    width: 18px;
    height: 18px;
  }

  #hubSidebarTools .hub-sidebar-mobile-login > span {
    display: none;
  }

  #hubSidebarTools .hub-sidebar-account-heading > span,
  #hubSidebarTools .hub-sidebar-account > p,
  #hubSidebarTools .hub-sidebar-account-status,
  #hubSidebarTools .hub-sidebar-profile,
  #hubSidebarTools .hub-sidebar-login-retry,
  #hubSidebarTools .hub-sidebar-account .hub-telegram-login {
    display: none;
  }
}

.hub-loading,
.hub-empty {
  min-height: 240px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--soft);
  text-align: center;
}

.hub-loading svg {
  width: 20px;
  animation: hub-spin 1s linear infinite;
}

.hub-loading span,
.hub-empty span {
  max-width: 480px;
  font-size: 12px;
}

.hub-empty > svg {
  width: 25px;
  color: #41516a;
}

.hub-empty strong {
  color: var(--ink);
  font-size: 13px;
}

.hub-admin-card {
  overflow: hidden;
}

.hub-admin-card > header {
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--line);
  padding: 18px;
}

.hub-admin-card > header > div {
  display: flex;
  align-items: center;
  gap: 12px;
}

.hub-admin-card > header svg {
  width: 20px;
  color: var(--blue);
}

.hub-admin-card > header span {
  display: grid;
  gap: 2px;
}

.hub-admin-card > header small {
  color: var(--soft);
  font-size: 13px;
  text-transform: uppercase;
}

.hub-admin-card > header strong {
  font-size: 13px;
}

.hub-admin-connection {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  margin: 0;
  color: var(--soft);
  font-size: 13px;
}

.hub-admin-connection span {
  color: var(--soft);
}

.hub-admin-connection strong {
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}

.hub-admin-connection[data-state="connected"] strong {
  color: var(--green);
}

.hub-admin-card dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 0;
}

.hub-admin-card dl > div {
  min-height: 95px;
  display: grid;
  align-content: center;
  gap: 7px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 18px;
}

.hub-admin-card dt {
  color: var(--soft);
  font-size: 13px;
  text-transform: uppercase;
}

.hub-admin-card dd {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 13px;
}

.hub-admin-card footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  padding: 16px 18px;
}

.hub-raffle-manager {
  margin-top: 18px;
  /* clip, not hidden: a scroll container here would pin the editor's sticky
     submit bar to the panel instead of the viewport. */
  overflow: clip;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
}

.hub-raffle-manager > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--line);
  padding: 18px;
}

.hub-raffle-manager > header p,
.hub-raffle-manager > header h3 {
  margin: 0;
}

.hub-raffle-manager > header p {
  margin-bottom: 4px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.hub-raffle-manager > header h3 {
  color: var(--ink);
  font-size: 17px;
}

.hub-raffle-manager button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  padding: 0 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
}

.hub-raffle-manager button:hover:not(:disabled),
.hub-raffle-manager button:focus-visible {
  border-color: var(--blue);
  color: var(--ink);
}

.hub-raffle-manager button:focus-visible {
  outline: 1px solid var(--blue);
  outline-offset: 2px;
}

.hub-raffle-manager button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.hub-raffle-manager button svg {
  width: 14px;
  height: 14px;
}

.hub-raffle-create {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) minmax(220px, 1.8fr) 100px 90px 90px minmax(190px, 1fr) auto;
  align-items: end;
  gap: 10px;
  border-bottom: 1px solid var(--line);
  padding: 18px;
}

.hub-raffle-create label {
  min-width: 0;
  display: grid;
  gap: 7px;
}

.hub-raffle-create label > span {
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-create input {
  width: 100%;
  min-height: 42px;
  box-sizing: border-box;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--panel);
  color: var(--ink);
  padding: 0 11px;
  color-scheme: dark;
  font: inherit;
  font-size: 13px;
}

.hub-raffle-create input:focus {
  border-color: var(--blue);
  outline: 1px solid var(--blue);
  outline-offset: 1px;
}

.hub-raffle-create > button {
  border-color: var(--accent-primary-line);
  background: var(--accent-primary);
  color: #fff;
}

.hub-raffle-create > p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-empty {
  margin: 0;
  padding: 14px 18px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-list {
  display: grid;
}

.hub-raffle-item {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.hub-raffle-item + .hub-raffle-item {
  border-top: 1px solid var(--line);
}

.hub-raffle-item > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.hub-raffle-item > header strong {
  color: var(--ink);
  font-size: 14px;
}

.hub-raffle-item > header p {
  margin: 5px 0 0;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-item > header > span {
  flex-shrink: 0;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  padding: 4px 8px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 750;
}

.hub-raffle-item > header > span[data-status="open"] {
  border-color: rgb(0 214 107 / 45%);
  color: var(--green);
}

.hub-raffle-item > header > span[data-status="drawn"] {
  border-color: rgb(8 127 245 / 55%);
  color: var(--blue);
}

.hub-raffle-item > dl {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 0;
  border: 1px solid var(--line);
}

.hub-raffle-item > dl > div {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 12px;
}

.hub-raffle-item > dl > div + div {
  border-left: 1px solid var(--line);
}

.hub-raffle-item dt {
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-item dd {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 12px;
}

.hub-raffle-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.hub-raffle-link code {
  min-width: 0;
  display: flex;
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 0 11px;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-raffle-result {
  display: grid;
  gap: 12px;
  border: 1px solid rgb(8 127 245 / 35%);
  background: rgb(8 127 245 / 5%);
  padding: 14px;
}

.hub-raffle-result > p {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  color: var(--ink);
  font-size: 12px;
}

.hub-raffle-result > p span {
  color: var(--green);
}

.hub-raffle-result-entries {
  display: grid;
  gap: 7px;
}

.hub-raffle-result-entries > strong {
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-result-entries ol {
  display: grid;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-raffle-result-entries li {
  min-width: 0;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
}

.hub-raffle-result-entries li span {
  color: var(--blue);
}

.hub-raffle-result-entries code {
  overflow-wrap: anywhere;
}

.hub-raffle-item > footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.hub-raffle-item > footer .primary {
  border-color: var(--accent-primary-line);
  background: var(--accent-primary);
  color: #fff;
}

.hub-digest-settings {
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
}

.hub-digest-settings > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--line);
  padding: 18px;
}

.hub-digest-settings > header p {
  margin: 0 0 4px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.hub-digest-settings > header h3 {
  margin: 0;
  color: var(--ink);
  font-size: 17px;
}

.hub-digest-settings > header > span,
.hub-digest-settings label > span,
.hub-digest-settings dt {
  color: var(--soft);
  font-size: 12px;
}

.hub-digest-settings > div {
  display: grid;
  grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
}

.hub-digest-settings label {
  display: grid;
  align-content: center;
  gap: 8px;
  border-right: 1px solid var(--line);
  padding: 18px;
}

.hub-digest-settings select {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--panel);
  padding: 0 11px;
  color: var(--ink);
  font: inherit;
}

.hub-digest-settings dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 0;
}

.hub-digest-settings dl > div {
  display: grid;
  align-content: center;
  gap: 7px;
  min-width: 0;
  min-height: 82px;
  padding: 18px;
}

.hub-digest-settings dl > div + div {
  border-left: 1px solid var(--line);
}

.hub-digest-settings dd {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 13px;
}

.hub-digest-access {
  display: inline-block;
  margin-left: 8px;
  border-radius: 3px;
  padding: 2px 7px;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  color: var(--soft);
  border: 1px solid var(--line-strong);
}

.hub-digest-access[data-state="can_post"] {
  border-color: rgb(0 214 107 / 45%);
  color: #00d66b;
}

.hub-digest-access[data-state="not_admin"] {
  border-color: rgb(255 105 105 / 55%);
  color: #ff6969;
}

.hub-digest-settings > .hub-digest-warning {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  background: rgb(255 105 105 / 8%);
  padding: 14px 18px;
}

.hub-digest-warning p {
  margin: 0;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.5;
}

.hub-digest-warning button {
  flex-shrink: 0;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--accent-primary-line);
  border-radius: 4px;
  background: var(--accent-primary);
  color: #fff;
  padding: 0 11px;
  font-size: 12px;
  font-weight: 700;
}

.hub-digest-warning button svg {
  width: 13px;
  height: 13px;
}

.hub-digest-settings > .hub-digest-actions {
  display: flex;
  gap: 8px;
  border-top: 1px solid var(--line);
  padding: 14px 18px;
}

.hub-digest-actions button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  padding: 0 11px;
  font-size: 12px;
  font-weight: 700;
}

.hub-digest-actions button:last-child {
  border-color: var(--accent-primary-line);
  background: var(--accent-primary);
  color: #fff;
}

.hub-digest-actions button:disabled {
  opacity: 0.55;
}

.hub-digest-actions button svg {
  width: 13px;
  height: 13px;
}

.hub-digest-settings > .hub-digest-test-send {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto;
  align-items: end;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding: 14px 18px;
}

.hub-digest-test-send label {
  display: grid;
  gap: 7px;
}

.hub-digest-test-send label > span {
  color: var(--soft);
  font-size: 12px;
}

.hub-digest-test-send input {
  min-width: 0;
  min-height: 44px;
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  outline: 0;
  background: var(--panel);
  padding: 0 12px;
  color: var(--ink);
  font: inherit;
  font-size: 13px;
}

.hub-digest-test-send input:focus-visible {
  border-color: var(--blue);
  box-shadow: 0 0 0 1px var(--blue);
}

.hub-digest-test-send button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  padding: 0 14px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.hub-digest-test-send button:disabled {
  opacity: 0.45;
}

.hub-digest-test-send button svg {
  width: 13px;
  height: 13px;
}

.hub-digest-settings > .hub-digest-preview {
  display: block;
  border-top: 1px solid var(--line);
  padding: 14px 18px 18px;
}

.hub-digest-preview h4 {
  margin: 0 0 8px;
  color: var(--soft);
  font-size: 12px;
  letter-spacing: 0.05em;
}

.hub-digest-preview p {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 12px;
}

.hub-digest-preview pre {
  margin: 0;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--panel);
  padding: 12px;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.6;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.hub-digest-template {
  border-top: 1px solid var(--line);
  padding: 18px;
}

.hub-digest-template > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.hub-digest-template > header p,
.hub-digest-template > header h4 {
  margin: 0;
}

.hub-digest-template > header p {
  margin-bottom: 4px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.hub-digest-template > header h4 {
  color: var(--ink);
  font-size: 16px;
}

.hub-digest-template > header > span {
  color: #ffb84d;
  font-size: 12px;
  font-weight: 700;
}

.hub-digest-mode {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(140px, 1fr));
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 5px;
}

.hub-digest-mode button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  background: transparent;
  padding: 0 14px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.hub-digest-mode button + button {
  border-left: 1px solid var(--line-strong);
}

.hub-digest-mode button.active {
  background: var(--accent-soft);
  color: var(--blue);
}

.hub-digest-mode button:disabled,
.hub-digest-template button:disabled,
.hub-digest-cover-toggle:has(input:disabled) {
  opacity: 0.55;
}

.hub-digest-mode svg,
.hub-digest-template footer button svg {
  width: 15px;
  height: 15px;
}

.hub-digest-template-fields {
  display: grid;
  grid-template-columns: minmax(220px, 1.7fr) repeat(3, minmax(110px, 0.8fr));
  gap: 12px;
  margin-top: 14px;
}

.hub-digest-settings .hub-digest-template-fields label {
  display: grid;
  gap: 7px;
  border: 0;
  padding: 0;
}

.hub-digest-template-fields label > span {
  color: var(--soft);
  font-size: 12px;
}

.hub-digest-message-template-field,
.hub-digest-template-variables {
  grid-column: 1 / -1;
}

.hub-digest-template-fields textarea {
  min-width: 0;
  min-height: 168px;
  width: 100%;
  resize: vertical;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  outline: 0;
  background: var(--panel);
  padding: 12px;
  color: var(--ink);
  font: inherit;
  font-size: 14px;
  line-height: 1.65;
}

.hub-digest-template-fields textarea:focus-visible {
  border-color: var(--blue);
  box-shadow: 0 0 0 1px var(--blue);
}

.hub-digest-template-variables {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  margin: -2px 0 2px;
  color: var(--muted);
  font-size: 12px;
}

.hub-digest-template-variables code {
  border: 1px solid var(--line);
  border-radius: 3px;
  background: var(--panel-strong);
  padding: 3px 6px;
  color: var(--blue);
  font: inherit;
  font-weight: 700;
}

.hub-digest-template-fields input[type="text"] {
  min-width: 0;
  min-height: 44px;
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  outline: 0;
  background: var(--panel);
  padding: 0 12px;
  color: var(--ink);
  font: inherit;
  font-size: 13px;
}

.hub-digest-template-fields input[type="text"]:focus-visible {
  border-color: var(--blue);
  box-shadow: 0 0 0 1px var(--blue);
}

.hub-digest-template > footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 14px;
}

.hub-digest-settings .hub-digest-cover-toggle {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 0;
  padding: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.hub-digest-cover-toggle input {
  width: 17px;
  height: 17px;
  accent-color: var(--blue);
}

.hub-digest-template > footer button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  padding: 0 14px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
}

.hub-digest-preview > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.hub-digest-preview > header h4,
.hub-digest-preview > header p {
  margin: 0;
}

.hub-digest-preview > header p {
  margin-top: 5px;
}

.hub-digest-character-count {
  color: var(--soft);
  font-size: 12px;
}

.hub-digest-character-count[data-over-limit="true"] {
  color: #ff6969;
  font-weight: 800;
}

.hub-telegram-delivery-preview {
  width: min(100%, 680px);
  margin: 0 auto;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--subtle);
  padding: 14px;
}

.hub-telegram-delivery-bar {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.hub-telegram-delivery-bar > span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--ink);
  font-size: 13px;
}

.hub-telegram-delivery-bar img {
  width: 34px;
  height: 34px;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: #020914;
  object-fit: contain;
  padding: 4px;
}

.hub-telegram-delivery-bar em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.hub-telegram-message-preview {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--canvas);
}

.hub-telegram-message-preview > img {
  display: block;
  width: 100%;
  aspect-ratio: 5 / 4;
  background: #060a0f;
  object-fit: contain;
}

.hub-telegram-message-preview > pre {
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  padding: 14px 16px 12px;
  font-size: 13px;
  line-height: 1.65;
}

.hub-telegram-inline-button {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid var(--line);
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
}

.hub-telegram-page-nav {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.hub-telegram-page-nav button {
  width: 44px;
  min-width: 44px;
  height: 44px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
}

.hub-telegram-page-nav button:disabled {
  opacity: 0.45;
}

.hub-telegram-page-nav svg {
  width: 17px;
  height: 17px;
}

.hub-digest-preview-grid {
  display: grid;
  grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.25fr);
  align-items: start;
  gap: 16px;
}

.hub-digest-preview-grid.text-only {
  grid-template-columns: 1fr;
}

.hub-digest-poster-preview {
  min-width: 0;
}

.hub-digest-poster-preview img {
  display: block;
  width: 100%;
  max-width: 420px;
  aspect-ratio: 4 / 5;
  margin: 0 auto;
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  background: var(--panel);
  object-fit: contain;
}

.hub-digest-poster-preview nav {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.hub-digest-poster-preview nav button {
  width: 44px;
  min-width: 44px;
  height: 44px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
}

.hub-digest-poster-preview nav button:disabled {
  opacity: 0.45;
}

.hub-digest-poster-preview nav svg {
  width: 17px;
  height: 17px;
}

.hub-digest-poster-empty {
  min-height: 180px;
  display: grid;
  place-items: center;
  border: 1px dashed var(--line-strong);
  border-radius: 5px;
  margin: 0;
  text-align: center;
}

.hub-digest-text-preview {
  min-width: 0;
}

.hub-digest-text-preview h5 {
  margin: 0 0 8px;
  color: var(--soft);
  font-size: 12px;
  letter-spacing: 0.05em;
}

.hub-taxonomy-manager {
  margin-top: 18px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
  overflow: hidden;
}

.hub-taxonomy-manager > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--line);
  padding: 18px;
}

.hub-taxonomy-manager > header p {
  margin: 0 0 4px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.hub-taxonomy-manager > header h3 {
  margin: 0;
  color: var(--ink);
  font-size: 17px;
}

.hub-taxonomy-manager > header > span {
  color: var(--soft);
  font-size: 12px;
}

.hub-taxonomy-manager > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.hub-taxonomy-group {
  min-width: 0;
  padding: 18px;
}

.hub-taxonomy-group + .hub-taxonomy-group {
  border-left: 1px solid var(--line);
}

.hub-taxonomy-group h4 {
  margin: 0 0 12px;
  color: var(--ink);
  font-size: 12px;
}

.hub-taxonomy-group > form,
.hub-taxonomy-row form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 6px;
}

.hub-taxonomy-group > form.has-wallet-family {
  grid-template-columns: minmax(0, 1fr) minmax(150px, 0.7fr) auto;
}

.hub-taxonomy-row form.has-wallet-family {
  grid-template-columns: minmax(0, 1fr) minmax(150px, 0.75fr) auto auto;
}

.hub-taxonomy-group input,
.hub-taxonomy-group select,
.hub-taxonomy-delete select {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  outline: 0;
  background: #071322;
  color: var(--ink);
  padding: 0 10px;
  font-size: 13px;
}

.hub-taxonomy-group input:focus,
.hub-taxonomy-group select:focus,
.hub-taxonomy-delete select:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.hub-taxonomy-wallet-family-hint {
  margin: 7px 0 0;
  color: #f3b85c;
  font-size: 12px;
  line-height: 1.45;
}

.hub-taxonomy-row form .hub-taxonomy-wallet-family-hint {
  grid-column: 1 / -1;
  margin: 0;
  color: #f3b85c;
}

/* Keep chain name/family controls usable while the two taxonomy panels still share a row. */
@media (max-width: 1040px) {
  .hub-taxonomy-group > form.has-wallet-family {
    grid-template-columns: 1fr;
  }

  .hub-taxonomy-group > form.has-wallet-family > button {
    width: 100%;
  }

  .hub-taxonomy-row form.has-wallet-family {
    grid-template-columns: 1fr 1fr;
  }

  .hub-taxonomy-row form.has-wallet-family > label {
    grid-column: 1 / -1;
  }

  .hub-taxonomy-row form.has-wallet-family > button {
    width: 100%;
  }

  .hub-taxonomy-row form.has-wallet-family > button:last-of-type {
    grid-column: auto;
  }
}

.hub-taxonomy-group button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
}

.hub-taxonomy-group button:hover:not(:disabled) {
  border-color: var(--blue);
  color: #fff;
}

.hub-taxonomy-group button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.hub-taxonomy-group button svg {
  width: 13px;
  height: 13px;
}

.hub-taxonomy-group > form > button {
  border-color: var(--accent-primary-line);
  background: var(--accent-primary);
  color: #fff;
}

.hub-taxonomy-group ul {
  display: grid;
  gap: 7px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}

.hub-taxonomy-group li {
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #050e1b;
}

.hub-taxonomy-reorder-hint {
  margin: 0 0 8px;
  color: var(--soft);
  font-size: 12px;
}

.hub-taxonomy-row {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 10px;
}

.hub-taxonomy-row[draggable="true"] {
  cursor: grab;
}

.hub-taxonomy-row[draggable="true"]:active {
  cursor: grabbing;
}

.hub-taxonomy-grip {
  flex: none;
  width: 14px;
  height: 14px;
  color: var(--soft);
}

.hub-taxonomy-group li.is-dragging {
  opacity: 0.4;
}

/* The row being dragged over shows where it would land. */
.hub-taxonomy-group li.is-drop-target {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
  border-radius: 4px;
}

.hub-taxonomy-row > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.hub-taxonomy-row strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  text-overflow: ellipsis;
}

.hub-taxonomy-row small,
.hub-taxonomy-delete p,
.hub-taxonomy-delete label > span {
  color: var(--soft);
  font-size: 13px;
}

.hub-taxonomy-row small b {
  color: #79c7ff;
  font-weight: 700;
}

.hub-taxonomy-row small b.is-unassigned {
  color: #ffb258;
}

.hub-taxonomy-row > div {
  display: flex;
  /* Four actions share the row, so the label truncates instead of squeezing them. */
  flex: none;
  gap: 5px;
}

.hub-taxonomy-row > div button {
  width: 34px;
  min-height: 34px;
  padding: 0;
}

.hub-taxonomy-row > div button:disabled {
  opacity: 0.35;
}

.hub-taxonomy-row form {
  width: 100%;
}

.hub-taxonomy-delete {
  display: grid;
  gap: 9px;
  border-top: 1px solid var(--line);
  padding: 10px;
}

.hub-taxonomy-delete p {
  margin: 0;
  line-height: 1.5;
}

.hub-taxonomy-delete label {
  display: grid;
  gap: 5px;
}

.hub-taxonomy-delete > div {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
}

.hub-taxonomy-delete button.danger {
  border-color: rgba(255, 84, 109, 0.5);
  color: #ff7187;
}

.hub-member-wallet-manager {
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
}

.hub-member-wallet-manager > header {
  min-height: 76px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--line);
  padding: 18px;
}

.hub-member-wallet-manager > header p {
  margin: 0 0 4px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hub-member-wallet-manager > header h3 {
  margin: 0;
  color: var(--ink);
  font-size: 17px;
}

.hub-member-wallet-manager > header > div:last-child {
  display: flex;
  align-items: center;
  gap: 10px;
}

.hub-member-wallet-manager > header > div:last-child > span {
  color: var(--soft);
  font-size: 13px;
}

.hub-member-wallet-manager button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  padding: 0 11px;
  font-size: 12px;
  font-weight: 700;
}

.hub-member-wallet-manager button:hover:not(:disabled) {
  border-color: var(--blue);
  color: var(--ink);
}

.hub-member-wallet-manager button:focus-visible {
  outline: 0;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.hub-member-wallet-manager button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.hub-member-wallet-manager button svg {
  width: 14px;
  height: 14px;
}

.hub-member-wallet-state {
  margin: 0;
  padding: 28px 18px;
  color: var(--soft);
  font-size: 13px;
}

.hub-member-wallet-state.is-error {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #ff7187;
}

.hub-member-wallet-state p {
  margin: 0;
}

.hub-member-wallet-list,
.hub-member-wallet-addresses {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-member-wallet-list > li + li {
  border-top: 1px solid var(--line);
}

.hub-member-wallet-profile {
  display: grid;
  grid-template-columns: 46px minmax(150px, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
}

.hub-member-wallet-avatar {
  position: relative;
  width: 46px;
  height: 46px;
  overflow: hidden;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: var(--panel);
  color: var(--ink);
  font-size: 16px;
  font-weight: 800;
}

.hub-member-wallet-avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hub-member-wallet-profile > div:nth-child(2) {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.hub-member-wallet-profile > div:nth-child(2) strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-member-wallet-profile > div:nth-child(2) span {
  color: var(--blue);
  font-size: 13px;
}

.hub-member-wallet-profile dl {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 0;
}

.hub-member-wallet-profile dl > div {
  display: grid;
  gap: 3px;
}

.hub-member-wallet-profile dt {
  color: var(--soft);
  font-size: 12px;
}

.hub-member-wallet-profile dd {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.hub-member-wallet-addresses {
  border-top: 1px solid var(--line);
}

.hub-member-wallet-addresses > li {
  min-height: 58px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 10px 18px;
}

.hub-member-wallet-addresses > li + li {
  border-top: 1px solid var(--line);
}

.hub-member-wallet-addresses > li > span {
  justify-self: start;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  padding: 3px 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.05em;
}

.hub-member-wallet-addresses > li > span[data-namespace="solana"] {
  border-color: rgb(20 241 149 / 35%);
  color: #14f195;
}

.hub-member-wallet-addresses code {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--soft);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: 12px;
  line-height: 1.45;
}

.hub-member-wallet-pagination {
  min-height: 58px;
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) 88px;
  align-items: center;
  gap: 12px;
  border-top: 1px solid var(--line);
  padding: 10px 18px;
}

.hub-member-wallet-pagination > span {
  color: var(--soft);
  font-size: 12px;
  text-align: center;
}

@media (max-width: 760px) {
  .hub-member-wallet-profile {
    grid-template-columns: 46px minmax(0, 1fr);
  }

  .hub-member-wallet-manager > header {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
  }

  .hub-member-wallet-manager > header > div:last-child {
    justify-content: space-between;
  }

  .hub-member-wallet-manager button {
    min-height: 44px;
  }

  .hub-member-wallet-profile dl {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  .hub-member-wallet-profile dd {
    white-space: normal;
  }

  .hub-member-wallet-state.is-error {
    align-items: flex-start;
    flex-direction: column;
  }

  .hub-member-wallet-pagination {
    grid-template-columns: 1fr auto 1fr;
    padding: 10px 12px;
  }
}

/* Dedicated administrator console */
.hub-app-admin {
  width: 100%;
  max-width: none;
  margin: 0;
}

.hub-app-admin .hub-layout {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}

.hub-app-admin .hub-main {
  width: 100%;
}

.hub-admin-console {
  width: 100%;
}

.hub-admin-console-bar {
  min-height: 72px;
  display: flex;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid var(--line);
}

.hub-admin-console-bar > div {
  margin-right: 4px;
}

.hub-admin-console-bar p,
.hub-admin-console-bar h2 {
  margin: 0;
}

.hub-admin-console-bar p {
  margin-bottom: 3px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.hub-admin-console-bar h2 {
  color: var(--ink);
  font-size: 22px;
  letter-spacing: -0.025em;
}

.hub-admin-console-time,
.hub-admin-console-health {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--soft);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.hub-admin-console-time svg {
  width: 15px;
  height: 15px;
}

.hub-admin-console-health i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--soft);
}

.hub-admin-console-health[data-state="ok"] i {
  background: var(--green);
}

.hub-admin-console-health strong {
  color: var(--green);
  font-weight: 750;
}

/* The tab strip stays pinned while a long section scrolls, and the wrapper
   paints edge fades only while tabs are actually hidden off one side. */
.hub-admin-nav-wrap {
  position: sticky;
  top: 0;
  z-index: 5;
  background: var(--canvas);
}

.hub-admin-nav-wrap::before,
.hub-admin-nav-wrap::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 1px;
  width: 40px;
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--dur-fast) var(--ease-out);
}

.hub-admin-nav-wrap::before {
  left: 0;
  background: linear-gradient(90deg, var(--canvas), transparent);
}

.hub-admin-nav-wrap::after {
  right: 0;
  background: linear-gradient(270deg, var(--canvas), transparent);
}

.hub-admin-nav-wrap[data-fade~="left"]::before,
.hub-admin-nav-wrap[data-fade~="right"]::after {
  opacity: 1;
}

.hub-admin-nav {
  min-height: 56px;
  display: flex;
  align-items: stretch;
  gap: 18px;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  scrollbar-width: none;
}

.hub-admin-nav::-webkit-scrollbar {
  display: none;
}

.hub-admin-nav button {
  flex: none;
  min-width: 44px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--soft);
  padding: 0 6px;
  font: inherit;
  font-size: 13px;
  font-weight: 680;
  white-space: nowrap;
  cursor: pointer;
}

.hub-admin-nav button:hover,
.hub-admin-nav button:focus-visible {
  color: var(--ink);
}

.hub-admin-nav button:focus-visible {
  outline: 1px solid var(--blue);
  outline-offset: -3px;
}

.hub-admin-nav button.active {
  border-bottom-color: var(--blue);
  color: var(--ink);
  font-weight: 800;
}

.hub-admin-overview {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  padding-top: 16px;
}

.hub-admin-work-queue > .hub-admin-overview-empty {
  margin: 0;
  padding: 18px 16px;
  color: var(--soft);
  font-size: 12px;
}

.hub-admin-work-queue {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--subtle);
}

.hub-admin-work-queue > header {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 9px;
  border-bottom: 1px solid var(--line);
  padding: 0 16px;
}

.hub-admin-work-queue h3 {
  margin: 0;
  color: var(--ink);
  font-size: 15px;
}

.hub-admin-work-queue > header span {
  color: var(--soft);
  font-size: 12px;
}

.hub-admin-work-head,
.hub-admin-work-row {
  display: grid;
  grid-template-columns: 92px minmax(210px, 1fr) minmax(150px, 0.7fr) 78px;
  align-items: center;
  gap: 12px;
  padding: 0 16px;
}

.hub-admin-work-head {
  min-height: 34px;
  color: var(--soft);
  font-size: 12px;
}

.hub-admin-work-row {
  min-height: 58px;
  border-top: 1px solid var(--line);
}

.hub-admin-work-row strong,
.hub-admin-work-row > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 12px;
}

.hub-admin-work-row strong {
  color: var(--ink);
  font-size: 13px;
}

.hub-admin-priority {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.hub-admin-priority i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--soft);
}

.hub-admin-priority[data-priority="high"] i { background: #ff6262; }
.hub-admin-priority[data-priority="medium"] i { background: #ffad3d; }

.hub-admin-work-row button {
  min-height: 34px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
}

.hub-admin-work-row button:hover,
.hub-admin-work-row button:focus-visible {
  border-color: var(--blue);
  color: var(--ink);
}


.hub-admin-console > .hub-admin-card,
.hub-admin-console > .hub-member-wallet-directory,
.hub-admin-console > .hub-digest-settings,
.hub-admin-console > .hub-taxonomy-manager,
.hub-admin-console > .hub-raffle-manager {
  margin-top: 16px;
}

.hub-raffle-console {
  background: var(--subtle);
}

.hub-raffle-console-header > div:last-child {
  display: flex;
  gap: 8px;
}

.hub-raffle-console button.primary {
  border-color: var(--accent-primary-line);
  background: var(--accent-primary);
  color: #fff;
}

.hub-raffle-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
}

.hub-raffle-summary > div {
  min-height: 72px;
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 0 18px;
}

.hub-raffle-summary > div + div {
  border-left: 1px solid var(--line);
}

.hub-raffle-summary span {
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-summary strong {
  color: var(--ink);
  font-family: var(--mono);
  font-size: 18px;
  font-variant-numeric: tabular-nums;
}

.hub-raffle-toolbar {
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  padding: 9px 18px;
}

.hub-raffle-toolbar > div {
  display: flex;
  align-items: stretch;
}

.hub-raffle-toolbar > div button {
  min-height: 38px;
  border-radius: 0;
  border-right: 0;
}

.hub-raffle-toolbar > div button:first-child { border-radius: 4px 0 0 4px; }
.hub-raffle-toolbar > div button:last-child { border-right: 1px solid var(--line-strong); border-radius: 0 4px 4px 0; }
.hub-raffle-toolbar > div button.active { border-color: var(--blue); background: rgb(8 127 245 / 10%); color: var(--blue); }

.hub-raffle-toolbar > label {
  width: min(320px, 100%);
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  padding: 0 11px;
}

.hub-raffle-toolbar > label:focus-within {
  border-color: var(--blue);
  outline: 1px solid var(--blue);
}

.hub-raffle-toolbar > label svg {
  width: 15px;
  color: var(--soft);
}

.hub-raffle-toolbar input {
  min-width: 0;
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
}

.hub-raffle-table {
  overflow-x: auto;
  scrollbar-gutter: stable;
  border-bottom: 1px solid var(--line);
}

.hub-raffle-table-head,
.hub-raffle-table-row {
  min-width: 1080px;
  display: grid;
  grid-template-columns: minmax(230px, 1.35fr) 124px 118px minmax(150px, 1fr) minmax(210px, 1.1fr) minmax(140px, 0.9fr);
  align-items: center;
  gap: 14px;
  padding: 0 18px;
}

.hub-raffle-table-head {
  min-height: 38px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-table-row {
  width: 100%;
  min-height: 66px;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  text-align: left;
}

.hub-raffle-manager .hub-raffle-table-row {
  display: grid;
  justify-content: stretch;
  padding: 0 18px;
}

.hub-raffle-table-row:hover,
.hub-raffle-table-row:focus-visible,
.hub-raffle-table-row.selected {
  background: var(--accent-hover-bg);
}

.hub-raffle-table-row:focus-visible {
  outline: 1px solid var(--blue);
  outline-offset: -2px;
}

.hub-raffle-table-row > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.hub-raffle-table-row > span:first-child {
  display: grid;
  gap: 4px;
}

.hub-raffle-table-row strong { overflow: hidden; color: var(--ink); font-size: 13px; text-overflow: ellipsis; }
.hub-raffle-table-row small { overflow: hidden; color: var(--soft); font-family: var(--mono); font-size: 12px; text-overflow: ellipsis; }
.hub-raffle-allocation-cell b { overflow: hidden; color: var(--blue); font: inherit; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.hub-raffle-allocation-mobile { display: none; }
.hub-raffle-table-row em,
.hub-raffle-detail header em { width: max-content; border: 1px solid var(--line-strong); border-radius: 3px; color: var(--soft); padding: 4px 7px; font-size: 12px; font-style: normal; font-weight: 750; }
.hub-raffle-table-row em[data-status="open"],
.hub-raffle-detail header em[data-status="open"] { border-color: rgb(0 214 107 / 40%); color: var(--green); }
.hub-raffle-table-row em[data-status="drawn"],
.hub-raffle-detail header em[data-status="drawn"] { border-color: rgb(8 127 245 / 45%); color: var(--blue); }

.hub-raffle-editor {
  border-bottom: 1px solid var(--line);
  background: rgb(8 127 245 / 3%);
  padding: 18px;
}

.hub-raffle-editor > header,
.hub-raffle-editor > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.hub-raffle-editor > header {
  margin-bottom: 16px;
}

.hub-raffle-editor > header small { color: var(--blue); font-size: 12px; font-weight: 800; }
.hub-raffle-editor > header h4 { margin: 3px 0 0; color: var(--ink); font-size: 16px; }
.hub-raffle-editor > header button { width: 42px; padding: 0; }

.hub-raffle-editor-fields {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 12px;
}

.hub-raffle-editor-fields label {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 7px;
}

.hub-raffle-editor-fields label.wide {
  grid-column: span 5;
}

.hub-raffle-editor-fields > .wide {
  grid-column: 1 / -1;
}

.hub-raffle-editor-fields label > span {
  color: var(--soft);
  font-size: 12px;
}

/* Inline, not a flex child: several label spans in this form stack a strong
   over a small in their own grid, and a display rule here would flatten them. */
.hub-raffle-required-tag {
  margin-left: 4px;
  color: var(--soft);
  font-size: 12px;
  font-style: normal;
  font-weight: 750;
  letter-spacing: 0.02em;
}

.hub-raffle-required-tag[data-required-missing] { color: var(--red); }

.hub-raffle-editor [data-required-missing] > input,
.hub-raffle-editor [data-required-missing] > select,
.hub-raffle-editor [data-required-missing] > textarea { border-color: var(--red); }

.hub-raffle-editor-required-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 12px 0 0;
  border: 1px solid rgb(255 77 98 / 40%);
  background: rgb(255 77 98 / 8%);
  padding: 10px 12px;
  font-size: 12px;
}

.hub-raffle-editor-required-summary strong { color: var(--red); font-weight: 750; }

.hub-raffle-editor-required-summary em {
  border: 1px solid rgb(255 77 98 / 40%);
  border-radius: 4px;
  color: var(--ink);
  padding: 2px 7px;
  font-style: normal;
  font-size: 12px;
}

.hub-raffle-campaign-team-preview em[data-required-missing] { color: var(--red); }

.hub-raffle-prize-label > small {
  color: var(--soft);
  font-size: 12px;
  line-height: 1.5;
}

.hub-raffle-editor input,
.hub-raffle-editor select,
.hub-raffle-editor textarea {
  width: 100%;
  min-height: 42px;
  box-sizing: border-box;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--panel);
  color: var(--ink);
  padding: 9px 11px;
  font: inherit;
  font-size: 12px;
}

.hub-raffle-editor input[type="datetime-local"] { color-scheme: dark; }

/* Native dropdown popups paint with the OS scheme unless told otherwise, so a
   dark select would open a list of dark text on a dark panel. */
.hub-raffle-editor select { color-scheme: dark; }
.hub-raffle-editor select option { background: var(--panel, #0d1b33); color: var(--ink, #f4f7fb); }
.hub-raffle-editor textarea { resize: vertical; line-height: 1.55; }
.hub-raffle-editor input:focus,
.hub-raffle-editor select:focus,
.hub-raffle-editor textarea:focus { border-color: var(--blue); outline: 1px solid var(--blue); }

/* Shares the audience field's geometry so the two-column seam below the
   five-column field row lines up down the whole form. */
.hub-raffle-policy-grid {
  min-width: 0;
  margin: 16px 0 0;
  border: 0;
  padding: 0;
}

.hub-raffle-policy-grid legend {
  margin-bottom: 7px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-policy-grid > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

/* Every tile keeps the same three tracks — icon, copy, trailing control — so
   the titles line up across both rows whether the rule can be switched or not. */
.hub-raffle-policy-grid > div > label {
  min-height: 78px;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) auto;
  align-content: center;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--panel);
  padding: 0 14px;
}

.hub-raffle-policy-grid > div > label { cursor: pointer; }
.hub-raffle-policy-grid > div > label.selected { border-color: var(--blue); background: rgb(8 127 245 / 8%); }
.hub-raffle-policy-grid > div > label:has(input:disabled) { cursor: default; }
.hub-raffle-policy-grid svg { width: 16px; color: var(--blue); }

.hub-raffle-capacity-field {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 7px;
}

.hub-raffle-capacity-field > label {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 7px;
}

/* The editor's generic label rule lays labels out as grids; this one is a
   compact flex row, so it needs the heavier selector to win. */
.hub-raffle-capacity-field label.hub-raffle-inline-check {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.hub-raffle-capacity-field .hub-raffle-inline-check input { width: 14px; height: 14px; min-height: 0; margin: 0; padding: 0; accent-color: var(--blue); }
.hub-raffle-capacity-field .hub-raffle-inline-check small { color: var(--soft); font-size: 12px; }

.hub-raffle-requirements-field {
  min-width: 0;
  margin: 0;
  border: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.hub-raffle-requirements-field legend {
  margin-bottom: 7px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-requirement-row {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr) minmax(0, 1.4fr) 34px;
  gap: 8px;
}

/* The comment-link option rides under its own mission row, full width, so
   the four-column grid above never learns a fifth column. */
.hub-raffle-requirement-row .hub-raffle-requirement-proof {
  grid-column: 1 / -1;
  margin: -2px 0 2px;
}

/* Prize groups: order badge | name | WL type | winners | backups | remove.
   The listed order is the draw's priority order. */
.hub-raffle-group-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1.4fr) 150px auto auto 34px;
  gap: 8px;
  align-items: center;
}

.hub-raffle-group-order {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--subtle);
  color: var(--soft);
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 700;
}

.hub-raffle-group-count {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.hub-raffle-group-count span {
  color: var(--soft);
  font-size: 12px;
  white-space: nowrap;
}

.hub-raffle-group-count input {
  width: 74px;
}

.hub-raffle-groups-footer {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin-top: 10px;
}

.hub-raffle-groups-help {
  min-height: 36px;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  border-left: 2px solid rgb(8 127 245 / 45%);
  background: rgb(8 127 245 / 5%);
  padding: 7px 11px;
}

.hub-raffle-groups-help svg {
  width: 16px;
  height: 16px;
  color: var(--blue);
}

.hub-raffle-groups-help small {
  color: var(--soft);
  font-size: 12px;
  line-height: 1.55;
}

.hub-raffle-create-mode,
.hub-raffle-campaign-allocation {
  min-width: 0;
  margin: 0;
  border: 0;
  padding: 0;
}

.hub-raffle-create-mode legend,
.hub-raffle-campaign-allocation legend {
  margin-bottom: 7px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-create-mode > div {
  display: inline-flex;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  overflow: hidden;
}

.hub-raffle-create-mode button {
  min-width: 200px;
  border: 0;
  border-right: 1px solid var(--line-strong);
  border-radius: 0;
  background: var(--panel);
  color: var(--ink);
}

.hub-raffle-create-mode button:last-child { border-right: 0; }
.hub-raffle-create-mode button.active { background: var(--blue); color: #fff; }

.hub-raffle-campaign-allocation {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  background: rgb(8 127 245 / 2.5%);
  padding: 13px;
}

.hub-raffle-campaign-equation {
  display: grid;
  grid-template-columns: repeat(4, minmax(100px, 150px));
  align-items: end;
  gap: 8px;
}

.hub-raffle-campaign-equation b { display: none; }

.hub-raffle-campaign-allocation > p {
  margin: 0;
  color: var(--soft);
  font-size: 12px;
  line-height: 1.5;
}

.hub-raffle-campaign-children {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.hub-raffle-campaign-children > section {
  display: grid;
  gap: 9px;
  border: 1px solid var(--line-strong);
  background: var(--panel);
  padding: 11px 12px;
}

.hub-raffle-campaign-children header { display: flex; align-items: center; gap: 8px; }
.hub-raffle-campaign-children header strong { color: var(--ink); font-size: 13px; }
.hub-raffle-campaign-children header em { border: 1px solid rgb(8 127 245 / 35%); color: var(--blue); padding: 3px 6px; font-size: 12px; font-style: normal; }
.hub-raffle-campaign-children dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; }
.hub-raffle-campaign-children dl > div { display: grid; gap: 4px; }
.hub-raffle-campaign-children dt { color: var(--soft); font-size: 12px; }
.hub-raffle-campaign-children dd { margin: 0; color: var(--ink); font-size: 14px; font-weight: 800; }
.hub-raffle-campaign-children dd input { min-height: 34px; padding: 5px 8px; }
.hub-raffle-campaign-children small { color: var(--soft); font-size: 12px; }
.hub-raffle-campaign-copy-hint { display: flex; align-items: center; gap: 7px; }
.hub-raffle-campaign-copy-hint svg { width: 14px; color: var(--blue); }
.hub-raffle-campaign-allocation .hub-raffle-campaign-error { color: var(--red); font-weight: 750; }
.hub-raffle-campaign-allocation ul.hub-raffle-campaign-error {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 17px;
  font-weight: 600;
  line-height: 1.5;
}

.hub-raffle-editor-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.hub-raffle-editor-options.is-paired { grid-template-columns: 1fr; }

.hub-raffle-editor-options > label {
  position: relative;
  min-width: 0;
  min-height: 76px;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 24px;
  align-content: center;
  align-items: center;
  gap: 11px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--panel);
  padding: 11px 13px;
  cursor: pointer;
  transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease;
}

.hub-raffle-editor-options > label:hover {
  border-color: rgb(8 127 245 / 55%);
}

.hub-raffle-editor-options > label.selected {
  border-color: var(--blue);
  background: rgb(8 127 245 / 8%);
  box-shadow: 0 0 0 1px rgb(8 127 245 / 14%);
}

.hub-raffle-editor-options > label:has(input:disabled) {
  opacity: 0.55;
  cursor: default;
}

.hub-raffle-editor-options input {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 0;
  overflow: hidden;
  border: 0;
  margin: 0;
  padding: 0;
  opacity: 0;
  pointer-events: none;
}

.hub-raffle-editor-options > label > svg {
  width: 18px;
  height: 18px;
  color: var(--blue);
}

.hub-raffle-editor-options > label > span {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.hub-raffle-editor-options strong {
  color: var(--ink);
  font-size: 13px;
  font-weight: 650;
}

.hub-raffle-editor-options small {
  color: var(--soft);
  font-size: 12px;
  line-height: 1.45;
}

.hub-raffle-editor-option-state {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  color: transparent;
  font-style: normal;
}

.hub-raffle-editor-option-state svg {
  width: 14px;
  height: 14px;
}

.hub-raffle-editor-options > label.selected .hub-raffle-editor-option-state {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
}

@media (max-width: 760px) {
  .hub-raffle-group-row {
    grid-template-columns: 24px minmax(0, 1fr) 34px;
  }

  .hub-raffle-group-row select,
  .hub-raffle-group-row .hub-raffle-group-count {
    grid-column: 2;
  }

  .hub-raffle-groups-footer,
  .hub-raffle-editor-options {
    grid-template-columns: 1fr;
  }

  .hub-raffle-groups-footer .hub-raffle-requirement-add {
    width: 100%;
    justify-content: center;
  }

  .hub-raffle-create-mode > div,
  .hub-raffle-create-mode button { width: 100%; }
  .hub-raffle-create-mode button { min-width: 0; }
  .hub-raffle-campaign-equation,
  .hub-raffle-campaign-children { grid-template-columns: 1fr; }
}

/* The details card indents each prize block under the winner total. */
.raffle-public-facts .raffle-public-fact-group dt {
  padding-left: 14px;
  opacity: 0.85;
}

/* The GA4-backed stats tab: metric cards, a hand-rolled trend chart, source
   tables, and a day-by-hour heatmap — all on the design tokens. */
/* Named parent for specificity: the digest container's generic `> div`
   two-column rule would otherwise split this stack. */
.hub-stats-panel > .hub-stats-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  padding: 18px;
}

.hub-stats-note {
  margin: 0;
  color: var(--soft);
  font-size: 13px;
  line-height: 1.6;
}

.hub-stats-setup {
  margin: 0;
  padding-left: 20px;
  display: grid;
  gap: 8px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.6;
}

.hub-stats-retry {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: transparent;
  color: var(--soft);
  font-size: 13px;
  font-weight: 650;
  padding: 0 14px;
  cursor: pointer;
}

.hub-stats-retry svg {
  width: 14px;
  height: 14px;
}

.hub-stats-updated {
  color: var(--soft);
  font-size: 12px;
  white-space: nowrap;
}

.hub-stats-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.hub-stats-card {
  display: grid;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--subtle);
  padding: 14px 16px;
}

.hub-stats-card span {
  color: var(--soft);
  font-size: 12px;
  font-weight: 700;
}

.hub-stats-card strong {
  color: var(--ink);
  font-size: 24px;
  font-variant-numeric: tabular-nums;
}

.hub-stats-card[data-live] strong {
  background: var(--brand-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hub-stats-chart {
  margin: 0;
  display: grid;
  gap: 8px;
}

.hub-stats-chart figcaption {
  color: var(--soft);
  font-size: 13px;
  font-weight: 700;
}

.hub-stats-chart svg {
  width: 100%;
  height: 160px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--subtle);
}

.hub-stats-chart-area {
  fill: rgb(8 127 245 / 14%);
  stroke: none;
}

.hub-stats-chart-line {
  fill: none;
  stroke: var(--blue);
  stroke-width: 2;
  stroke-linejoin: round;
  stroke-linecap: round;
}

.hub-stats-chart-range {
  display: flex;
  justify-content: space-between;
  color: var(--soft);
  font-size: 12px;
}

.hub-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
}

.hub-stats-panel h4 {
  margin: 0 0 10px;
  color: var(--ink);
  font-size: 14px;
}

.hub-stats-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.hub-stats-table th {
  text-align: left;
  color: var(--soft);
  font-size: 12px;
  font-weight: 700;
  border-bottom: 1px solid var(--line);
  padding: 6px 10px;
}

.hub-stats-table th:not(:first-child),
.hub-stats-table td:not(:first-child) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.hub-stats-table td {
  color: var(--ink);
  border-bottom: 1px solid var(--line);
  padding: 7px 10px;
  overflow-wrap: anywhere;
}

.hub-stats-heatmap {
  display: grid;
  gap: 4px;
}

.hub-stats-heatmap-row {
  display: grid;
  grid-template-columns: 26px repeat(24, minmax(0, 1fr));
  gap: 3px;
  align-items: center;
}

.hub-stats-heatmap-row span {
  color: var(--soft);
  font-size: 12px;
}

.hub-stats-heatmap-row i {
  display: block;
  aspect-ratio: 1 / 1;
  border-radius: 3px;
  background: var(--blue);
}

@media (max-width: 640px) {
  .hub-stats-heatmap-row i {
    border-radius: 2px;
  }
}

/* Curated channel poster panel in the admin announcements tab: a compact
   checkable list of every early project, newest first. */
.hub-selection-poster-count {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 14px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.hub-selection-poster-count svg {
  width: 14px;
  height: 14px;
}

.hub-selection-poster-count[data-active] {
  color: var(--blue);
  border-color: rgb(8 127 245 / 45%);
  background: rgb(8 127 245 / 12%);
}

/* The digest container's generic `> div` rule is two-column and higher
   specificity, so this stack names its parent to win: hint, toolbar,
   list, footer in one column. */
.hub-selection-poster > .hub-selection-poster-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  padding: 18px;
}

.hub-selection-poster-hint {
  margin: 0;
  color: var(--soft);
  font-size: 13px;
  line-height: 1.6;
  max-width: 640px;
}

.hub-selection-poster-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
}

.hub-selection-poster-search {
  flex: 1;
  max-width: 420px;
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--subtle);
  padding: 0 13px;
  color: var(--soft);
}

.hub-selection-poster-search svg {
  width: 15px;
  height: 15px;
  flex: none;
}

.hub-selection-poster-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-size: 13px;
  outline: none;
}

.hub-selection-poster-search input::placeholder {
  color: var(--soft);
}

.hub-selection-poster-search:focus-within {
  border-color: rgb(8 127 245 / 55%);
}

.hub-selection-poster-toolbar > button {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: transparent;
  color: var(--soft);
  font-size: 13px;
  font-weight: 650;
  padding: 0 14px;
  cursor: pointer;
  white-space: nowrap;
}

.hub-selection-poster-toolbar > button:disabled {
  opacity: 0.4;
  cursor: default;
}

.hub-selection-poster-list {
  margin: 0;
  padding: 0;
  list-style: none;
  max-height: 430px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
}

.hub-selection-poster-list li + li {
  border-top: 1px solid var(--line);
}

.hub-selection-poster-list label {
  display: grid;
  grid-template-columns: 16px 30px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  padding: 9px 14px;
  cursor: pointer;
}

.hub-selection-poster-list label:hover {
  background: rgb(8 127 245 / 6%);
}

.hub-selection-poster-list label[data-checked] {
  background: rgb(8 127 245 / 11%);
}

.hub-selection-poster-list input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--blue);
  cursor: pointer;
}

.hub-selection-poster-avatar {
  position: relative;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--subtle);
  border: 1px solid var(--line);
  color: var(--soft);
  font-size: 12px;
  font-weight: 700;
}

.hub-selection-poster-avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hub-selection-poster-name {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.hub-selection-poster-name strong {
  color: var(--ink);
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-selection-poster-name small {
  color: var(--soft);
  font-size: 12px;
  font-family: var(--mono);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-selection-poster-list b {
  font-size: 12px;
  font-weight: 700;
  color: var(--soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 2px 9px;
}

.hub-selection-poster-list time {
  color: var(--soft);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.hub-selection-poster-empty {
  margin: 0;
  padding: 16px;
  color: var(--soft);
  font-size: 13px;
}

.hub-selection-poster-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.hub-selection-poster-notice {
  margin-right: auto;
  color: var(--green);
  font-size: 13px;
  font-style: normal;
}

.hub-selection-poster-preview {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  border: 0;
  border-radius: 10px;
  background: var(--brand-gradient);
  color: #fff;
  font-size: 13px;
  font-weight: 750;
  padding: 0 18px;
  cursor: pointer;
}

.hub-selection-poster-preview:disabled {
  opacity: 0.45;
  cursor: default;
}

.hub-selection-poster-preview svg {
  width: 15px;
  height: 15px;
}

@media (max-width: 640px) {
  .hub-selection-poster-toolbar {
    flex-wrap: wrap;
  }

  .hub-selection-poster-list label {
    grid-template-columns: 16px 30px minmax(0, 1fr) auto;
  }

  .hub-selection-poster-list time {
    display: none;
  }
}

.hub-poster-modal {
  width: min(560px, calc(100vw - 32px));
}

.hub-poster-modal-body {
  display: grid;
  gap: 10px;
}

.hub-poster-modal-body img {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: var(--subtle);
  object-fit: contain;
}

.hub-poster-modal-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: var(--soft);
  font-size: 13px;
}

.hub-poster-modal-pager button {
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  font-size: 16px;
  cursor: pointer;
}

.hub-poster-modal-pager button:disabled {
  opacity: 0.4;
  cursor: default;
}

.hub-poster-modal-note {
  margin: 0;
  color: var(--soft);
  font-size: 12px;
}

.hub-poster-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.hub-poster-modal-footer .hub-poster-modal-send {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--brand-gradient);
  border: 0;
  border-radius: 8px;
  color: #fff;
  font-weight: 700;
  padding: 0 16px;
  min-height: 38px;
  cursor: pointer;
}

.hub-poster-modal-footer .hub-poster-modal-send svg {
  width: 15px;
  height: 15px;
}

@media (max-width: 760px) {
  /* One column per line: the fixed four-column grid leaves the text inputs
     a few dozen pixels on a phone. */
  .hub-raffle-requirement-row {
    grid-template-columns: minmax(0, 1fr) 34px;
  }

  .hub-raffle-requirement-row select {
    grid-column: 1;
    grid-row: 1;
  }

  .hub-raffle-requirement-row button {
    grid-column: 2;
    grid-row: 1;
  }

  .hub-raffle-requirement-row input {
    grid-column: 1 / -1;
  }
}

.hub-raffle-requirement-row select,
.hub-raffle-requirement-row input {
  min-height: 38px;
}

.hub-raffle-requirement-row button {
  min-height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--soft);
}

.hub-raffle-requirement-row button svg { width: 14px; }

.hub-raffle-requirement-add {
  width: max-content;
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 7px;
  border: 1px dashed var(--line-strong);
  border-radius: 4px;
  background: transparent;
  padding: 0 12px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-requirement-add svg { width: 14px; }

.hub-raffle-result-entries li button {
  min-height: 28px;
  margin-left: auto;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  padding: 0 10px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 750;
}

.hub-raffle-result-entries li { display: flex; align-items: center; gap: 8px; }
.hub-raffle-rerolled { color: var(--soft); font-size: 12px; font-style: normal; }

.hub-raffle-xreview {
  display: grid;
  gap: 7px;
  margin-top: 10px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.hub-raffle-xreview > strong {
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-xreview > p {
  margin: 0;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-xreview-run {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}

.hub-raffle-xreview-run button {
  min-height: 28px;
  border: 1px solid var(--blue);
  border-radius: 4px;
  background: transparent;
  padding: 0 12px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 750;
}

.hub-raffle-xreview-run button:disabled {
  border-color: var(--line-strong);
  color: var(--soft);
}

.hub-raffle-xreview-run em {
  color: var(--soft);
  font-size: 12px;
  font-style: normal;
}

.hub-raffle-xreview ol {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-raffle-xreview li {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
}

.hub-raffle-xreview-seat {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.hub-raffle-xreview-seat > em {
  font-size: 12px;
  font-style: normal;
  font-weight: 750;
  color: var(--soft);
  white-space: nowrap;
}

.hub-raffle-xreview-seat > em[data-role="winner"] { color: var(--green); }

.hub-raffle-xreview-identity {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  min-width: 0;
}

.hub-raffle-xreview-identity a {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  color: var(--blue);
  font-weight: 750;
  text-decoration: none;
}

.hub-raffle-xreview-identity a svg { width: 12px; height: 12px; }

.hub-raffle-xreview-identity em {
  font-size: 12px;
  font-style: normal;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  padding: 1px 7px;
  color: var(--soft);
}

.hub-raffle-xreview-identity em[data-source="linked"] { color: var(--green); border-color: currentColor; }

.hub-raffle-xreview-identity small { color: var(--soft); }

.hub-raffle-xreview-verdicts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin-left: auto;
}

.hub-raffle-xreview-requirement {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
}

.hub-raffle-xreview-requirement > a {
  margin-right: 4px;
  color: var(--blue);
  font-weight: 750;
  text-decoration: none;
}

.hub-raffle-xreview-requirement button {
  min-height: 26px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  padding: 0 8px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 750;
}

.hub-raffle-xreview-requirement button.active[data-verdict="followed"] { color: var(--green); border-color: currentColor; }
.hub-raffle-xreview-requirement button.active[data-verdict="not_followed"] { color: var(--red); border-color: currentColor; }
.hub-raffle-xreview-requirement button.active[data-verdict="unchecked"] { color: var(--ink); border-color: var(--line-strong); }

.hub-raffle-xreview-reroll {
  min-height: 28px;
  border: 1px solid var(--red);
  border-radius: 4px;
  background: transparent;
  padding: 0 10px;
  color: var(--red);
  font-size: 12px;
  font-weight: 750;
}

@media (max-width: 720px) {
  .hub-raffle-xreview-verdicts { margin-left: 0; width: 100%; }
}

.raffle-public-amendments {
  margin: 14px 0 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--subtle);
  padding: 12px 14px;
}

.raffle-public-amendments strong { color: var(--ink); font-size: 13px; }
.raffle-public-amendments ul { margin: 8px 0 0; padding-left: 16px; color: var(--soft); font-size: 12px; line-height: 1.7; }

.hub-raffle-participants { display: grid; gap: 10px; }

.hub-raffle-participants-meta {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0;
}

.hub-raffle-participants-meta strong { color: var(--ink); font-size: 13px; }
.hub-raffle-participants-meta span { color: var(--soft); font-size: 12px; }
.hub-raffle-participants-loading { margin: 0; color: var(--soft); font-size: 12px; }

.hub-raffle-participant-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}

.hub-raffle-participant-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--subtle);
  padding: 8px 12px;
}

.hub-raffle-participant-identity {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

.hub-raffle-participant-identity img,
.hub-raffle-participant-identity i {
  width: 28px;
  height: 28px;
  flex: none;
  border-radius: 50%;
  object-fit: cover;
}

.hub-raffle-participant-identity i {
  display: grid;
  place-items: center;
  background: rgb(8 127 245 / 16%);
  color: var(--blue);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.hub-raffle-participant-identity > span { min-width: 0; display: grid; }
.hub-raffle-participant-identity strong { color: var(--ink); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hub-raffle-participant-identity small { color: var(--soft); font-size: 12px; }

.hub-raffle-participant-facts {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--soft);
  font-size: 12px;
  white-space: nowrap;
}

.hub-raffle-participant-facts code { font-size: 12px; }
.hub-raffle-participant-facts em { font-style: normal; font-weight: 750; }
.hub-raffle-participant-facts em[data-role="winner"] { color: var(--green); }
.hub-raffle-participant-facts em[data-role="backup"] { color: var(--blue); }
.hub-raffle-participant-facts em[data-role="forfeited"] { color: var(--soft); text-decoration: line-through; }


.hub-raffle-export-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
}

.hub-raffle-partner-wrap {
  position: relative;
  display: inline-flex;
}

.hub-raffle-export-row .hub-raffle-partner-wrap > button.active {
  border-color: var(--blue);
  color: var(--blue);
}

.hub-raffle-partner-popover {
  position: fixed;
  z-index: 100;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(760px, calc(100vw - 80px));
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  display: grid;
  gap: 14px;
  border: 1px solid var(--line-strong);
  background: var(--panel);
  box-shadow: 0 24px 70px rgb(0 0 0 / 24%);
  padding: 15px;
}

.hub-raffle-partner-popover > header,
.hub-raffle-partner-popover > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.hub-raffle-partner-popover > header strong { color: var(--ink); font-size: 15px; }
.hub-raffle-partner-popover > header button { width: 34px; min-height: 34px; justify-content: center; padding: 0; }
.hub-raffle-partner-popover fieldset { min-width: 0; display: grid; gap: 8px; margin: 0; border: 0; padding: 0; }
.hub-raffle-partner-popover legend { display: flex; align-items: center; gap: 7px; color: var(--ink); font-size: 12px; font-weight: 750; }
.hub-raffle-partner-popover legend b { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: rgb(8 127 245 / 12%); color: var(--blue); font-size: 12px; }
.hub-raffle-partner-options { display: flex; flex-wrap: wrap; gap: 12px; }
.hub-raffle-partner-combined { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--ink); font-size: 12px; line-height: 1.5; }
.hub-raffle-partner-combined svg { width: 15px; height: 15px; color: var(--green); }
.hub-raffle-partner-options label { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; cursor: pointer; }
.hub-raffle-partner-options label.selected { color: var(--ink); font-weight: 750; }
.hub-raffle-partner-options input { accent-color: var(--blue); }
.hub-raffle-partner-presets { display: flex; flex-wrap: wrap; gap: 7px; }
.hub-raffle-partner-presets button.active { border-color: var(--blue); background: rgb(8 127 245 / 9%); color: var(--blue); }

.hub-raffle-partner-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.hub-raffle-partner-preview > section { min-width: 0; display: grid; gap: 6px; border: 1px solid var(--line); padding: 9px; }
.hub-raffle-partner-preview > section > strong { color: var(--blue); font-size: 12px; }
.hub-raffle-partner-preview [role="table"] { overflow-x: auto; border: 1px solid var(--line); }
.hub-raffle-partner-preview [role="row"] { min-width: 360px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(110px, 1fr); }
.hub-raffle-partner-preview [role="row"] + [role="row"] { border-top: 1px solid var(--line); }
.hub-raffle-partner-preview [role="row"] span { min-width: 0; overflow-wrap: anywhere; border-right: 1px solid var(--line); padding: 6px; color: var(--muted); font-size: 12px; white-space: normal; }
.hub-raffle-partner-preview [role="row"] span:last-child { border-right: 0; }
.hub-raffle-partner-preview [role="columnheader"] { color: var(--ink); font-weight: 750; }
.hub-raffle-partner-popover fieldset > small,
.hub-raffle-partner-loading { margin: 0; color: var(--soft); font-size: 12px; }
.hub-raffle-partner-popover > footer { justify-content: flex-end; border-top: 1px solid var(--line); padding-top: 12px; }
.hub-raffle-partner-popover > footer a,
.hub-raffle-partner-popover > footer button { min-height: 38px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line-strong); background: var(--panel); color: var(--ink); padding: 0 12px; font-size: 12px; font-weight: 750; text-decoration: none; }
.hub-raffle-partner-popover > footer button.primary { border-color: var(--blue); background: var(--blue); color: #fff; }

.hub-raffle-campaign-protected {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  color: var(--green);
  font-size: 12px;
  font-style: normal;
}

.hub-raffle-campaign-protected svg,
.hub-raffle-campaign-audit svg { width: 14px; height: 14px; }
.hub-raffle-result .hub-raffle-campaign-audit { justify-content: flex-start; color: var(--soft); font-size: 12px; }

/* Draw-mode switch in the raffle editor: reuses the creation-mode segment;
   the hint and lock note sit beneath it as quiet copy. */
.hub-raffle-draw-mode > em,
.hub-raffle-draw-mode > small { display: block; margin: 8px 0 0; color: var(--soft); font-size: 12px; font-style: normal; line-height: 1.5; }

/* Post-draw seat expansion: one deliberate control row on a finished
   campaign raffle. */
.hub-raffle-seat-expansion { display: grid; gap: 10px; margin-top: 12px; border: 1px solid var(--line); background: var(--panel-strong); padding: 12px 14px; }
.hub-raffle-seat-expansion > p { display: grid; gap: 2px; margin: 0; }
.hub-raffle-seat-expansion > p strong { color: var(--ink); font-size: 13px; }
.hub-raffle-seat-expansion > p span { color: var(--soft); font-size: 12px; }
.hub-raffle-seat-expansion > div { display: flex; align-items: end; flex-wrap: wrap; gap: 8px; }
.hub-raffle-seat-expansion label { display: grid; gap: 4px; }
.hub-raffle-seat-expansion label span { color: var(--muted); font-size: 12px; }
.hub-raffle-seat-expansion input,
.hub-raffle-seat-expansion select { width: 104px; min-height: 38px; border: 1px solid var(--line-strong); border-radius: var(--radius-control); background: var(--field-bg); color: var(--ink); padding: 0 10px; font-size: 13px; }
.hub-raffle-seat-expansion input:focus-visible,
.hub-raffle-seat-expansion select:focus-visible { outline: 0; border-color: var(--blue); box-shadow: 0 0 0 3px var(--focus-ring); }
.hub-raffle-seat-expansion button { min-height: 38px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--accent-primary-line); border-radius: var(--radius-control); background: var(--accent-primary); color: #fff; padding: 0 14px; font-size: 12px; font-weight: 700; }
.hub-raffle-seat-expansion button:disabled { cursor: not-allowed; border-color: var(--disabled-line); background: var(--disabled-bg); color: var(--disabled-fg); }

.hub-raffle-carryover {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 1px solid rgb(72 215 160 / 34%);
  background: rgb(72 215 160 / 6%);
  padding: 10px 12px;
}
.hub-raffle-carryover > svg { width: 16px; height: 16px; color: var(--green); }
.hub-raffle-carryover > span { min-width: 0; display: grid; gap: 3px; }
.hub-raffle-carryover strong { color: var(--ink); font-size: 12px; }
.hub-raffle-carryover small { color: var(--soft); font-size: 12px; }
.hub-raffle-carryover em { color: var(--green); font-size: 12px; font-style: normal; font-weight: 800; white-space: nowrap; }
.hub-raffle-carryover[data-unfilled] { border-color: rgb(255 177 41 / 42%); background: rgb(255 177 41 / 6%); }
.hub-raffle-carryover[data-unfilled] > svg,
.hub-raffle-carryover[data-unfilled] em { color: #ffd064; }

.hub-raffle-campaign-statuses { display: flex !important; flex-wrap: wrap; gap: 5px; }
.hub-raffle-campaign-statuses em { white-space: nowrap; }
.hub-raffle-campaign-allocation-cell b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.hub-raffle-campaign-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
}

.hub-raffle-campaign-tabs button { min-height: 40px; }
.hub-raffle-campaign-tabs button.active { border-color: var(--blue); background: rgb(36 161 255 / 12%); color: var(--blue); }

.hub-raffle-campaign-project,
.hub-raffle-campaign-partner,
.hub-raffle-campaign-audit-panel {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.hub-raffle-campaign-project > header,
.hub-raffle-campaign-partner > header,
.hub-raffle-campaign-audit-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.hub-raffle-campaign-project header span,
.hub-raffle-campaign-partner header span,
.hub-raffle-campaign-audit-panel header span { color: var(--blue); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hub-raffle-campaign-project h5,
.hub-raffle-campaign-partner h5,
.hub-raffle-campaign-audit-panel h5 { margin: 3px 0 0; color: var(--ink); font-size: 17px; }
.hub-raffle-campaign-project > dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
.hub-raffle-campaign-project > dl > div { display: grid; gap: 4px; padding: 10px; border: 1px solid var(--line); background: var(--panel); }
.hub-raffle-campaign-project dt { color: var(--soft); font-size: 12px; }
.hub-raffle-campaign-project dd { min-width: 0; margin: 0; color: var(--ink); overflow-wrap: anywhere; }
.hub-raffle-campaign-project dd a { display: inline-flex; align-items: center; gap: 5px; color: var(--blue); }
.hub-raffle-campaign-project dd svg { width: 13px; }
.hub-raffle-campaign-missing { display: flex; align-items: center; gap: 7px; margin: 0; color: #ffd064; }
.hub-raffle-campaign-missing svg { width: 15px; }
.hub-raffle-campaign-child-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.hub-raffle-campaign-child-cards article { display: grid; gap: 8px; padding: 12px; border: 1px solid var(--line); background: var(--panel); }
.hub-raffle-campaign-child-cards article header { display: flex; justify-content: space-between; gap: 8px; }
.hub-raffle-campaign-child-cards article code { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; }
.hub-raffle-campaign-draw-state { color: #ffd064 !important; font-size: 12px !important; }

.hub-raffle-campaign-partner > header > em,
.hub-raffle-campaign-audit-panel > header > em { padding: 5px 8px; border: 1px solid rgb(255 177 41 / 45%); color: #ffd064; font-size: 12px; font-style: normal; }
.hub-raffle-campaign-partner > header > em[data-verified="true"],
.hub-raffle-campaign-audit-panel > header > em[data-verified="true"] { border-color: rgb(72 215 160 / 42%); color: #48d7a0; }
.hub-raffle-campaign-partner > footer { display: flex; justify-content: flex-end; gap: 8px; }

.hub-raffle-campaign-team-preview ol,
.hub-raffle-campaign-audit-panel ol { display: grid; gap: 6px; margin: 4px 0 0; padding: 0; list-style: none; }
.hub-raffle-campaign-team-preview li,
.hub-raffle-campaign-audit-panel li { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 7px; border: 1px solid var(--line); background: var(--panel-strong); }
.hub-raffle-campaign-team-preview li > b,
.hub-raffle-campaign-audit-panel li > b { color: var(--blue); }
.hub-raffle-campaign-team-preview li > span,
.hub-raffle-campaign-audit-panel li > span { min-width: 0; display: grid; }
.hub-raffle-campaign-team-preview li small,
.hub-raffle-campaign-audit-panel li small { color: var(--muted); font-size: 12px; }
.hub-raffle-campaign-team-preview li > em,
.hub-raffle-campaign-audit-panel li > em { color: #ffd064; font-size: 12px; font-style: normal; font-weight: 800; }
.hub-raffle-campaign-team-preview li > code,
.hub-raffle-campaign-audit-panel li > code { grid-column: 2 / -1; overflow: hidden; color: var(--soft); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.hub-raffle-campaign-audit-panel li[data-missing] { border-color: rgb(255 77 98 / 45%); }
.hub-raffle-campaign-audit-panel > p { margin: 0; color: var(--soft); }
.hub-raffle-campaign-audit-panel > footer { display: flex; align-items: center; gap: 7px; color: #48d7a0; }
.hub-raffle-campaign-audit-panel > footer svg { width: 15px; }

@media (max-width: 760px) {
  .hub-raffle-campaign-project > header,
  .hub-raffle-campaign-partner > header,
  .hub-raffle-campaign-audit-panel > header { align-items: stretch; flex-direction: column; }
  .hub-raffle-campaign-project > dl,
  .hub-raffle-campaign-child-cards { grid-template-columns: 1fr; }
  .hub-raffle-carryover { grid-template-columns: 18px minmax(0, 1fr); }
  .hub-raffle-carryover > em { grid-column: 2; white-space: normal; }
}
.hub-raffle-sibling-switch { min-height: 30px; border: 1px solid rgb(8 127 245 / 35%); background: transparent; color: var(--blue); padding: 0 9px; font-size: 12px; }

@media (max-width: 760px) {
  .hub-raffle-partner-popover {
    inset: 70px 12px auto;
    transform: none;
    width: auto;
    max-height: calc(100vh - 84px);
    overflow-y: auto;
  }
  .hub-raffle-partner-preview { grid-template-columns: 1fr; }
}

.hub-raffle-og-panel {
  border: 1px solid var(--line);
  border-radius: 6px;
  margin: 0 0 14px;
  padding: 10px 12px;
}

.hub-raffle-og-panel summary {
  cursor: pointer;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.hub-raffle-og-panel p {
  margin: 8px 0;
  color: var(--soft);
  font-size: 12px;
  line-height: 1.5;
}

.hub-raffle-og-panel textarea {
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  background: transparent;
  color: var(--ink);
  padding: 8px 10px;
  font-size: 12px;
  font-family: inherit;
  resize: vertical;
}

.hub-raffle-og-panel button {
  margin-top: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--ink);
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 700;
}

.hub-raffle-og-panel button:hover {
  border-color: var(--blue);
  color: var(--blue);
}

.hub-raffle-dm-status {
  display: grid;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  margin: 0 0 12px;
  padding: 10px 12px;
}

.hub-raffle-dm-status > p {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  color: var(--soft);
  font-size: 12px;
  line-height: 1.5;
}

.hub-raffle-dm-status strong {
  color: var(--ink);
  font-size: 12px;
}

.hub-raffle-dm-status button {
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--ink);
  padding: 3px 8px;
  font-size: 12px;
  font-weight: 700;
}

.hub-raffle-dm-status button:hover {
  border-color: var(--blue);
  color: var(--blue);
}

.hub-raffle-export-row a,
.hub-raffle-export-row button {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--panel);
  padding: 0 12px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}

.hub-raffle-switch { position: relative; display: inline-flex; width: 34px; height: 20px; }

/* The editor styles every input as a 42px-tall text field, which leaked into
   the switch and, once disabled, painted a native checkbox over the track.
   Both states are neutralised explicitly. */
.hub-raffle-policy-grid .hub-raffle-switch input,
.hub-raffle-policy-grid .hub-raffle-switch input:disabled {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  border: 0;
  background: transparent;
  padding: 0;
  opacity: 0;
  appearance: none;
  cursor: pointer;
}

.hub-raffle-policy-grid .hub-raffle-switch input:disabled { cursor: default; }

.hub-raffle-switch i {
  width: 34px;
  height: 20px;
  position: relative;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--subtle);
  pointer-events: none;
  transition: background 0.15s, border-color 0.15s;
}

.hub-raffle-switch i::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--soft);
  transition: transform 0.15s, background 0.15s;
}

.hub-raffle-switch input:checked + i { border-color: var(--blue); background: rgb(8 127 245 / 28%); }
.hub-raffle-switch input:checked + i::after { transform: translateX(14px); background: var(--blue); }
.hub-raffle-switch input:disabled + i { opacity: 0.45; }
.hub-raffle-policy-grid span { min-width: 0; display: grid; gap: 3px; }
.hub-raffle-policy-grid strong { color: var(--ink); font-size: 12px; }
.hub-raffle-policy-grid small { color: var(--soft); font-size: 12px; }

.hub-raffle-editor-warning {
  margin: 12px 0 0;
  border: 1px solid rgb(255 173 61 / 40%);
  background: rgb(255 173 61 / 8%);
  color: #ffc66f;
  padding: 10px 12px;
  font-size: 12px;
}

.hub-raffle-editor > footer {
  justify-content: flex-end;
  margin-top: 16px;
}

.hub-raffle-detail {
  margin: 14px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 4px;
}

/* Raffles carry different amounts of copy, so the explicit body owns the
   stable height and internal scroll. Navigation always keeps natural height,
   including the nested campaign + child raffle tab rows. */
.hub-raffle-detail-body {
  height: 420px;
  overflow-y: auto;
  box-sizing: border-box;
}

.hub-raffle-detail > header {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  padding: 0 14px;
}

.hub-raffle-detail > header > div { display: flex; align-items: center; gap: 9px; }
.hub-raffle-detail > header span { color: var(--soft); font-size: 12px; }
.hub-raffle-detail > header h4 { margin: 0; color: var(--ink); font-size: 14px; }
.hub-raffle-detail > header > button { min-height: 36px; }

.hub-raffle-detail > nav {
  min-height: 46px;
  display: flex;
  gap: 26px;
  border-bottom: 1px solid var(--line);
  padding: 0 14px;
}

.hub-raffle-detail > nav button {
  min-height: 46px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0 2px;
}

.hub-raffle-detail > nav button.active { border-bottom-color: var(--blue); color: var(--ink); }

.hub-raffle-settings-detail {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.8fr);
}

.hub-raffle-settings-detail > dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.hub-raffle-settings-detail > dl > div {
  min-height: 64px;
  display: grid;
  grid-template-columns: minmax(130px, 0.65fr) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  padding: 0 14px;
}

.hub-raffle-settings-detail > dl > div:nth-child(odd) { border-right: 1px solid var(--line); }
.hub-raffle-settings-detail dt { color: var(--soft); font-size: 12px; }
.hub-raffle-settings-detail dd { margin: 0; overflow-wrap: anywhere; color: var(--ink); font-size: 12px; }

.hub-raffle-link-management {
  display: grid;
  align-content: start;
  gap: 10px;
  border-left: 1px solid var(--line);
  padding: 14px;
}

.hub-raffle-link-management > span { color: var(--soft); font-size: 12px; }
.hub-raffle-link-management code,
.hub-raffle-link-management p { margin: 0; overflow-wrap: anywhere; color: var(--muted); font-size: 12px; line-height: 1.5; }
.hub-raffle-link-management > div { display: flex; gap: 8px; }
.hub-raffle-settings-detail > footer { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 8px; border-top: 1px solid var(--line); padding: 12px 14px; }
/* Delete sits apart from the routine actions, on the far left in red. */
.hub-raffle-settings-detail > footer .hub-raffle-delete {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  order: -1;
  margin-right: auto;
  border-color: color-mix(in srgb, var(--red) 58%, var(--line));
  color: var(--red);
}
.hub-raffle-settings-detail > footer .hub-raffle-delete svg { width: 14px; height: 14px; }

.hub-raffle-detail-empty { min-height: 140px; display: grid; place-content: center; gap: 8px; padding: 20px; text-align: center; }
.hub-raffle-detail-empty strong { color: var(--ink); font-size: 14px; }
.hub-raffle-detail-empty p { max-width: 520px; margin: 0; color: var(--soft); font-size: 12px; }

.hub-raffle-detail-body > .hub-raffle-result { border: 0; }

.hub-raffle-audit {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-raffle-audit li {
  min-height: 52px;
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  border-top: 1px solid var(--line);
  padding: 0 14px;
}

.hub-raffle-audit li:first-child { border-top: 0; }
.hub-raffle-audit span { color: var(--soft); font-family: var(--mono); font-size: 12px; }
.hub-raffle-audit strong { color: var(--ink); font-size: 12px; }

html[data-theme="light"] .hub-raffle-console,
html[data-theme="light"] .hub-raffle-editor {
  background: #fff;
}

html[data-theme="light"] .hub-raffle-editor input,
html[data-theme="light"] .hub-raffle-editor select,
html[data-theme="light"] .hub-raffle-editor textarea {
  background: #f8fafc;
  color-scheme: light;
}
html[data-theme="light"] .hub-raffle-editor select { color-scheme: light; }


@media (max-width: 1080px) {
  .hub-admin-overview { grid-template-columns: 1fr; }
  .hub-raffle-editor-fields { grid-template-columns: repeat(3, minmax(120px, 1fr)); }
  .hub-raffle-editor-fields label.wide { grid-column: span 3; }
  .hub-raffle-settings-detail { grid-template-columns: 1fr; }
  .hub-raffle-link-management { border-top: 1px solid var(--line); border-left: 0; }
}

@media (max-width: 760px) {
  .hub-admin-console-bar { min-height: 82px; align-items: flex-start; flex-wrap: wrap; gap: 5px 16px; padding: 14px 0; }
  .hub-admin-console-bar > div { width: 100%; }
  .hub-admin-console-time,
  .hub-admin-console-health { font-size: 12px; }
  .hub-admin-nav { width: 100%; box-sizing: border-box; gap: 24px; padding-right: 16px; }
  .hub-admin-overview { padding-top: 12px; }
  .hub-admin-work-head { display: none; }
  .hub-admin-work-row { grid-template-columns: 76px minmax(0, 1fr) 66px; gap: 8px; padding: 10px 12px; }
  .hub-admin-work-row > span:nth-child(3) { grid-column: 2 / -1; grid-row: 2; }
  .hub-admin-work-row button { grid-column: 3; grid-row: 1; }
  .hub-raffle-console-header { align-items: flex-start; flex-direction: column; }
  .hub-raffle-console-header > div:last-child { width: 100%; }
  .hub-raffle-console-header > div:last-child button { flex: 1; }
  .hub-raffle-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hub-raffle-summary > div:nth-child(3) { border-top: 1px solid var(--line); border-left: 0; }
  .hub-raffle-summary > div:nth-child(4) { border-top: 1px solid var(--line); }
  .hub-raffle-toolbar { align-items: stretch; flex-direction: column; }
  .hub-raffle-toolbar > div { overflow-x: auto; }
  .hub-raffle-toolbar > div button { flex: 1; min-width: max-content; }
  .hub-raffle-toolbar > label { width: 100%; box-sizing: border-box; }
  .hub-raffle-table { overflow-x: visible; }
  .hub-raffle-table-head { display: none; }
  .hub-raffle-table-row { min-width: 0; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 14px; padding: 12px 14px; }
  .hub-raffle-table-row > span:nth-child(1) { grid-column: 1; grid-row: 1; }
  .hub-raffle-table-row > span:nth-child(2) { grid-column: 2; grid-row: 1; }
  .hub-raffle-table-row > span:nth-child(n+3) { font-size: 12px; }
  .hub-raffle-table-row > span:nth-child(6) { display: none; }
  .hub-raffle-table-row > span:nth-child(3),
  .hub-raffle-table-row > span:nth-child(4),
  .hub-raffle-table-row > span:nth-child(5) { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .hub-raffle-table-row > span:nth-child(3)::before,
  .hub-raffle-table-row > span:nth-child(4)::before,
  .hub-raffle-table-row > span:nth-child(5)::before { content: attr(data-label); flex: none; color: var(--soft); }
  .hub-raffle-allocation-desktop { display: none; }
  .hub-raffle-allocation-mobile { display: block; }
  .hub-raffle-editor-fields { grid-template-columns: 1fr; }
  .hub-raffle-editor-fields label.wide { grid-column: auto; }
  .hub-raffle-editor select { min-height: 44px; font-size: 16px; }
  .hub-raffle-policy-grid { grid-template-columns: 1fr; }
  .hub-raffle-policy-grid > div:nth-child(even) { border-left: 0; }
  .hub-raffle-policy-grid > div:nth-child(n+2) { border-top: 1px solid var(--line); }
  .hub-raffle-detail { margin: 10px; }
  .hub-raffle-detail > header { min-height: 72px; align-items: flex-start; flex-direction: column; padding: 12px; }
  .hub-raffle-detail > header > div { flex-wrap: wrap; }
  .hub-raffle-detail > nav { gap: 20px; overflow-x: auto; }
  .hub-raffle-settings-detail > dl { grid-template-columns: 1fr; }
  .hub-raffle-settings-detail > dl > div:nth-child(odd) { border-right: 0; }
  .hub-raffle-settings-detail > footer,
  .hub-raffle-link-management > div,
  .hub-raffle-editor > footer { align-items: stretch; flex-direction: column; }
  .hub-raffle-settings-detail > footer button,
  .hub-raffle-link-management button,
  .hub-raffle-editor > footer button { width: 100%; }
  .hub-raffle-audit li { grid-template-columns: 1fr; gap: 4px; padding: 10px 12px; }
}

.hub-modal-layer {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  background: rgb(2 9 22 / 55%);
  padding: 20px;
}

.hub-modal {
  width: min(720px, 100%);
  max-height: calc(100vh - 40px);
  max-height: calc(100dvh - 40px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  overflow: auto;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow-overlay);
  animation: hub-modal-in var(--dur-base) var(--ease-out);
}

@keyframes hub-modal-in {
  from {
    opacity: 0;
    transform: scale(0.96);
  }
}

.hub-modal > header {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--line);
  padding: 16px 20px;
}

.hub-modal > header button {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--muted);
}

.hub-modal > header button:hover {
  color: #fff;
}

.hub-modal > header button svg {
  width: 18px;
}

.hub-instant > div:last-child {
  padding: 24px;
}

.hub-instant h2 {
  font-size: 23px;
}

.hub-instant-message {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.9;
  white-space: pre-wrap;
}

.hub-instant-message a {
  color: var(--blue);
  font-weight: 700;
  overflow-wrap: anywhere;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.hub-instant > div:last-child > a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--accent-primary-line);
  border-radius: 4px;
  background: var(--accent-primary);
  color: #fff;
  margin-top: 6px;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 800;
}

.hub-instant > div:last-child > a svg {
  width: 13px;
}

.hub-bookmark-modal {
  width: min(760px, 100%);
}

.hub-delete-modal {
  width: min(520px, 100%);
}

.hub-delete-modal > div {
  display: grid;
  gap: 18px;
  padding: 20px;
}

.hub-delete-modal > div > p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}

.hub-delete-modal footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.hub-delete-modal footer button {
  min-height: 40px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  padding: 0 14px;
  font-size: 13px;
  font-weight: 750;
}

.hub-delete-modal footer button.danger {
  border-color: color-mix(in srgb, var(--red) 58%, var(--line));
  color: var(--red);
}

.hub-delete-modal footer button:hover,
.hub-delete-modal footer button:focus-visible {
  color: var(--ink);
}

/* Admin decisions (send DMs, drop a team wallet, replace the OG list) go
   through this dialog instead of window.confirm so the title can name the
   target and the body can state the consequence. */
.hub-confirm-modal footer button.primary {
  border-color: var(--accent-primary-line);
  background: var(--accent-primary);
  color: #fff;
}

.hub-confirm-modal footer button.primary:hover,
.hub-confirm-modal footer button.primary:focus-visible {
  color: #fff;
  filter: brightness(1.08);
}

.hub-raffle-og-panel small {
  display: block;
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.hub-raffle-og-panel small[data-removed] {
  color: var(--red);
}

.hub-raffle-editor-submit-reason {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.hub-bookmark-modal form {
  display: grid;
  gap: 14px;
  padding: 20px;
}

.hub-bookmark-modal form > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.hub-x-import-note {
  margin: 0;
  padding: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.hub-bookmark-modal label,
.hub-bookmark-modal fieldset {
  display: grid;
  gap: 6px;
  border: 0;
  margin: 0;
  padding: 0;
}

.hub-bookmark-modal label > span,
.hub-bookmark-modal legend {
  color: var(--soft);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
}

.hub-bookmark-modal input,
.hub-bookmark-modal select,
.hub-bookmark-modal textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  outline: 0;
  background: var(--field-bg);
  color: var(--ink);
  padding: 9px 11px;
  font: inherit;
  font-size: 13px;
}

.hub-bookmark-modal textarea {
  resize: vertical;
}

.hub-bookmark-modal input:focus,
.hub-bookmark-modal select:focus,
.hub-bookmark-modal textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.hub-rating-picker button {
  border: 0;
  background: transparent;
  color: #3d4756;
  padding: 2px;
  font-size: 23px;
}

.hub-rating-picker button.active {
  color: var(--amber);
}

.hub-bookmark-modal form > footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  border-top: 1px solid var(--line);
  margin-top: 4px;
  padding-top: 16px;
}

.hub-bookmark-modal form > footer button {
  min-height: 42px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  padding: 0 16px;
  font-size: 12px;
  font-weight: 800;
}

.hub-bookmark-modal form > footer button:last-child {
  border-color: var(--accent-primary-line);
  background: var(--accent-primary);
  color: #fff;
}

.hub-form-error {
  margin: 0;
  color: var(--red);
  font-size: 12px;
}

.hub-form-hint {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.hub-toast-layer {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 260;
  display: grid;
  gap: 8px;
  justify-items: end;
  max-width: min(360px, calc(100vw - 44px));
  pointer-events: none;
}

.hub-toast {
  min-height: 46px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-card);
  background: var(--navy);
  color: var(--ink);
  box-shadow: var(--shadow-raised);
  padding: 0 8px 0 15px;
  font-size: 12px;
  font-weight: 700;
  max-width: 100%;
  pointer-events: auto;
  animation: toast-in var(--dur-base) var(--ease-out);
  transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out);
}

.hub-toast > span {
  flex: 1 1 auto;
  min-width: 0;
  padding: 10px 0;
  line-height: 1.5;
}

.hub-toast button {
  flex: none;
  min-height: 30px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--muted);
  padding: 0 7px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.hub-toast button:hover,
.hub-toast button:focus-visible {
  color: var(--ink);
  background: rgb(255 255 255 / 8%);
}

.hub-toast-close svg {
  width: 14px;
}

.hub-toast.is-leaving {
  opacity: 0;
  transform: translateY(12px);
}

.hub-toast svg {
  flex: none;
  width: 15px;
  color: var(--green);
}

.hub-toast.is-error {
  border-color: color-mix(in srgb, var(--red) 55%, var(--line-strong));
}

.hub-toast.is-error svg {
  color: var(--red);
}

@media (prefers-reduced-motion: reduce) {
  .hub-toast {
    animation: none;
    transition: none;
  }

  .hub-toast.is-leaving {
    opacity: 0;
  }
}

@keyframes hub-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 1199px) {
  .hub-layout {
    display: block;
  }

  .hub-main {
    width: min(100%, 677px);
    margin: 0;
  }

  .hub-side {
    display: none;
  }

  .hub-mobile-tools {
    display: block;
    width: min(100%, 677px);
    margin: 0 0 24px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
  }

  .hub-mobile-tools summary {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 8px;
    list-style: none;
    cursor: pointer;
    color: var(--ink);
    padding: 0;
    font-size: 13px;
    font-weight: 700;
  }

  .hub-mobile-tools summary::-webkit-details-marker {
    display: none;
  }

  .hub-mobile-tools summary > svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    color: var(--soft);
    transform: rotate(-90deg);
    transition: transform var(--dur-press) var(--ease-out);
  }

  .hub-mobile-tools[open] summary > svg {
    transform: rotate(0deg);
  }

  .hub-mobile-tools-body {
    display: grid;
    gap: 16px;
    padding: 0 0 16px;
  }

  .hub-mobile-tools .hub-sidebar-account {
    width: 100%;
    min-height: 0;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--subtle);
    padding: 12px 14px;
  }

  .hub-mobile-tools .hub-sidebar-account-heading,
  .hub-mobile-tools .hub-sidebar-profile > button {
    min-height: 44px;
  }

  .hub-mobile-tools .hub-sidebar-profile > button {
    width: 44px;
    height: 44px;
  }

  .hub-sidebar-mobile-login {
    min-height: 44px;
  }

  .hub-mobile-alerts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .hub-mobile-alerts > button {
    min-width: 0;
    min-height: 52px;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    border: 1px solid var(--line);
    border-radius: 5px;
    background: transparent;
    color: var(--muted);
    padding: 8px 10px;
    text-align: left;
  }

  .hub-mobile-alerts > button > svg {
    width: 17px;
    height: 17px;
    color: var(--blue);
  }

  .hub-mobile-alerts > button > span {
    min-width: 0;
    display: grid;
    gap: 2px;
  }

  .hub-mobile-alerts b,
  .hub-mobile-alerts small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .hub-mobile-alerts b {
    color: var(--ink);
    font-size: 12px;
  }

  .hub-mobile-alerts small {
    color: var(--soft);
    font-size: 12px;
  }

  .hub-mobile-tools-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

}

@media (max-width: 1199px) {
  .hub-bookmark-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .hub-page {
    padding: calc(72px + env(safe-area-inset-top, 0px)) 0 calc(32px + env(safe-area-inset-bottom, 0px));
  }

  .hub-heading {
    min-height: 0;
    display: grid;
    padding: 20px 0;
  }

  .hub-heading-actions {
    justify-content: space-between;
  }

  .hub-alert-popover {
    right: auto;
    left: 0;
    width: min(288px, calc(100vw - 28px));
  }

  .hub-bookmark-tools select,
  .hub-search input,
  .hub-time-selects input,
  .hub-bookmark-modal input,
  .hub-bookmark-modal select,
  .hub-bookmark-modal textarea,
  .hub-discussion-panel form textarea {
    font-size: 16px;
  }

  .hub-heading h1 {
    font-size: 32px;
  }

  .hub-tabs {
    height: 54px;
    gap: 20px;
    overflow-x: auto;
  }

  .hub-layout {
    padding-top: 12px;
  }

  .hub-mobile-tools-grid {
    grid-template-columns: 1fr;
  }

  .hub-section-heading {
    min-height: 0;
    display: grid;
  }

  .hub-bookmark-heading-actions {
    width: 100%;
    justify-content: space-between;
  }

  .hub-member-gate {
    grid-template-columns: 1fr;
    gap: 36px;
    padding: 44px 20px;
  }

  .hub-news-heading {
    gap: 12px;
    margin-bottom: 4px;
    padding-bottom: 16px;
  }

  .hub-app-news {
    margin-top: 0;
  }

  .hub-news-heading h2 {
    font-size: 28px;
  }

  .hub-add-button {
    justify-self: start;
  }

  .hub-bookmark-tools {
    grid-template-columns: 1fr;
  }

  .hub-search {
    grid-column: auto;
  }

  .hub-filter-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .hub-news-media.compact {
    height: clamp(160px, 52vw, 220px);
    max-height: none;
    object-fit: contain;
  }

  .hub-media-fallback.compact {
    height: clamp(160px, 52vw, 220px);
  }

  .hub-news-card {
    grid-template-columns: 34px minmax(0, 1fr);
    column-gap: 10px;
    row-gap: 0;
    padding: 16px 0 20px;
  }

  .hub-news-avatar {
    width: 32px;
    height: 32px;
    margin-top: 2px;
  }

  .hub-news-avatar img {
    width: 26px;
    height: 16px;
  }

  .hub-news-copy h3 {
    margin-top: 4px;
    font-size: 16px;
  }

  .hub-news-copy > p {
    font-size: 14px;
    -webkit-line-clamp: 4;
  }

  .hub-news-card .hub-card-actions button,
  .hub-news-card .hub-card-actions a {
    min-height: 44px;
  }

  .hub-card-actions-right {
    gap: 6px;
  }

  .hub-card-actions-right a {
    gap: 4px;
    font-size: 12px;
    white-space: nowrap;
  }

  .hub-card-actions .icon-only {
    width: 44px;
    min-width: 44px;
  }

  .hub-filter-tabs button,
  .hub-rating-filter-star,
  .hub-raw-help {
    min-height: 44px;
  }

  .hub-raw-help {
    width: 44px;
    min-width: 44px;
    justify-content: center;
  }

  .hub-modal-layer {
    padding-top: max(0px, env(safe-area-inset-top, 0px));
    padding-right: 0;
    padding-bottom: max(0px, env(safe-area-inset-bottom, 0px));
    padding-left: 0;
  }

  .hub-modal {
    max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  }

  .hub-admin-card dl {
    grid-template-columns: 1fr;
  }

  .hub-admin-card dl > div {
    border-right: 0;
  }

  .hub-digest-settings > header,
  .hub-digest-settings > div,
  .hub-digest-settings dl {
    display: grid;
    grid-template-columns: 1fr;
  }

  .hub-digest-settings label {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .hub-digest-settings dl > div + div {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .hub-taxonomy-manager > header,
  .hub-taxonomy-manager > div {
    display: grid;
    grid-template-columns: 1fr;
  }

  .hub-taxonomy-group + .hub-taxonomy-group {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .hub-modal-layer {
    align-items: end;
    padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px);
  }

  .hub-modal {
    max-height: calc(100vh - 20px);
    max-height: calc(100dvh - 20px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 8px 8px 0 0;
  }

  .hub-toast-layer {
    right: 12px;
    bottom: calc(84px + env(safe-area-inset-bottom, 0px));
    left: 12px;
    max-width: none;
    justify-items: stretch;
  }
}

@media (min-width: 521px) and (max-width: 760px) {
  .hub-card-actions {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 6px;
  }

  .hub-instant-action {
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
  }

  .hub-card-actions-right {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
  }
}

@media (max-width: 520px) {
  .hub-card-actions {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px;
    gap: 6px;
  }

  .hub-instant-action {
    grid-column: 1;
    grid-row: 1;
    justify-self: stretch;
  }

  .hub-card-actions-right {
    display: contents;
  }

  .hub-card-actions-right a {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    justify-content: center;
  }

  .hub-card-actions-right .icon-only {
    grid-column: 3;
    grid-row: 1;
  }
}

@media (max-width: 350px) {
  .hub-mobile-alerts {
    grid-template-columns: 1fr;
  }

  .hub-card-actions {
    grid-template-columns: repeat(3, 44px);
    justify-content: space-between;
  }

  .hub-instant-action,
  .hub-card-actions-right a,
  .hub-card-actions-right .icon-only {
    width: 44px;
    min-width: 44px;
  }

  .hub-card-actions button > span,
  .hub-card-actions a > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
}

@media (max-width: 760px) and (max-height: 450px) and (orientation: landscape) {
  .hub-page {
    padding-top: calc(60px + env(safe-area-inset-top, 0px));
    padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
  }

  .hub-heading {
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .hub-toast-layer {
    bottom: calc(70px + env(safe-area-inset-bottom, 0px));
  }
}

html[data-theme="light"] .hub-section-heading h2,
html[data-theme="light"] .hub-side-heading h2,
html[data-theme="light"] .hub-modal h2,
html[data-theme="light"] .hub-news-copy h3,
html[data-theme="light"] .hub-bookmark-identity h3,
html[data-theme="light"] .hub-clock > strong {
  color: var(--ink);
}

html[data-theme="light"] .hub-channel-link:hover,
html[data-theme="light"] .hub-icon-button:hover,
html[data-theme="light"] .hub-sidebar-admin-link:hover {
  border-color: var(--blue-line);
  background: var(--accent-soft);
  color: var(--ink);
}

@media (min-width: 1360px) {
  .app-shell.sidebar-collapsed #hubSidebarTools .hub-sidebar-admin-link {
    width: 48px;
    height: 48px;
    grid-template-columns: 1fr;
    justify-items: center;
    margin-inline: auto;
    padding: 0;
  }

  .app-shell.sidebar-collapsed #hubSidebarTools .hub-sidebar-admin-link > span,
  .app-shell.sidebar-collapsed #hubSidebarTools .hub-sidebar-admin-link > svg:last-child {
    display: none;
  }
}

html[data-theme="light"] .hub-alert-popover,
html[data-theme="light"] .hub-modal {
  background: #ffffff;
  box-shadow: 0 20px 55px rgba(35, 49, 70, 0.16);
}

html[data-theme="light"] .hub-bookmark-identity > span,
html[data-theme="light"] .hub-zone-tabs button,
html[data-theme="light"] .hub-time-selects input,
html[data-theme="light"] .hub-taxonomy-group input,
html[data-theme="light"] .hub-taxonomy-group select,
html[data-theme="light"] .hub-taxonomy-delete select,
html[data-theme="light"] .hub-bookmark-modal input,
html[data-theme="light"] .hub-bookmark-modal select,
html[data-theme="light"] .hub-bookmark-modal textarea {
  background: #ffffff;
  color: var(--ink);
}

html[data-theme="light"] .hub-raw-tooltip,
html[data-theme="light"] .hub-discussion-panel form textarea {
  background: #ffffff;
}

html[data-theme="light"] .hub-member-gate-copy h2,
html[data-theme="light"] .hub-access-ladder strong {
  color: var(--ink);
}

html[data-theme="light"] .hub-bookmark-modal select {
  color-scheme: light;
}

html[data-theme="light"] .hub-bookmark-modal select option {
  background: #ffffff;
  color: var(--ink);
}

html[data-theme="light"] .hub-zone-tabs button.active {
  background: var(--accent-soft);
  color: var(--accent);
}

html[data-theme="light"] .hub-sidebar-tools .hub-clock,
html[data-theme="light"] .hub-sidebar-tools .hub-quick,
html[data-theme="light"] .hub-clock-panel,
html[data-theme="light"] .hub-quick,
html[data-theme="light"] .hub-digest-settings,
/* Member directory: one row per member, expandable detail. */
.hub-member-directory-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 14px 0 4px;
}

.hub-member-directory-tools .hub-search {
  flex: 1;
  min-width: 220px;
}

.hub-member-directory-tools > div[role="group"] {
  display: flex;
  gap: 6px;
}

.hub-member-directory-tools > div[role="group"] button {
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 600;
}

.hub-member-directory-tools > div[role="group"] button.active {
  border-color: var(--blue-line);
  color: var(--blue);
}

.hub-member-directory-table {
  overflow-x: auto;
  margin-top: 10px;
}

.hub-member-directory-table table {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  font-size: 13px;
}

.hub-member-directory-table th {
  color: var(--muted);
  text-align: left;
  font-weight: 600;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}

.hub-member-directory-table tbody tr {
  cursor: pointer;
}

.hub-member-directory-table tbody tr:hover td {
  background: color-mix(in srgb, var(--accent) 7%, transparent);
}

.hub-member-directory-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  vertical-align: middle;
}

.hub-member-directory-table td svg.is-yes { width: 15px; color: var(--green); }
.hub-member-directory-table td svg.is-no { width: 15px; color: var(--soft); }

.hub-member-directory-identity {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.hub-member-directory-identity strong { display: block; font-size: 13px; }
.hub-member-directory-identity span { color: var(--soft); font-size: 12px; }

.hub-member-directory-detail td {
  background: color-mix(in srgb, var(--accent) 5%, transparent);
  cursor: default;
}

.hub-member-directory-detail dl {
  display: flex;
  gap: 22px;
  margin: 2px 0 8px;
}

.hub-member-directory-detail dt { color: var(--muted); font-size: 12px; }
.hub-member-directory-detail dd { margin: 2px 0 0; font-size: 13px; }

.hub-member-directory-detail .hub-member-wallet-addresses li button.icon-only {
  border: 0;
  background: transparent;
  color: var(--muted);
  padding: 3px;
}

.hub-member-directory-detail .hub-member-wallet-addresses li button.icon-only:hover { color: var(--ink); }
.hub-member-directory-detail .hub-member-wallet-addresses li button.icon-only svg { width: 13px; height: 13px; }

.hub-member-directory-nowallet { margin: 0; color: var(--muted); font-size: 12px; }


html[data-theme="light"] .hub-member-wallet-manager,
html[data-theme="light"] .hub-taxonomy-manager,
html[data-theme="light"] .hub-taxonomy-group li,
html[data-theme="light"] .hub-toast {
  border-color: var(--line-strong);
  background: #ffffff;
  color: var(--ink);
}

html[data-theme="light"] .hub-risk-notice {
  background: #fffaf0;
}

html[data-theme="light"] .hub-bookmark-stats button,
html[data-theme="light"] .hub-bookmark-banner {
  background: var(--subtle);
}

html[data-theme="light"] .hub-member-wallet-addresses > li > span[data-namespace="solana"] {
  border-color: rgb(4 120 87 / 35%);
  color: #047857;
}

html[data-theme="light"] .hub-card-actions button:hover,
html[data-theme="light"] .hub-card-actions a:hover,
html[data-theme="light"] .hub-empty button:hover,
html[data-theme="light"] .hub-taxonomy-group button:hover:not(:disabled) {
  color: var(--ink);
}

@media (max-width: 520px) {
  .hub-channel-link span {
    display: none;
  }

  .hub-bookmark-identity {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .hub-bookmark-identity > div:last-child {
    grid-column: 2;
    justify-items: start;
  }

  .hub-bookmark-identity > .hub-follower-snapshot,
  .hub-follower-snapshot > span {
    justify-content: flex-start;
    justify-items: start;
  }

  .hub-bookmark-copy > footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .hub-bookmark-copy > footer > div {
    width: 100%;
    flex-wrap: wrap;
  }

  .hub-bookmark-copy footer a {
    flex: 1;
  }

  .hub-bookmark-heading-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .hub-member-gate {
    padding-right: 0;
    padding-left: 0;
  }

  .hub-bookmark-modal form > div,
  .hub-bookmark-tools {
    grid-template-columns: 1fr;
  }

  .hub-taxonomy-group > form,
  .hub-taxonomy-row form {
    grid-template-columns: 1fr auto;
  }

  .hub-taxonomy-group > form.has-wallet-family {
    grid-template-columns: 1fr;
  }

  .hub-taxonomy-row form.has-wallet-family {
    grid-template-columns: 1fr 1fr;
  }

  .hub-taxonomy-group input,
  .hub-taxonomy-group select,
  .hub-taxonomy-group button {
    min-height: 44px;
  }

  .hub-taxonomy-group input,
  .hub-taxonomy-group select {
    font-size: 16px;
  }

  .hub-taxonomy-row > div button {
    width: 44px;
    min-height: 44px;
  }

  .hub-taxonomy-group > form.has-wallet-family > button {
    width: 100%;
  }

  .hub-taxonomy-row form > button:last-child {
    grid-column: 1 / -1;
  }

  .hub-search {
    grid-column: auto;
  }

  .hub-card-actions {
    flex-wrap: wrap;
  }

  .hub-card-actions a {
    margin-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hub-loading svg,
  .hub-boot-loading i {
    animation: none;
  }
}

/* Mobile utility controls remain comfortably tappable even when the browser
   reports a fine pointer (for example, tablet desktop-mode emulation). */
@media (max-width: 760px) {
  .hub-mobile-tools .hub-sidebar-login-retry {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    padding-block: 0;
  }

  .hub-mobile-tools .hub-zone-tabs button,
  .hub-mobile-tools .hub-time-selects input {
    min-height: 44px;
    height: 44px;
  }
}

@media (min-width: 761px) and (max-width: 1040px) {
  .hub-news-card .hub-card-actions button,
  .hub-news-card .hub-card-actions a {
    min-height: 44px;
  }
}

/* Touch targets: pointer-coarse devices get at least 44px interactive height. */
@media (pointer: coarse) {
  .hub-mobile-tools summary,
  .hub-news-card .hub-card-actions button,
  .hub-news-card .hub-card-actions a,
  .hub-bookmark-admin-actions button,
  .hub-bookmark-copy footer button,
  .hub-bookmark-copy footer a,
  .hub-discussion-toggle,
  .hub-discussion-panel form button,
  .hub-member-gate-actions button,
  .hub-add-button,
  .hub-filter-tabs button,
  .hub-rating-filter-star,
  .hub-raw-help,
  .hub-zone-tabs button,
  .hub-time-selects input,
  .hub-member-wallet-manager button,
  .hub-taxonomy-row > div button {
    min-height: 44px;
  }

  .hub-card-actions .icon-only {
    width: 44px;
  }

  .hub-bookmark-admin-actions button {
    min-width: 44px;
  }

  /* Four square actions plus the label must still fit a narrow column. */
  .hub-taxonomy-row > div {
    gap: 3px;
  }

  .hub-taxonomy-row > div button {
    width: 40px;
  }
}

@media (max-width: 1100px) {
  .hub-digest-template-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hub-digest-title-field {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .hub-digest-template > header,
  .hub-digest-template > footer,
  .hub-digest-preview > header {
    align-items: stretch;
    flex-direction: column;
  }

  .hub-digest-mode,
  .hub-digest-template-fields,
  .hub-digest-preview-grid {
    width: 100%;
    grid-template-columns: 1fr;
  }

  .hub-digest-title-field {
    grid-column: auto;
  }

  .hub-digest-template > footer button,
  .hub-digest-actions button {
    flex: 1 1 0;
  }

  .hub-digest-settings > .hub-digest-actions {
    display: flex;
  }

  .hub-digest-settings > .hub-digest-test-send {
    grid-template-columns: 1fr;
  }

  .hub-digest-test-send button {
    width: 100%;
  }

  .hub-digest-poster-preview img {
    max-width: min(100%, 380px);
  }

  .hub-digest-character-count {
    align-self: flex-start;
  }
}

@media (max-width: 380px) {
  .hub-digest-settings > .hub-digest-actions {
    flex-direction: column;
  }

}

html[data-theme="light"] .hub-raffle-manager {
  background: #fff;
}

html[data-theme="light"] .hub-raffle-create input {
  background: #f8fafc;
  color-scheme: light;
}

html[data-theme="light"] .hub-raffle-result {
  background: rgb(8 127 245 / 4%);
}

@media (max-width: 1180px) {
  .hub-raffle-create {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hub-raffle-title-field,
  .hub-raffle-description-field,
  .hub-raffle-create > button,
  .hub-raffle-create > p {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .hub-raffle-manager > header,
  .hub-raffle-item > header {
    align-items: stretch;
    flex-direction: column;
  }

  .hub-raffle-manager > header > button,
  .hub-raffle-create,
  .hub-raffle-item > dl,
  .hub-raffle-link {
    width: 100%;
  }

  .hub-raffle-create,
  .hub-raffle-item > dl,
  .hub-raffle-link {
    grid-template-columns: 1fr;
  }

  .hub-raffle-title-field,
  .hub-raffle-description-field,
  .hub-raffle-create > button,
  .hub-raffle-create > p {
    grid-column: auto;
  }

  .hub-raffle-item > dl > div + div {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .hub-raffle-link code {
    min-height: 42px;
  }

  .hub-raffle-link button,
  .hub-raffle-item > footer button {
    width: 100%;
  }
}

/* Public raffle catalogue and detail */
.raffles-active .hub-page {
  padding-top: 0;
}


.raffle-public-shell {
  width: min(100%, 1360px);
  min-height: calc(100vh - 1px);
  margin: 0 auto;
  color: var(--ink);
}

.raffle-public-header {
  position: sticky;
  z-index: 30;
  top: 0;
  min-height: 74px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border-bottom: 1px solid var(--line);
  background: rgb(2 9 22 / 88%);
  padding: 0 clamp(18px, 3vw, 42px);
  backdrop-filter: blur(18px);
}

.raffle-public-brand,
.raffle-public-header nav,
.raffle-public-header nav a,
.raffle-public-back,
.raffle-public-detail-copy .raffle-public-host a,
.raffle-public-enter,
.raffle-public-card-action {
  display: inline-flex;
  align-items: center;
}

.raffle-public-brand {
  gap: 11px;
  color: var(--ink);
  text-decoration: none;
}

.raffle-public-more {
  display: flex;
  justify-content: center;
  padding: 28px 0 0;
}

.raffle-public-more button {
  min-width: 190px;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--subtle);
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}

.raffle-public-more button svg {
  width: 15px;
  height: 15px;
}

.raffle-public-brand > img {
  width: 34px;
  height: 34px;
  object-fit: contain;
}

.raffle-public-brand > span {
  display: grid;
  gap: 2px;
}

.raffle-public-brand strong {
  font-size: 14px;
  letter-spacing: -0.01em;
}

.raffle-public-brand small {
  color: var(--blue);
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.raffle-public-header nav {
  align-self: stretch;
  gap: 28px;
}

.raffle-public-header nav a {
  position: relative;
  gap: 6px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.raffle-public-header nav a::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  background: transparent;
  content: "";
}

.raffle-public-header nav a.active,
.raffle-public-header nav a:hover {
  color: var(--ink);
}

.raffle-public-header nav a.active::after {
  background: var(--blue);
}

.raffle-public-header nav svg,
.raffle-public-detail-copy .raffle-public-host svg,
.raffle-public-card-action svg {
  width: 14px;
  height: 14px;
}

.raffle-public-main {
  min-height: 640px;
  padding: 0 0 72px;
}

.raffle-public-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 48px;
  border-bottom: 1px solid var(--line);
  padding: 34px clamp(0px, 1vw, 14px) 26px;
}

.raffle-public-intro > div {
  max-width: 760px;
}

.raffle-public-intro > div > p {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: var(--blue);
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.15em;
}

.raffle-public-intro > div > p svg {
  width: 16px;
  height: 16px;
}

.raffle-public-intro h1 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(36px, 5vw, 66px);
  line-height: 0.98;
  letter-spacing: -0.055em;
}

.raffle-public-intro > div > span {
  display: block;
  max-width: 680px;
  margin-top: 18px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}

.raffle-public-tasks ol {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
  counter-reset: raffle-task;
}

.raffle-public-tasks li {
  display: grid;
  /* number badge | click-check | task copy | shortcut */
  grid-template-columns: 26px 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--subtle);
  padding: 12px 14px;
}

.raffle-public-task-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.raffle-public-task-actions a.raffle-public-task-mark {
  text-decoration: none;
}

/* The comment-link input rides under its mission row, spanning the whole
   four-column grid — the row above keeps its columns untouched. */
.raffle-public-task-proof {
  grid-column: 1 / -1;
  display: grid;
  gap: 5px;
  border-top: 1px dashed var(--line);
  padding-top: 10px;
}

.raffle-public-task-proof label {
  display: grid;
  gap: 5px;
}

.raffle-public-task-proof label span {
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.raffle-public-task-proof input {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  font-size: 13px;
  padding: 0 12px;
}

.raffle-public-task-proof input:focus-visible {
  outline: 2px solid var(--accent-border);
  outline-offset: 1px;
}

.raffle-public-task-proof small[data-state="ok"] {
  color: var(--green);
}

.raffle-public-task-proof small[data-state="invalid"] {
  color: var(--red);
}

.raffle-public-tasks li::before {
  counter-increment: raffle-task;
  content: counter(raffle-task);
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--accent-active-bg);
  color: var(--blue);
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 800;
}

.raffle-public-tasks li span { min-width: 0; display: grid; gap: 2px; }
.raffle-public-tasks li strong { color: var(--ink); font-size: 14px; }
.raffle-public-tasks li small { color: var(--soft); font-size: 12px; }

.raffle-public-tasks li a {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--accent-border);
  border-radius: 6px;
  padding: 0 12px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
}

.raffle-public-tasks li a svg { width: 13px; }

.raffle-public-toolbar {
  min-height: 68px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
}

.raffle-public-toolbar > div[role="tablist"] {
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--subtle);
  padding: 3px;
}

.raffle-public-toolbar-controls {
  min-width: 0;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.raffle-public-toolbar button {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  padding: 0 12px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 750;
}

.raffle-public-toolbar button.active {
  background: var(--accent-active-bg);
  color: var(--blue);
}

.raffle-public-toolbar button span {
  min-width: 21px;
  border-radius: 999px;
  background: rgb(128 145 170 / 12%);
  padding: 2px 6px;
  color: inherit;
  font-family: var(--mono);
  font-size: 12px;
}

.raffle-public-search,
.raffle-public-sort,
.raffle-public-unentered {
  min-height: 42px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  border: 1px solid var(--line-strong);
  border-radius: 9px;
  background: var(--subtle);
}

.raffle-public-search {
  width: min(380px, 100%);
  min-width: 180px;
  flex: 1 1 280px;
  gap: 9px;
  padding: 0 12px;
}

.raffle-public-search:focus-within,
.raffle-public-sort:focus-within,
.raffle-public-unentered:focus-within {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.raffle-public-search > svg {
  flex: none;
  width: 17px;
  height: 17px;
  color: var(--soft);
}

.raffle-public-search input {
  min-width: 0;
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 14px;
}

.raffle-public-sort {
  flex: 0 1 154px;
  padding: 0 9px;
}

.raffle-public-sort select {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.raffle-public-unentered {
  flex: none;
  gap: 8px;
  padding: 0 11px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}

.raffle-public-unentered input {
  width: 17px;
  height: 17px;
  flex: none;
  margin: 0;
  accent-color: var(--blue);
  cursor: pointer;
}

.raffle-public-unentered:has(input:checked) {
  border-color: var(--accent-border-strong);
  background: var(--accent-active-bg);
  color: var(--ink);
}

.raffle-public-unentered:has(input:disabled) {
  opacity: 0.62;
  cursor: not-allowed;
}

.raffle-public-unentered input:disabled {
  cursor: not-allowed;
}

.raffle-public-toolbar button:focus-visible,
.raffle-public-sort select:focus-visible,
.raffle-public-unentered input:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

.raffle-public-catalogue-summary {
  min-height: 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px 10px;
  color: var(--soft);
  font-size: 12px;
}

.raffle-public-result-count {
  margin-right: auto;
  font-variant-numeric: tabular-nums;
}

.raffle-public-search-notice,
.raffle-public-participation-notice {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-align: right;
}

.raffle-public-search-notice.is-searching::before,
.raffle-public-participation-notice.is-loading::before {
  width: 11px;
  height: 11px;
  flex: none;
  box-sizing: border-box;
  border: 2px solid var(--line-strong);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: hub-spin 0.8s linear infinite;
  content: "";
}

.raffle-public-search-notice.is-error,
.raffle-public-participation-notice.is-error {
  color: var(--red);
  font-weight: 700;
}

.raffle-public-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 340px));
  justify-content: center;
  gap: 16px;
}

.raffle-public-campaign-group {
  width: min(696px, 100%);
  max-width: 100%;
  grid-column: span 2;
  justify-self: center;
  display: grid;
  gap: 9px;
}

.raffle-public-campaign-group > header {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 2px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 760;
}

.raffle-public-campaign-group > header small {
  color: var(--soft);
  font-size: 12px;
  font-weight: 650;
}

.raffle-public-campaign-group > header small::before { content: "· "; }

.raffle-public-campaign-group > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 340px));
  gap: 16px;
}

/* Sparse result sets stay card-sized; four or more use the full catalogue row. */
.raffle-public-grid:has(> .raffle-public-card:nth-child(4)) {
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
}

.raffle-public-card {
  position: relative;
  width: 100%;
  max-width: 340px;
  min-width: 0;
  justify-self: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--subtle);
  box-shadow: 0 10px 30px rgb(0 0 0 / 12%);
  transition: border-color var(--dur-press) var(--ease-out), transform var(--dur-press) var(--ease-out), box-shadow var(--dur-press) var(--ease-out);
}

/* Campaign OG cards stay inside the AlphaDuo system while reading as rare:
   four restrained edge colours, a narrow halo, and icon-library sparkles. */
.raffle-public-card[data-campaign-audience="og"] {
  overflow: visible;
  border-width: 2px;
  border-top-color: #a56cff;
  border-right-color: #55dff8;
  border-bottom-color: #5aa8ff;
  border-left-color: #c46cff;
  box-shadow: -5px 0 14px rgb(196 108 255 / 24%), 5px 0 14px rgb(85 223 248 / 22%), 0 12px 30px rgb(90 168 255 / 18%);
  animation: raffle-og-halo 3.8s ease-in-out infinite;
}

.raffle-public-card[data-campaign-audience="og"] .raffle-public-card-link {
  overflow: hidden;
  border-radius: 10px;
  background: var(--subtle);
}

.raffle-public-card[data-campaign-audience="og"] .raffle-public-status[data-status="og"] {
  border-color: rgb(176 118 255 / 68%);
  background: rgb(75 47 150 / 86%);
  color: #fff;
  box-shadow: 0 0 12px rgb(133 104 255 / 32%);
}

.raffle-public-og-sparkles {
  position: absolute;
  z-index: 4;
  inset: -9px;
  pointer-events: none;
}

.raffle-public-og-sparkles i {
  position: absolute;
  width: 14px;
  height: 14px;
  color: #a56cff;
  font-style: normal;
  filter: drop-shadow(0 0 4px currentColor);
  animation: raffle-og-sparkle 2.8s ease-in-out infinite;
}

.raffle-public-og-sparkles i svg { width: 100%; height: 100%; fill: rgb(255 255 255 / 72%); }
.raffle-public-og-sparkles i:nth-child(1) { top: 0; left: 16%; }
.raffle-public-og-sparkles i:nth-child(2) { top: 0; right: 1%; color: #55dff8; animation-delay: .45s; }
.raffle-public-og-sparkles i:nth-child(3) { top: 42%; right: 0; color: #62c9ff; animation-delay: .9s; }
.raffle-public-og-sparkles i:nth-child(4) { right: 5%; bottom: 0; color: #5aa8ff; animation-delay: 1.35s; }
.raffle-public-og-sparkles i:nth-child(5) { bottom: 0; left: 18%; color: #917cff; animation-delay: 1.8s; }
.raffle-public-og-sparkles i:nth-child(6) { top: 54%; left: 0; color: #c46cff; animation-delay: 2.25s; }

@keyframes raffle-og-halo {
  0%, 100% { box-shadow: -5px 0 14px rgb(196 108 255 / 20%), 5px 0 14px rgb(85 223 248 / 18%), 0 12px 30px rgb(90 168 255 / 16%); }
  50% { box-shadow: -7px 0 20px rgb(196 108 255 / 34%), 7px 0 20px rgb(85 223 248 / 30%), 0 14px 34px rgb(90 168 255 / 24%); }
}

@keyframes raffle-og-sparkle {
  0%, 100% { opacity: .28; transform: scale(.72) rotate(-8deg); }
  42% { opacity: 1; transform: scale(1.08) rotate(8deg); }
}

.raffle-public-card:hover {
  border-color: var(--accent-border);
  box-shadow: 0 16px 38px rgb(0 0 0 / 18%);
  transform: translateY(-2px);
}

.raffle-public-card-link {
  height: 100%;
  min-height: 100%;
  display: grid;
  grid-template-rows: auto 1fr;
  color: inherit;
  text-decoration: none;
}

.raffle-public-card-link:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: -3px;
}

.raffle-public-card.is-entered {
  border: 2px solid var(--blue);
}

.raffle-public-card-cover,
.raffle-public-detail-cover {
  position: relative;
  display: block;
  overflow: hidden;
  background: #07162d;
}

.raffle-public-card-cover {
  aspect-ratio: 2 / 1;
}

.raffle-public-card-cover > img,
.raffle-public-detail-cover > img,
.raffle-public-cover-fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.raffle-public-card-cover > img,
.raffle-public-detail-cover > img {
  z-index: 1;
  object-fit: cover;
}

.raffle-public-cover-fallback {
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 72% 18%, rgb(15 150 255 / 34%), transparent 34%),
    linear-gradient(140deg, #061126, #0b244b);
}

.raffle-public-cover-fallback img {
  width: 44px;
  opacity: 0.38;
}

.raffle-public-status,
.raffle-public-time {
  position: absolute;
  z-index: 2;
  top: 10px;
  max-width: calc(50% - 14px);
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 16%);
  border-radius: 999px;
  background: rgb(2 9 22 / 76%);
  color: #dbe9ff;
  padding: 0 9px;
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-overflow: ellipsis;
  white-space: nowrap;
  backdrop-filter: blur(10px);
}

.raffle-public-status {
  left: 10px;
}

.raffle-public-status[data-status="open"] {
  border-color: rgb(0 214 107 / 40%);
  color: #63f3aa;
}

.raffle-public-status[data-status="drawn"] {
  border-color: var(--accent-border-strong);
  color: #7bc1ff;
}

.raffle-public-status[data-status="full"] {
  border-color: rgb(255 173 61 / 48%);
  color: #ffc66f;
}

.raffle-public-time {
  right: 10px;
  gap: 5px;
  max-width: calc(65% - 14px);
  letter-spacing: 0;
}

.raffle-public-time svg {
  width: 12px;
  height: 12px;
}

.raffle-public-entered-badge {
  position: absolute;
  z-index: 2;
  bottom: 10px;
  left: 10px;
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid rgb(255 255 255 / 32%);
  border-radius: 999px;
  background: rgb(2 9 22 / 82%);
  color: #fff;
  padding: 0 9px;
  font-size: 12px;
  font-weight: 800;
  backdrop-filter: blur(10px);
}

.raffle-public-entered-badge svg {
  width: 13px;
  height: 13px;
}

.raffle-public-early-project-badge {
  position: absolute;
  z-index: 2;
  bottom: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  max-width: calc(100% - 20px);
  padding: 4px 8px;
  border: 1px solid rgb(255 177 41 / 62%);
  border-radius: 5px;
  background: rgb(5 9 16 / 90%);
  color: #ffd064;
  box-shadow: 0 5px 14px rgb(0 0 0 / 28%);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  backdrop-filter: blur(10px);
}

.raffle-public-early-project-badge strong {
  color: #ffe09a;
  letter-spacing: 0.08em;
}

.raffle-public-card-cover.has-early-project .raffle-public-entered-badge {
  right: 10px;
  left: auto;
}

.hub-raffle-early-project-field small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.hub-raffle-early-project-field {
  display: grid;
  gap: 9px;
}

.hub-raffle-early-project-field > label {
  display: grid;
  gap: 7px;
}

.hub-raffle-early-project-suggestions {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgb(36 161 255 / 42%);
  border-radius: 7px;
  background: rgb(36 161 255 / 7%);
}

.hub-raffle-early-project-suggestions > strong {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--blue);
  font-size: 12px;
}

.hub-raffle-early-project-suggestions > strong svg,
.hub-raffle-early-project-confirmed svg {
  width: 15px;
  height: 15px;
}

.hub-raffle-early-project-suggestions article {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 9px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
}

.hub-raffle-early-project-avatar {
  width: 36px;
  height: 36px;
  overflow: hidden;
  border-radius: 50%;
  background: var(--panel-strong);
}

.hub-raffle-early-project-avatar img { width: 100%; height: 100%; object-fit: cover; }
.hub-raffle-early-project-suggestions article > div { min-width: 0; display: grid; gap: 2px; }
.hub-raffle-early-project-suggestions article b { overflow: hidden; color: var(--ink); text-overflow: ellipsis; white-space: nowrap; }
.hub-raffle-early-project-suggestions article em { color: var(--soft); font-size: 12px; font-style: normal; }
.hub-raffle-early-project-suggestions article em[data-confidence="high"] { color: #48d7a0; }
.hub-raffle-early-project-suggestions article button { min-height: 34px; padding: 6px 9px; }

.hub-raffle-early-project-confirmed {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 8px 10px;
  border: 1px solid rgb(72 215 160 / 38%);
  border-radius: 6px;
  background: rgb(72 215 160 / 8%);
  color: #48d7a0;
  font-size: 12px;
}

.hub-raffle-early-project-confirmed[data-stale] { border-color: rgb(255 177 41 / 52%); background: rgb(255 177 41 / 8%); color: #ffd064; }
.hub-raffle-early-project-confirmed button { margin-left: auto; min-height: 30px; padding: 4px 8px; }

@media (max-width: 760px) {
  .hub-raffle-early-project-suggestions article { grid-template-columns: 34px minmax(0, 1fr); }
  .hub-raffle-early-project-suggestions article button { grid-column: auto; }
}

/* Administrator-only project calendar. Public navigation stays absent until
   the server-side feature flag is explicitly enabled in a later release. */
.hub-calendar-admin-header,
.hub-calendar-candidates > header,
.hub-calendar-event-editor > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.hub-calendar-admin-header > div:first-child p,
.hub-calendar-event-editor small {
  margin: 0;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.hub-calendar-admin-header h3,
.hub-calendar-candidates h4,
.hub-calendar-event-editor h4 {
  margin: 3px 0 0;
}

.hub-calendar-admin-header small,
.hub-calendar-candidates header p {
  color: var(--muted);
  font-size: 12px;
}

.hub-calendar-admin-header > div:last-child,
.hub-calendar-candidates > header > div:last-child {
  display: flex;
  gap: 8px;
}

.hub-calendar-download,
.hub-calendar-admin button,
.hub-calendar-admin select,
.hub-calendar-admin input {
  min-height: 42px;
}

.hub-calendar-download {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 13px;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.hub-calendar-download svg,
.hub-calendar-admin button svg {
  width: 15px;
  height: 15px;
}

.hub-calendar-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--line);
}

.hub-calendar-summary > div {
  display: grid;
  gap: 5px;
  min-height: 76px;
  padding: 14px 16px;
  border-right: 1px solid var(--line);
}

.hub-calendar-summary > div:last-child { border-right: 0; }
.hub-calendar-summary span { color: var(--muted); font-size: 12px; }
.hub-calendar-summary strong { font-size: 22px; }

.hub-calendar-toolbar button span {
  margin-left: 5px;
  color: var(--blue);
}

.hub-calendar-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
  align-items: start;
}

.hub-calendar-month,
.hub-calendar-upcoming,
.hub-calendar-event-editor,
.hub-calendar-candidates,
.hub-calendar-cancelled {
  border: 1px solid var(--line);
  background: var(--subtle);
}

.hub-calendar-month > header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
}

.hub-calendar-month h4 { min-width: 160px; margin: 0; text-align: center; }
.hub-calendar-month > header button { min-width: 42px; border: 0; background: transparent; color: var(--muted); }

.hub-calendar-weekdays,
.hub-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.hub-calendar-weekdays span {
  border-bottom: 1px solid var(--line);
}

.hub-calendar-grid > div {
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.hub-calendar-grid > div:nth-child(7n) { border-right: 0; }
.hub-calendar-grid > div[data-creatable] { cursor: pointer; }
.hub-calendar-grid > div[data-creatable]:hover { background: rgb(8 127 245 / 5%); }
.hub-calendar-week-grid > article[data-creatable] { cursor: pointer; }
.hub-calendar-week-grid > article[data-creatable]:hover { background: rgb(8 127 245 / 5%); }
.hub-calendar-create-modal { width: min(560px, 100%); }
.hub-calendar-create-modal > .hub-calendar-editor-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 14px;
  margin: 0;
  padding: 22px;
}
.hub-calendar-create-modal > .hub-calendar-editor-fields > .hub-calendar-field-project { grid-column: 1 / -1; }
.hub-calendar-create-modal > .hub-calendar-editor-fields > .hub-calendar-field-link { grid-column: 1 / -1; }
.hub-calendar-create-modal > .hub-calendar-editor-fields label { min-width: 0; display: grid; gap: 6px; }
.hub-calendar-create-modal > .hub-calendar-editor-fields label span { color: var(--muted); font-size: 12px; font-weight: 700; }
.hub-calendar-create-modal > .hub-calendar-editor-fields input,
.hub-calendar-create-modal > .hub-calendar-editor-fields select {
  width: 100%;
  min-height: 40px;
  box-sizing: border-box;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  outline: 0;
  background: var(--field-bg);
  color: var(--ink);
  padding: 0 11px;
  color-scheme: dark;
  font: inherit;
  font-size: 13px;
}
.hub-calendar-create-modal > .hub-calendar-editor-fields input:focus-visible,
.hub-calendar-create-modal > .hub-calendar-editor-fields select:focus-visible { border-color: var(--blue); box-shadow: 0 0 0 3px var(--focus-ring); }
.hub-calendar-create-modal > .hub-calendar-editor-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 0;
  padding: 0 22px 22px;
}
.hub-calendar-create-modal > .hub-calendar-editor-actions button {
  min-width: 104px;
  min-height: 40px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--ink);
  padding: 0 16px;
  font-size: 13px;
  font-weight: 700;
}
.hub-calendar-create-modal > .hub-calendar-editor-actions .primary { border-color: var(--blue); background: var(--blue); color: #fff; }
.hub-calendar-create-modal > .hub-calendar-editor-actions button:disabled { cursor: not-allowed; opacity: .55; }
.hub-calendar-grid time { display: block; }

.hub-calendar-upcoming { padding: 14px; }
.hub-calendar-upcoming h4 { margin: 0 0 10px; }
.hub-calendar-upcoming ul,
.hub-calendar-cancelled ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.hub-calendar-upcoming li button { display: grid; width: 100%; gap: 3px; padding: 10px; border: 1px solid var(--line); background: transparent; color: var(--ink); text-align: left; }
.hub-calendar-upcoming li a { display: grid; gap: 3px; padding: 10px; border: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.hub-calendar-upcoming time,
.hub-calendar-upcoming span { color: var(--muted); font-size: 12px; }

.hub-calendar-event-editor { padding: 15px; }
.hub-calendar-event-editor > div { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; margin-top: 13px; }
.hub-calendar-event-editor label { display: grid; gap: 5px; }
.hub-calendar-event-editor label span { color: var(--muted); font-size: 12px; }
.hub-calendar-event-editor input,
.hub-calendar-event-editor select,
.hub-calendar-candidate-rows input,
.hub-calendar-candidate-rows select { width: 100%; padding: 0 10px; border: 1px solid var(--line); background: var(--field-bg); color: var(--ink); }
.hub-calendar-event-editor footer,
.hub-calendar-candidates article footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 13px; }
.hub-calendar-event-editor em[data-status="cancelled"] { color: var(--red); }

.hub-calendar-candidates { padding: 15px; }
.hub-calendar-candidates > header { margin-bottom: 12px; }
.hub-calendar-candidates article { padding: 14px 0; border-top: 1px solid var(--line); }
.hub-calendar-candidates article > header { display: flex; justify-content: space-between; gap: 12px; }
.hub-calendar-candidates article > header > div { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.hub-calendar-candidates article h4 { margin: 0; }
.hub-calendar-candidates article p { max-width: 90ch; color: var(--muted); font-size: 13px; white-space: pre-wrap; }
.hub-calendar-candidates article a { display: inline-flex; align-items: center; gap: 4px; color: var(--blue); font-size: 12px; }
.hub-calendar-reasons { display: flex; flex-wrap: wrap; gap: 5px; }
.hub-calendar-reasons code { padding: 3px 6px; border: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.hub-calendar-candidate-rows { display: grid; gap: 7px; margin-top: 10px; }
.hub-calendar-candidate-rows > div { display: grid; grid-template-columns: 120px minmax(110px, 1fr) 180px 180px 140px 42px; gap: 7px; }
.hub-calendar-candidate-rows button { border: 1px solid var(--line); background: transparent; color: var(--muted); }
.hub-calendar-candidates article footer select { min-width: 240px; border: 1px solid var(--line); background: var(--field-bg); color: var(--ink); }
.hub-calendar-candidates button.primary,
.hub-calendar-event-editor button.primary { border-color: var(--blue); background: var(--blue); color: white; }

.hub-calendar-cancelled { padding: 15px; }
.hub-calendar-cancelled li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--line); }
.hub-calendar-cancelled li span { display: grid; gap: 2px; }
.hub-calendar-cancelled small { color: var(--muted); font-size: 12px; }
.hub-calendar-empty { color: var(--muted); }

.hub-raffle-mint-phases > em { display: block; margin-top: 8px; color: var(--muted); font-size: 12px; }
.hub-raffle-mint-phase-row { display: grid; grid-template-columns: 110px 130px 1fr 1fr 1.2fr 42px; gap: 7px; margin-bottom: 7px; }
.hub-raffle-mint-phase-row label { display: grid; gap: 4px; }
.hub-raffle-mint-phase-row label span { color: var(--muted); font-size: 12px; }
.hub-raffle-mint-phase-row input,
.hub-raffle-mint-phase-row select { width: 100%; }

@media (max-width: 900px) {
  .hub-calendar-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hub-calendar-summary > div:nth-child(2) { border-right: 0; }
  .hub-calendar-layout { grid-template-columns: 1fr; }
  .hub-calendar-upcoming { order: -1; }
  .hub-calendar-month { overflow-x: auto; }
  .hub-calendar-weekdays,
  .hub-calendar-grid { min-width: 720px; }
  .hub-calendar-event-editor > div { grid-template-columns: 1fr 1fr; }
  .hub-calendar-candidate-rows > div,
  .hub-raffle-mint-phase-row { grid-template-columns: 1fr 1fr; }
  .hub-calendar-admin-header,
  .hub-calendar-candidates > header { align-items: stretch; flex-direction: column; }
}

@media (max-width: 560px) {
  .hub-calendar-summary { grid-template-columns: 1fr 1fr; }
  .hub-calendar-toolbar > div { width: 100%; }
  .hub-calendar-toolbar button { flex: 1; }
  .hub-calendar-toolbar select { flex: 1 1 100%; width: 100%; }
  .hub-calendar-event-editor > div,
  .hub-calendar-candidate-rows > div,
  .hub-raffle-mint-phase-row { grid-template-columns: 1fr; }
  .hub-calendar-candidates article footer,
  .hub-calendar-event-editor footer { align-items: stretch; flex-direction: column; }
  .hub-calendar-candidates article footer select { min-width: 0; width: 100%; }
}

/* Calendar timeline explorer: one editorial workspace for both surfaces. */
.hub-calendar-admin { display: grid; gap: 0; border-top: 1px solid var(--line); }
.hub-calendar-admin-header,
.calendar-public-header {
  min-height: 72px;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
  align-items: center;
  gap: 20px;
  padding: 0 4px;
  border-bottom: 1px solid var(--line);
}
.calendar-public-heading { min-width: 0; }
.calendar-public-heading h1 { margin: 0; color: var(--ink); font-size: clamp(26px, 2.4vw, 34px); line-height: 1.2; }
.hub-calendar-heading { min-width: 0; }
.hub-calendar-heading p { margin: 0 0 2px; color: var(--blue); font-size: 12px; font-weight: 800; letter-spacing: .12em; }
.hub-calendar-heading h1,
.hub-calendar-heading h3 { margin: 0; color: var(--ink); font-size: 22px; line-height: 1.2; }
.hub-calendar-heading small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }
.hub-calendar-period-controls { display: inline-flex; align-items: center; justify-content: center; gap: 10px; }
.hub-calendar-view-switch { display: inline-grid; grid-template-columns: repeat(2, minmax(58px, auto)); border: 1px solid var(--line); border-radius: 3px; }
.hub-calendar-view-switch button { min-height: 36px; padding: 0 11px; border: 0; border-right: 1px solid var(--line); border-radius: 0; background: transparent; color: var(--muted); font-size: 12px; font-weight: 760; }
.hub-calendar-view-switch button:last-child { border-right: 0; }
/* Active segment matches the raffle toolbar tabs: tinted fill, no accent band. */
.hub-calendar-view-switch button[aria-pressed="true"] { background: var(--accent-active-bg); color: var(--blue); }
.hub-calendar-month-navigation { display: inline-grid; grid-template-columns: 38px minmax(128px, auto) 38px auto; align-items: center; gap: 4px; }
.hub-calendar-month-navigation button,
.hub-calendar-header-actions button,
.hub-calendar-download,
.hub-calendar-header-actions summary,
.calendar-public-actions summary { min-height: 38px; border: 1px solid var(--line); border-radius: 3px; background: transparent; color: var(--ink); }
.hub-calendar-header-actions button { display: inline-flex; align-items: center; gap: 6px; padding: 0 12px; }
.hub-calendar-month-navigation button { display: inline-grid; place-items: center; padding: 0; }
.hub-calendar-month-navigation button svg { width: 16px; height: 16px; }
.hub-calendar-month-navigation strong { padding: 0 10px; color: var(--ink); font-size: 15px; text-align: center; white-space: nowrap; }
.hub-calendar-month-navigation .hub-calendar-today { width: auto; padding: 0 13px; color: var(--muted); font-size: 12px; font-weight: 700; }
.hub-calendar-header-actions,
.calendar-public-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.hub-calendar-download { border-color: var(--accent-border-strong); border-radius: 3px; }
.hub-calendar-toolbar { min-height: 48px; display: flex; flex-wrap: wrap; align-items: stretch; gap: 0; border-bottom: 1px solid var(--line); }
.hub-calendar-toolbar > div { display: inline-flex; margin-right: auto; align-items: stretch; }
.hub-calendar-toolbar button,
.hub-calendar-toolbar select { min-height: 47px; padding: 0 14px; border: 0; border-right: 1px solid var(--line); border-radius: 0; background: transparent; color: var(--muted); font-size: 12px; }
.hub-calendar-toolbar button { position: relative; }
.hub-calendar-toolbar button.active { border-color: var(--line); background: var(--accent-active-bg); color: var(--blue); }
.hub-calendar-toolbar select:last-child { border-right: 0; }
.hub-calendar-workspace { min-width: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); background: var(--subtle); }
.hub-calendar-month { overflow: hidden; border: 0; background: transparent; }
.hub-calendar-weekdays span { min-height: 38px; display: grid; place-items: center; padding: 0; color: var(--muted); font-size: 12px; font-weight: 700; }
.hub-calendar-grid { height: 696px; grid-template-rows: repeat(6, minmax(0, 1fr)); }
.hub-calendar-grid > div { position: relative; min-height: 0; padding: 7px 8px 5px; overflow: hidden; background: transparent; }
/* Today reads from the cell's own tinted background; the date number stays a
   plain figure with no badge. */
.hub-calendar-grid > div[data-today] { background: var(--accent-active-bg); box-shadow: none; }
.hub-calendar-grid > div[data-outside] { opacity: .38; }
.hub-calendar-grid time { min-height: 18px; margin-bottom: 1px; color: var(--muted); font-family: var(--mono); font-size: 12px; font-variant-numeric: tabular-nums; }
.hub-calendar-grid button { min-height: 34px; display: block; width: 100%; margin: 1px 0; padding: 3px 4px; overflow: visible; border: 0; border-radius: 0; background: transparent; color: var(--ink); font-size: 12px; line-height: 1.25; text-align: left; text-overflow: clip; white-space: normal; }
.hub-calendar-grid button[data-type="raffle_open"] { background: transparent; color: var(--ink); }
.hub-calendar-grid button[data-type="raffle_deadline"] { background: transparent; color: var(--ink); }
.hub-calendar-grid button[data-selected],
.hub-calendar-grid button:hover,
.hub-calendar-grid button:focus-visible { background: var(--accent-active-bg); }
.hub-calendar-project-label { min-width: 0; display: inline-flex; align-items: center; gap: 7px; color: inherit; font-size: 12px; font-weight: 700; }
.hub-calendar-project-label img { width: 15px; height: 15px; flex: 0 0 auto; object-fit: contain; }
.hub-calendar-project-label > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hub-calendar-month-event-label { width: 100%; align-items: flex-start; }
.hub-calendar-month-event-label > .hub-calendar-event-copy { min-width: 0; display: grid; gap: 1px; overflow: visible; text-overflow: clip; white-space: normal; }
.hub-calendar-event-copy > span { min-width: 0; overflow-wrap: anywhere; }
.hub-calendar-month-event-label b { color: var(--muted); font-family: var(--mono); font-size: 12px; font-weight: 700; white-space: nowrap; }
.hub-calendar-grid button[data-type="raffle_open"] .hub-calendar-month-event-label b,
.hub-calendar-week-events > button[data-type="raffle_open"] .hub-calendar-month-event-label b { color: var(--green); }
.hub-calendar-grid button[data-type="raffle_deadline"] .hub-calendar-month-event-label b,
.hub-calendar-week-events > button[data-type="raffle_deadline"] .hub-calendar-month-event-label b { color: var(--amber); }
/* Pinned inside the cell so a tall day never bleeds the counter into the next
   row; the solid chip keeps it readable over clipped event rows. It is a
   button: clicking it expands the day in week view. The grid-button variant in
   the selector outranks the generic grid button reset, so the chip border and
   radius actually render. */
.hub-calendar-more,
.hub-calendar-grid button.hub-calendar-more { position: absolute; right: 5px; bottom: 4px; display: block; width: auto; min-height: 0; margin: 0; padding: 2px 6px; border: 1px solid var(--accent-border); border-radius: 2px; background: var(--panel-strong); color: var(--muted); font-family: var(--mono); font-size: 12px; line-height: 14px; cursor: pointer; }
.hub-calendar-more:hover,
.hub-calendar-more:focus-visible,
.hub-calendar-grid button.hub-calendar-more:hover,
.hub-calendar-grid button.hub-calendar-more:focus-visible { border-color: var(--blue); color: var(--ink); background: var(--panel-strong); }
.hub-calendar-timeline h2 small { margin-left: 7px; color: var(--soft); font-size: 12px; font-weight: 700; letter-spacing: .06em; }
.hub-calendar-sync-note { margin: 0; color: var(--soft); font-size: 12px; }
.hub-calendar-grid button.hub-calendar-mobile-count { display: none; }
.hub-calendar-week { overflow: hidden; border-bottom: 1px solid var(--line); background: transparent; }
.hub-calendar-week-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.hub-calendar-week-grid > article { min-width: 0; min-height: 280px; border-right: 1px solid var(--line); background: transparent; }
.hub-calendar-week-grid > article:last-child { border-right: 0; }
.hub-calendar-week-grid > article[data-today] { background: var(--accent-active-bg); }
.hub-calendar-week-grid > article > header { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 10px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.hub-calendar-week-grid > article > header time { color: var(--ink); font-family: var(--mono); font-size: 13px; font-weight: 700; }
.hub-calendar-week-events { display: grid; align-content: start; gap: 3px; padding: 8px 7px 12px; }
.hub-calendar-week-events > button { min-width: 0; min-height: 52px; display: grid; grid-template-rows: auto auto; align-content: center; gap: 4px; width: 100%; padding: 6px 7px; overflow: visible; border: 0; border-radius: 0; background: transparent; color: var(--ink); line-height: 1.25; text-align: left; white-space: normal; }
.hub-calendar-week-events > button[data-selected],
.hub-calendar-week-events > button:hover,
.hub-calendar-week-events > button:focus-visible { background: var(--accent-active-bg); }
.hub-calendar-week-events > button > time { color: var(--muted); font-family: var(--mono); font-size: 12px; font-variant-numeric: tabular-nums; }
.hub-calendar-week-events > p { margin: 10px 5px; color: var(--muted); font-size: 12px; }
.hub-calendar-agenda { min-height: 330px; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, .9fr); border-top: 1px solid var(--line); }
.hub-calendar-timeline { min-width: 0; padding: 20px 18px 24px; }
.hub-calendar-timeline > h2 { margin: 0 0 14px; color: var(--ink); font-size: 17px; }
.hub-calendar-timeline-groups { display: grid; }
.hub-calendar-timeline-groups > section { display: grid; grid-template-columns: 148px minmax(0, 1fr); border-top: 1px solid var(--line); }
.hub-calendar-timeline-groups h3 { margin: 0; padding: 14px 16px 10px 8px; color: var(--blue); font-size: 12px; font-weight: 700; }
.hub-calendar-timeline-groups ul { position: relative; margin: 0; padding: 7px 0; border-left: 1px solid var(--line-strong); list-style: none; }
.hub-calendar-timeline-groups li { position: relative; }
.hub-calendar-timeline-groups li button { min-height: 40px; display: grid; grid-template-columns: 54px 12px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; padding: 0 12px 0 16px; border: 0; border-radius: 0; background: transparent; color: var(--ink); text-align: left; }
.hub-calendar-timeline-groups li[data-selected] button,
.hub-calendar-timeline-groups li button:hover,
.hub-calendar-timeline-groups li button:focus-visible { background: var(--accent-active-bg); }
.hub-calendar-timeline-groups li time { color: var(--muted); font-family: var(--mono); font-size: 12px; font-variant-numeric: tabular-nums; }
.hub-calendar-timeline-groups li i { width: 8px; height: 8px; position: relative; left: -21px; border: 2px solid var(--ink); border-radius: 50%; background: var(--field-bg); }
.hub-calendar-timeline-groups li > button > span:last-child { color: var(--muted); font-family: var(--mono); font-size: 12px; }
.hub-calendar-detail,
.hub-calendar-event-editor.hub-calendar-detail { min-width: 0; padding: 28px 24px; border: 0; border-left: 1px solid var(--line); background: transparent; }
.hub-calendar-detail > header,
.hub-calendar-event-editor.hub-calendar-detail > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hub-calendar-detail > header .hub-calendar-project-label { font-size: 19px; }
.hub-calendar-detail > header .hub-calendar-project-label img { width: 22px; height: 22px; }
.hub-calendar-detail > header em { padding: 4px 9px; border: 1px solid var(--accent-border); border-radius: 2px; color: var(--blue); font-family: var(--mono); font-size: 12px; font-style: normal; font-weight: 700; }
.hub-calendar-detail-time { display: block; margin: 20px 0; color: var(--ink); font-size: 16px; line-height: 1.5; }
.hub-calendar-detail-source { display: grid; gap: 8px; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.hub-calendar-detail-source > span,
.hub-calendar-detail > footer > span { color: var(--muted); font-size: 12px; }
.hub-calendar-detail-source a { min-width: 0; display: inline-flex; align-items: center; gap: 6px; overflow: hidden; color: var(--blue); font-size: 13px; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.hub-calendar-detail-source a svg { width: 13px; height: 13px; flex: 0 0 auto; }
.hub-calendar-detail > footer { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: 18px; }
.hub-calendar-detail > footer > span { width: 100%; }
.hub-calendar-detail > footer a,
.hub-calendar-detail > footer button { min-height: 28px; display: inline-flex; align-items: center; gap: 7px; padding: 0; border: 0; background: transparent; color: var(--blue); font-size: 12px; text-decoration: underline; text-underline-offset: 3px; }
.hub-calendar-event-editor > .hub-calendar-editor-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 8px; padding-top: 15px; border-top: 1px solid var(--line); }
.hub-calendar-editor-fields label { min-width: 0; display: grid; gap: 4px; }
.hub-calendar-editor-fields label:first-child,
.hub-calendar-editor-fields label:last-child { grid-column: auto; }
.hub-calendar-event-editor > .hub-calendar-editor-fields > .hub-calendar-field-project { grid-column: 1 / -1; }
.hub-calendar-event-editor > .hub-calendar-editor-fields > .hub-calendar-field-link { grid-column: 1 / -1; }
.hub-calendar-editor-fields label span { color: var(--muted); font-size: 12px; }
.hub-calendar-editor-fields input,
.hub-calendar-editor-fields select { min-width: 0; width: 100%; min-height: 38px; box-sizing: border-box; color-scheme: dark; }
.hub-calendar-event-editor.hub-calendar-detail > .hub-calendar-editor-actions { display: grid; grid-template-columns: repeat(2, 132px); justify-content: end; gap: 8px; margin-top: 14px; }
.hub-calendar-event-editor.hub-calendar-detail > .hub-calendar-editor-actions button { width: 100%; min-height: 38px; display: inline-grid; place-items: center; padding: 0 14px; border: 1px solid var(--line); border-radius: 3px; background: transparent; color: var(--ink); font-size: 12px; font-weight: 700; text-decoration: none; }
.hub-calendar-event-editor.hub-calendar-detail > .hub-calendar-editor-actions .hub-calendar-cancel-action { border-color: var(--red-line); color: var(--red); }
.hub-calendar-event-editor.hub-calendar-detail > .hub-calendar-editor-actions .primary { border-color: var(--blue); background: var(--blue); color: #fff; }
.hub-calendar-event-editor.hub-calendar-detail > .hub-calendar-editor-actions button:disabled { cursor: not-allowed; opacity: .55; }
.calendar-public-main { width: min(100%, 1360px); margin: 0 auto; padding: 0 0 70px; }
.calendar-public-header { margin-bottom: 22px; padding: 28px clamp(12px, 2vw, 26px) 18px; }
.hub-calendar-header-actions details,
.calendar-public-actions details { position: relative; }
.hub-calendar-header-actions summary,
.calendar-public-actions summary { min-height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 0 12px; cursor: pointer; font-size: 12px; font-weight: 700; list-style: none; }
.hub-calendar-header-actions summary::-webkit-details-marker,
.calendar-public-actions summary::-webkit-details-marker { display: none; }
.hub-calendar-header-actions summary svg,
.calendar-public-actions summary svg { width: 15px; height: 15px; }
.hub-calendar-subscribe-menu > summary { border-color: var(--accent-border-strong); color: var(--blue); }
.hub-calendar-header-actions details > div,
.calendar-public-actions details > div { min-width: 210px; position: absolute; z-index: 40; top: calc(100% + 6px); right: 0; display: grid; padding: 7px; border: 1px solid var(--line); background: var(--field-bg); }
.hub-calendar-header-actions details > div a,
.hub-calendar-header-actions details > div button,
.hub-calendar-header-actions details > div select,
.calendar-public-actions details > div a,
.calendar-public-actions details > div button,
.calendar-public-actions details > div select { min-height: 38px; width: 100%; padding: 0 10px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; color: var(--ink); font-size: 12px; text-align: left; text-decoration: none; }
.hub-calendar-header-actions details > div a,
.hub-calendar-header-actions details > div button,
.calendar-public-actions details > div a,
.calendar-public-actions details > div button { display: flex; align-items: center; gap: 9px; }
.hub-calendar-subscribe-icon { width: 17px; height: 17px; flex: 0 0 auto; object-fit: contain; }
.hub-calendar-header-actions details > div button svg,
.calendar-public-actions details > div button svg { width: 16px; height: 16px; flex: 0 0 auto; }
.hub-calendar-header-actions details > div > :last-child,
.calendar-public-actions details > div > :last-child { border-bottom: 0; }
.calendar-public-workspace { border-top: 1px solid var(--line); }
.hub-calendar-candidates,
.hub-calendar-cancelled { border: 0; border-bottom: 1px solid var(--line); background: transparent; }

@media (max-width: 1100px) {
  .hub-calendar-admin-header,
  .calendar-public-header { grid-template-columns: minmax(180px, 1fr) auto; margin-bottom: 16px; padding: 22px 4px 14px; }
  .hub-calendar-period-controls { justify-self: end; }
  .hub-calendar-header-actions,
  .calendar-public-actions { grid-column: 1 / -1; justify-content: flex-end; }
}

@media (max-width: 760px) {
  .calendar-public-main { width: 100%; padding-top: 0; }
  .hub-calendar-admin-header,
  .calendar-public-header { min-height: 0; grid-template-columns: 1fr; gap: 12px; margin-bottom: 12px; padding: 20px 14px 16px; }
  .hub-calendar-heading small { max-width: 42ch; }
  .hub-calendar-period-controls { width: 100%; display: grid; grid-template-columns: 1fr; justify-self: stretch; gap: 8px; }
  .hub-calendar-view-switch { width: 100%; grid-template-columns: 1fr 1fr; }
  .hub-calendar-month-navigation { width: 100%; grid-template-columns: 38px minmax(0, 1fr) 38px auto; justify-self: stretch; }
  .hub-calendar-header-actions,
  .calendar-public-actions { grid-column: auto; justify-content: stretch; }
  .hub-calendar-header-actions > *,
  .calendar-public-actions > * { flex: 1; }
  .hub-calendar-header-actions summary,
  .calendar-public-actions summary { width: 100%; justify-content: center; }
  .hub-calendar-toolbar { padding: 0 8px; overflow-x: auto; overflow-y: hidden; flex-wrap: nowrap; scrollbar-width: none; }
  .hub-calendar-toolbar::-webkit-scrollbar { display: none; }
  .hub-calendar-toolbar > div { width: auto; flex: 0 0 auto; }
  .hub-calendar-toolbar select { flex: 0 0 auto; width: auto; }
  .hub-calendar-month { overflow: hidden; }
  .hub-calendar-weekdays,
  .hub-calendar-grid { min-width: 0; }
  .hub-calendar-grid { height: 372px; grid-template-rows: repeat(6, minmax(0, 1fr)); }
  .hub-calendar-weekdays span { min-height: 32px; font-size: 12px; }
  .hub-calendar-grid > div { min-height: 0; padding: 5px 3px; }
  .hub-calendar-grid time { margin-left: 2px; font-size: 12px; }
  .hub-calendar-grid button,
  .hub-calendar-grid .hub-calendar-more { display: none; }
  .hub-calendar-grid button.hub-calendar-mobile-count { width: 28px; min-height: 24px; height: 24px; display: grid; place-items: center; margin: 2px 0 0 2px; padding: 0; border: 1px solid var(--accent-border); border-radius: 2px; background: var(--accent-active-bg); color: var(--blue); font-family: var(--mono); font-size: 12px; font-weight: 700; text-align: center; }
  .hub-calendar-grid button.hub-calendar-mobile-count[data-selected],
  .hub-calendar-grid button.hub-calendar-mobile-count:hover,
  .hub-calendar-grid button.hub-calendar-mobile-count:focus-visible { border-color: var(--blue); background: rgb(8 127 245 / 24%); }
  .hub-calendar-project-label { gap: 4px; font-size: 12px; }
  .hub-calendar-project-label img { width: 12px; height: 12px; }
  .hub-calendar-week-grid { grid-template-columns: 1fr; }
  .hub-calendar-week-grid > article { min-height: 0; display: grid; grid-template-columns: 92px minmax(0, 1fr); border-right: 0; border-bottom: 1px solid var(--line); }
  .hub-calendar-week-grid > article:last-child { border-bottom: 0; }
  .hub-calendar-week-grid > article > header { min-height: 100%; align-content: center; flex-direction: column; justify-content: center; padding: 12px 8px; border-right: 1px solid var(--line); border-bottom: 0; text-align: center; }
  .hub-calendar-week-events { min-height: 68px; padding: 7px 8px; }
  .hub-calendar-week-events > button { min-height: 46px; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: none; align-items: center; }
  .hub-calendar-week-events > button > time { justify-self: end; }
  .hub-calendar-agenda { grid-template-columns: 1fr; }
  .hub-calendar-timeline { padding: 18px 14px; }
  .hub-calendar-timeline-groups > section { grid-template-columns: 112px minmax(0, 1fr); }
  .hub-calendar-timeline-groups h3 { padding-left: 2px; font-size: 12px; }
  .hub-calendar-timeline-groups li button { grid-template-columns: 44px 8px minmax(0, 1fr) auto; gap: 7px; padding-right: 5px; padding-left: 11px; }
  .hub-calendar-timeline-groups li i { left: -16px; }
  .hub-calendar-detail,
  .hub-calendar-event-editor.hub-calendar-detail { border-top: 1px solid var(--line); border-left: 0; padding: 22px 16px 30px; }
  .hub-calendar-event-editor > .hub-calendar-editor-fields { grid-template-columns: 1fr; }
  .hub-calendar-editor-fields label,
  .hub-calendar-editor-fields label:first-child,
  .hub-calendar-editor-fields label:last-child,
  .hub-calendar-event-editor > .hub-calendar-editor-fields > .hub-calendar-field-project { grid-column: auto; }
  .hub-calendar-event-editor.hub-calendar-detail > .hub-calendar-editor-actions { width: 100%; grid-template-columns: 1fr 1fr; }
}

@media (max-width: 430px) {
  .hub-calendar-heading h1,
  .hub-calendar-heading h3 { font-size: 20px; }
  .hub-calendar-grid > div { min-height: 0; }
  .hub-calendar-timeline-groups > section { grid-template-columns: 1fr; }
  .hub-calendar-timeline-groups h3 { padding: 12px 0 5px; }
  .hub-calendar-timeline-groups ul { margin-left: 4px; }
}

.raffle-public-card-copy {
  min-width: 0;
  padding: 12px 14px 14px;
}

.raffle-public-card-heading {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 6px;
}

.raffle-public-chain-mark {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  display: grid;
  place-items: center;
  margin-top: 1px;
}

.raffle-public-chain-mark > img {
  width: 16px;
  height: 16px;
  display: block;
  object-fit: contain;
}

.raffle-public-card h2 {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  margin: 0 0 4px;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.35;
  letter-spacing: -0.025em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.raffle-public-card h2 a {
  color: var(--ink);
  text-decoration: none;
}

.raffle-public-reward-row {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.raffle-public-reward-label {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.raffle-public-prize-allocation {
  min-width: 0;
  max-width: 55%;
  flex: 0 1 auto;
  overflow: hidden;
  color: var(--blue);
  font-family: var(--mono);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.raffle-public-reward-row.is-allocation-only .raffle-public-prize-allocation {
  max-width: 100%;
}

.raffle-public-card dl {
  display: grid;
  /* One equal column per stat, so the ticket total slots into the same
     row instead of wrapping the winners tile underneath. */
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  margin: 10px -14px -14px;
  border-top: 1px solid var(--line);
  background: rgb(128 145 170 / 4%);
}

.raffle-public-card dl > div {
  min-width: 0;
  min-height: 48px;
  display: grid;
  align-content: center;
  gap: 2px;
  padding: 0 8px;
}

.raffle-public-card dl > div + div {
  border-left: 1px solid var(--line);
}

.raffle-public-card dt {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 4px;
  overflow: hidden;
  color: var(--soft);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.raffle-public-card dt svg {
  flex: none;
  width: 13px;
  height: 13px;
}

.raffle-public-card dd {
  overflow: hidden;
  margin: 0;
  color: var(--ink);
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.raffle-public-card-action {
  justify-content: space-between;
  gap: 12px;
  margin-top: 15px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.raffle-public-loading,
.raffle-public-state {
  min-height: 300px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card-lg);
  color: var(--soft);
  text-align: center;
}

.raffle-public-loading i {
  width: 28px;
  height: 28px;
  border: 2px solid var(--line-strong);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: hub-spin 0.8s linear infinite;
}

.raffle-public-state > svg {
  width: 30px;
  height: 30px;
  color: var(--blue);
}

.raffle-public-state strong {
  color: var(--ink);
  font-size: 17px;
}

.raffle-public-state p {
  max-width: 520px;
  margin: 0;
  color: var(--soft);
  font-size: 12px;
  line-height: 1.6;
}

.raffle-public-state button {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}

.raffle-public-state button svg {
  width: 15px;
}

.raffle-public-detail-page {
  padding-top: 26px;
}

.raffle-public-back {
  gap: 8px;
  min-height: 38px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
}

.raffle-public-back:hover {
  color: var(--ink);
}

.raffle-public-back svg {
  width: 16px;
  height: 16px;
}

.raffle-public-detail-hero {
  /* A wide banner with the title riding on it: the cover fills the frame,
     the scrim keeps the overlaid copy readable on any artwork. */
  position: relative;
  overflow: hidden;
  margin-top: 12px;
  min-height: clamp(180px, 24vw, 280px);
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--subtle);
  box-shadow: 0 24px 80px rgb(0 0 0 / 14%);
}

.raffle-public-detail-hero > .raffle-public-hero-cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.raffle-public-detail-hero > .raffle-public-cover-fallback {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.raffle-public-detail-hero > .raffle-public-cover-fallback img {
  width: clamp(120px, 16vw, 190px);
  opacity: 0.5;
}

.raffle-public-hero-scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgb(5 10 22 / 34%) 0%, rgb(5 10 22 / 4%) 38%, rgb(5 10 22 / 76%) 100%);
}

.raffle-public-detail-hero > .raffle-public-detail-eyebrow {
  position: absolute;
  top: 16px;
  left: 18px;
  color: #dbe6f8;
}

.raffle-public-hero-stats {
  position: absolute;
  top: 16px;
  right: 18px;
}

.raffle-public-hero-stats span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid rgb(244 248 255 / 26%);
  border-radius: 999px;
  background: rgb(5 10 22 / 55%);
  padding: 5px 12px;
  color: #f4f8ff;
  font-size: 12px;
  font-weight: 750;
}

.raffle-public-hero-stats svg {
  width: 14px;
  height: 14px;
  color: #ffd76a;
}

.raffle-public-hero-copy {
  position: absolute;
  right: 18px;
  bottom: 14px;
  left: 18px;
}

.raffle-public-hero-copy h1 {
  margin: 0;
  color: #f4f8ff;
  font-size: clamp(24px, 2.6vw, 34px);
  line-height: 1.05;
  letter-spacing: -0.04em;
  text-shadow: 0 2px 18px rgb(0 0 0 / 45%);
}

.raffle-public-hero-copy p {
  margin: 6px 0 0;
  color: #c3d2ea;
  font-size: 13px;
  text-shadow: 0 1px 10px rgb(0 0 0 / 45%);
}

.raffle-public-detail-eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--soft);
  font-family: var(--mono);
  font-size: 12px;
  text-transform: uppercase;
}

.raffle-public-detail-eyebrow .raffle-public-status {
  position: static;
}

.raffle-public-detail-copy h1 {
  margin: 16px 0 10px;
  color: var(--ink);
  font-size: clamp(26px, 2.6vw, 36px);
  line-height: 1.02;
  letter-spacing: -0.045em;
}

.raffle-public-detail-copy .raffle-public-host {
  margin: 0;
  color: var(--soft);
  font-size: 12px;
}

.raffle-public-detail-copy .raffle-public-host a {
  gap: 5px;
  color: var(--ink);
  font-weight: 750;
  text-decoration: none;
}

.raffle-public-prize {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin-top: 28px;
  border: 1px solid var(--accent-border);
  border-radius: 12px;
  background: var(--accent-hover-bg);
  padding: 14px;
}

.raffle-public-prize > svg {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: var(--accent-active-bg);
  color: var(--blue);
  padding: 10px;
}

.raffle-public-prize > span {
  display: grid;
  gap: 3px;
}

.raffle-public-prize small {
  color: var(--soft);
  font-size: 12px;
  text-transform: uppercase;
}

.raffle-public-prize strong {
  font-size: 14px;
}

.raffle-public-detail-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: auto 0 0;
  padding: 28px 0 18px;
}

.raffle-public-detail-stats > div {
  min-width: 0;
}

.raffle-public-detail-stats > div + div {
  border-left: 1px solid var(--line);
  padding-left: 14px;
}

.raffle-public-detail-stats dt {
  color: var(--soft);
  font-size: 12px;
}

.raffle-public-detail-stats dd {
  margin: 7px 0 0;
  overflow: hidden;
  color: var(--ink);
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.raffle-public-enter {
  min-height: 50px;
  justify-content: center;
  gap: 9px;
  border: 1px solid #248ee8;
  border-radius: 11px;
  background: var(--accent-primary);
  box-shadow: 0 12px 28px rgb(8 127 245 / 24%);
  color: #fff;
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
}

.raffle-public-enter svg {
  width: 17px;
  height: 17px;
}

.raffle-public-enter.disabled {
  border-color: var(--line-strong);
  background: var(--panel);
  box-shadow: none;
  color: var(--soft);
}

.raffle-public-entry-note {
  margin-top: 9px;
  color: var(--soft);
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}

.raffle-public-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  align-items: start;
  gap: 22px;
  margin-top: 22px;
}

.raffle-public-detail-primary,
.raffle-public-detail-aside {
  display: grid;
  gap: 22px;
  align-content: start;
}

.raffle-public-countdown-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 16px 18px 18px;
  text-align: center;
}

.raffle-public-countdown-grid strong {
  display: block;
  color: var(--ink);
  font-size: 26px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}

.raffle-public-countdown-grid div:last-child strong {
  color: var(--blue);
}

.raffle-public-countdown-grid span {
  display: block;
  margin-top: 2px;
  color: var(--soft);
  font-size: 12px;
}

.raffle-public-countdown-closed {
  margin: 0;
  padding: 16px 18px 18px;
  color: var(--soft);
  font-size: 13px;
}

.raffle-public-facts dl {
  margin: 0;
  padding: 8px 18px 14px;
}

.raffle-public-facts dl > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  padding: 9px 0;
}

.raffle-public-facts dl > div:last-child {
  border-bottom: 0;
}

.raffle-public-facts dt {
  color: var(--soft);
  font-size: 12px;
  white-space: nowrap;
}

.raffle-public-facts dd {
  margin: 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 750;
  text-align: right;
  overflow-wrap: anywhere;
}

.raffle-public-links > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px 18px 18px;
}

.raffle-public-links a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 7px 12px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
}

.raffle-public-links a svg {
  width: 13px;
  height: 13px;
}

.raffle-public-join > .raffle-web-entry {
  padding: 16px 18px 18px;
}

.raffle-entry-inline {
  display: grid;
  gap: 12px;
}

.raffle-entry-inline-wallets h3 {
  margin: 0 0 8px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 750;
}

.raffle-web-entry-subscribe {
  display: grid;
  gap: 10px;
}

.raffle-web-entry-subscribe > a {
  justify-content: center;
}

.raffle-web-entry-subscribe > div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.raffle-web-entry-subscribe > div button {
  flex-shrink: 0;
  min-height: 32px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: transparent;
  padding: 0 12px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
}

.raffle-web-entry-subscribe > div span {
  color: var(--soft);
  font-size: 12px;
  line-height: 1.5;
}

.raffle-entry-wallet-select {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel);
  padding: 0 12px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 650;
}

.raffle-entry-wallet-select:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.raffle-entry-inline-submit {
  width: 100%;
  justify-content: center;
}

.raffle-public-section,
.raffle-public-eligibility,
.raffle-public-schedule {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: var(--subtle);
}

.raffle-public-section > header,
.raffle-public-eligibility > header,
.raffle-public-schedule > header {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--line);
  padding: 0 18px;
}

.raffle-public-section > header > span {
  color: var(--blue);
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 850;
}

.raffle-public-section h2,
.raffle-public-eligibility h2,
.raffle-public-schedule h2 {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
}

.raffle-public-section > p {
  margin: 0;
  padding: 24px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.8;
  white-space: pre-line;
}

.raffle-public-awaiting {
  display: flex;
  align-items: center;
  gap: 10px;
}

.raffle-public-awaiting > svg {
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
  border-radius: 12px;
  background: var(--accent-active-bg);
  color: var(--blue);
  padding: 12px;
}

.raffle-public-awaiting h2 {
  margin: 0;
  color: var(--soft);
  font-size: 13px;
  font-weight: 600;
}

.raffle-public-awaiting p {
  margin: 7px 0 0;
  color: var(--soft);
  font-size: 12px;
  line-height: 1.6;
}

.raffle-public-eligibility > header svg,
.raffle-public-schedule > header svg {
  width: 17px;
  height: 17px;
  color: var(--blue);
}

.raffle-public-eligibility ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.raffle-public-eligibility li {
  min-height: 68px;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding: 0 16px;
}

.raffle-public-eligibility li:first-child {
  border-top: 0;
}

.raffle-public-eligibility li > svg {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: rgb(0 214 107 / 11%);
  color: var(--green);
  padding: 6px;
}

.raffle-public-eligibility li span {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.raffle-public-eligibility li strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.raffle-public-eligibility li small {
  color: var(--soft);
  font-size: 12px;
}

.raffle-public-schedule dl {
  margin: 0;
}

.raffle-public-schedule dl > div {
  min-height: 64px;
  display: grid;
  align-content: center;
  gap: 5px;
  border-top: 1px solid var(--line);
  padding: 0 16px;
}

.raffle-public-schedule dl > div:first-child {
  border-top: 0;
}

.raffle-public-schedule dt {
  color: var(--soft);
  font-size: 12px;
}

.raffle-public-schedule dd {
  margin: 0;
  color: var(--ink);
  font-family: var(--mono);
  font-size: 12px;
}

.raffle-public-results > header em {
  margin-left: auto;
  border: 1px solid rgb(0 214 107 / 30%);
  border-radius: 999px;
  color: var(--green);
  padding: 5px 9px;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.raffle-public-results > header em[data-verified="false"] {
  border-color: rgb(255 173 61 / 35%);
  color: #ffc66f;
}

.raffle-public-result-group {
  padding: 20px;
}

.raffle-public-result-group + .raffle-public-result-group {
  border-top: 1px solid var(--line);
}

.raffle-public-result-group h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: var(--ink);
  font-size: 12px;
}

.raffle-public-result-group h3 svg {
  width: 16px;
  height: 16px;
  color: var(--blue);
}

.raffle-public-result-group h3 span {
  margin-left: auto;
  color: var(--soft);
  font-family: var(--mono);
  font-size: 12px;
}

.raffle-public-result-group ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.raffle-public-result-group li {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--panel);
  padding: 0 12px;
}

.raffle-public-result-group li span {
  color: var(--blue);
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 850;
}

.raffle-public-result-group li strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-family: var(--mono);
  font-size: 12px;
  text-overflow: ellipsis;
}

.raffle-public-result-rerolled {
  margin-left: auto;
  flex: none;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 2px 8px;
  color: var(--soft);
  font-size: 12px;
  font-style: normal;
  white-space: nowrap;
}

.raffle-public-verification {
  border-top: 1px solid var(--line);
  background: var(--accent-hover-bg);
  padding: 20px;
}

.raffle-public-verification > div {
  display: flex;
  align-items: center;
  gap: 11px;
}

.raffle-public-verification > div > svg {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  background: var(--accent-active-bg);
  color: var(--blue);
  padding: 9px;
}

.raffle-public-verification > div span {
  display: grid;
  gap: 3px;
}

.raffle-public-verification > div strong {
  font-size: 12px;
}

.raffle-public-verification > div small {
  color: var(--soft);
  font-size: 12px;
}

.raffle-public-verification dl {
  display: grid;
  gap: 8px;
  margin: 16px 0 0;
}

.raffle-public-verification dl > div {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
}

.raffle-public-verification dt {
  color: var(--soft);
  font-size: 12px;
}

.raffle-public-verification dd {
  min-width: 0;
  margin: 0;
}

.raffle-public-verification code {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* raffle:v2 administrator fields */
.hub-raffle-editor-fields label.span-2 {
  grid-column: span 2;
}

.hub-raffle-editor-fields label.span-3 {
  grid-column: span 3;
}

.hub-raffle-cover-preview {
  grid-column: 1 / -1;
  min-height: 112px;
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 8px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-cover-preview img {
  width: 160px;
  height: 90px;
  border-radius: 4px;
  object-fit: cover;
}

.hub-raffle-audience-field {
  min-width: 0;
  margin: 0;
  border: 0;
  padding: 0;
}

.hub-raffle-audience-field legend {
  margin-bottom: 7px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-audience-field > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.hub-raffle-audience-field label {
  min-height: 78px;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  /* The editor's generic label rule pins grid content to the top; these cards
     are taller than their copy, so without this the text hugs the top edge. */
  align-content: center;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--panel);
  padding: 0 14px;
  cursor: pointer;
}

.hub-raffle-audience-field label.selected {
  border-color: var(--blue);
  background: rgb(8 127 245 / 8%);
  box-shadow: 0 0 0 1px rgb(8 127 245 / 16%);
}

.hub-raffle-audience-field input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

.hub-raffle-audience-field label > svg {
  width: 19px;
  height: 19px;
  color: var(--blue);
}

.hub-raffle-audience-field label > span {
  display: grid;
  gap: 4px;
}

.hub-raffle-audience-field label strong {
  color: var(--ink);
  font-size: 12px;
}

.hub-raffle-audience-field label small {
  color: var(--soft);
  font-size: 12px;
  line-height: 1.45;
}

.hub-raffle-group-preflight {
  min-height: 66px;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  border: 1px solid rgb(255 173 61 / 34%);
  border-radius: 6px;
  background: rgb(255 173 61 / 7%);
  padding: 10px 13px;
}

.hub-raffle-group-preflight > svg {
  width: 20px;
  height: 20px;
  color: #ffc66f;
}

.hub-raffle-group-preflight > span {
  display: grid;
  gap: 3px;
}

.hub-raffle-group-preflight strong {
  color: var(--ink);
  font-size: 12px;
}

.hub-raffle-group-preflight small {
  color: var(--soft);
  font-size: 12px;
  line-height: 1.45;
}

.hub-raffle-settings-cover {
  width: 100%;
  aspect-ratio: 16 / 7;
  border-radius: 5px;
  object-fit: cover;
}

.hub-raffle-link-management > a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  overflow-wrap: anywhere;
  color: var(--blue);
  font-size: 12px;
  text-decoration: none;
}

.hub-raffle-settings-lock {
  min-width: 0;
  display: grid;
  gap: 2px;
  margin-right: auto;
  text-align: left;
}

.hub-raffle-settings-lock strong {
  color: var(--ink);
  font-size: 12px;
}

.hub-raffle-settings-lock small {
  max-width: 520px;
  color: var(--soft);
  font-size: 12px;
  line-height: 1.45;
}

.hub-raffle-link-management > a svg {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
}

html[data-theme="light"] .raffle-public-header {
  background: rgb(247 249 252 / 90%);
}

html[data-theme="light"] .raffle-public-card,
html[data-theme="light"] .raffle-public-detail-hero,
html[data-theme="light"] .raffle-public-section,
html[data-theme="light"] .raffle-public-eligibility,
html[data-theme="light"] .raffle-public-schedule {
  background: #fff;
  box-shadow: 0 18px 54px rgb(15 40 80 / 8%);
}

html[data-theme="light"] .raffle-public-enter.disabled,
html[data-theme="light"] .raffle-public-result-group li {
  background: #f7f9fc;
}

html[data-theme="light"] .hub-raffle-audience-field label {
  background: #f8fafc;
}

@media (max-width: 1080px) {
  .raffle-public-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 340px));
  }

  .raffle-public-detail-hero {
    grid-template-columns: minmax(0, 0.8fr) minmax(340px, 1.2fr);
  }

  .raffle-public-detail-cover {
    min-height: 240px;
  }

  .raffle-public-detail-layout {
    grid-template-columns: minmax(0, 1fr) 290px;
  }

  .hub-raffle-editor-fields label.span-2,
  .hub-raffle-editor-fields label.span-3 {
    grid-column: span 3;
  }
}

@media (max-width: 760px) {
  .raffle-public-shell {
    padding-top: 64px;
  }

  .raffle-public-header {
    display: none;
  }

  .raffle-public-main {
    padding-right: 14px;
    padding-left: 14px;
  }

  .raffle-public-intro {
    min-height: 0;
    align-items: stretch;
    flex-direction: column;
    gap: 24px;
    padding: 46px 0 28px;
  }

  .raffle-public-toolbar {
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 10px;
    padding: 14px 0 18px;
  }

  .raffle-public-toolbar > div[role="tablist"],
  .raffle-public-toolbar-controls {
    width: 100%;
    box-sizing: border-box;
  }

  .raffle-public-toolbar button {
    flex: 1;
    min-height: 44px;
    justify-content: center;
  }

  .raffle-public-toolbar-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  .raffle-public-search {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
    min-height: 44px;
  }

  .raffle-public-search input {
    font-size: 16px;
  }

  .raffle-public-sort,
  .raffle-public-unentered {
    min-height: 44px;
  }

  .raffle-public-sort {
    width: 100%;
    max-width: none;
  }

  .raffle-public-catalogue-summary {
    flex-wrap: wrap;
  }

  .raffle-public-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 340px));
    gap: 16px;
  }

  .raffle-public-campaign-group {
    width: min(340px, 100%);
    grid-column: span 1;
  }

  .raffle-public-campaign-group > div {
    grid-template-columns: 1fr;
  }

  .raffle-public-card h2,
  .raffle-public-reward-row {
    min-height: 0;
  }

  .raffle-public-detail-page {
    padding-top: 14px;
  }

  .raffle-public-detail-hero {
    grid-template-columns: 1fr;
    border-radius: 16px;
  }

  .raffle-public-detail-cover {
    min-height: 0;
    aspect-ratio: 16 / 7;
  }

  .raffle-public-detail-copy {
    padding: 24px 18px;
  }

  .raffle-public-detail-copy h1 {
    margin-top: 20px;
  }

  .raffle-public-detail-stats {
    margin-top: 12px;
  }

  .raffle-public-detail-layout {
    grid-template-columns: 1fr;
  }

  .raffle-public-detail-aside {
    grid-row: 1;
  }

  .raffle-public-result-group ol {
    grid-template-columns: 1fr;
  }

  .raffle-public-verification dl > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .hub-raffle-editor-fields label.span-2,
  .hub-raffle-editor-fields label.span-3 {
    grid-column: auto;
  }

  .hub-raffle-audience-field > div {
    grid-template-columns: 1fr;
  }

  .hub-raffle-cover-preview {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .raffle-public-grid,
  .raffle-public-grid:has(> .raffle-public-card:nth-child(4)) {
    grid-template-columns: 1fr;
  }

  .raffle-public-card {
    max-width: none;
  }
}

@media (max-width: 430px) {
  .raffle-public-brand > span {
    display: none;
  }

  .raffle-public-intro h1 {
    font-size: 38px;
  }

  .raffle-public-detail-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 0;
  }

  .raffle-public-detail-stats > div:nth-child(3) {
    grid-column: 1 / -1;
    border-top: 1px solid var(--line);
    border-left: 0;
    padding-top: 14px;
    padding-left: 0;
  }

  .raffle-public-card-copy {
    padding: 12px 14px 14px;
  }
}

@media (pointer: coarse) {
  .raffle-public-header nav a,
  .raffle-public-back,
  .raffle-public-card-action,
  .raffle-public-toolbar button,
  .raffle-public-search,
  .raffle-public-sort,
  .raffle-public-unentered,
  .hub-raffle-audience-field label {
    min-height: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .raffle-public-card {
    transition: none;
  }

  .raffle-public-card[data-campaign-audience="og"],
  .raffle-public-og-sparkles i {
    animation: none;
  }

  .raffle-public-loading i {
    animation: none;
  }

  .raffle-public-search-notice.is-searching::before,
  .raffle-public-participation-notice.is-loading::before {
    animation: none;
  }
}

.raffle-public-verify-guide {
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.raffle-public-verify-guide > summary {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  list-style: none;
  color: var(--soft);
  font-size: 12px;
  font-weight: 700;
}

.raffle-public-verify-guide > summary::-webkit-details-marker {
  display: none;
}

.raffle-public-verify-guide > summary svg {
  width: 14px;
  height: 14px;
}

.raffle-public-verify-guide[open] > summary svg:last-child {
  transform: rotate(180deg);
}

.raffle-public-verify-guide ol {
  margin: 12px 0 0;
  padding-left: 20px;
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.raffle-public-verify-guide p {
  margin: 10px 0 0;
  color: var(--soft);
  font-size: 12px;
  line-height: 1.6;
}

.raffle-public-verify-guide code {
  overflow-wrap: anywhere;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: var(--subtle);
  padding: 1px 5px;
  font-size: 12px;
}

.hub-raffle-collect-field {
  display: grid;
  gap: 6px;
}

.hub-raffle-collect-field > span { color: var(--soft); font-size: 12px; }
.hub-raffle-collect-field > div { display: flex; align-items: center; gap: 16px; }

/* The editor's generic input sizing (42px shells) must not inflate these
   checkboxes, and the generic label grid must not stack them vertically. */
.hub-raffle-collect-field .hub-raffle-inline-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 0;
}

.hub-raffle-collect-field .hub-raffle-inline-check input {
  min-height: 0;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
  accent-color: var(--blue);
}

.hub-raffle-collect-field .hub-raffle-inline-check small { color: var(--ink); font-size: 13px; }
.hub-raffle-collect-field > em { color: var(--soft); font-size: 12px; font-style: normal; opacity: 0.8; }

.hub-raffle-winner-info {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-winner-info small { font-size: 12px; white-space: nowrap; }

.hub-raffle-winner-info-copy {
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  padding: 2px 8px;
  color: var(--soft);
  font-size: 12px;
  cursor: pointer;
}

.raffle-winner-info form.raffle-winner-info-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.raffle-winner-info-form label { display: grid; gap: 6px; font-size: 13px; }
.raffle-winner-info-form label span { color: var(--soft); font-size: 12px; }

.raffle-winner-info-form input {
  min-height: 40px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--field-bg);
  padding: 0 12px;
  color: var(--ink);
  font-size: 14px;
}

.raffle-winner-info-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 12px;
}

.raffle-winner-info-actions button,
.raffle-winner-info-login {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  border: 0;
  border-radius: 8px;
  background: var(--blue);
  padding: 0 18px;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.raffle-winner-info-login { margin-top: 12px; }
.raffle-winner-info-login svg, .raffle-winner-info-actions svg { width: 16px; height: 16px; }
.raffle-winner-info-saved { display: inline-flex; align-items: center; gap: 6px; color: var(--green, #2fbf71); font-size: 13px; }
.raffle-winner-info-saved svg { width: 14px; height: 14px; }
.raffle-winner-info-error { margin-top: 10px; color: var(--red, #e5484d); font-size: 13px; }

.raffle-web-entry { display: grid; gap: 10px; }

.raffle-web-entry-button { cursor: pointer; border: 0; }
.raffle-web-entry-button:disabled { opacity: 0.6; cursor: default; }

.raffle-public-enter.entered {
  background: rgb(31 191 113 / 14%);
  color: var(--green, #2fbf71);
  border: 1px solid rgb(31 191 113 / 35%);
}

.raffle-web-entry-bot {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--soft);
  font-size: 12px;
  text-decoration: none;
}

.raffle-web-entry-bot:hover { color: var(--ink); }
.raffle-web-entry-bot svg { width: 13px; height: 13px; }

.raffle-web-entry-wallet { display: grid; gap: 8px; color: var(--soft); font-size: 13px; }
.raffle-web-entry-wallet-current { display: inline-flex; align-items: center; gap: 6px; color: var(--green, #2fbf71); }

.raffle-web-entry-hint { color: var(--muted); font-size: 12px; }

.raffle-web-entry-manage { display: inline-flex; align-items: center; gap: 8px; }
.raffle-web-entry-manage button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 600;
}
.raffle-web-entry-manage button:hover { border-color: var(--control-border); color: var(--ink); }
.raffle-web-entry-manage button.is-danger:hover { border-color: color-mix(in srgb, var(--red) 55%, var(--line-strong)); color: var(--red); }
.raffle-web-entry-manage button svg { width: 12px; height: 12px; }

.raffle-leave-modal { max-width: 420px; }
.raffle-leave-modal > div > p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.raffle-leave-confirm { border-color: color-mix(in srgb, var(--red) 55%, var(--line-strong)) !important; color: var(--red) !important; }
.raffle-web-entry-wallet-current svg { width: 14px; height: 14px; }
.raffle-web-entry-wallet-choices { display: flex; flex-wrap: wrap; gap: 8px; }

.raffle-web-entry-wallet-choices button {
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--field-bg);
  padding: 8px 12px;
  color: var(--ink);
  font-size: 12px;
  cursor: pointer;
}

.raffle-web-entry-wallet-choices button:hover { border-color: var(--blue); }
.raffle-web-entry-error { color: var(--red, #e5484d); font-size: 13px; }

.raffle-public-task-check {
  flex: none;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--green, #2fbf71);
}

.raffle-public-task-check svg { width: 13px; height: 13px; }
.raffle-public-task-done .raffle-public-task-check { border-color: rgb(31 191 113 / 45%); background: rgb(31 191 113 / 12%); }
.raffle-public-task-done strong { opacity: 0.75; }

.raffle-public-task-mark {
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: transparent;
  padding: 6px 10px;
  color: var(--soft);
  font-size: 12px;
  cursor: pointer;
}

.raffle-public-task-mark:disabled { color: var(--green, #2fbf71); border-color: rgb(31 191 113 / 40%); cursor: default; }

.raffle-entry-modal { width: min(560px, 100%); }
.raffle-entry-modal-body { display: grid; gap: 22px; padding: 20px; }
.raffle-entry-modal-body section { display: grid; gap: 10px; }
.raffle-entry-modal-body h3 { color: var(--ink); font-size: 14px; font-weight: 800; }
.raffle-entry-modal-hint { color: var(--soft); font-size: 12px; line-height: 1.6; }
.raffle-entry-modal-hint a { color: var(--blue); }

.raffle-entry-modal-tasks {
  display: grid;
  gap: 8px;
  counter-reset: raffle-task;
  list-style: none;
  margin: 0;
  padding: 0;
}

.raffle-entry-modal-tasks li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--subtle);
  padding: 10px 12px;
}

.raffle-entry-modal-tasks li > span:nth-child(2) { min-width: 0; display: grid; gap: 2px; }
.raffle-entry-modal-tasks strong { color: var(--ink); font-size: 13px; }
.raffle-entry-modal-tasks small { color: var(--soft); font-size: 12px; }

.raffle-entry-modal-tasks a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  border: 1px solid var(--accent-border);
  border-radius: 6px;
  padding: 0 10px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
}

.raffle-entry-modal-tasks a svg { width: 13px; height: 13px; }

.raffle-entry-modal-wallets { display: grid; gap: 8px; }

.raffle-entry-modal-wallets button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--field-bg);
  padding: 12px 14px;
  color: var(--ink);
  font-size: 13px;
  cursor: pointer;
}

.raffle-entry-modal-wallets button.is-selected { border-color: var(--blue); background: var(--accent-active-bg); }
.raffle-entry-modal-wallets code { color: var(--soft); font-size: 12px; }

.raffle-entry-modal-entered {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--green, #2fbf71);
  font-size: 13px;
}

.raffle-entry-modal-entered svg { width: 14px; height: 14px; }

.raffle-entry-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding: 16px 20px;
}

.raffle-entry-modal-footer button {
  min-height: 42px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: transparent;
  padding: 0 18px;
  color: var(--soft);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.raffle-entry-modal-footer .raffle-entry-modal-submit {
  border-color: transparent;
  background: var(--blue);
  color: #fff;
}

.raffle-entry-modal-footer button:disabled { opacity: 0.55; cursor: default; }

/* Unified search: one box over posts, early projects, and raffles. */
.hub-search-modal { width: min(640px, calc(100vw - 32px)); padding: 0; overflow: hidden; }
.hub-search-modal-input {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}
.hub-search-modal-input > svg { width: 18px; height: 18px; color: var(--soft); flex: none; }
.hub-search-modal-input input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-size: 15px;
  outline: none;
}
.hub-search-modal-input button {
  flex: none;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 8px;
}
.hub-search-modal-input button svg { width: 14px; height: 14px; }
.hub-search-modal-body { max-height: min(480px, 62vh); overflow-y: auto; padding: 10px 10px 14px; }
.hub-search-modal-body section + section { margin-top: 12px; }
.hub-search-modal-body h3 {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 6px 6px 4px;
  color: var(--soft);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.hub-search-modal-body h3 svg { width: 13px; height: 13px; }
.hub-search-modal-body ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.hub-search-modal-body li button {
  width: 100%;
  display: grid;
  gap: 3px;
  text-align: left;
  padding: 9px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
}
.hub-search-modal-body li button:hover,
.hub-search-modal-body li button:focus-visible { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.hub-search-modal-body li strong { color: var(--ink); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hub-search-modal-body li small { color: var(--soft); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hub-search-empty, .hub-search-hint { margin: 18px 8px 12px; color: var(--soft); font-size: 13px; text-align: center; }
.hub-mobile-search {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid var(--line);
  color: var(--ink);
  font-size: 13px;
}
.hub-mobile-search svg { width: 15px; height: 15px; }
.hub-search-flash { animation: hubSearchFlash 2.4s ease-out; }
@keyframes hubSearchFlash {
  0% { box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 85%, transparent); }
  100% { box-shadow: 0 0 0 2px transparent; }
}

/* Telegram login member stats above the wallet directory. */
.hub-member-stats { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; margin-bottom: 14px; }
.hub-member-stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; }
.hub-member-stats-grid > div { display: grid; gap: 4px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; }
.hub-member-stats-grid small { color: var(--soft); font-size: 12px; }
.hub-member-stats-grid strong { color: var(--ink); font-size: 18px; font-variant-numeric: tabular-nums; }
.hub-member-stats-recent { display: grid; gap: 6px; }
.hub-member-stats-recent > small { color: var(--soft); font-size: 12px; font-weight: 600; }
.hub-member-stats-recent ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.hub-member-stats-recent li { display: flex; align-items: baseline; gap: 8px; font-size: 13px; }
.hub-member-stats-recent li strong { color: var(--ink); }
.hub-member-stats-recent li span { color: var(--soft); font-size: 12px; }
.hub-member-stats-recent li time { margin-left: auto; color: var(--soft); font-size: 12px; white-space: nowrap; }
.hub-member-stats-note { margin: 0; color: var(--soft); font-size: 12px; }

/* Member profile page — flat privy-style rows: soft filled groups, icon
   tiles, label left / value right, one inline editor at a time. */
.hub-profile-main { width: min(680px, calc(100vw - 32px)); margin: 0; padding: 0 0 70px; display: grid; gap: 14px; }
.hub-profile-state { color: var(--soft); font-size: 13px; }
.hub-privy-label { margin: 10px 2px 0; color: var(--soft); font-size: 13px; }
.hub-privy-group { display: grid; border-radius: 16px; overflow: hidden; background: color-mix(in srgb, var(--ink) 5%, transparent); }
.hub-privy-row { display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 10px 16px; }
.hub-privy-row + .hub-privy-row, .hub-privy-editor + .hub-privy-row { border-top: 1px solid color-mix(in srgb, var(--ink) 7%, transparent); }
.hub-privy-tile { flex: none; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: var(--field-bg); border: 1px solid var(--line); color: var(--ink); overflow: hidden; }
.hub-privy-tile svg { width: 16px; height: 16px; }
.hub-privy-tile img { width: 100%; height: 100%; object-fit: cover; }
.hub-privy-tile.is-brand { font-size: 12px; font-weight: 800; letter-spacing: 0.02em; }
.hub-privy-tile.is-discord { background: #5865f2; border-color: #5865f2; color: #fff; }
.hub-privy-tile.is-x { background: #000; border-color: #333; color: #fff; }
.hub-privy-tile.is-chain-evm { background: #627eea; border-color: #627eea; color: #fff; }
.hub-privy-tile.is-chain-sol { background: linear-gradient(135deg, #9945ff, #14f195); border-color: transparent; color: #fff; }
.hub-privy-tile.is-chain-btc { background: #f7931a; border-color: #f7931a; color: #fff; }
.hub-privy-tile.is-discord svg, .hub-privy-tile.is-x svg { width: 17px; height: 17px; }
.hub-privy-tile[class*="is-chain-"] svg { width: 18px; height: 18px; }
.hub-privy-name { color: var(--ink); font-size: 14px; display: flex; align-items: center; gap: 6px; }
.hub-privy-name em { font-style: normal; font-size: 12px; color: var(--accent); }
.hub-privy-name .hub-profile-verification { display: inline-flex; align-items: center; gap: 3px; padding: 2px 6px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1.2; }
.hub-profile-verification svg { width: 11px; height: 11px; }
.hub-profile-verification.is-verified { color: var(--green); background: color-mix(in srgb, var(--green) 13%, transparent); }
.hub-profile-verification.is-unverified { color: #d88a12; background: color-mix(in srgb, #d88a12 14%, transparent); }
.hub-privy-value { margin-left: auto; text-align: right; display: grid; gap: 1px; }
.hub-privy-value strong { color: var(--ink); font-size: 14px; font-weight: 600; }
.hub-privy-value small, .hub-privy-value code { color: var(--soft); font-size: 12px; }
.hub-privy-value.is-empty { color: var(--soft); font-size: 13px; }
.hub-privy-value.is-positive strong { color: var(--green); }
.hub-privy-actions { flex: none; display: inline-flex; gap: 2px; margin-left: 6px; }
.hub-privy-actions button { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; border: 0; background: transparent; color: var(--soft); }
.hub-privy-actions button:hover { color: var(--ink); background: color-mix(in srgb, var(--ink) 8%, transparent); }
.hub-privy-actions button svg { width: 14px; height: 14px; }
.hub-privy-actions .hub-profile-discord-button { width: auto; min-width: 0; min-height: 32px; display: inline-flex; gap: 6px; padding: 0 10px; border: 1px solid var(--line); border-radius: 999px; font-size: 12px; font-weight: 600; }
.hub-privy-actions .hub-profile-discord-button.is-connect { color: #7784ff; border-color: color-mix(in srgb, #5865f2 48%, var(--line)); background: color-mix(in srgb, #5865f2 10%, transparent); }
.hub-privy-actions .hub-profile-discord-button.is-danger { color: var(--soft); }
.hub-privy-actions .hub-profile-discord-button:disabled { cursor: wait; opacity: 0.58; }
.hub-privy-editor { display: grid; gap: 8px; padding: 12px 16px 14px; border-top: 1px solid color-mix(in srgb, var(--ink) 7%, transparent); }
.hub-privy-editor input { min-height: 40px; }
.hub-privy-editor > div { display: flex; justify-content: flex-end; gap: 8px; }
.hub-privy-editor button { min-height: 36px; padding: 0 14px; border-radius: 10px; }
.hub-privy-editor button.is-primary { border: 1px solid color-mix(in srgb, var(--accent) 55%, var(--line)); color: var(--accent); font-weight: 600; }
.hub-privy-add { margin: 4px 10px 10px; justify-self: start; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 0; background: transparent; color: var(--accent); font-size: 13px; font-weight: 600; }
.hub-privy-footnote { margin: 0; padding: 0 16px 12px; color: var(--soft); font-size: 12px; }
.hub-privy-pill { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 18px; border-radius: 999px; border: 1px solid var(--line); color: var(--ink); font-size: 14px; font-weight: 600; background: transparent; }
.hub-privy-pill svg { width: 15px; height: 15px; }
.hub-privy-pill.is-primary { margin-left: auto; border-color: color-mix(in srgb, var(--accent) 55%, var(--line)); color: var(--accent); }
.hub-profile-logout { justify-self: start; margin-top: 8px; }
.hub-profile-login .hub-privy-row { min-height: 66px; }
@media (max-width: 560px) {
  .hub-profile-discord-row { flex-wrap: wrap; }
  .hub-profile-discord-row .hub-privy-value { min-width: calc(100% - 46px); order: 3; margin-left: 46px; text-align: left; }
  .hub-profile-discord-row .hub-profile-discord-actions { margin-left: auto; }
}
.hub-sidebar-profile-link {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
  padding: 5px 8px;
  margin: -5px -8px;
  border-radius: 10px;
  transition: background-color var(--dur-press) var(--ease-out), color var(--dur-press) var(--ease-out);
}
.hub-sidebar-profile-link:hover,
.hub-sidebar-profile-link:focus-visible {
  background: color-mix(in srgb, var(--accent) 14%, transparent);
}
.hub-sidebar-profile-link:hover strong,
.hub-sidebar-profile-link:focus-visible strong {
  color: var(--accent);
}
}

/* Early-call activity pulse: silence turns into a dormant warning. */
.hub-bookmark-activity { color: var(--soft); font-size: 12px; white-space: nowrap; }
.hub-bookmark-activity.is-dormant {
  color: var(--red);
  font-weight: 600;
  padding: 1px 8px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--red) 40%, var(--line));
}

/* The hub column already opens with its own gap above the title block. */
.hub-main .page-heading,
.hub-panel > .page-heading {
  padding-top: 0;
}

/* ── Admin console: OG & tiers ─────────────────────────────────────── */

.hub-admin-og {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.hub-admin-og > .hub-raffle-admin-head {
  padding: 0;
  border: 0;
}

.hub-admin-og-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
}

.hub-admin-og .hub-admin-card {
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 20px;
}

.hub-admin-og .hub-admin-card h4 {
  margin: 0;
  font-size: 15px;
  letter-spacing: -0.01em;
  color: var(--ink);
}

.hub-admin-og .hub-admin-card > p {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--soft);
}

.hub-admin-og-tiers ol {
  list-style: none;
  margin: 2px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.hub-admin-og-tiers li {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--canvas);
}

/* One gradient ribbon, fading as the tier drops. */
.hub-admin-og-tiers li::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--brand-gradient);
}

.hub-admin-og-tiers li[data-tier="2"]::before { opacity: 0.5; }
.hub-admin-og-tiers li[data-tier="3"]::before { opacity: 0.22; }

.hub-admin-og-tiers li strong {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.hub-admin-og-tiers li b {
  flex: none;
  font-family: var(--mono);
  font-size: 17px;
  font-weight: 700;
  color: var(--ink);
}

.hub-admin-og-tiers li[data-tier="1"] b {
  background: var(--brand-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hub-admin-og-switch {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin-top: 2px;
  padding: 13px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--canvas);
  cursor: pointer;
}

.hub-admin-og-switch input {
  flex: none;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  accent-color: var(--brand-indigo);
  cursor: pointer;
}

.hub-admin-og-switch span {
  display: grid;
  gap: 3px;
}

.hub-admin-og-switch strong {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

.hub-admin-og-switch small {
  font-size: 12px;
  line-height: 1.5;
  color: var(--soft);
}

.hub-admin-og-chat button {
  justify-self: start;
  padding: 9px 16px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--canvas);
  color: var(--ink);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

.hub-admin-og-chat button:hover:not(:disabled) {
  border-color: var(--brand-indigo);
}

.hub-admin-og-chat button:disabled {
  opacity: 0.6;
  cursor: default;
}

.hub-admin-og-chat em {
  font-style: normal;
  font-size: 13px;
  line-height: 1.5;
  color: var(--soft);
}

.hub-admin-og-chat em[data-state="ok"] {
  color: var(--green);
}

.hub-admin-og .hub-raffle-og-panel {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--subtle);
}

.hub-admin-og .hub-raffle-og-panel summary {
  cursor: pointer;
  padding: 16px 20px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}

.hub-admin-og .hub-raffle-og-panel p {
  margin: 0;
  padding: 0 20px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--soft);
}

.hub-admin-og .hub-raffle-og-panel textarea {
  display: block;
  width: calc(100% - 40px);
  min-height: 230px;
  margin: 12px 20px 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--mono);
  font-size: 13px;
  line-height: 1.7;
  resize: vertical;
}

.hub-admin-og .hub-raffle-og-panel textarea:focus-visible {
  outline: none;
  border-color: var(--brand-indigo);
}

.hub-admin-og .hub-raffle-og-panel > button {
  margin: 12px 20px 20px;
  padding: 10px 20px;
  border: 0;
  border-radius: 7px;
  background: var(--brand-gradient);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.hub-admin-og .hub-raffle-og-panel > button:hover:not(:disabled) {
  box-shadow: var(--glow);
}

.hub-admin-og .hub-raffle-og-panel > button:disabled {
  opacity: 0.6;
  cursor: default;
}

@media (max-width: 900px) {
  .hub-admin-og-grid {
    grid-template-columns: 1fr;
  }
}

/* The tier strip between how-to-enter and the join card: three chips, the
   signed-in member's own chip lit, and their entry count on the right. */
.raffle-public-ticket-tiers {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.raffle-public-ticket-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--subtle);
}

.raffle-public-ticket-chip em {
  font-style: normal;
  font-size: 13px;
  color: var(--soft);
}

.raffle-public-ticket-chip b {
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}

.raffle-public-ticket-chip[data-mine] {
  border-color: var(--brand-indigo);
  background: var(--canvas);
}

.raffle-public-ticket-chip[data-mine] em {
  color: var(--ink);
  font-weight: 600;
}

.raffle-public-ticket-chip[data-mine] b {
  background: var(--brand-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.raffle-public-ticket-mine {
  margin-left: auto;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}

@media (max-width: 560px) {
  .raffle-public-ticket-mine {
    margin-left: 0;
    width: 100%;
  }
}

/* Each entrant's ticket count in the admin participant and winner lists. */
/* The comment link an entrant joined with; a borrowed link (author differs
   from the known handle) tints red so review can spot it without opening. */
.hub-raffle-entry-proof {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--soft);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2px 7px;
  text-decoration: none;
}

.hub-raffle-entry-proof svg {
  width: 12px;
  height: 12px;
}

.hub-raffle-entry-proof:hover {
  color: var(--ink);
  border-color: color-mix(in srgb, var(--ink) 40%, transparent);
}

.hub-raffle-entry-proof[data-mismatch] {
  color: var(--red);
  border-color: color-mix(in srgb, var(--red) 45%, transparent);
}

.hub-raffle-entry-tickets {
  flex: none;
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2px 7px;
  background: var(--canvas);
}

/* Administrator-only team wallet directory. Full addresses stay visible and
   the row order is the deterministic allocation priority for team spots. */
.hub-team-wallets-manager {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.hub-team-wallets-manager > .hub-raffle-admin-head {
  padding: 0;
  border: 0;
}

.hub-team-wallets-order-note {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border-left: 2px solid var(--blue);
  background: color-mix(in srgb, var(--blue) 5%, transparent);
  padding: 10px 12px;
}

.hub-team-wallets-order-note svg { width: 16px; height: 16px; color: var(--blue); }
.hub-team-wallets-order-note p { margin: 0; color: var(--soft); font-size: 12px; line-height: 1.5; }
.hub-team-wallets-order-note strong { color: var(--ink); font-family: var(--mono); }

.hub-team-wallets-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
}

.hub-team-wallets-table {
  width: 100%;
  min-width: 1260px;
  border-collapse: collapse;
  table-layout: fixed;
}

.hub-team-wallets-table th,
.hub-team-wallets-table td {
  border-bottom: 1px solid var(--line);
  padding: 8px;
  text-align: left;
  vertical-align: middle;
}

.hub-team-wallets-table th {
  background: var(--panel);
  color: var(--soft);
  font-size: 12px;
  font-weight: 700;
}

.hub-team-wallets-table th:first-child,
.hub-team-wallets-table td:first-child { width: 42px; text-align: center; }
.hub-team-wallets-table th:nth-child(2) { width: 130px; }
.hub-team-wallets-table th:nth-child(3) { width: 170px; }
.hub-team-wallets-table th:nth-child(4) { width: 130px; }
.hub-team-wallets-table th:nth-child(5) { width: 330px; }
.hub-team-wallets-table th:nth-child(6) { width: 350px; }
.hub-team-wallets-table th:nth-child(7) { width: 360px; }
.hub-team-wallets-table th:last-child { width: 118px; }

.hub-team-wallets-table input {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line-strong);
  background: var(--canvas);
  color: var(--ink);
  padding: 7px 9px;
  font-size: 12px;
}

.hub-team-wallets-table input:focus {
  outline: 0;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.hub-team-wallet-actions { display: flex; gap: 5px; }
.hub-team-wallet-actions button {
  width: 36px;
  min-height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--soft);
  padding: 0;
}
.hub-team-wallet-actions button:hover:not(:disabled) { border-color: var(--blue); color: var(--ink); }
.hub-team-wallet-actions button:disabled { opacity: 0.35; }
.hub-team-wallet-actions svg { width: 16px; height: 16px; }

.hub-team-wallets-empty { margin: 0; color: var(--soft); font-size: 13px; }

/* Collab request queue: the team-wallet table idiom with per-row status. */
.hub-whitelist-admin { display: grid; gap: 12px; }
.hub-whitelist-admin > .hub-raffle-admin-head { padding: 0; border: 0; }
.hub-whitelist-admin-project { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 10px; align-items: center; }
.hub-whitelist-admin-project > span:last-child { min-width: 0; }
.hub-whitelist-admin-thumb {
  width: 44px;
  height: 44px;
  display: block;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: var(--field-bg);
  overflow: hidden;
}
.hub-whitelist-admin-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
.hub-whitelist-admin-table-wrap { overflow-x: auto; border: 1px solid var(--line); }
.hub-whitelist-admin-table { width: 100%; min-width: 1100px; border-collapse: collapse; table-layout: fixed; }
.hub-whitelist-admin-table th,
.hub-whitelist-admin-table td { border-bottom: 1px solid var(--line); padding: 8px; text-align: left; vertical-align: middle; }
.hub-whitelist-admin-table th { background: var(--panel); color: var(--soft); font-size: 12px; font-weight: 700; }
.hub-whitelist-admin-table th:nth-child(1) { width: 360px; }
.hub-whitelist-admin-table th:nth-child(2) { width: 70px; }
.hub-whitelist-admin-table th:nth-child(3) { width: 130px; }
.hub-whitelist-admin-table th:nth-child(5) { width: 170px; }
.hub-whitelist-admin-table th:last-child { width: 150px; }
.hub-whitelist-admin-table td { font-size: 12px; color: var(--muted); }
.hub-whitelist-admin-table td strong a { color: var(--ink); font-size: 13px; text-decoration: none; }
.hub-whitelist-admin-table td strong a:hover { color: var(--blue); }
.hub-whitelist-admin-table td small { display: block; color: var(--soft); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hub-whitelist-admin-table td em { display: block; color: var(--muted); font-size: 12px; font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hub-whitelist-admin-votes { color: var(--ink); font-family: var(--mono); font-size: 14px; }
.hub-whitelist-admin-table input,
.hub-whitelist-admin-table select {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line-strong);
  background: var(--canvas);
  color: var(--ink);
  padding: 7px 9px;
  font-size: 12px;
}
.hub-whitelist-admin-table input:focus,
.hub-whitelist-admin-table select:focus { outline: 0; border-color: var(--blue); box-shadow: 0 0 0 3px var(--focus-ring); }
.hub-whitelist-admin-actions { display: flex; gap: 5px; }
.hub-whitelist-admin-actions button {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--soft);
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
}
.hub-whitelist-admin-actions button.primary { border-color: var(--accent-primary-line); background: var(--accent-primary); color: #fff; }
.hub-whitelist-admin-actions button:hover:not(:disabled) { border-color: var(--blue); color: var(--ink); }
.hub-whitelist-admin-actions button.primary:hover:not(:disabled) { color: #fff; }
.hub-whitelist-admin-actions button:disabled { opacity: 0.35; }
.hub-whitelist-admin-actions svg { width: 16px; height: 16px; }
.hub-whitelist-admin-empty { margin: 0; color: var(--soft); font-size: 13px; }
.hub-team-wallets-manager > footer { display: flex; justify-content: space-between; gap: 10px; }
.hub-team-wallets-manager > footer button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line-strong);
  background: var(--panel);
  color: var(--ink);
  padding: 0 13px;
  font-size: 12px;
  font-weight: 700;
}
.hub-team-wallets-manager > footer button.primary { border-color: var(--blue); background: var(--blue); color: #fff; }
.hub-team-wallets-manager > footer svg { width: 15px; height: 15px; }

@media (max-width: 760px) {
  .hub-team-wallets-manager { padding: 14px 12px; }
  .hub-team-wallets-manager > footer { display: grid; grid-template-columns: 1fr; }
  .hub-team-wallets-manager > footer button { justify-content: center; min-height: 44px; }
}

/* Structural skeletons: ghost blocks that mirror the real card geometry while
   a feed loads. The pulse runs once, then the blocks sit still; the arriving
   content crossfades in over the same spot. */
.hub-skel-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px 14px;
  border-bottom: 1px dashed var(--line);
  padding: 16px 2px 18px;
}

.hub-skel-raffle {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card-lg);
  background: var(--subtle);
  padding: 14px;
}

.hub-skel-card i,
.hub-skel-raffle i {
  display: block;
  border-radius: var(--radius-control);
  background: var(--subtle-strong);
  animation: hub-skel-pulse 1.2s var(--ease-out) 1;
}

.hub-skel-card i.hub-skel-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
}

.hub-skel-lines {
  display: grid;
  gap: 8px;
  align-content: center;
}

.hub-skel-line {
  height: 12px;
}

.hub-skel-line.short {
  width: 56%;
}

.hub-skel-raffle i.hub-skel-cover {
  aspect-ratio: 2 / 1;
  border-radius: 10px;
}

@keyframes hub-skel-pulse {
  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: 0.55;
  }
}

/* Loaded content replaces a skeleton with a short crossfade instead of a hard
   swap. Mount-time only; filter re-renders inside the container do not replay. */
.hub-content-reveal {
  animation: hub-content-reveal 400ms var(--ease-out);
}

@keyframes hub-content-reveal {
  from {
    opacity: 0;
    filter: blur(2px);
  }
}

/* Reduced motion, completed for the hub sheet: the member-gate spinner and the
   search flash were the last unguarded loops; dialog/popover entries, the
   skeleton pulse, and the content crossfade register here as they are added. */
@media (prefers-reduced-motion: reduce) {
  .hub-member-gate-actions .is-spinning,
  .hub-search-flash,
  .hub-modal,
  .hub-alert-popover,
  .hub-skel-card i,
  .hub-skel-raffle i,
  .hub-content-reveal {
    animation: none;
  }
}

/* Press feedback: a 1px settle on the active state of member-facing buttons.
   A state offset, not an animation — it stays under reduced motion. */
.hub-card-actions button:active:not(:disabled),
.hub-card-actions a:active,
.hub-add-button:active:not(:disabled),
.hub-empty button:active:not(:disabled),
.hub-tabs button:active:not(:disabled),
.hub-filter-tabs button:active:not(:disabled),
.hub-zone-tabs button:active:not(:disabled),
.raffle-public-toolbar button:active:not(:disabled),
.raffle-public-enter:active:not(:disabled),
.raffle-public-more:active:not(:disabled) {
  transform: translateY(1px);
}

/* Light theme for the calendar and raffle covers. The calendar region is now
   token-driven, so most of it flips on its own; only the deliberately dark
   leftovers need light values here. Raffle status capsules stay theme-invariant
   on purpose — they overlay cover imagery, not the page. */
html[data-theme="light"] .hub-calendar-create-modal > .hub-calendar-editor-fields input,
html[data-theme="light"] .hub-calendar-create-modal > .hub-calendar-editor-fields select,
html[data-theme="light"] .hub-calendar-event-editor input,
html[data-theme="light"] .hub-calendar-event-editor select,
html[data-theme="light"] .hub-calendar-candidate-rows input,
html[data-theme="light"] .hub-calendar-candidate-rows select,
html[data-theme="light"] .hub-calendar-candidates article footer select,
html[data-theme="light"] .hub-calendar-header-actions details > div,
html[data-theme="light"] .calendar-public-actions details > div {
  background: #ffffff;
  color: var(--ink);
  color-scheme: light;
}

html[data-theme="light"] .hub-calendar-more,
html[data-theme="light"] .hub-calendar-more:hover,
html[data-theme="light"] .hub-calendar-more:focus-visible,
html[data-theme="light"] .hub-calendar-timeline-groups li i {
  background: var(--subtle-strong);
}

html[data-theme="light"] .raffle-public-card-cover,
html[data-theme="light"] .raffle-public-detail-cover {
  background: var(--subtle-strong);
}

html[data-theme="light"] .raffle-public-cover-fallback {
  background:
    radial-gradient(circle at 72% 18%, rgb(15 150 255 / 18%), transparent 34%),
    linear-gradient(140deg, #dbe7f6, #b9cfec);
}

/* Per-action progress: the running button spins its own icon while the rest
   of the panel stays legible. */
.hub-spin {
  animation: hub-spin 0.9s linear infinite;
}

@keyframes hub-spin {
  to { transform: rotate(360deg); }
}

.hub-stats-detail summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 12px;
}

.hub-stats-detail code {
  display: block;
  margin-top: 6px;
  white-space: pre-wrap;
  word-break: break-all;
  color: var(--soft);
  font-size: 12px;
}

@media (prefers-reduced-motion: reduce) {
  .hub-spin {
    animation: none;
  }
}

html[data-theme="light"] .hub-toast button:hover,
html[data-theme="light"] .hub-toast button:focus-visible {
  background: rgb(0 0 0 / 6%);
}

.hub-toast-close svg {
  color: currentColor;
}

/* Section heads: OG and team wallets get the same card header the raffle
   manager uses, so every section opens with kicker + title + actions. */
.hub-admin-og,
.hub-team-wallets-manager {
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
}

.hub-admin-og > .hub-raffle-admin-head,
.hub-team-wallets-manager > .hub-raffle-admin-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: -18px -18px 0;
  border-bottom: 1px solid var(--line);
  padding: 18px;
}

.hub-raffle-admin-head p,
.hub-raffle-admin-head h3 {
  margin: 0;
}

.hub-raffle-admin-head p {
  margin-bottom: 4px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.hub-raffle-admin-head h3 {
  color: var(--ink);
  font-size: 17px;
}

.hub-raffle-admin-head > div > span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.hub-raffle-admin-head button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--ink);
  padding: 0 14px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.hub-raffle-admin-head button:hover:not(:disabled),
.hub-raffle-admin-head button:focus-visible {
  border-color: var(--blue);
  color: var(--blue);
}

.hub-raffle-admin-head button svg {
  width: 15px;
  height: 15px;
}

/* Campaign rows stack two status pills; both must fit or truncate cleanly. */
.hub-raffle-table-row > span:nth-child(2) {
  display: grid;
  gap: 4px;
  justify-items: start;
}

.hub-raffle-table-row em {
  width: auto;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* The raffle editor reads as four numbered steps instead of one 3,400px
   sheet; the submit bar stays in view so the operator never hunts for it. */
.hub-raffle-editor-step {
  margin-top: 16px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
}

.hub-raffle-editor-step > header {
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  padding: 12px 16px;
}

.hub-raffle-editor-step > header b {
  flex: none;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--accent-active-bg);
  color: var(--blue);
  font-size: 12px;
  font-weight: 800;
}

.hub-raffle-editor-step > header strong {
  display: block;
  color: var(--ink);
  font-size: 13px;
}

.hub-raffle-editor-step > header small {
  display: block;
  margin-top: 2px;
  color: var(--soft);
  font-size: 12px;
}

.hub-raffle-editor-step > .hub-raffle-editor-fields {
  padding: 16px;
}

.hub-raffle-editor-step > .hub-raffle-policy-grid {
  margin: 0;
  border-top: 1px solid var(--line);
  padding: 16px;
}

.hub-raffle-editor > footer {
  position: sticky;
  bottom: 0;
  z-index: 2;
  justify-content: space-between;
  margin: 16px -18px -18px;
  border-top: 1px solid var(--line);
  background: var(--panel);
  padding: 12px 18px;
}

.hub-raffle-editor > footer > div {
  display: flex;
  gap: 10px;
}

.hub-raffle-editor > footer .hub-raffle-editor-submit-reason {
  margin: 0;
  text-align: left;
}

.hub-raffle-campaign-total {
  display: flex;
  align-items: center;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--subtle);
  color: var(--ink);
  padding: 0 11px;
  font-size: 13px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 760px) {
  .hub-raffle-editor > footer {
    margin: 16px -14px -14px;
    padding: 10px 14px;
  }

  .hub-raffle-editor > footer > div {
    display: grid;
    gap: 8px;
  }

  .hub-raffle-policy-grid > div {
    grid-template-columns: 1fr;
  }
}

/* Review queue: candidate metadata in words, invalid phase rows marked in
   place, and a visible hierarchy between the destructive prune, the read-only
   preview and the writing import. */
.hub-calendar-reasons span {
  padding: 3px 7px;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--muted);
  font-size: 12px;
}

.hub-calendar-review-status {
  align-self: start;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  color: var(--soft);
  padding: 4px 7px;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.hub-calendar-review-status[data-status="cancel_pending"] {
  border-color: color-mix(in srgb, var(--red) 55%, var(--line-strong));
  color: var(--red);
}

.hub-calendar-review-status[data-status="update_pending"] {
  border-color: color-mix(in srgb, var(--amber) 55%, var(--line-strong));
  color: var(--amber);
}

.hub-calendar-candidate-rows [data-required-missing] {
  border-color: var(--red);
}

.hub-calendar-row-error {
  margin: 8px 0 0;
  color: var(--red);
  font-size: 12px;
}

.hub-calendar-candidates > header button.hub-calendar-danger-action {
  border-color: color-mix(in srgb, var(--red) 58%, var(--line));
  color: var(--red);
}

.hub-calendar-candidates > header button.primary {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
}

.hub-calendar-sync-note button {
  margin-left: 8px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--blue);
  padding: 3px 8px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.hub-calendar-event-editor input:disabled,
.hub-calendar-event-editor select:disabled {
  color: var(--muted);
  cursor: default;
}

/* Overview queues load with three placeholder rows instead of a "working"
   sentence; the pulse runs once and then rests. */
.hub-admin-work-skeleton > div {
  display: grid;
  grid-template-columns: 92px minmax(210px, 1fr) minmax(150px, 0.7fr);
  gap: 12px;
  min-height: 58px;
  align-items: center;
  border-top: 1px solid var(--line);
  padding: 0 16px;
}

.hub-admin-work-skeleton i {
  display: block;
  height: 12px;
  border-radius: 4px;
  background: var(--subtle-strong);
  animation: hub-skel-pulse 1.1s var(--ease-out) 1;
}

@media (max-width: 760px) {
  .hub-admin-work-skeleton > div {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 12px 16px;
  }
}

/* Phase E: touch and small-screen fit for the console. Inputs sit at 16px so
   iOS does not zoom, targets reach 44px, the overview rows keep their labels,
   and the mobile calendar leads with the agenda instead of a 7-column grid. */
.hub-raffle-editor-fields label > small,
.hub-calendar-candidates article header small {
  font-size: 12px;
}

@media (max-width: 760px) {
  .hub-raffle-editor input,
  .hub-raffle-editor textarea,
  .hub-team-wallets-table input,
  .hub-taxonomy-group input,
  .hub-taxonomy-group select,
  .hub-calendar-editor-fields input,
  .hub-calendar-editor-fields select,
  .hub-calendar-candidate-rows input,
  .hub-calendar-candidate-rows select,
  .hub-raffle-og-panel textarea {
    min-height: 44px;
    font-size: 16px;
  }

  .hub-taxonomy-group button,
  .hub-calendar-event-editor.hub-calendar-detail > .hub-calendar-editor-actions button,
  .hub-calendar-candidates article footer button,
  .hub-calendar-candidates > header button,
  .hub-raffle-og-panel button,
  .hub-raffle-seat-expansion button,
  .hub-raffle-dm-status button {
    min-height: 44px;
  }

  .hub-admin-work-row {
    grid-template-columns: 92px minmax(0, 1fr) auto;
  }

  .hub-admin-work-row > span[data-label] {
    grid-column: 1 / -1;
  }

  .hub-admin-work-row > span[data-label]::before {
    content: attr(data-label) " · ";
    color: var(--soft);
  }

  .hub-admin-work-row button {
    white-space: nowrap;
  }

  .hub-calendar-workspace {
    display: flex;
    flex-direction: column;
  }

  .hub-calendar-workspace > .hub-calendar-agenda {
    order: -1;
    border-top: 0;
    border-bottom: 1px solid var(--line);
  }
}

/* Phase F: consistency polish. One tab idiom (tinted segment) for the member
   filters, KPI tiles on the same radius ladder, taxonomy names next to their
   handle, delete demoted to a text action, the daily calendar action as the
   primary one, and the audit tab reading as a timeline. */
.hub-member-wallet-manager > header + .hub-member-stats {
  margin: 14px 14px 0;
  border-radius: 6px;
}

.hub-member-stats-grid > div {
  border-radius: 6px;
}

.hub-member-directory-tools > div[role="group"] {
  gap: 0;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  overflow: hidden;
}

.hub-member-directory-tools > div[role="group"] button {
  min-height: 40px;
  border: 0;
  border-right: 1px solid var(--line-strong);
  border-radius: 0;
  padding: 0 14px;
  font-weight: 700;
}

.hub-member-directory-tools > div[role="group"] button:last-child {
  border-right: 0;
}

.hub-member-directory-tools > div[role="group"] button.active {
  background: var(--accent-active-bg);
  color: var(--blue);
}

.hub-member-empty {
  display: grid;
  justify-items: start;
  gap: 6px;
}

.hub-member-empty strong {
  color: var(--ink);
  font-size: 13px;
}

.hub-member-empty span {
  color: var(--soft);
  font-size: 12px;
}

.hub-member-empty button {
  min-height: 36px;
  margin-top: 4px;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--ink);
  padding: 0 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.hub-taxonomy-row > span {
  flex: 1 1 auto;
}

.hub-taxonomy-group li {
  background: var(--panel);
}

.hub-raffle-settings-detail > footer .hub-raffle-delete {
  border-color: transparent;
  color: var(--muted);
}

.hub-raffle-settings-detail > footer .hub-raffle-delete:hover,
.hub-raffle-settings-detail > footer .hub-raffle-delete:focus-visible {
  border-color: color-mix(in srgb, var(--red) 58%, var(--line));
  color: var(--red);
}

.hub-calendar-header-actions button.primary {
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
}

.hub-calendar-subscribe-menu > summary {
  border-color: var(--line);
  color: var(--ink);
}

.hub-raffle-settings-detail > dl > div {
  grid-template-columns: minmax(150px, 0.7fr) minmax(0, 1fr);
}

.hub-raffle-settings-detail dt {
  line-height: 1.45;
}

.hub-admin-priority small {
  color: var(--soft);
  font-size: 12px;
}

.hub-admin-console > .hub-admin-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 16px;
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
  background: var(--panel);
  padding: 14px 18px;
}

.hub-admin-console > .hub-admin-section-head + .hub-admin-card {
  margin-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.hub-admin-console-health[data-state="warn"] i {
  background: var(--amber);
}

.hub-admin-console-health[data-state="warn"] strong,
.hub-admin-connection[data-state="warn"] strong {
  color: var(--amber);
}

.hub-admin-console-health[data-state="checking"] strong {
  color: var(--soft);
}

.hub-raffle-audit li {
  grid-template-columns: 210px minmax(0, 1fr) auto;
}

.hub-raffle-audit small {
  color: var(--soft);
  font-family: var(--mono);
  font-size: 12px;
}

.hub-stats-chart figcaption small {
  margin-left: 8px;
  color: var(--soft);
  font-size: 12px;
}

/* ====================================================================
   Admin console skin: Toss-grade type, density and surfaces on the
   existing navy palette. Every color is still a token; what changes is
   scale (14px body, 20px section titles, 26px figures), radius (16/12),
   filled fields and buttons instead of outlines, soft status pills, and
   one level of card nesting.
   ==================================================================== */
.hub-admin-console,
.hub-confirm-modal,
.hub-toast-layer {
  --adm-font: "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Malgun Gothic", Inter, ui-sans-serif, system-ui, sans-serif;
  --adm-r-card: 16px;
  --adm-r-inner: 12px;
  --adm-r-control: 12px;
  --adm-line: color-mix(in srgb, var(--line) 80%, transparent);
  --adm-fill: var(--subtle-strong);
  --adm-fill-strong: color-mix(in srgb, var(--subtle-strong) 90%, var(--ink) 10%);
  --adm-field: var(--subtle-strong);
  --adm-field-nested: var(--panel);
  --adm-track: var(--subtle-strong);
  font-family: var(--adm-font);
}

html[data-theme="dark"] .hub-admin-console,
html[data-theme="dark"] .hub-confirm-modal,
html[data-theme="dark"] .hub-toast-layer {
  --adm-field: color-mix(in srgb, var(--field-bg) 88%, var(--ink) 12%);
  --adm-field-nested: color-mix(in srgb, var(--field-bg) 88%, var(--ink) 12%);
}

/* Inside a filled surface, fields and tracks flip to the nested color */
.hub-admin-console .hub-raffle-editor-step,
.hub-admin-console .hub-raffle-detail,
.hub-admin-console .hub-admin-og .hub-admin-card,
.hub-admin-console .hub-taxonomy-group li,
.hub-admin-console .hub-raffle-og-panel,
.hub-admin-console .hub-raffle-dm-status,
.hub-admin-console .hub-raffle-seat-expansion,
.hub-admin-console .hub-raffle-campaign-allocation,
.hub-admin-console .hub-member-stats-grid > div {
  --adm-field: var(--adm-field-nested);
  --adm-track: var(--adm-field-nested);
}

.hub-admin-console {
  font-size: 14px;
  line-height: 1.5;
}

/* Console bar and tab strip */
.hub-admin-console-bar {
  min-height: 96px;
  gap: 20px;
  padding: 10px 0;
}

.hub-admin-console-bar p {
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
}

.hub-admin-console-bar h2 {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.hub-admin-console-time,
.hub-admin-console-health {
  font-size: 13px;
}

.hub-admin-nav {
  min-height: 52px;
  gap: 26px;
}

.hub-admin-nav button {
  padding: 0 2px;
  font-size: 15px;
  font-weight: 600;
}

/* Section cards: one radius, one hairline, one surface */
.hub-admin-console > .hub-raffle-manager,
.hub-admin-console > .hub-digest-settings,
.hub-admin-console > .hub-taxonomy-manager,
.hub-admin-console > .hub-member-wallet-manager,
.hub-admin-console > .hub-admin-card,
.hub-admin-console > .hub-admin-og,
.hub-admin-console > .hub-team-wallets-manager,
.hub-admin-console .hub-calendar-admin,
.hub-admin-console .hub-admin-work-queue,
.hub-admin-console .hub-stats-panel {
  margin-top: 24px;
  border: 1px solid var(--adm-line);
  border-radius: var(--adm-r-card);
  background: var(--panel);
}

.hub-admin-console .hub-admin-overview {
  gap: 20px;
  padding-top: 0;
}

.hub-admin-console > .hub-admin-section-head {
  margin-top: 24px;
  border-color: var(--adm-line);
  border-radius: var(--adm-r-card) var(--adm-r-card) 0 0;
  padding: 22px 24px 18px;
}

.hub-admin-console > .hub-admin-section-head + .hub-admin-card {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

/* Section headers */
.hub-admin-console .hub-raffle-manager > header,
.hub-admin-console .hub-digest-settings > header,
.hub-admin-console .hub-member-wallet-manager > header,
.hub-admin-console .hub-taxonomy-manager > header,
.hub-admin-console .hub-admin-card > header,
.hub-admin-console .hub-calendar-admin-header {
  border-bottom: 1px solid var(--adm-line);
  padding: 22px 24px;
}

.hub-admin-console .hub-admin-og > .hub-raffle-admin-head,
.hub-admin-console .hub-team-wallets-manager > .hub-raffle-admin-head {
  margin: -24px -24px 0;
  border-bottom: 1px solid var(--adm-line);
  padding: 22px 24px;
}

.hub-admin-console .hub-admin-og,
.hub-admin-console .hub-team-wallets-manager {
  padding: 24px;
}

.hub-admin-console .hub-raffle-manager > header p,
.hub-admin-console .hub-digest-settings > header p,
.hub-admin-console .hub-member-wallet-manager > header p,
.hub-admin-console .hub-taxonomy-manager > header p,
.hub-admin-console .hub-raffle-admin-head p,
.hub-admin-console .hub-calendar-heading p,
.hub-admin-console .hub-raffle-editor > header small {
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

.hub-admin-console .hub-raffle-manager > header h3,
.hub-admin-console .hub-digest-settings > header h3,
.hub-admin-console .hub-member-wallet-manager > header h3,
.hub-admin-console .hub-taxonomy-manager > header h3,
.hub-admin-console .hub-raffle-admin-head h3,
.hub-admin-console .hub-calendar-heading h3,
.hub-admin-console .hub-raffle-editor > header h4 {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1.3;
}

.hub-admin-console .hub-raffle-admin-head > div > span,
.hub-admin-console .hub-calendar-heading small,
.hub-admin-console .hub-taxonomy-manager > header > span {
  margin-top: 6px;
  font-size: 13px;
}

/* Inner surfaces: filled, borderless, 12px */
.hub-admin-console .hub-raffle-detail {
  margin: 20px 24px 24px;
  border: 0;
  border-radius: var(--adm-r-inner);
  background: var(--adm-fill);
}

.hub-admin-console .hub-raffle-editor {
  border-bottom: 1px solid var(--adm-line);
  background: transparent;
  padding: 24px;
}

.hub-admin-console .hub-raffle-editor-step,
.hub-admin-console .hub-member-stats-grid > div,
.hub-admin-console .hub-stats-card,
.hub-admin-console .hub-admin-og .hub-admin-card,
.hub-admin-console .hub-raffle-campaign-allocation,
.hub-admin-console .hub-taxonomy-group li,
.hub-admin-console .hub-raffle-og-panel,
.hub-admin-console .hub-raffle-dm-status,
.hub-admin-console .hub-raffle-seat-expansion,
.hub-admin-console .hub-team-wallets-order-note,
.hub-admin-console .hub-raffle-editor-options > label,
.hub-admin-console .hub-raffle-policy-grid > div > label,
.hub-admin-console .hub-raffle-audience-field > div > label,
.hub-admin-console .hub-raffle-group-preflight,
.hub-admin-console .hub-stats-chart svg {
  border: 1px solid transparent;
  border-radius: var(--adm-r-inner);
  background: var(--adm-fill);
}

.hub-admin-console .hub-raffle-editor-options > label.selected,
.hub-admin-console .hub-raffle-policy-grid > div > label.selected,
.hub-admin-console .hub-raffle-audience-field > div > label.selected {
  border-color: var(--accent-border);
  background: var(--accent-active-bg);
}

.hub-admin-console .hub-member-stats {
  margin: 20px 24px 0;
  border: 0;
  padding: 0;
}

.hub-admin-console .hub-member-stats-grid > div,
.hub-admin-console .hub-stats-card {
  padding: 16px 18px;
}

.hub-admin-console .hub-raffle-og-panel,
.hub-admin-console .hub-raffle-dm-status,
.hub-admin-console .hub-raffle-seat-expansion {
  padding: 16px 18px;
}

/* Figures */
.hub-admin-console .hub-raffle-summary > div {
  min-height: 92px;
  gap: 8px;
  padding: 0 24px;
}

.hub-admin-console .hub-raffle-summary span,
.hub-admin-console .hub-member-stats-grid small,
.hub-admin-console .hub-stats-card span {
  color: var(--soft);
  font-size: 13px;
  font-weight: 600;
}

.hub-admin-console .hub-raffle-summary strong,
.hub-admin-console .hub-member-stats-grid strong,
.hub-admin-console .hub-stats-card strong {
  font-family: var(--adm-font);
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

/* Buttons: filled secondary, filled primary, tinted danger */
.hub-admin-console .hub-raffle-console-header button,
.hub-admin-console .hub-raffle-admin-head button,
.hub-admin-console .hub-member-wallet-manager > header button,
.hub-admin-console .hub-admin-card > footer button,
.hub-admin-console .hub-calendar-header-actions button,
.hub-admin-console .hub-calendar-header-actions summary,
.hub-admin-console .hub-calendar-candidates > header button,
.hub-admin-console .hub-calendar-candidates article footer button,
.hub-admin-console .hub-calendar-editor-actions button,
.hub-admin-console .hub-team-wallets-manager > footer button,
.hub-admin-console .hub-raffle-settings-detail > footer button,
.hub-admin-console .hub-raffle-editor > footer button,
.hub-admin-console .hub-raffle-export-row button,
.hub-admin-console .hub-raffle-export-row a,
.hub-admin-console .hub-raffle-link-management button,
.hub-admin-console .hub-digest-actions button,
.hub-admin-console .hub-stats-retry,
.hub-admin-console .hub-member-empty button,
.hub-admin-console .hub-admin-og-chat button,
.hub-admin-console .hub-raffle-og-panel button,
.hub-admin-console .hub-raffle-seat-expansion button,
.hub-admin-console .hub-taxonomy-group form button,
.hub-admin-console .hub-taxonomy-delete button,
.hub-admin-console .hub-member-wallet-pagination button,
.hub-admin-console .hub-raffle-requirement-add {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: var(--adm-r-control);
  background: var(--adm-fill-strong);
  color: var(--ink);
  padding: 0 16px;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.hub-admin-console .hub-raffle-console-header button:hover:not(:disabled),
.hub-admin-console .hub-raffle-admin-head button:hover:not(:disabled),
.hub-admin-console .hub-member-wallet-manager > header button:hover:not(:disabled),
.hub-admin-console .hub-admin-card > footer button:hover:not(:disabled),
.hub-admin-console .hub-calendar-header-actions button:hover:not(:disabled),
.hub-admin-console .hub-calendar-candidates > header button:hover:not(:disabled),
.hub-admin-console .hub-calendar-candidates article footer button:hover:not(:disabled),
.hub-admin-console .hub-calendar-editor-actions button:hover:not(:disabled),
.hub-admin-console .hub-team-wallets-manager > footer button:hover:not(:disabled),
.hub-admin-console .hub-raffle-settings-detail > footer button:hover:not(:disabled),
.hub-admin-console .hub-raffle-editor > footer button:hover:not(:disabled),
.hub-admin-console .hub-raffle-export-row button:hover:not(:disabled),
.hub-admin-console .hub-raffle-link-management button:hover:not(:disabled),
.hub-admin-console .hub-digest-actions button:hover:not(:disabled) {
  border-color: var(--line-strong);
  color: var(--ink);
}

.hub-admin-console .hub-raffle-console-header button.primary,
.hub-admin-console .hub-calendar-header-actions button.primary,
.hub-admin-console .hub-calendar-candidates > header button.primary,
.hub-admin-console .hub-calendar-candidates article footer button.primary,
.hub-admin-console .hub-calendar-editor-actions button.primary,
.hub-admin-console .hub-team-wallets-manager > footer button.primary,
.hub-admin-console .hub-raffle-settings-detail > footer button.primary,
.hub-admin-console .hub-raffle-editor > footer button.primary,
.hub-admin-console .hub-digest-actions button.primary,
.hub-admin-console .hub-admin-card > footer button.primary,
.hub-admin-console .hub-raffle-console button.primary {
  border-color: transparent;
  background: var(--accent-primary);
  color: #fff;
}

.hub-admin-console .hub-raffle-console-header button.primary:hover:not(:disabled),
.hub-admin-console .hub-raffle-editor > footer button.primary:hover:not(:disabled) {
  border-color: transparent;
  color: #fff;
  filter: brightness(1.08);
}

.hub-admin-console .hub-calendar-candidates > header button.hub-calendar-danger-action,
.hub-admin-console .hub-calendar-editor-actions .hub-calendar-cancel-action,
.hub-admin-console .hub-taxonomy-delete button.danger {
  border-color: transparent;
  background: color-mix(in srgb, var(--red) 14%, transparent);
  color: var(--red);
}

.hub-admin-console .hub-raffle-settings-detail > footer .hub-raffle-delete {
  background: transparent;
  color: var(--muted);
}

.hub-admin-console .hub-raffle-settings-detail > footer .hub-raffle-delete:hover:not(:disabled) {
  border-color: transparent;
  background: color-mix(in srgb, var(--red) 12%, transparent);
  color: var(--red);
}

.hub-admin-console .hub-raffle-console-header button:disabled,
.hub-admin-console .hub-raffle-editor > footer button:disabled,
.hub-admin-console .hub-digest-actions button:disabled {
  color: var(--soft);
  cursor: default;
}

/* Compact buttons inside rows */
.hub-admin-console .hub-admin-work-row button,
.hub-admin-console .hub-raffle-result-entries button,
.hub-admin-console .hub-raffle-dm-status button,
.hub-admin-console .hub-raffle-xreview-reroll {
  min-height: 36px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--adm-fill-strong);
  color: var(--ink);
  padding: 0 12px;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.hub-admin-console .hub-team-wallet-actions button,
.hub-admin-console .hub-taxonomy-row > div > button {
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--adm-fill-strong);
  color: var(--ink);
}

.hub-admin-console .hub-raffle-console-header button svg,
.hub-admin-console .hub-raffle-admin-head button svg,
.hub-admin-console .hub-calendar-header-actions button svg,
.hub-admin-console .hub-team-wallets-manager > footer button svg,
.hub-admin-console .hub-admin-card > footer button svg {
  width: 16px;
  height: 16px;
}

/* Fields: filled, 48px, 12px radius */
.hub-admin-console .hub-raffle-editor input:not([type="checkbox"]):not([type="radio"]),
.hub-admin-console .hub-raffle-editor select,
.hub-admin-console .hub-raffle-editor textarea,
.hub-admin-console .hub-calendar-editor-fields input,
.hub-admin-console .hub-calendar-editor-fields select,
.hub-admin-console .hub-calendar-candidate-rows input,
.hub-admin-console .hub-calendar-candidate-rows select,
.hub-admin-console .hub-calendar-candidates article footer select,
.hub-admin-console .hub-taxonomy-group input,
.hub-admin-console .hub-taxonomy-group select,
.hub-admin-console .hub-taxonomy-delete select,
.hub-admin-console .hub-raffle-og-panel textarea,
.hub-admin-console .hub-digest-template-fields input,
.hub-admin-console .hub-digest-template textarea,
.hub-admin-console .hub-digest-test-send input,
.hub-admin-console .hub-raffle-seat-expansion input,
.hub-admin-console .hub-raffle-seat-expansion select {
  min-height: 48px;
  border: 1px solid transparent;
  border-radius: var(--adm-r-control);
  background: var(--adm-field);
  color: var(--ink);
  padding: 10px 14px;
  font: inherit;
  font-size: 14px;
}

.hub-admin-console .hub-raffle-editor input:not([type="checkbox"]):not([type="radio"]):focus,
.hub-admin-console .hub-raffle-editor select:focus,
.hub-admin-console .hub-raffle-editor textarea:focus,
.hub-admin-console .hub-calendar-editor-fields input:focus,
.hub-admin-console .hub-calendar-editor-fields select:focus,
.hub-admin-console .hub-calendar-candidate-rows input:focus,
.hub-admin-console .hub-calendar-candidate-rows select:focus,
.hub-admin-console .hub-taxonomy-group input:focus,
.hub-admin-console .hub-taxonomy-group select:focus,
.hub-admin-console .hub-raffle-og-panel textarea:focus,
.hub-admin-console .hub-digest-template-fields input:focus,
.hub-admin-console .hub-digest-template textarea:focus,
.hub-admin-console .hub-digest-test-send input:focus {
  outline: 0;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.hub-admin-console .hub-raffle-editor [data-required-missing] > input,
.hub-admin-console .hub-raffle-editor [data-required-missing] > select,
.hub-admin-console .hub-raffle-editor [data-required-missing] > textarea,
.hub-admin-console .hub-calendar-candidate-rows [data-required-missing] {
  border-color: var(--red);
}

.hub-admin-console .hub-team-wallets-table input {
  min-height: 40px;
  border-color: transparent;
  border-radius: 10px;
  background: var(--adm-field);
}

.hub-admin-console .hub-raffle-toolbar > label,
.hub-admin-console .hub-search {
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: var(--adm-r-control);
  background: var(--adm-field);
}

.hub-admin-console .hub-raffle-toolbar > label:focus-within,
.hub-admin-console .hub-search:focus-within {
  outline: 0;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.hub-admin-console .hub-raffle-toolbar input,
.hub-admin-console .hub-search input {
  font-size: 14px;
}

.hub-admin-console .hub-raffle-toolbar {
  min-height: 72px;
  padding: 14px 24px;
}

/* Segmented controls: a filled track with a tinted active segment */
.hub-admin-console .hub-raffle-toolbar > div,
.hub-admin-console .hub-member-directory-tools > div[role="group"],
.hub-admin-console .hub-raffle-create-mode > div,
.hub-admin-console .hub-calendar-view-switch,
.hub-admin-console .hub-calendar-toolbar > div[role="tablist"],
.hub-admin-console .hub-raffle-campaign-tabs,
.hub-admin-console .hub-digest-mode {
  gap: 2px;
  border: 0;
  border-radius: var(--adm-r-control);
  background: var(--adm-track);
  padding: 3px;
  overflow: hidden;
}

.hub-admin-console .hub-raffle-toolbar > div button,
.hub-admin-console .hub-member-directory-tools > div[role="group"] button,
.hub-admin-console .hub-raffle-create-mode > div button,
.hub-admin-console .hub-calendar-view-switch button,
.hub-admin-console .hub-calendar-toolbar > div[role="tablist"] button,
.hub-admin-console .hub-raffle-campaign-tabs button,
.hub-admin-console .hub-digest-mode button {
  min-height: 38px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--muted);
  padding: 0 14px;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
}

.hub-admin-console .hub-raffle-toolbar > div button.active,
.hub-admin-console .hub-member-directory-tools > div[role="group"] button.active,
.hub-admin-console .hub-raffle-create-mode > div button.active,
.hub-admin-console .hub-calendar-view-switch button[aria-pressed="true"],
.hub-admin-console .hub-calendar-toolbar > div[role="tablist"] button.active,
.hub-admin-console .hub-raffle-campaign-tabs button.active,
.hub-admin-console .hub-digest-mode button.active {
  border: 0;
  background: var(--accent-active-bg);
  color: var(--blue);
}

.hub-admin-console .hub-calendar-toolbar {
  min-height: 0;
  gap: 12px;
  border-bottom: 1px solid var(--adm-line);
  padding: 14px 24px;
}

.hub-admin-console .hub-calendar-toolbar select {
  min-height: 40px;
  border: 0;
  border-radius: 10px;
  background: var(--adm-track);
  padding: 0 12px;
  font-size: 13px;
  font-weight: 600;
}

/* Status pills: soft tint from the status color itself */
.hub-admin-console .hub-raffle-table-row em,
.hub-admin-console .hub-raffle-detail header em,
.hub-admin-console .hub-calendar-review-status,
.hub-admin-console .hub-calendar-event-editor > header em {
  border: 0;
  border-radius: 999px;
  background: color-mix(in srgb, currentColor 14%, transparent);
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 700;
}

/* Lists and rows */
.hub-admin-console .hub-raffle-table-head {
  min-height: 44px;
  padding: 0 24px;
  font-size: 13px;
}

.hub-admin-console .hub-raffle-table-row {
  min-height: 72px;
  padding: 0 24px;
}

.hub-admin-console .hub-raffle-table-row strong {
  font-size: 15px;
  font-weight: 700;
}

.hub-admin-console .hub-raffle-table-row > span {
  font-size: 13px;
}

.hub-admin-console .hub-admin-work-queue > header {
  min-height: 62px;
  padding: 0 24px;
}

.hub-admin-console .hub-admin-work-queue h3 {
  font-size: 17px;
  font-weight: 800;
}

.hub-admin-console .hub-admin-work-queue > header span {
  font-size: 13px;
}

.hub-admin-console .hub-admin-work-head,
.hub-admin-console .hub-admin-work-row {
  padding: 0 24px;
}

.hub-admin-console .hub-admin-work-head {
  font-size: 13px;
}

.hub-admin-console .hub-admin-work-row {
  min-height: 68px;
}

.hub-admin-console .hub-admin-work-row strong {
  font-size: 15px;
}

.hub-admin-console .hub-admin-work-row > span {
  font-size: 13px;
}

.hub-admin-console .hub-admin-overview-empty {
  padding: 22px 24px;
  font-size: 14px;
}

.hub-admin-console .hub-admin-work-skeleton > div {
  padding: 0 24px;
}

/* Detail panel */
.hub-admin-console .hub-raffle-detail > header {
  padding: 16px 20px;
}

.hub-admin-console .hub-raffle-detail > nav {
  gap: 24px;
  padding: 0 20px;
}

.hub-admin-console .hub-raffle-detail > nav button {
  font-size: 15px;
  font-weight: 600;
}

.hub-admin-console .hub-raffle-settings-detail > dl > div {
  min-height: 68px;
  padding: 0 20px;
}

.hub-admin-console .hub-raffle-settings-detail dt {
  font-size: 13px;
}

.hub-admin-console .hub-raffle-settings-detail dd {
  font-size: 14px;
  font-weight: 600;
}

.hub-admin-console .hub-raffle-settings-detail > footer {
  padding: 16px 20px;
}

.hub-admin-console .hub-raffle-audit li {
  min-height: 56px;
  padding: 0 20px;
}

.hub-admin-console .hub-raffle-audit strong {
  font-size: 14px;
}

/* Editor */
.hub-admin-console .hub-raffle-editor > header {
  margin-bottom: 4px;
}

.hub-admin-console .hub-raffle-editor-step > header {
  padding: 16px 20px;
}

.hub-admin-console .hub-raffle-editor-step > header b {
  width: 28px;
  height: 28px;
  font-size: 13px;
}

.hub-admin-console .hub-raffle-editor-step > header strong {
  font-size: 15px;
  font-weight: 800;
}

.hub-admin-console .hub-raffle-editor-step > header small {
  font-size: 13px;
}

.hub-admin-console .hub-raffle-editor-step > .hub-raffle-editor-fields {
  gap: 16px;
  padding: 20px;
}

.hub-admin-console .hub-raffle-editor-step > .hub-raffle-policy-grid {
  padding: 20px;
}

.hub-admin-console .hub-raffle-editor-fields label > span,
.hub-admin-console .hub-raffle-create-mode legend,
.hub-admin-console .hub-raffle-campaign-allocation legend,
.hub-admin-console .hub-raffle-policy-grid legend,
.hub-admin-console .hub-raffle-mint-phases legend,
.hub-admin-console .hub-raffle-groups-field legend,
.hub-admin-console .hub-raffle-requirements-field legend,
.hub-admin-console .hub-raffle-audience-field legend {
  font-size: 13px;
  font-weight: 600;
}

.hub-admin-console .hub-raffle-editor > footer {
  margin: 20px -24px -24px;
  border-radius: 0;
  padding: 14px 24px;
}

.hub-admin-console .hub-raffle-editor > footer .hub-raffle-editor-submit-reason {
  font-size: 13px;
}

/* Calendar */
.hub-admin-console .hub-calendar-candidates {
  padding: 20px 24px;
}

.hub-admin-console .hub-calendar-candidates article h4 {
  font-size: 16px;
}

.hub-admin-console .hub-calendar-candidates article p {
  font-size: 14px;
}

.hub-admin-console .hub-calendar-reasons span {
  border: 0;
  border-radius: 999px;
  background: var(--adm-fill);
  padding: 4px 10px;
}

/* Announcement poster panel */
.hub-admin-console .hub-selection-poster-count,
.hub-admin-console .hub-selection-poster-toolbar button,
.hub-admin-console .hub-selection-poster-preview {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: var(--adm-r-control);
  background: var(--adm-fill-strong);
  color: var(--ink);
  padding: 0 16px;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.hub-admin-console .hub-selection-poster-preview {
  background: var(--accent-primary);
  color: #fff;
}

.hub-admin-console .hub-selection-poster-preview:disabled,
.hub-admin-console .hub-selection-poster-toolbar button:disabled {
  background: var(--adm-fill);
  color: var(--soft);
}

.hub-admin-console .hub-selection-poster-search {
  min-height: 48px;
  border: 1px solid transparent;
  border-radius: var(--adm-r-control);
  background: var(--adm-field);
}

.hub-admin-console .hub-selection-poster-search:focus-within {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.hub-admin-console .hub-selection-poster-search input {
  font-size: 14px;
}

.hub-admin-console .hub-selection-poster-list label {
  border-radius: var(--adm-r-inner);
}

/* Toast and confirm dialog */
.hub-toast {
  min-height: 52px;
  border-radius: 12px;
  padding: 4px 8px 4px 16px;
  font-size: 14px;
  font-weight: 600;
}

.hub-confirm-modal {
  width: min(440px, 100%);
  border-radius: 20px;
}

.hub-confirm-modal > header {
  min-height: 0;
  border-bottom: 0;
  padding: 28px 28px 0;
}

.hub-confirm-modal > header p {
  display: none;
}

.hub-confirm-modal > header h2 {
  font-size: 20px;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: -0.01em;
}

.hub-confirm-modal > div {
  gap: 22px;
  padding: 12px 28px 24px;
}

.hub-confirm-modal > div > p {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.6;
}

.hub-confirm-modal footer {
  gap: 8px;
}

.hub-confirm-modal footer button {
  flex: 1;
  min-height: 52px;
  border: 0;
  border-radius: 14px;
  background: var(--adm-fill-strong);
  color: var(--ink);
  font-size: 15px;
  font-weight: 700;
}

.hub-confirm-modal footer button.primary {
  background: var(--accent-primary);
  color: #fff;
}

.hub-confirm-modal footer button.danger {
  background: color-mix(in srgb, var(--red) 16%, transparent);
  color: var(--red);
}

@keyframes hub-sheet-in {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
}

@media (max-width: 760px) {
  .hub-admin-console-bar {
    min-height: 0;
    padding: 12px 0;
  }

  .hub-admin-console-bar h2 {
    font-size: 24px;
  }

  .hub-admin-console .hub-raffle-manager > header,
  .hub-admin-console .hub-digest-settings > header,
  .hub-admin-console .hub-member-wallet-manager > header,
  .hub-admin-console .hub-taxonomy-manager > header,
  .hub-admin-console .hub-admin-card > header,
  .hub-admin-console .hub-calendar-admin-header,
  .hub-admin-console .hub-admin-og > .hub-raffle-admin-head,
  .hub-admin-console .hub-team-wallets-manager > .hub-raffle-admin-head {
    padding: 18px 16px;
  }

  .hub-admin-console .hub-admin-og > .hub-raffle-admin-head,
  .hub-admin-console .hub-team-wallets-manager > .hub-raffle-admin-head {
    margin: -16px -16px 0;
  }

  .hub-admin-console .hub-admin-og,
  .hub-admin-console .hub-team-wallets-manager {
    padding: 16px;
  }

  .hub-admin-console .hub-raffle-editor {
    padding: 16px;
  }

  .hub-admin-console .hub-raffle-editor > footer {
    margin: 16px -16px -16px;
    padding: 12px 16px;
  }

  .hub-admin-console .hub-raffle-detail {
    margin: 12px;
  }

  .hub-admin-console .hub-raffle-table-row,
  .hub-admin-console .hub-admin-work-row,
  .hub-admin-console .hub-admin-work-skeleton > div {
    padding: 12px 16px;
  }

  .hub-admin-console .hub-raffle-toolbar,
  .hub-admin-console .hub-calendar-toolbar,
  .hub-admin-console .hub-calendar-candidates {
    padding: 12px 16px;
  }

  .hub-admin-console .hub-member-stats {
    margin: 16px 16px 0;
  }

  .hub-admin-console .hub-raffle-create-mode > div button,
  .hub-admin-console .hub-raffle-toolbar > div button {
    padding: 0 10px;
    font-size: 13px;
  }

  .hub-modal-layer:has(> .hub-confirm-modal) {
    align-items: end;
    padding: 0;
  }

  .hub-confirm-modal {
    width: 100%;
    max-width: none;
    border-radius: 20px 20px 0 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    animation: hub-sheet-in var(--dur-base) var(--ease-out);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hub-confirm-modal {
    animation: none;
  }
}

.hub-admin-console .hub-admin-card dd .hub-admin-error-detail {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
  overflow-wrap: anywhere;
}

/* Wallet activity alerts (profile). Same privy rows as the wallet list; the
   event checkboxes and the activity feed are the only new shapes. */
.hub-wallet-watch-events { display: flex; flex-wrap: wrap; gap: 8px 14px; padding: 2px 16px 12px; color: var(--muted); font-size: 13px; }
.hub-wallet-watch-events label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.hub-wallet-watch-events input { accent-color: var(--accent-primary); }
.hub-wallet-watch-status { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 16px; color: var(--muted); font-size: 13px; }
.hub-wallet-watch-status a, .hub-wallet-watch-status button { color: var(--blue); background: none; border: 0; padding: 0; font: inherit; cursor: pointer; text-decoration: none; }
.hub-wallet-watch-activity .hub-privy-row { min-height: 44px; }
.hub-wallet-watch-activity .hub-privy-name { font-size: 13px; }
.hub-wallet-watch-activity .hub-privy-name em { font-style: normal; font-weight: 700; margin-right: 6px; }
.hub-wallet-watch-activity .hub-privy-name em.is-buy { color: var(--blue); }
.hub-wallet-watch-activity .hub-privy-name em.is-sell { color: var(--violet); }
.hub-wallet-watch-activity .hub-privy-name em.is-mint, .hub-wallet-watch-activity .hub-privy-name em.is-received { color: var(--muted); }
.hub-wallet-watch-group .hub-privy-actions .hub-wallet-watch-toggle { width: auto; min-width: 0; height: 30px; padding: 0 10px; border: 1px solid var(--line); border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; color: var(--soft); }
.hub-wallet-watch-group .hub-privy-actions .hub-wallet-watch-toggle:hover { color: var(--ink); }
.hub-wallet-watch-chains { display: block; color: var(--soft); font-size: 12px; white-space: nowrap; }
.hub-privy-footnote.is-error { color: var(--red); }
