/* Cassell internal UI v2 — near-black forum surfaces with iOS-style controls. */
.forum-ios-v2 {
  --bg: #05070a;
  --bg-deep: #020305;
  --card: rgba(11, 14, 19, .88);
  --card-solid: #0b0e13;
  --gold: #9ebde2;
  --gold-bright: #f2f5f8;
  --gold-dim: #75869a;
  --moon: #d7e3ee;
  --text: #edf1f5;
  --text-dim: #8b96a3;
  --muted: #737e8a;
  --border: rgba(158, 194, 231, .38);
  --border-cool: rgba(181, 195, 211, .14);
  --ios-blue: #9ec8f4;
  --ios-surface: rgba(15, 18, 24, .92);
  --ios-surface-raised: rgba(20, 24, 31, .94);
  color-scheme: dark;
  background: #030405;
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Microsoft YaHei", sans-serif;
}

.forum-ios-v2:not([data-board="cafeteria"]) #bg-layer {
  background: radial-gradient(circle at 50% 8%, rgba(63, 81, 105, .12), transparent 34%), #030405;
  filter: none;
  transform: none;
}
.forum-ios-v2:not([data-board="cafeteria"]) #bg-overlay {
  background:
    radial-gradient(circle at 82% 4%, rgba(107, 151, 201, .07), transparent 28%),
    linear-gradient(180deg, rgba(3, 4, 5, .03), rgba(3, 4, 5, .86));
}
.forum-ios-v2:not([data-board="cafeteria"]) #particles { opacity: .18; }

.forum-ios-v2 :where(button, .button, .btn, .nav-btn, input, select, textarea) {
  font-family: inherit;
}
.forum-ios-v2 :where(.nav-btn, .button, .btn, button, [role="button"]) {
  -webkit-tap-highlight-color: transparent;
}
.forum-ios-v2 :where(.nav-btn, .button, .btn, .credit-button, .daily-credit-action) {
  min-height: 44px;
  border: 1px solid var(--border-cool);
  border-radius: 14px;
  background: rgba(14, 17, 22, .9);
  color: #dfe5eb;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
  letter-spacing: .02em;
  transition: color .18s ease, border-color .18s ease, background-color .18s ease, transform .18s ease;
}
.forum-ios-v2 :where(.nav-btn, .button, .btn, .credit-button, .daily-credit-action):hover {
  color: #fff;
  border-color: rgba(158, 200, 244, .48);
  background: rgba(29, 36, 45, .96);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}
.forum-ios-v2 :where(.nav-btn, .button, .btn, .credit-button, .daily-credit-action):active { transform: scale(.98); }
.forum-ios-v2 .btn::after { display: none; }
.forum-ios-v2 :where(input, select, textarea, .input) {
  border: 1px solid var(--border-cool);
  border-radius: 14px;
  background: rgba(9, 11, 15, .94);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
  outline: none;
}
.forum-ios-v2 :where(input, select, textarea, .input)::placeholder { color: #626d79; }
.forum-ios-v2 :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(117, 181, 245, .28);
  outline-offset: 2px;
  border-color: var(--ios-blue) !important;
}

.forum-ios-v2:not([data-board="cafeteria"]) :where(.card, .pf-card, .mailbox, .pack-case, .pack-detail, .credit-panel, .daily-credit-main, .daily-credit-history, .daily-credit-reward) {
  border-color: var(--border-cool);
  background-color: rgba(10, 12, 16, .86);
  box-shadow: 0 18px 56px rgba(0, 0, 0, .26), inset 0 1px 0 rgba(255, 255, 255, .025);
}
.forum-ios-v2:not([data-board="cafeteria"]) .card::before { display: none; }

/* Shared internal navigation */
.forum-ios-v2:not([data-board="cafeteria"]) :where(header.nav, .pack-nav, .credit-nav, .daily-credit-nav, .event-nav) {
  border-bottom: 1px solid rgba(187, 201, 218, .11);
  background: rgba(4, 5, 7, .88);
  box-shadow: none;
  backdrop-filter: blur(22px) saturate(1.1);
  -webkit-backdrop-filter: blur(22px) saturate(1.1);
}
.forum-ios-v2 :where(header.nav .brand .en, header.nav .brand strong, .pack-brand strong, .credit-brand strong, .daily-credit-brand strong, .event-brand b) {
  color: #f2f4f7;
}

/* Main forum */
.forum-ios-v2:not([data-board="cafeteria"]) header.nav {
  padding: 13px clamp(18px, 2.4vw, 36px);
  gap: 22px;
}
.forum-ios-v2:not([data-board="cafeteria"]) header.nav .brand img {
  width: 42px;
  height: 42px;
  border: 0;
  background: transparent;
  filter: grayscale(1) contrast(1.08) brightness(1.24);
}
.forum-ios-v2:not([data-board="cafeteria"]) header.nav .brand .en { font-size: 14px; letter-spacing: .2em; }
.forum-ios-v2:not([data-board="cafeteria"]) header.nav .brand .cn { color: #707b87; }
.forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions {
  gap: 5px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions::-webkit-scrollbar { display: none; }
.forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions .nav-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 8px 12px;
  border-color: transparent;
  border-radius: 12px;
  color: #929ca7;
  background: transparent;
  white-space: nowrap;
}
.forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions .nav-btn:hover,
.forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions .nav-btn[aria-current="page"] {
  color: #f5f7f9;
  border-color: rgba(179, 199, 220, .13);
  background: rgba(255, 255, 255, .045);
}
.forum-ios-v2 .nav-icon { width: 18px; height: 18px; flex: 0 0 auto; stroke: currentColor; }

.forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-cassell-launch {
  max-width: 1440px;
  margin: 0 auto;
  padding: 18px 28px 0;
}
.forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-switch {
  width: fit-content;
  padding: 4px;
  border: 1px solid var(--border-cool);
  border-radius: 14px;
  background: #080a0d;
}
.forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-switch a {
  min-height: 36px;
  border: 0;
  border-radius: 10px;
  color: #747f8a;
  background: transparent;
}
.forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-switch a[aria-current="page"] {
  color: #eef2f6;
  background: #171b21;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}
.forum-ios-v2:not([data-board="cafeteria"]) .layout { padding-top: 24px; }
.forum-ios-v2:not([data-board="cafeteria"]) .crumb { color: #66717d; }
.forum-ios-v2:not([data-board="cafeteria"]) .crumb a { color: #8b97a3; }
.forum-ios-v2:not([data-board="cafeteria"]) .board-head {
  min-height: 106px;
  margin-bottom: 20px;
  padding: 21px 24px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(20, 25, 33, .92), rgba(8, 10, 14, .92));
}
.forum-ios-v2:not([data-board="cafeteria"]) .board-hero-icon {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  border-color: rgba(182, 199, 217, .13);
  filter: grayscale(.74) contrast(1.05) brightness(.88);
}
.forum-ios-v2:not([data-board="cafeteria"]) .board-head .h .name { color: #f2f4f7; font-size: 23px; font-weight: 620; }
.forum-ios-v2:not([data-board="cafeteria"]) .board-head .h .desc { color: #7f8a96; }
.forum-ios-v2:not([data-board="cafeteria"]) .board-head .stats .n { color: #dfe7ef; }

.forum-ios-v2:not([data-board="cafeteria"]) .toolbar {
  display: grid;
  grid-template-columns: auto minmax(260px, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--border-cool);
}
.forum-ios-v2:not([data-board="cafeteria"]) .tabs {
  gap: 3px;
  padding: 4px;
  border: 1px solid var(--border-cool);
  border-radius: 14px;
  background: #080a0d;
}
.forum-ios-v2:not([data-board="cafeteria"]) .tab {
  min-height: 36px;
  padding: 7px 14px;
  border-radius: 10px;
}
.forum-ios-v2:not([data-board="cafeteria"]) .tab.active {
  border-color: transparent;
  color: #f1f4f7;
  background: #1a1e24;
}
.forum-ios-v2:not([data-board="cafeteria"]) .thread-search { width: 100%; max-width: 640px; justify-self: center; }
.forum-ios-v2:not([data-board="cafeteria"]) .thread-search .input { min-height: 42px; background: #090b0f; }
.forum-ios-v2:not([data-board="cafeteria"]) .new-post {
  color: #06101a;
  border-color: #a6c9ec;
  background: #b9d6f3;
  font-weight: 650;
}
.forum-ios-v2:not([data-board="cafeteria"]) .new-post:hover { color: #02070c; background: #d3e7fb; }

.forum-ios-v2:not([data-board="cafeteria"]) #threadList { border-bottom: 1px solid var(--border-cool); }
.forum-ios-v2:not([data-board="cafeteria"]) .thread {
  position: relative;
  align-items: center;
  min-height: 104px;
  margin: 0;
  padding: 20px 14px 20px 8px;
  border: 0;
  border-bottom: 1px solid var(--border-cool);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.forum-ios-v2:not([data-board="cafeteria"]) .thread:last-of-type { border-bottom: 0; }
.forum-ios-v2:not([data-board="cafeteria"]) .thread::before {
  content: "";
  width: 3px;
  height: 32px;
  border-radius: 2px;
  background: transparent;
  transition: background-color .18s ease;
}
.forum-ios-v2:not([data-board="cafeteria"]) .thread:hover,
.forum-ios-v2:not([data-board="cafeteria"]) .thread:focus-visible {
  border-color: var(--border-cool);
  background: rgba(255, 255, 255, .025);
  box-shadow: none;
  transform: none;
}
.forum-ios-v2:not([data-board="cafeteria"]) .thread:hover::before,
.forum-ios-v2:not([data-board="cafeteria"]) .thread:focus-visible::before { background: var(--ios-blue); }
.forum-ios-v2:not([data-board="cafeteria"]) .thread .title { color: #e8ecf0; font-size: 16px; font-weight: 590; }
.forum-ios-v2:not([data-board="cafeteria"]) .thread .meta { color: #68737e; }
.forum-ios-v2:not([data-board="cafeteria"]) .thread .nums {
  min-width: 62px;
  padding-left: 18px;
  border-left: 1px solid var(--border-cool);
}
.forum-ios-v2:not([data-board="cafeteria"]) .tagx {
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .025);
}
.forum-ios-v2:not([data-board="cafeteria"]) .tagx.gold,
.forum-ios-v2:not([data-board="cafeteria"]) .tagx.pin {
  color: #b9d6f3;
  border-color: rgba(158, 200, 244, .34);
  background: rgba(97, 157, 218, .08);
}

/* The same material language across authenticated sub-pages. */
.forum-ios-v2:not([data-board="cafeteria"]) :where(.activity-wrap, .mail-wrap, .pf-wrap, .pack-shell, .credit-shell, .daily-credit-shell, .event-shell) {
  color: var(--text);
}
.forum-ios-v2:not([data-board="cafeteria"]) :where(.activity-tab, .compose-btn, .folder, .credit-tabs button, .credit-rules-link, .credit-pagination button, .daily-credit-action, .pack-nav nav a, .credit-nav nav a, .daily-credit-nav nav a, .event-nav nav a) {
  border-radius: 12px;
}
.forum-ios-v2:not([data-board="cafeteria"]) :where(.activity-tab.active, .folder.active, .credit-tabs button.active) {
  color: #f2f5f8;
  border-color: rgba(158, 200, 244, .36);
  background: rgba(114, 169, 224, .1);
}

/* Credit account: keep the functional art, replace the legacy navy/gold shell. */
.credit-page.forum-ios-v2 {
  --credit-bg: #030405;
  --credit-surface: rgba(10, 12, 16, .94);
  --credit-surface-strong: rgba(7, 9, 12, .98);
  --credit-ivory: #edf1f5;
  --credit-gold: #9ebde2;
  --credit-gold-bright: #d8e8f8;
  --credit-muted: #7f8a96;
  --credit-line: rgba(169, 193, 219, .22);
  --credit-line-cool: rgba(181, 195, 211, .13);
}
.credit-page.forum-ios-v2 .credit-panel,
.credit-page.forum-ios-v2 .credit-story-entry {
  border-color: var(--credit-line-cool);
  background: linear-gradient(145deg, rgba(14, 17, 22, .96), rgba(7, 9, 12, .97));
}
.credit-page.forum-ios-v2 .credit-balance-card::after {
  background: radial-gradient(circle at 78% 49%, rgba(94, 150, 205, .1), transparent 36%);
}
.credit-page.forum-ios-v2 .credit-button.primary,
.credit-page.forum-ios-v2 .credit-daily-entry > strong {
  color: #07101a;
  border-color: #a8caeb;
  background: #b9d6f3;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45);
}
.credit-page.forum-ios-v2 .credit-panel-head form,
.credit-page.forum-ios-v2 .credit-tabs button,
.credit-page.forum-ios-v2 .credit-entry-list,
.credit-page.forum-ios-v2 .credit-rules-inner { background-color: #080a0d; }
.credit-page.forum-ios-v2 .credit-card-art::before,
.credit-page.forum-ios-v2 .credit-card-art::after { opacity: .38; filter: grayscale(.7) saturate(.5); }

/* Inventory */
.forum-ios-v2 {
  --ink: #030405;
  --panel: rgba(10, 12, 16, .94);
  --panel-2: #0d1015;
  --line: rgba(181, 195, 211, .15);
  --silver: #edf1f5;
  --muted: #7f8a96;
  --blue: #a8cbed;
}
.forum-ios-v2::before { opacity: .08; filter: grayscale(1) contrast(1.1); }
.forum-ios-v2 :where(.pack-case, .pack-detail, .item-card, .preview-dialog, .preview-result) {
  border-color: var(--line);
  background-color: #0a0d12;
  background-image: linear-gradient(150deg, rgba(17, 20, 26, .96), rgba(6, 8, 11, .98));
}
.forum-ios-v2 .item-card[data-item-type="food"] .item-art {
  background: radial-gradient(circle at 50% 42%, rgba(164, 184, 204, .08), rgba(5, 7, 10, .94) 72%);
}

/* Friends, mail, activity and profile surfaces */
.forum-ios-v2 :where(.shell, .side, .chat, .composer, .tools, .mailbox, .sidebar, .panel, .pf-card) {
  border-color: rgba(181, 195, 211, .13);
  background-color: rgba(9, 11, 15, .94);
}
.forum-ios-v2 :where(.row:hover, .row.on, .folder.active, .activity-tab.active, .seg button.active) {
  background-color: rgba(120, 174, 227, .09);
}
.forum-ios-v2 :where(.bubble, .composer, .message-day span) { background-color: #10141a; }
.forum-ios-v2 .bubble.mine { border-color: rgba(158, 200, 244, .25); background-color: #18212b; }

@media (max-width: 1000px) {
  .forum-ios-v2:not([data-board="cafeteria"]) header.nav { align-items: flex-start; flex-direction: column; }
  .forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions { width: 100%; }
  .forum-ios-v2:not([data-board="cafeteria"]) .toolbar { grid-template-columns: 1fr auto; }
  .forum-ios-v2:not([data-board="cafeteria"]) .thread-search { grid-column: 1 / -1; grid-row: 2; max-width: none; }
}

@media (max-width: 640px) {
  .forum-ios-v2 { min-height: 100dvh; }
  .forum-ios-v2:not([data-board="cafeteria"]) header.nav {
    display: flex;
    padding: calc(10px + env(safe-area-inset-top)) 12px 9px;
    gap: 8px;
  }
  .forum-ios-v2:not([data-board="cafeteria"]) header.nav .brand img { width: 36px; height: 36px; }
  .forum-ios-v2:not([data-board="cafeteria"]) header.nav .brand .en { font-size: 12px; }
  .forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions {
    display: flex;
    margin-inline: -12px;
    width: calc(100% + 24px);
    padding: 0 12px 2px;
    scroll-snap-type: x proximity;
  }
  .forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions .nav-btn,
  .forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions .nav-btn.ghost,
  .forum-ios-v2:not([data-board="cafeteria"]) header.nav .actions .activity-link {
    display: inline-flex;
    flex: 0 0 auto;
    min-width: 76px;
    min-height: 54px;
    padding: 6px 9px;
    flex-direction: column;
    gap: 4px;
    font-size: 10px;
    scroll-snap-align: start;
  }
  .forum-ios-v2 .nav-icon { width: 19px; height: 19px; }
  .forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-cassell-launch { padding: 12px 12px 0; }
  .forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-cassell-launch--with-back {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 8px;
  }
  .forum-ios-v2:not([data-board="cafeteria"]) .cassell-back--realm-launch { justify-self: start; }
  .forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-switch { width: 100%; }
  .forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-cassell-launch--with-back .realm-v3-switch {
    width: 100% !important;
    min-width: 0;
    flex: none;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-cassell-launch--with-back .realm-v3-switch a {
    min-width: 0;
    padding-inline: 6px;
  }
  .forum-ios-v2:not([data-board="cafeteria"]) .realm-v3-switch a { flex: 1; justify-content: center; }
  .forum-ios-v2:not([data-board="cafeteria"]) .layout { padding: 14px 12px calc(40px + env(safe-area-inset-bottom)); }
  .forum-ios-v2:not([data-board="cafeteria"]) .crumb { margin: 0 2px 12px; }
  .forum-ios-v2:not([data-board="cafeteria"]) .board-head { min-height: 92px; padding: 16px; border-radius: 17px; }
  .forum-ios-v2:not([data-board="cafeteria"]) .board-hero-icon { width: 52px; height: 52px; border-radius: 14px; }
  .forum-ios-v2:not([data-board="cafeteria"]) .board-head .h .name { font-size: 20px; }
  .forum-ios-v2:not([data-board="cafeteria"]) .toolbar { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .forum-ios-v2:not([data-board="cafeteria"]) .tabs { width: 100%; }
  .forum-ios-v2:not([data-board="cafeteria"]) .tab { flex: 1; justify-content: center; }
  .forum-ios-v2:not([data-board="cafeteria"]) .thread-search { grid-column: 1; grid-row: auto; }
  .forum-ios-v2:not([data-board="cafeteria"]) .new-post { width: 100%; }
  .forum-ios-v2:not([data-board="cafeteria"]) .thread { min-height: 96px; padding: 17px 4px; }
  .forum-ios-v2:not([data-board="cafeteria"]) .thread::before { width: 2px; }
  .forum-ios-v2:not([data-board="cafeteria"]) .thread .meta { gap: 7px 12px; }
  .forum-ios-v2 :where(input, select, textarea, .input) { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .forum-ios-v2 *, .forum-ios-v2 *::before, .forum-ios-v2 *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}